github/sub2api
4
0
Fork 0
mirror of https://github.com/Wei-Shaw/sub2api.git synced 2026-10-31 16:26:30 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #4573 from Astrenix/fix/dark-palette-slate-consistency

Browse Source 
style(frontend): 统一暗色模式表面色板为项目 slate 色系
This commit is contained in:
Wesley Liddick
2026-07-20 15:32:16 +08:00
committed by GitHub
parent 7cbb0d8552 ed280b81fc
commit ecf199d29d
12 changed files with 49 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/views/admin/AccountsView.vue
+12 -12
View File
@@ -38,22 +38,22 @@
</button>
<div
v-if="showAutoRefreshDropdown"
class="absolute right-0 z-50 mt-2 w-56 origin-top-right rounded-lg border border-gray-200 bg-white shadow-lg dark:border-gray-700 dark:bg-gray-800"
class="absolute right-0 z-50 mt-2 w-56 origin-top-right rounded-lg border border-gray-200 bg-white shadow-lg dark:border-dark-700 dark:bg-dark-800"
>
<div class="p-2">
<button
@click="setAutoRefreshEnabled(!autoRefreshEnabled)"
class="flex w-full items-center justify-between rounded-md px-3 py-2 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-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-200 dark:hover:bg-dark-700"
>
<span>{{ t('admin.accounts.enableAutoRefresh') }}</span>
<Icon v-if="autoRefreshEnabled" name="check" size="sm" class="text-primary-500" />
</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 autoRefreshIntervals"
:key="sec"
@click="setAutoRefreshInterval(sec)"
class="flex w-full items-center justify-between rounded-md px-3 py-2 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-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-200 dark:hover:bg-dark-700"
>
<span>{{ autoRefreshIntervalLabel(sec) }}</span>
<Icon v-if="autoRefreshIntervalSeconds === sec" name="check" size="sm" class="text-primary-500" />
@@ -78,7 +78,7 @@
</button>
<div
v-if="showAccountToolsDropdown"
class="absolute right-0 z-50 mt-2 w-[min(20rem,calc(100vw-2rem))] origin-top-right overflow-hidden rounded-lg border border-gray-200 bg-white shadow-xl dark:border-gray-700 dark:bg-gray-800"
class="absolute right-0 z-50 mt-2 w-[min(20rem,calc(100vw-2rem))] origin-top-right overflow-hidden rounded-lg border border-gray-200 bg-white shadow-xl dark:border-dark-700 dark:bg-dark-800"
>
<div class="max-h-[70vh] overflow-y-auto p-2">
<div class="px-2 py-2">
@@ -113,7 +113,7 @@
</span>
</button>
<div class="my-2 border-t border-gray-100 dark:border-gray-700"></div>
<div class="my-2 border-t border-gray-100 dark:border-dark-700"></div>
<div class="px-2 py-2">
<div class="text-xs font-semibold uppercase tracking-wide text-gray-400 dark:text-gray-500">
{{ t('admin.accounts.toolActions') }}
@@ -132,7 +132,7 @@
<span class="flex-1 text-left">{{ t('admin.tlsFingerprintProfiles.title') }}</span>
</button>
<div class="my-2 border-t border-gray-100 dark:border-gray-700"></div>
<div class="my-2 border-t border-gray-100 dark:border-dark-700"></div>
<div class="px-2 py-2">
<div class="flex items-center justify-between gap-3">
<span class="text-xs font-semibold uppercase tracking-wide text-gray-400 dark:text-gray-500">
@@ -146,7 +146,7 @@
v-for="col in toggleableColumns"
:key="col.key"
@click="toggleColumn(col.key)"
class="flex w-full items-center justify-between rounded-md px-3 py-2 text-sm text-gray-700 transition-colors 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-2 text-sm text-gray-700 transition-colors hover:bg-gray-100 dark:text-gray-200 dark:hover:bg-dark-700"
>
<span class="truncate">{{ col.label }}</span>
<Icon v-if="isColumnVisible(col.key)" name="check" size="sm" class="text-primary-500" />
@@ -228,7 +228,7 @@
:href="accountHomepageUrl(row)"
target="_blank"
rel="noopener noreferrer"
class="border-b border-dotted border-gray-300 font-medium text-gray-900 dark:border-gray-600 dark:text-white"
class="border-b border-dotted border-gray-300 font-medium text-gray-900 dark:border-dark-600 dark:text-white"
>
{{ value }}
</a>
@@ -330,7 +330,7 @@
<span class="inline-flex items-center px-1.5 py-0.5 rounded text-xs font-medium bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-200" :title="t('admin.accounts.fallbackActiveTip', { origin: row.proxy_fallback_origin_name })">
{{ t('admin.accounts.fallbackActive') }}
</span>
<button class="text-xs px-1.5 py-0.5 rounded border border-gray-300 dark:border-gray-600 text-gray-600 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700" @click="onRevertFallback(row)">{{ t('admin.accounts.revertProxy') }}</button>
<button class="text-xs px-1.5 py-0.5 rounded border border-gray-300 dark:border-dark-600 text-gray-600 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-dark-700" @click="onRevertFallback(row)">{{ t('admin.accounts.revertProxy') }}</button>
</div>
</div>
</template>
@@ -1348,7 +1348,7 @@ function getOpenAICompactTitle(row: any): string {
function getAntigravityTierClass(row: any): string {
const tier = getAntigravityTierFromRow(row)
switch (tier) {
case 'free-tier': return 'bg-gray-100 text-gray-600 dark:bg-gray-700 dark:text-gray-300'
case 'free-tier': return 'bg-gray-100 text-gray-600 dark:bg-dark-700 dark:text-gray-300'
case 'g1-pro-tier': return 'bg-blue-100 text-blue-600 dark:bg-blue-900/40 dark:text-blue-300'
case 'g1-ultra-tier': return 'bg-purple-100 text-purple-600 dark:bg-purple-900/40 dark:text-purple-300'
default: return ''
@@ -2078,7 +2078,7 @@ onUnmounted(() => {
<style scoped>
.account-tools-menu-item {
@apply flex w-full items-center gap-3 rounded-md px-3 py-2 text-sm text-gray-700 transition-colors hover:bg-gray-100 dark:text-gray-200 dark:hover:bg-gray-700;
@apply flex w-full items-center gap-3 rounded-md px-3 py-2 text-sm text-gray-700 transition-colors hover:bg-gray-100 dark:text-gray-200 dark:hover:bg-dark-700;
}
.account-tools-menu-icon {
frontend/src/views/admin/SubscriptionsView.vue
+9 -9
View File
@@ -37,7 +37,7 @@
<!-- User Dropdown -->
<div
v-if="showFilterUserDropdown && (filterUserResults.length > 0 || filterUserKeyword)"
class="absolute z-50 mt-1 max-h-60 w-full overflow-auto rounded-lg border border-gray-200 bg-white shadow-lg dark:border-gray-700 dark:bg-gray-800"
class="absolute z-50 mt-1 max-h-60 w-full overflow-auto rounded-lg border border-gray-200 bg-white shadow-lg dark:border-dark-700 dark:bg-dark-800"
>
<div
v-if="filterUserLoading"
@@ -56,7 +56,7 @@
:key="user.id"
type="button"
@click="selectFilterUser(user)"
class="w-full px-4 py-2 text-left text-sm hover:bg-gray-100 dark:hover:bg-gray-700"
class="w-full px-4 py-2 text-left text-sm hover:bg-gray-100 dark:hover:bg-dark-700"
>
<span class="font-medium text-gray-900 dark:text-white">{{ user.email }}</span>
<span class="ml-2 text-gray-500 dark:text-gray-400">#{{ user.id }}</span>
@@ -116,24 +116,24 @@
<!-- Dropdown menu -->
<div
v-if="showColumnDropdown"
class="absolute right-0 z-50 mt-2 w-48 origin-top-right rounded-lg border border-gray-200 bg-white shadow-lg dark:border-gray-700 dark:bg-gray-800"
class="absolute right-0 z-50 mt-2 w-48 origin-top-right rounded-lg border border-gray-200 bg-white shadow-lg dark:border-dark-700 dark:bg-dark-800"
>
<div class="p-2">
<!-- User column mode selection -->
<div class="mb-2 border-b border-gray-200 pb-2 dark:border-gray-700">
<div class="mb-2 border-b border-gray-200 pb-2 dark:border-dark-700">
<div class="px-3 py-1 text-xs font-medium text-gray-500 dark:text-gray-400">
{{ t('admin.subscriptions.columns.user') }}
</div>
<button
@click="setUserColumnMode('email')"
class="flex w-full items-center justify-between rounded-md px-3 py-2 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-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-200 dark:hover:bg-dark-700"
>
<span>{{ t('admin.users.columns.email') }}</span>
<Icon v-if="userColumnMode === 'email'" name="check" size="sm" class="text-primary-500" />
</button>
<button
@click="setUserColumnMode('username')"
class="flex w-full items-center justify-between rounded-md px-3 py-2 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-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-200 dark:hover:bg-dark-700"
>
<span>{{ t('admin.users.columns.username') }}</span>
<Icon v-if="userColumnMode === 'username'" name="check" size="sm" class="text-primary-500" />
@@ -144,7 +144,7 @@
v-for="col in toggleableColumns"
:key="col.key"
@click="toggleColumn(col.key)"
class="flex w-full items-center justify-between rounded-md px-3 py-2 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-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-200 dark:hover:bg-dark-700"
>
<span>{{ col.label }}</span>
<Icon v-if="isColumnVisible(col.key)" name="check" size="sm" class="text-primary-500" />
@@ -473,7 +473,7 @@
<!-- User Dropdown -->
<div
v-if="showUserDropdown && (userSearchResults.length > 0 || userSearchKeyword)"
class="absolute z-50 mt-1 max-h-60 w-full overflow-auto rounded-lg border border-gray-200 bg-white shadow-lg dark:border-gray-700 dark:bg-gray-800"
class="absolute z-50 mt-1 max-h-60 w-full overflow-auto rounded-lg border border-gray-200 bg-white shadow-lg dark:border-dark-700 dark:bg-dark-800"
>
<div
v-if="userSearchLoading"
@@ -492,7 +492,7 @@
:key="user.id"
type="button"
@click="selectUser(user)"
class="w-full px-4 py-2 text-left text-sm hover:bg-gray-100 dark:hover:bg-gray-700"
class="w-full px-4 py-2 text-left text-sm hover:bg-gray-100 dark:hover:bg-dark-700"
>
<span class="font-medium text-gray-900 dark:text-white">{{ user.email }}</span>
<span class="ml-2 text-gray-500 dark:text-gray-400">#{{ user.id }}</span>
frontend/src/views/admin/ops/components/OpsDashboardHeader.vue
+3 -3
View File
@@ -1004,8 +1004,8 @@ function handleToolbarRefresh() {
<div
class="pointer-events-none absolute left-1/2 top-full z-50 mt-2 w-72 -translate-x-1/2 opacity-0 transition-opacity duration-200 group-hover:pointer-events-auto group-hover:opacity-100 md:left-full md:top-0 md:ml-2 md:mt-0 md:translate-x-0"
>
<div class="rounded-xl bg-white p-4 shadow-xl ring-1 ring-black/5 dark:bg-gray-800 dark:ring-white/10">
<h4 class="mb-3 border-b border-gray-100 pb-2 text-sm font-bold text-gray-900 dark:border-gray-700 dark:text-white flex items-center gap-2">
<div class="rounded-xl bg-white p-4 shadow-xl ring-1 ring-black/5 dark:bg-dark-800 dark:ring-white/10">
<h4 class="mb-3 border-b border-gray-100 pb-2 text-sm font-bold text-gray-900 dark:border-dark-700 dark:text-white flex items-center gap-2">
<Icon name="brain" size="sm" class="text-blue-500" />
{{ t('admin.ops.diagnosis.title') }}
</h4>
@@ -1046,7 +1046,7 @@ function handleToolbarRefresh() {
</div>
</div>
<div class="mt-3 border-t border-gray-100 pt-2 text-[10px] text-gray-400 dark:border-gray-700">
<div class="mt-3 border-t border-gray-100 pt-2 text-[10px] text-gray-400 dark:border-dark-700">
{{ t('admin.ops.diagnosis.footer') }}
</div>
</div>