openclaw/oikos
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

fix: Sidebar-Menüpunkte kompakter + Tiefeneffekte stark reduziert

Browse Source 
- padding 6px statt space-3/space-2, min-height entfernt
- Hover: box-shadow 2px statt 4px (kaum sichtbar, subtil)
- Aktiv: inset 1px statt 3px (ganz leicht gedrückt)
- border-radius xs statt sm (weniger klobig)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
ulsklyc
2026-03-25 14:27:10 +01:00
parent a189e4be8d
commit 1bea4f1428
1 changed files with 13 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/styles/layout.css
+13 -13
View File
@@ -189,10 +189,10 @@
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
border-radius: var(--radius-sm); border-radius: var(--radius-xs);
padding: var(--space-3) var(--space-2); padding: 6px var(--space-2);
gap: 0; gap: 0;
min-height: 44px; min-height: unset;
font-size: var(--text-sm); font-size: var(--text-sm);
color: var(--color-text-secondary); color: var(--color-text-secondary);
background: transparent; background: transparent;
@@ -205,8 +205,8 @@
} }
.nav-sidebar .nav-item__icon { .nav-sidebar .nav-item__icon {
width: 20px; width: 18px;
height: 20px; height: 18px;
flex-shrink: 0; flex-shrink: 0;
} }
@@ -218,23 +218,23 @@
overflow: hidden; overflow: hidden;
} }
/* Hover: neumorphic raised */ /* Hover: sehr subtiler raised-Effekt */
.nav-sidebar .nav-item:hover:not([aria-current="page"]) { .nav-sidebar .nav-item:hover:not([aria-current="page"]) {
color: var(--color-accent); color: var(--color-accent);
background: var(--sidebar-bg); background: var(--sidebar-bg);
box-shadow: box-shadow:
4px 4px 10px var(--sidebar-shadow-dark), 2px 2px 5px var(--sidebar-shadow-dark),
-4px -4px 10px var(--sidebar-shadow-light); -2px -2px 5px var(--sidebar-shadow-light);
} }
/* Aktiv: neumorphic inset (gedrückt) */ /* Aktiv: leichter inset */
.nav-sidebar .nav-item[aria-current="page"] { .nav-sidebar .nav-item[aria-current="page"] {
color: var(--color-accent); color: var(--color-accent);
font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold);
background: var(--sidebar-bg); background: var(--sidebar-bg);
box-shadow: box-shadow:
inset 3px 3px 7px var(--sidebar-shadow-dark), inset 1px 1px 3px var(--sidebar-shadow-dark),
inset -3px -3px 7px var(--sidebar-shadow-light); inset -1px -1px 3px var(--sidebar-shadow-light);
} }
/* Aktiv-Indikator: kleiner Akzentstreifen links */ /* Aktiv-Indikator: kleiner Akzentstreifen links */
@@ -297,9 +297,9 @@
/* Nav-Items: horizontal mit Label */ /* Nav-Items: horizontal mit Label */
.nav-sidebar .nav-item { .nav-sidebar .nav-item {
justify-content: flex-start; justify-content: flex-start;
padding: var(--space-2) var(--space-3); padding: 6px var(--space-3);
gap: var(--space-3); gap: var(--space-3);
min-height: 40px; min-height: unset;
} }
.nav-sidebar .nav-item__icon { .nav-sidebar .nav-item__icon {