P42/P42_UI
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

kfeditor : html & css cleanup

Browse Source
This commit is contained in:
STEINNI
2025-10-23 16:41:05 +00:00
parent 8276a77172
commit 6931a777a2
2 changed files with 23 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/views/editors/KeyframeView.html
+20 -13
View File
@@ -8,25 +8,32 @@
height: 100%; height: 100%;
margin: 0; margin: 0;
} }
.kf-editor > article, .kf-editor > article header{ border-color: #473; }
.kf-editor article.agent-preview header { padding:0; }
.kf-editor canvas[data-output="agentSampleCanvas"]{ width:100%; aspect-ratio: 1 / 1;} .kf-editor canvas[data-output="agentSampleCanvas"]{ width:100%; aspect-ratio: 1 / 1;}
.kf-editor canvas[data-output="kfArenaCanvas"]{ width:100%; height:100%; } .kf-editor canvas[data-output="kfArenaCanvas"]{ width:100%; height:100%; }
.kf-editor article.agent-preview section{ .kf-editor article.left-pane section{
display: grid; display: grid;
grid-template-rows: 2em auto; grid-template-rows: 2em auto;
overflow: visible; overflow: visible;
} }
.kf-editor article.agent-properties section{ .kf-editor article.agent-properties section{
display: grid; display: grid;
grid-template-rows: 2em auto; grid-template-rows: 2em 3em auto;
overflow: visible; overflow: visible;
height:100%; height:100%;
} }
.kf-editor article.agent-preview section.selector{ padding: 0.5em .5em 1.5em .5em; } .kf-editor article.left-pane > section, .kf-editor article.agent-properties > section { padding:0; }
.kf-editor article.agent-preview section.browser{ padding:0; } .kf-editor article.left-pane > section header, .kf-editor article.agent-properties > section header {
.kf-editor article.agent-preview section.browser header { border-top: 1px solid #473; border-bottom: 1px solid #473;} margin: 0;
.kf-editor article.agent-preview section.browser header h1{ text-align: center; margin-top: .3em;} padding: 0;
border-top: 1px solid #473;
border-bottom: 1px solid #473;
background-color: #342;
}
.kf-editor article.left-pane > section header h1, .kf-editor article.agent-properties > section header h1{
text-align: center;
margin-top: .3em;
}
.kf-editor article.left-pane > section > bz-select{ margin: 0 0.5em 1em 0.5em; }
.kf-editor article.kfArena section{ .kf-editor article.kfArena section{
padding: 0; padding: 0;
height: 100%; height: 100%;
@@ -39,6 +46,7 @@
box-shadow: 0px 0px 7px #0B69; box-shadow: 0px 0px 7px #0B69;
height: 2em; height: 2em;
padding: 0 5px 0 5px; padding: 0 5px 0 5px;
margin-top: .5em;
} }
.kf-editor article.agent-properties section div.agent-actions button{ .kf-editor article.agent-properties section div.agent-actions button{
color: #DDD; color: #DDD;
@@ -55,8 +63,6 @@
.kf-editor button[data-trigger="onRemoveAgent"] { background-color: #A00; } .kf-editor button[data-trigger="onRemoveAgent"] { background-color: #A00; }
.kf-editor button[data-trigger="onSaveKF"] { background-color: #367; } .kf-editor button[data-trigger="onSaveKF"] { background-color: #367; }
.kf-editor button[data-trigger="onResetKF"] { background-color: #A00; } .kf-editor button[data-trigger="onResetKF"] { background-color: #A00; }
.kf-editor section[data-output="agentProperties"] label{ font-size: 0.9em; }
.kf-editor section[data-output="agentProperties"] div.cols-2 { grid-template-columns: 4fr 3fr; }
.kf-editor div[data-output="agentId"] { .kf-editor div[data-output="agentId"] {
border: 1px solid #574; border: 1px solid #574;
border-radius: 5px; border-radius: 5px;
@@ -69,9 +75,10 @@
} }
</style> </style>
<div class="kf-editor cols-3"> <div class="kf-editor cols-3">
<article eiccard class="agent-preview"> <article eiccard class="left-pane">
<header><canvas data-output="agentSampleCanvas"></canvas></header>
<section class="selector"> <section class="selector">
<header><h1>Agent type browser</h1></header>
<canvas data-output="agentSampleCanvas"></canvas>
<bz-select label="Agent type..." data-output="agentsSelector"></bz-select> <bz-select label="Agent type..." data-output="agentsSelector"></bz-select>
</section> </section>
<section class="browser"> <section class="browser">
@@ -84,8 +91,8 @@
</section> </section>
</article> </article>
<article eiccard class="agent-properties"> <article eiccard class="agent-properties">
<header><h1>Agent properties</h1></header>
<section> <section>
<header><h1>Agent properties</h1></header>
<div class="agent-actions cols-2"> <div class="agent-actions cols-2">
<button eicbutton rounded data-output="btnAddAgent" data-trigger="onAddAgent">Create agent</button> <button eicbutton rounded data-output="btnAddAgent" data-trigger="onAddAgent">Create agent</button>
<button eicbutton rounded data-output="btnRemoveAgent" data-trigger="onRemoveAgent" >Remove agent</button> <button eicbutton rounded data-output="btnRemoveAgent" data-trigger="onRemoveAgent" >Remove agent</button>
app/views/editors/KeyframeView.js
+3
View File
@@ -124,6 +124,9 @@ class KeyframeView extends WindozDomContent {
this.setupRefs() this.setupRefs()
} }
onSaveKF(evt){
console.log('SAVE:',this.kfArena.agents)
}
} }