/* ================================================================= * TECH-5607 — Admin Panel Foundation (AP-F0) * admin-theme-dark.css — Dark mode token override * * Bootstrap script (`admin-theme-bootstrap.js`) `` * attribute set ettiğinde aktive olur. Cookie + localStorage persistence. * ================================================================= */ [data-theme="dark"] { /* --- Surface override (proposal styles.css L2043+) --- */ --adm-bg: #0d0f13; --adm-surface: #1a1d23; --adm-surface-soft: #20242c; --adm-surface-hover: #262a33; --adm-surface-sidebar: #15181d; --adm-surface-topbar: rgba(21, 24, 29, 0.85); /* --- Text (inverted) --- */ --adm-text: #f0f1ea; --adm-text-strong: #ffffff; --adm-text-muted: rgba(240, 241, 234, 0.62); --adm-text-dim: rgba(240, 241, 234, 0.45); --adm-text-faint: rgba(240, 241, 234, 0.28); /* --- Lines --- */ --adm-line: rgba(255, 255, 255, 0.08); --adm-line-strong: rgba(255, 255, 255, 0.14); --adm-line-input: rgba(255, 255, 255, 0.16); --adm-line-input-focus: rgba(160, 230, 20, 0.55); /* --- Status backgrounds (yumuşatılmış) --- */ --adm-status-green-bg: rgba(95, 160, 14, 0.18); --adm-status-amber-bg: rgba(255, 168, 0, 0.20); --adm-status-red-bg: rgba(196, 61, 45, 0.20); --adm-status-blue-bg: rgba(61, 138, 255, 0.20); --adm-status-gray-bg: rgba(255, 255, 255, 0.08); /* --- Shadows daha derin --- */ --adm-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4); --adm-shadow-md: 0 4px 14px rgba(0, 0, 0, 0.5); --adm-shadow-lg: 0 24px 60px rgba(0, 0, 0, 0.6); } /* --- Body bg follow-through --- */ [data-theme="dark"] body, [data-theme="dark"] body.adm-body, [data-theme="dark"] .adm-shell { background: var(--adm-bg); color: var(--adm-text); } /* --- Smooth crossfade when toggling --- */ [data-theme] { transition: background-color var(--adm-transition-base); } /* ================================================================= * MudBlazor dark override — henüz DS'e dönüştürülmemiş ham sayfalar * (Contacts/Subscribers/Blogs/Faqs/OurStories/CompanyInfo/Analytics) * dark modda okunabilir kalsın. console-mud-override.css light * `--mud-palette-*` değerlerini `[data-theme="dark"]` ile ezer. * ================================================================= */ [data-theme="dark"] { --mud-palette-background: #0d0f13; --mud-palette-background-gray: #15181d; --mud-palette-surface: #1a1d23; --mud-palette-drawer-background: #15181d; --mud-palette-drawer-text: #f0f1ea; --mud-palette-drawer-icon: #f0f1ea; --mud-palette-appbar-background: #1a1d23; --mud-palette-appbar-text: #f0f1ea; --mud-palette-text-primary: #f0f1ea; --mud-palette-text-secondary: rgba(240, 241, 234, 0.62); --mud-palette-text-disabled: rgba(240, 241, 234, 0.38); --mud-palette-action-default: #f0f1ea; --mud-palette-action-default-hover: rgba(255, 255, 255, 0.08); --mud-palette-lines-default: rgba(255, 255, 255, 0.08); --mud-palette-lines-inputs: rgba(255, 255, 255, 0.16); --mud-palette-divider: rgba(255, 255, 255, 0.08); --mud-palette-divider-light: rgba(255, 255, 255, 0.04); --mud-palette-table-lines: rgba(255, 255, 255, 0.08); --mud-palette-table-striped: rgba(255, 255, 255, 0.02); --mud-palette-table-hover: rgba(255, 255, 255, 0.05); } /* console-mud-override.css'te hard-coded açık değerleri ez */ [data-theme="dark"] body { background-color: #0d0f13; color: #f0f1ea; } [data-theme="dark"] .mud-paper:not(.mud-appbar):not(.mud-drawer) { background-color: #1a1d23; color: #f0f1ea; } [data-theme="dark"] .mud-table { background-color: #1a1d23; color: #f0f1ea; } [data-theme="dark"] .mud-table-head .mud-table-cell { background-color: #20242c; color: rgba(240, 241, 234, 0.80); } [data-theme="dark"] .mud-table-cell { color: #f0f1ea; border-bottom-color: rgba(255, 255, 255, 0.08); } [data-theme="dark"] .mud-table-row:hover { background-color: rgba(255, 255, 255, 0.05) !important; } [data-theme="dark"] .mud-input-outlined .mud-input-outlined-border { border-color: rgba(255, 255, 255, 0.16); } [data-theme="dark"] .mud-input-root, [data-theme="dark"] .mud-input-label, [data-theme="dark"] .mud-select .mud-input { color: #f0f1ea; } [data-theme="dark"] .mud-breadcrumbs .mud-breadcrumb-item, [data-theme="dark"] .mud-typography { color: inherit; }