diff --git a/src/routes/admin/+layout.svelte b/src/routes/admin/+layout.svelte index 8a0774a..ceaae4d 100644 --- a/src/routes/admin/+layout.svelte +++ b/src/routes/admin/+layout.svelte @@ -143,7 +143,6 @@ 访问前台 -
{$page.data.user?.email || 'Admin'} @@ -191,7 +190,7 @@ width: 260px; flex-shrink: 0; background: var(--bg-color, #ffffff); - border-right: 1px solid rgba(0, 0, 0, 0.08); + border-right: 2px solid var(--text-color); display: flex; flex-direction: column; height: 100vh; @@ -200,60 +199,62 @@ z-index: 40; } - @media (prefers-color-scheme: dark) { - .sidebar { - border-right: 1px solid rgba(255, 255, 255, 0.1); - } - } - .sidebar-header { height: 60px; display: flex; align-items: center; padding: 0 24px; + border-bottom: 2px solid var(--text-color); } .brand { - font-size: 1.1rem; + font-size: 1.2rem; font-weight: 700; color: var(--text-color); text-decoration: none; - letter-spacing: -0.01em; + letter-spacing: 1px; + text-transform: uppercase; } .sidebar-action { - padding: 12px 16px; + padding: 24px; + border-bottom: 1px solid rgba(0, 0, 0, 0.1); + } + + @media (prefers-color-scheme: dark) { + .sidebar-action { + border-bottom: 1px solid rgba(255, 255, 255, 0.2); + } } .btn-new { display: flex; align-items: center; + justify-content: center; gap: 8px; width: 100%; - padding: 10px 14px; + padding: 12px 14px; background: var(--text-color); color: var(--bg-color, #fff); - border-radius: 6px; font-weight: 600; font-size: 0.95rem; text-decoration: none; - transition: - transform 0.1s, - opacity 0.2s; + text-transform: uppercase; + letter-spacing: 1px; + border: 2px solid var(--text-color); + transition: all 0.2s ease; } .btn-new:hover { - opacity: 0.9; - } - - .btn-new:active { - transform: scale(0.98); + background-color: var(--accent-color, #419b38); + border-color: var(--accent-color, #419b38); + color: white; } .sidebar-scrollable { flex: 1; overflow-y: auto; - padding: 8px 12px 24px 12px; + padding: 24px 0; } /* Scrollbar styling for sidebar */ @@ -261,92 +262,84 @@ width: 4px; } .sidebar-scrollable::-webkit-scrollbar-thumb { - background: rgba(0, 0, 0, 0.1); - border-radius: 4px; + background: var(--text-color); } .nav-group { - margin-bottom: 24px; + margin-bottom: 30px; } .nav-group-title { - font-size: 0.75rem; - font-weight: 600; - color: var(--text-muted, rgba(0, 0, 0, 0.4)); + font-size: 0.8rem; + font-weight: 700; + color: var(--text-color); text-transform: uppercase; - letter-spacing: 0.05em; - padding: 0 12px; - margin-bottom: 8px; + letter-spacing: 1px; + padding: 0 24px; + margin-bottom: 12px; + opacity: 0.6; } .nav-item { display: flex; align-items: center; gap: 12px; - padding: 8px 12px; + padding: 10px 24px; color: var(--text-color); text-decoration: none; - border-radius: 6px; font-size: 0.95rem; font-weight: 500; - margin-bottom: 2px; - transition: - background-color 0.2s, - color 0.2s; + transition: all 0.2s; + border-left: 3px solid transparent; } .nav-item:hover { - background-color: rgba(0, 0, 0, 0.04); + color: var(--accent-color, #419b38); + padding-left: 28px; } .nav-item.active { - background-color: rgba(0, 0, 0, 0.06); - font-weight: 600; + border-left: 3px solid var(--accent-color, #419b38); + font-weight: 700; + background: rgba(0, 0, 0, 0.03); } @media (prefers-color-scheme: dark) { - .nav-item:hover { - background-color: rgba(255, 255, 255, 0.06); - } .nav-item.active { - background-color: rgba(255, 255, 255, 0.1); + background: rgba(255, 255, 255, 0.05); } } .sidebar-footer { - padding: 16px 20px; - border-top: 1px solid rgba(0, 0, 0, 0.08); + padding: 20px 24px; + border-top: 2px solid var(--text-color); display: flex; flex-direction: column; - gap: 8px; - font-size: 0.85rem; - color: var(--text-muted, rgba(0, 0, 0, 0.6)); - } - - @media (prefers-color-scheme: dark) { - .sidebar-footer { - border-top: 1px solid rgba(255, 255, 255, 0.1); - } + gap: 12px; + font-size: 0.9rem; } .site-link { display: inline-flex; align-items: center; gap: 8px; - color: var(--text-muted, rgba(0, 0, 0, 0.6)); + color: var(--text-color); text-decoration: none; - font-weight: 500; + font-weight: 600; transition: color 0.2s; + text-transform: uppercase; + letter-spacing: 0.5px; } .site-link:hover { - color: var(--text-color); + color: var(--accent-color, #419b38); } .user-email { font-weight: 500; - opacity: 0.7; word-break: break-all; + color: var(--text-color); + opacity: 0.8; } /* Main Wrapper */ @@ -363,7 +356,7 @@ align-items: center; padding: 0 16px; background: var(--bg-color, #ffffff); - border-bottom: 1px solid rgba(0, 0, 0, 0.08); + border-bottom: 2px solid var(--text-color); position: sticky; top: 0; z-index: 30;