Space UI Demo v2 (PHP + CSS + JS)
Übersicht
Diese Demo zeigt eine HUD-artige Navigation mit statischem Hauptmenü, kontextabhängiger Subnav, Sticky-Ressourcenleiste, Toasts und einem generischen Content-Bereich. Das HTML wird vom zentralen Entry-Point public/index.php zusammengesetzt, die einzelnen Bausteine liegen als Partial-Templates in src/partials.
Verzeichnisstruktur
web/desktop/public/: Dokumentenwurzel für den Desktop-Entry-Point und seine Assets (assets/).web/desktop/src/partials/: Die PHP-Partial-Templates für Menüs, Ressourcen und Content im Desktop-Build.web/mobile/public/: Mobile-Entry-Point; derzeit eine Kopie des Desktop-Systems, die für responsive Änderungen angepasst werden kann.web/mobile/src/partials/: Mobile-Partial-Templates (momentan identisch zum Desktop-Set).
Layout-Highlights
- Sidebar: Hauptmenü (links) mit statischem Link-Set plus optionaler Planetenliste auf der Unterseite.
- Topbar & Notification-Dropdown: Anzeige, Actions & Test-Toast-Button.
- Subnav: Mittig platzierte Tabs (Kontextmenü) basierend auf dem
$subnav-Array inpublic/index.php. - Ressourcenleiste: Sticky-Komponente unterhalb der Subnav (
src/partials/ressourcen.php). - Content: Demo-Inhalte aus
src/partials/site.php, die Sections und Subpages simulieren. - Footer: Menü-Links und optionaler Admin-Chip, gesteuert über
$isAdmin.
Lokale Entwicklung
cd /path/to/Space-Theme.php -S localhost:8000 -t web/desktop/public(setzt die Dokumentenwurzel auf den Desktop-Build).- Öffne
http://localhost:8000/index.phpund wechsle z. B. über?s=build&p=demolishdie Sections oder wechsle mit-t web/mobile/publiczur mobilen Variante.
Hinweise
- Die PHP-Session (
session_start()) im Entry-Point dient Flash-Toasts und Alert-Messages. - Die Partial-Templates erwarten die Variablen
$section,$sub,$planetund greifen über$partialsPathausweb/public/index.phpaufeinander zu. - Performance-/Alert-Profile werden über
sessionStoragebzw.localStoragegesteuert – die Buttons inpublic/assets/ui.jssorgen für die Visualisierung.