From 3358208817e54bb5b37833cb7534e834b90b310a Mon Sep 17 00:00:00 2001 From: void-57 Date: Fri, 5 Dec 2025 15:03:12 +0530 Subject: [PATCH] feat: Add light theme support --- style.css | 44 +++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 43 insertions(+), 1 deletion(-) diff --git a/style.css b/style.css index ba8fde8..6735552 100644 --- a/style.css +++ b/style.css @@ -11,6 +11,12 @@ --success: #10b981; --warning: #f59e0b; --error: #ef4444; + --accent: #8b5cf6; /* Violet */ +} + +/* Dark Theme (Default) */ +:root, +[data-theme="dark"] { --bg-dark: #0f172a; --bg-card: #1e293b; --bg-card-hover: #334155; @@ -18,11 +24,24 @@ --text-secondary: #94a3b8; --border: #334155; --border-light: #475569; + --body-bg: linear-gradient(135deg, #0f172a 0%, #1e293b 100%); +} + +/* Light Theme */ +[data-theme="light"] { + --bg-dark: #f8fafc; + --bg-card: #ffffff; + --bg-card-hover: #f1f5f9; + --text-primary: #1e293b; + --text-secondary: #64748b; + --border: #e2e8f0; + --border-light: #cbd5e1; + --body-bg: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%); } body { font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; - background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%); + background: var(--body-bg); color: var(--text-primary); min-height: 100vh; padding: 2rem; @@ -3158,6 +3177,29 @@ body:has(.header) .container { } } +/* Blockchain Badges */ +.blockchain-header { + display: flex; + align-items: center; +} + +.blockchain-badge { + display: inline-block; + padding: 0.2rem 0.6rem; + border-radius: 99px; + font-size: 0.7rem; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.05em; + margin-left: 0.75rem; +} + +.blockchain-badge.secondary { + background: transparent; + border: 1px solid var(--text-secondary); + color: var(--text-secondary); +} + /* Transaction Filters */ .transaction-filters { display: flex;