- 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>
52 lines
2.1 KiB
HTML
52 lines
2.1 KiB
HTML
{% extends theme_template %}
|
|
|
|
{% block title %}AppStore - SecuBox WebUI{% endblock %}
|
|
|
|
{% block content %}
|
|
<section class="panel" x-data="{ searchQuery: '{{ search_query }}', showInstalled: {{ 'true' if show_installed else 'false' }} }">
|
|
<div class="panel-head">
|
|
<div>
|
|
<h2>🏪 AppStore</h2>
|
|
<p>Browse, install, and manage SecuBox applications</p>
|
|
</div>
|
|
|
|
<!-- Search bar with Alpine -->
|
|
<div class="search-bar" style="display: flex; gap: 1rem; align-items: center;">
|
|
<input type="text"
|
|
x-model="searchQuery"
|
|
@input.debounce.500ms="
|
|
htmx.ajax('GET', '/appstore/grid?search=' + searchQuery + '&theme={{ selected_theme }}',
|
|
{target: '#appstore-grid', swap: 'outerHTML'})
|
|
"
|
|
placeholder="Search apps..."
|
|
style="padding: 0.5rem 1rem; border: 1px solid var(--border); border-radius: 999px; min-width: 300px;">
|
|
|
|
<label style="display: flex; align-items: center; gap: 0.5rem; cursor: pointer;">
|
|
<input type="checkbox"
|
|
x-model="showInstalled"
|
|
@change="htmx.ajax('GET', '/appstore?installed=' + showInstalled + '&theme={{ selected_theme }}',
|
|
{target: 'main', swap: 'innerHTML'})">
|
|
<span>Installed only</span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Category filters -->
|
|
<div class="chip-group" style="margin-bottom: 1.5rem; display: flex; flex-wrap: wrap; gap: 0.5rem;">
|
|
<a href="/appstore?theme={{ selected_theme }}"
|
|
class="chip {% if not active_category %}chip-active{% endif %}">
|
|
All
|
|
</a>
|
|
{% for cat in categories %}
|
|
<a href="/appstore?category={{ cat }}&theme={{ selected_theme }}"
|
|
class="chip {% if active_category == cat %}chip-active{% endif %}">
|
|
{{ cat }}
|
|
</a>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
<!-- Grid -->
|
|
{% include "partials/appstore_grid.html" %}
|
|
</section>
|
|
{% endblock %}
|