jonas/Hoard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Remove sidebar header and tweak global CSS

Browse Source 
Remove static drawer title/text from Layout.vue and refine global styles: use a color-mix-based ::selection tied to --color-primary-300 for a subtler highlight, and suppress the duplicate inner focus outline on Vuetify inputs so the field frame remains the primary focus indicator. Also update codexInfo.md to document these CSS adjustments.
This commit is contained in:
Jonas
2026-04-17 23:07:06 +02:00
parent 3b910850cb
commit f3b34df5bd
3 changed files with 8 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
GUI/src/Layout.vue
-2
View File
@@ -206,8 +206,6 @@ watch(
> >
<div class="drawer-top"> <div class="drawer-top">
<p class="drawer-kicker">Navigation</p> <p class="drawer-kicker">Navigation</p>
<h2 class="drawer-title">Dateiverwaltung</h2>
<p class="drawer-text">Ordner, Dateien und Ansichten schnell erreichen.</p>
</div> </div>
<v-list nav density="comfortable" class="px-1"> <v-list nav density="comfortable" class="px-1">
GUI/src/global.css
+6 -1
View File
@@ -123,7 +123,7 @@ body {
} }
::selection { ::selection {
background-color: rgb(60 143 66 / 22%); background-color: color-mix(in srgb, var(--color-primary-300) 38%, transparent);
color: var(--color-text); color: var(--color-text);
} }
@@ -266,6 +266,11 @@ p {
color: var(--color-primary-600) !important; color: var(--color-primary-600) !important;
} }
/* Vuetify steuert den Fokuszustand bereits am Feld; verhindert doppelten Fokusrahmen im Input */
.v-input .v-field :is(input, textarea, select):focus-visible {
outline: none !important;
}
.v-label { .v-label {
color: var(--color-text-secondary) !important; color: var(--color-text-secondary) !important;
} }
codexInfo.md
+2
View File
@@ -94,3 +94,5 @@ Ich baue alleine neben meiner Ausbildung eine einfache self-hosted Web-App für
- Darkmode-Fix für `GUI/src/routes/404NotFound.vue`: Heller Weiß-Gradient entfernt und auf theme-basierte Surface-Mischungen umgestellt, damit keine helle Fläche mehr im Darkmode erscheint. - Darkmode-Fix für `GUI/src/routes/404NotFound.vue`: Heller Weiß-Gradient entfernt und auf theme-basierte Surface-Mischungen umgestellt, damit keine helle Fläche mehr im Darkmode erscheint.
- `GUI/src/plugins/routesLayout.ts` um `Visibility.Route` und die optionale Eigenschaft `visibilityRoute` erweitert; `GUI/src/Layout.vue` zeigt Sidebar-Einträge mit `Visibility.Route` nur noch an, wenn die aktuelle Route unter dem konfigurierten Pfad liegt (z. B. `/dash` und Unterrouten). - `GUI/src/plugins/routesLayout.ts` um `Visibility.Route` und die optionale Eigenschaft `visibilityRoute` erweitert; `GUI/src/Layout.vue` zeigt Sidebar-Einträge mit `Visibility.Route` nur noch an, wenn die aktuelle Route unter dem konfigurierten Pfad liegt (z. B. `/dash` und Unterrouten).
- In `GUI/src/plugins/routesLayout.ts` wurde ein kurzer Kommentar ergänzt, der die Nutzung von `Visibility.Public`, `Visibility.Route`, `visibilityRoute` (einzeln/mehrfach) sowie typische Szenarien für die Sidebar-Sichtbarkeit beschreibt. - In `GUI/src/plugins/routesLayout.ts` wurde ein kurzer Kommentar ergänzt, der die Nutzung von `Visibility.Public`, `Visibility.Route`, `visibilityRoute` (einzeln/mehrfach) sowie typische Szenarien für die Sidebar-Sichtbarkeit beschreibt.
- Fokusdarstellung in `GUI/src/global.css` für Vuetify-Inputs verbessert: Der doppelte grüne Fokusrahmen (zusätzlicher `focus-visible`-Outline im inneren `<input>`) wird unterdrückt; der Fokus bleibt über den Feldrahmen klar sichtbar.
- Textauswahl (`::selection`) in `GUI/src/global.css` von kräftigem Grün auf eine subtilere Primär-Tönung reduziert, damit markierte Inhalte ruhiger wirken.