Reorganize layout for public root
This commit is contained in:
35
README.md
35
README.md
@@ -1,18 +1,27 @@
|
|||||||
# Space UI Demo v2 (PHP + CSS + JS)
|
# Space UI Demo v2 (PHP + CSS + JS)
|
||||||
|
|
||||||
## Start
|
## Übersicht
|
||||||
- Built-in PHP server:
|
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`.
|
||||||
php -S localhost:8000
|
|
||||||
then open: http://localhost:8000/index.php
|
|
||||||
|
|
||||||
## Layout (wie besprochen)
|
## Verzeichnisstruktur
|
||||||
- Links: Hauptmenü (statisch) + unten Planetenliste
|
- `public/`: Dokumentenwurzel, in der `index.php` sitzt und auf die Assets (`assets/`) zugreift. Alles, was vom Webserver ausgeliefert wird, gehört hierhin.
|
||||||
- Rechts: Topbar + Alert (optional) + Kontextmenü (Subnav in der Mitte) + Sticky Resources + Content + Footer
|
- `public/assets/`: CSS- und JS-Dateien (`style.css`, `ui.js`, `starfield.js`).
|
||||||
- Kontextmenü wechselt je nach Hauptmenüpunkt
|
- `src/partials/`: Menü-, Footer-, Ressourcendarstellung und Content-Renderer, die `public/index.php` inkludiert.
|
||||||
|
|
||||||
## Settings (ohne Cookies)
|
## Layout-Highlights
|
||||||
- Einstellungen -> Performance: Auto/Low/Medium/High (sessionStorage oder localStorage)
|
- **Sidebar**: Hauptmenü (links) mit statischem Link-Set plus optionaler Planetenliste auf der Unterseite.
|
||||||
- Einstellungen -> Alerts: Burst (3x) oder Loop (sessionStorage oder localStorage)
|
- **Topbar & Notification-Dropdown**: Anzeige, Actions & Test-Toast-Button.
|
||||||
|
- **Subnav**: Mittig platzierte Tabs (Kontextmenü) basierend auf dem `$subnav`-Array in `public/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`.
|
||||||
|
|
||||||
## Demos
|
## Lokale Entwicklung
|
||||||
- In Sidebar: "Demo: Success" / "Demo: Warning"
|
1. `cd /path/to/Space-Theme`.
|
||||||
|
2. `php -S localhost:8000 -t public` (setzt die Dokumentenwurzel auf `public/`).
|
||||||
|
3. Öffne `http://localhost:8000/index.php` und wechsle z. B. über `?s=build&p=demolish` die Sections.
|
||||||
|
|
||||||
|
## Hinweise
|
||||||
|
- Die PHP-Session (`session_start()`) im Entry-Point dient Flash-Toasts und Alert-Messages.
|
||||||
|
- Die Partial-Templates erwarten die Variablen `$section`, `$sub`, `$planet` und greifen über `$partialsPath` aufeinander zu.
|
||||||
|
- Performance-/Alert-Profile werden über `sessionStorage` bzw. `localStorage` gesteuert – die Buttons in `public/assets/ui.js` sorgen für die Visualisierung.
|
||||||
|
|||||||
@@ -64,6 +64,8 @@ $pageTitle = "Space UI – $section / $sub";
|
|||||||
|
|
||||||
// Admin demo (set to true to see footer admin link)
|
// Admin demo (set to true to see footer admin link)
|
||||||
$isAdmin = false;
|
$isAdmin = false;
|
||||||
|
$partialsPath = __DIR__ . '/../src/partials';
|
||||||
|
$partialsPath = __DIR__ . '/../src/partials';
|
||||||
?>
|
?>
|
||||||
<!doctype html>
|
<!doctype html>
|
||||||
<html lang="de"
|
<html lang="de"
|
||||||
@@ -107,11 +109,11 @@ $isAdmin = false;
|
|||||||
<!-- LINKS: Sidebar -->
|
<!-- LINKS: Sidebar -->
|
||||||
<aside class="sidebar" aria-label="Seitenleiste">
|
<aside class="sidebar" aria-label="Seitenleiste">
|
||||||
<div class="card panel">
|
<div class="card panel">
|
||||||
<?php include __DIR__ . "/menue.php"; ?>
|
<?php include $partialsPath . '/menue.php'; ?>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="card panel">
|
<div class="card panel">
|
||||||
<?php include __DIR__ . "/menue2.php"; ?>
|
<?php include $partialsPath . '/menue2.php'; ?>
|
||||||
</div>
|
</div>
|
||||||
</aside>
|
</aside>
|
||||||
|
|
||||||
@@ -169,7 +171,7 @@ $isAdmin = false;
|
|||||||
<!-- OPTIONAL: Alert Banner (über Subnav) -->
|
<!-- OPTIONAL: Alert Banner (über Subnav) -->
|
||||||
<?php if (!empty($errorMessage)): ?>
|
<?php if (!empty($errorMessage)): ?>
|
||||||
<header class="alertbar card panel" role="alert" aria-live="polite">
|
<header class="alertbar card panel" role="alert" aria-live="polite">
|
||||||
<?php include __DIR__ . "/menue-top.php"; ?>
|
<?php include $partialsPath . '/menue-top.php'; ?>
|
||||||
</header>
|
</header>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
|
|
||||||
@@ -195,7 +197,7 @@ $isAdmin = false;
|
|||||||
|
|
||||||
<!-- Ressourcen (sticky) -->
|
<!-- Ressourcen (sticky) -->
|
||||||
<div class="resourcebar card panel">
|
<div class="resourcebar card panel">
|
||||||
<?php include __DIR__ . "/ressourcen.php"; ?>
|
<?php include $partialsPath . '/ressourcen.php'; ?>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Content -->
|
<!-- Content -->
|
||||||
@@ -209,12 +211,12 @@ $isAdmin = false;
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<?php include __DIR__ . "/site.php"; ?>
|
<?php include $partialsPath . '/site.php'; ?>
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<!-- Footer -->
|
<!-- Footer -->
|
||||||
<footer class="footer card panel">
|
<footer class="footer card panel">
|
||||||
<?php include __DIR__ . "/menue-foot.php"; ?>
|
<?php include $partialsPath . '/menue-foot.php'; ?>
|
||||||
<?php if ($isAdmin): ?>
|
<?php if ($isAdmin): ?>
|
||||||
<div class="divider"></div>
|
<div class="divider"></div>
|
||||||
<a class="chip" href="index.php?s=admin&planet=<?= urlencode($planet) ?>">Admin</a>
|
<a class="chip" href="index.php?s=admin&planet=<?= urlencode($planet) ?>">Admin</a>
|
||||||
Reference in New Issue
Block a user