fix(dark-mode): correct dark mode token pairs

- bg-white -> bg-surface-50 (token compliance)
- Add missing dark:text-surface-100 on inputs
- Fix dark:border-surface-600 -> dark:border-surface-700
- Fix badge bg opacity (dark:bg-accent-900/30)

Confab-Link: http://localhost:8080/sessions/0ec83454-d346-4329-8aaf-6b12139bf596
This commit is contained in:
Ricardo
2026-03-07 15:59:36 +01:00
parent 9832c671c6
commit c6a3b090df
2 changed files with 6 additions and 6 deletions
+4 -4
View File
@@ -13,19 +13,19 @@
{# Mini stats — 2x2 grid #}
<div class="grid grid-cols-2 gap-2 mb-3">
<div class="text-center p-2 rounded-lg bg-white dark:bg-surface-800 border border-surface-200 dark:border-surface-700">
<div class="text-center p-2 rounded-lg bg-surface-50 dark:bg-surface-800 border border-surface-200 dark:border-surface-700">
<div class="text-lg font-bold text-surface-900 dark:text-surface-100">{{ stats.total }}</div>
<div class="text-[10px] text-surface-500 dark:text-surface-400">Total</div>
</div>
<div class="text-center p-2 rounded-lg bg-white dark:bg-surface-800 border border-surface-200 dark:border-surface-700">
<div class="text-center p-2 rounded-lg bg-surface-50 dark:bg-surface-800 border border-surface-200 dark:border-surface-700">
<div class="text-lg font-bold text-amber-600 dark:text-amber-400">{{ stats.aiCount }}</div>
<div class="text-[10px] text-surface-500 dark:text-surface-400">AI-involved</div>
</div>
<div class="text-center p-2 rounded-lg bg-white dark:bg-surface-800 border border-surface-200 dark:border-surface-700">
<div class="text-center p-2 rounded-lg bg-surface-50 dark:bg-surface-800 border border-surface-200 dark:border-surface-700">
<div class="text-lg font-bold text-emerald-600 dark:text-emerald-400">{{ stats.total - stats.aiCount }}</div>
<div class="text-[10px] text-surface-500 dark:text-surface-400">Human-only</div>
</div>
<div class="text-center p-2 rounded-lg bg-white dark:bg-surface-800 border border-surface-200 dark:border-surface-700">
<div class="text-center p-2 rounded-lg bg-surface-50 dark:bg-surface-800 border border-surface-200 dark:border-surface-700">
<div class="text-lg font-bold text-surface-900 dark:text-surface-100">{{ stats.percentage }}%</div>
<div class="text-[10px] text-surface-500 dark:text-surface-400">AI ratio</div>
</div>
@@ -5,12 +5,12 @@
<h3 class="widget-title">Categories</h3>
<div class="flex flex-wrap gap-2">
{% if category is string %}
<a href="/categories/{{ category | slugify }}/" class="p-category text-xs px-2 py-1 bg-accent-100 dark:bg-accent-900 text-accent-700 dark:text-accent-300 rounded-full hover:bg-accent-200 dark:hover:bg-accent-800 transition-colors">
<a href="/categories/{{ category | slugify }}/" class="p-category text-xs px-2 py-1 bg-accent-100 dark:bg-accent-900/30 text-accent-700 dark:text-accent-300 rounded-full hover:bg-accent-200 dark:hover:bg-accent-800 transition-colors">
{{ category }}
</a>
{% else %}
{% for cat in category %}
<a href="/categories/{{ cat | slugify }}/" class="p-category text-xs px-2 py-1 bg-accent-100 dark:bg-accent-900 text-accent-700 dark:text-accent-300 rounded-full hover:bg-accent-200 dark:hover:bg-accent-800 transition-colors">
<a href="/categories/{{ cat | slugify }}/" class="p-category text-xs px-2 py-1 bg-accent-100 dark:bg-accent-900/30 text-accent-700 dark:text-accent-300 rounded-full hover:bg-accent-200 dark:hover:bg-accent-800 transition-colors">
{{ cat }}
</a>
{% endfor %}