Pysty/vaaka-toggle avatareille
Lisätty nappi jolla org-chartin voi vaihtaa vaaka- ja pystyasennon välillä. Vaaka on oletuksena (kompakti), pysty lisää vertical-CSS-luokan. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -421,6 +421,16 @@
|
|||||||
.org-branch {
|
.org-branch {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
.org-chart.vertical {
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0;
|
||||||
|
}
|
||||||
|
.org-chart.vertical .org-connector {
|
||||||
|
width: 2px;
|
||||||
|
height: 24px;
|
||||||
|
background: linear-gradient(to bottom, rgba(88, 166, 255, 0.8), rgba(88, 166, 255, 0.2));
|
||||||
|
}
|
||||||
.avatar-card {
|
.avatar-card {
|
||||||
background: linear-gradient(145deg, rgba(33, 38, 45, 0.4) 0%, rgba(13, 17, 23, 0.8) 100%);
|
background: linear-gradient(145deg, rgba(33, 38, 45, 0.4) 0%, rgba(13, 17, 23, 0.8) 100%);
|
||||||
backdrop-filter: blur(12px);
|
backdrop-filter: blur(12px);
|
||||||
@@ -1007,6 +1017,7 @@
|
|||||||
<div style="display:flex;align-items:center;gap:16px;">
|
<div style="display:flex;align-items:center;gap:16px;">
|
||||||
<span style="font-weight:600;font-size:15px;color:var(--text-color)"><span style="color:#ff6b00">Kipinä</span> Agent Workspace</span>
|
<span style="font-weight:600;font-size:15px;color:var(--text-color)"><span style="color:#ff6b00">Kipinä</span> Agent Workspace</span>
|
||||||
<button id="btn-toggle-all" onclick="toggleAllAgents()" style="background:rgba(33, 38, 45, 0.8);border:1px solid var(--border-color);color:#c9d1d9;font-size:11px;padding:4px 12px;border-radius:4px;cursor:pointer;">Valitse kaikki</button>
|
<button id="btn-toggle-all" onclick="toggleAllAgents()" style="background:rgba(33, 38, 45, 0.8);border:1px solid var(--border-color);color:#c9d1d9;font-size:11px;padding:4px 12px;border-radius:4px;cursor:pointer;">Valitse kaikki</button>
|
||||||
|
<button id="btn-toggle-layout" onclick="toggleOrgLayout()" style="background:rgba(33, 38, 45, 0.8);border:1px solid var(--border-color);color:#c9d1d9;font-size:11px;padding:4px 12px;border-radius:4px;cursor:pointer;">⇅ Pysty</button>
|
||||||
</div>
|
</div>
|
||||||
<span id="agent-status" style="font-size:12px;color:var(--success-color)">Monitoring Active</span>
|
<span id="agent-status" style="font-size:12px;color:var(--success-color)">Monitoring Active</span>
|
||||||
</div>
|
</div>
|
||||||
@@ -1303,6 +1314,16 @@
|
|||||||
updatePromptEditor();
|
updatePromptEditor();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
window.toggleOrgLayout = function() {
|
||||||
|
const chart = document.querySelector('.org-chart');
|
||||||
|
const btn = document.getElementById('btn-toggle-layout');
|
||||||
|
if (chart.classList.toggle('vertical')) {
|
||||||
|
btn.textContent = '⇄ Vaaka';
|
||||||
|
} else {
|
||||||
|
btn.textContent = '⇅ Pysty';
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
// Autosave prompti
|
// Autosave prompti
|
||||||
document.getElementById('agent-prompt-text')?.addEventListener('input', (e) => {
|
document.getElementById('agent-prompt-text')?.addEventListener('input', (e) => {
|
||||||
if (selectedAgents.size === 0) return;
|
if (selectedAgents.size === 0) return;
|
||||||
|
|||||||
Reference in New Issue
Block a user