CyberMind-FR
0d6aaa1111
- Add complete Project Hub & Workspace Interface implementation - New data models: Project, ModuleKit, Workspace - 3 fixture projects (cybermind.fr, cybermood.eu, secubox-c3) - 4 module kits (Security, Network, Automation, Media) - Workspace routes with project switching and kit installation - 4 workspace tabs: Overview, Module Kits, Devices, Composer - New navigation item: Workspace (7th section) - Remove all glowing effects from UI - Remove Command Center widget glow and backdrop blur - Remove device status indicator glow - Remove toggle button glow effects - Extend DataStore with 13 new methods for workspace management - Add 270+ lines of workspace-specific CSS with responsive layouts - Create workspace templates and result partials 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
49 lines
2.2 KiB
HTML
49 lines
2.2 KiB
HTML
<!-- Visual Module Composer (Future Feature) -->
|
|
<section class="panel">
|
|
<div class="panel-head">
|
|
<div>
|
|
<h2>🎨 Module Composer</h2>
|
|
<p>Visual drag & drop module builder (coming soon)</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="composer-container">
|
|
<!-- Module Palette -->
|
|
<div class="module-palette">
|
|
<h3 style="margin-bottom: 1rem; font-size: 1rem;">Available Modules</h3>
|
|
<div style="text-align: center; padding: 2rem; color: var(--text-muted); font-size: 0.9rem;">
|
|
<p>Module palette will allow you to drag and drop modules onto the canvas.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Composer Canvas -->
|
|
<div class="composer-canvas">
|
|
<div style="display: flex; align-items: center; justify-content: center; height: 100%; color: var(--text-muted);">
|
|
<div style="text-align: center; max-width: 500px; padding: 2rem;">
|
|
<h3 style="margin-bottom: 1rem;">🚧 Coming Soon</h3>
|
|
<p style="margin-bottom: 1rem;">
|
|
The Module Composer will let you visually design and connect modules to create custom workflows and configurations.
|
|
</p>
|
|
<p style="font-size: 0.9rem; margin-bottom: 1.5rem;">
|
|
Features will include:
|
|
</p>
|
|
<ul style="text-align: left; margin-left: auto; margin-right: auto; max-width: 300px; font-size: 0.9rem;">
|
|
<li>Drag & drop module placement</li>
|
|
<li>Visual connection builder</li>
|
|
<li>Data flow visualization</li>
|
|
<li>Export as module kit or profile</li>
|
|
<li>Real-time validation</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Composer Actions -->
|
|
<div class="card-footer" style="display: flex; gap: 0.5rem; margin-top: 1.5rem;">
|
|
<button class="btn primary" disabled>💾 Save Composition</button>
|
|
<button class="btn ghost" disabled>📤 Export as Kit</button>
|
|
<button class="btn ghost" disabled>🔄 Clear Canvas</button>
|
|
</div>
|
|
</section>
|