Daniel/ndsolutionswebsite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

rename(theme): rename Design-Preset to Farb-Auswahl and show 4 global color indicators
All checks were successful
Production Build & Deploy / build-and-deploy (push) Successful in 45s
Details

Browse Source
This commit is contained in:
Daniel S
2026-08-09 23:11:03 +02:00
parent e932495742
commit 4d072864bc
2 changed files with 11 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/pages/admin/editor.astro
View File

@@ -34,7 +34,7 @@ const previewUrl = `${targetPage?.slug || '/'}?preview=draft`;
</div>
<div class="space-y-2">
<label class="text-xs font-semibold text-slate-400 uppercase tracking-wider block">Design-Preset</label>
<label class="text-xs font-semibold text-slate-400 uppercase tracking-wider block">Farb-Auswahl</label>
<select id="preset-selector" class="w-full bg-slate-800 border border-slate-700 rounded-lg p-2.5 text-xs text-white focus:outline-none focus:border-sky-500">
{Object.entries(THEME_PRESETS).map(([key, preset]) => (
<option value={key}>{preset.name}</option>
@@ -42,6 +42,7 @@ const previewUrl = `${targetPage?.slug || '/'}?preview=draft`;
</select>
</div>
<div class="space-y-2">
<label class="text-xs font-semibold text-slate-400 uppercase tracking-wider block">Farbschema</label>
<div class="grid grid-cols-2 gap-2">

14
src/pages/admin/index.astro
View File

@@ -154,12 +154,13 @@ const presets = Object.values(THEME_PRESETS);
<!-- Sidebar Column -->
<div class="space-y-8">
<!-- Theme Preset Picker & Custom Colors -->
<!-- Farb-Auswahl (10 globale Farb-Kombinationen) & Custom Colors -->
<div class="glass-panel rounded-2xl p-6 space-y-4">
<h2 class="text-lg font-bold text-sky-400 uppercase tracking-wider flex items-center gap-2">
Theme Preset (10 Styles)
🎨 Farb-Auswahl (10 Farb-Kombinationen)
</h2>
<div class="space-y-2 max-h-[220px] overflow-y-auto pr-1">
<p class="text-[10px] text-slate-400">Wähle eine globale Farbkombination für das gesamte Farbspektrum:</p>
<div class="space-y-2 max-h-[260px] overflow-y-auto pr-1">
{presets.map((p) => (
<label class={`flex items-center justify-between p-3 rounded-xl border transition-all cursor-pointer ${themeConfig.activePreset === p.id ? 'border-sky-400 bg-sky-400/10' : 'border-white/5 hover:border-white/20 bg-slate-950/40'}`}>
<div class="flex items-center gap-3">
@@ -167,13 +168,16 @@ const presets = Object.values(THEME_PRESETS);
<span class="text-xs font-semibold">{p.name}</span>
</div>
<div class="flex items-center gap-1">
<span class="w-3 h-3 rounded-full inline-block border border-white/20" style={`background-color: ${p.colors.bg};`}></span>
<span class="w-3 h-3 rounded-full inline-block" style={`background-color: ${p.colors.accent};`}></span>
<span class="w-2.5 h-2.5 rounded-full inline-block border border-white/20" style={`background-color: ${p.colors.bg};`} title="Hintergrund"></span>
<span class="w-2.5 h-2.5 rounded-full inline-block border border-white/20" style={`background-color: ${p.colors.cardBg};`} title="Karten"></span>
<span class="w-2.5 h-2.5 rounded-full inline-block border border-white/20" style={`background-color: ${p.colors.text};`} title="Text"></span>
<span class="w-2.5 h-2.5 rounded-full inline-block border border-white/20" style={`background-color: ${p.colors.accent};`} title="Akzent"></span>
</div>
</label>
))}
</div>
<!-- Custom Colors Section -->
<h3 class="text-xs font-bold text-slate-400 uppercase tracking-wider pt-3 border-t border-white/10">Individuelle Farbvergabe (Overrides)</h3>
<p class="text-[10px] text-slate-400">Überschreibe hier gezielt einzelne Preset-Farben:</p>