github/sub2api
4
0 Fork 0
mirror of https://github.com/Wei-Shaw/sub2api.git synced 2026-11-02 16:32:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

style(frontend): align dark-mode surfaces with the slate dark palette

Browse Source 
The project's dark theme uses the custom slate-based dark-* palette
(928 dark:bg-dark-* / 787 dark:border-dark-* occurrences), but a
minority of surfaces still used Tailwind's neutral gray-* scale, which
has a visibly cooler hue next to slate cards — most noticeably the
filter dropdown panels on the usage, accounts and subscriptions pages.

Migrate the remaining dark:bg-gray-* / dark:border-gray-* (and their
hover: variants) to the dark-* palette across 12 components: filter
dropdowns, chart card borders, menu separators, and small badges.
49 class-string substitutions, no structural or logic changes;
dark:text-gray-* is untouched since gray text on dark surfaces is the
established project-wide convention.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
AstrenixandClaude Fable 5 committed 2026-07-19 02:45:41 +08:00
1 parent d4b9797ff7
commit ed280b81fc
12 files changed
+49 -49
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

frontend/src/components/common/AutoRefreshButton.vue
+3 -3
View File
@@ -27,19 +27,19 @@
<div class="p-1.5">
<button
@click="$emit('update:enabled', !enabled)"
class="flex w-full items-center justify-between rounded-md px-3 py-1.5 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-200 dark:hover:bg-gray-700"
class="flex w-full items-center justify-between rounded-md px-3 py-1.5 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-200 dark:hover:bg-dark-700"
>
<span>{{ t('common.autoRefresh.enable') }}</span>
<svg v-if="enabled" class="h-4 w-4 text-primary-500" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd" d="M16.704 4.153a.75.75 0 01.143 1.052l-8 10.5a.75.75 0 01-1.127.075l-4.5-4.5a.75.75 0 011.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 011.05-.143z" clip-rule="evenodd" />
</svg>
</button>
<div class="my-1 border-t border-gray-100 dark:border-gray-700"></div>
<div class="my-1 border-t border-gray-100 dark:border-dark-700"></div>
<button
v-for="sec in intervals"
:key="sec"
@click="$emit('update:interval', sec)"
class="flex w-full items-center justify-between rounded-md px-3 py-1.5 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-200 dark:hover:bg-gray-700"
class="flex w-full items-center justify-between rounded-md px-3 py-1.5 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-200 dark:hover:bg-dark-700"
>
<span>{{ t('common.autoRefresh.seconds', { n: sec }) }}</span>
<svg v-if="intervalSeconds === sec" class="h-4 w-4 text-primary-500" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">