layout
This commit is contained in:
@@ -24,8 +24,10 @@ if ($currentModule) {
|
|||||||
<body data-theme="<?= e($theme) ?>">
|
<body data-theme="<?= e($theme) ?>">
|
||||||
<div class="bg-orb orb-a"></div>
|
<div class="bg-orb orb-a"></div>
|
||||||
<div class="bg-orb orb-b"></div>
|
<div class="bg-orb orb-b"></div>
|
||||||
|
<div class="app-shell">
|
||||||
<header class="topbar">
|
<header class="topbar">
|
||||||
<div class="topbar-left">
|
<div class="topbar-left">
|
||||||
|
<img src="/assets/images/logo.png" alt="Nexus Logo" class="topbar-logo">
|
||||||
<?php if ($currentModule && !empty($module['title'])): ?>
|
<?php if ($currentModule && !empty($module['title'])): ?>
|
||||||
<h1 class="page-title"><?= e($module['title']) ?></h1>
|
<h1 class="page-title"><?= e($module['title']) ?></h1>
|
||||||
<span class="pill">Modul</span>
|
<span class="pill">Modul</span>
|
||||||
@@ -46,16 +48,11 @@ if ($currentModule) {
|
|||||||
<a class="nav-link" href="/modules/install">Modul installieren/aktivieren</a>
|
<a class="nav-link" href="/modules/install">Modul installieren/aktivieren</a>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<div class="app-shell">
|
|
||||||
<aside class="app-sidebar">
|
<aside class="app-sidebar">
|
||||||
<div class="brand">
|
|
||||||
<img src="/assets/images/logo.png" alt="Nexus Logo">
|
|
||||||
<div class="brand-text">
|
<div class="brand-text">
|
||||||
<div class="brand-title"><?= htmlspecialchars(t('common.title'), ENT_QUOTES) ?></div>
|
<div class="brand-title"><?= htmlspecialchars(t('common.title'), ENT_QUOTES) ?></div>
|
||||||
<div class="brand-sub">Nexus Control Panel</div>
|
<div class="brand-sub">Nexus Control Panel</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<button class="sidebar-toggle" data-sidebar-toggle aria-label="Menü ein-/ausklappen">
|
<button class="sidebar-toggle" data-sidebar-toggle aria-label="Menü ein-/ausklappen">
|
||||||
<span class="sidebar-icon">☰</span>
|
<span class="sidebar-icon">☰</span>
|
||||||
|
|||||||
@@ -79,7 +79,7 @@ body {
|
|||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: 260px 1fr;
|
grid-template-columns: 260px 1fr;
|
||||||
gap: 24px;
|
gap: 24px;
|
||||||
padding: 0 24px 24px;
|
padding: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.app-sidebar {
|
.app-sidebar {
|
||||||
@@ -130,6 +130,12 @@ body {
|
|||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 14px;
|
gap: 14px;
|
||||||
}
|
}
|
||||||
|
.topbar-logo {
|
||||||
|
height: 40px;
|
||||||
|
width: auto;
|
||||||
|
filter: drop-shadow(0 8px 18px rgba(0,0,0,0.12));
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
.brand img {
|
.brand img {
|
||||||
height: 46px;
|
height: 46px;
|
||||||
width: auto;
|
width: auto;
|
||||||
@@ -198,10 +204,10 @@ body {
|
|||||||
top: 0;
|
top: 0;
|
||||||
z-index: 20;
|
z-index: 20;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
width: 100%;
|
grid-column: 1 / -1;
|
||||||
background: var(--panel);
|
background: var(--panel);
|
||||||
border: 1px solid var(--line);
|
border: 1px solid var(--line);
|
||||||
border-radius: 0;
|
border-radius: 16px;
|
||||||
padding: 16px 24px;
|
padding: 16px 24px;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@@ -311,7 +317,7 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 1100px) {
|
@media (max-width: 1100px) {
|
||||||
.app-shell { grid-template-columns: 1fr; padding: 0 18px 18px; }
|
.app-shell { grid-template-columns: 1fr; padding: 18px; }
|
||||||
.app-sidebar { position: relative; top: 0; }
|
.app-sidebar { position: relative; top: 0; }
|
||||||
}
|
}
|
||||||
@media (max-width: 720px) {
|
@media (max-width: 720px) {
|
||||||
|
|||||||
Reference in New Issue
Block a user