/* Prevatt theme — Synthwave '76 Built on top of forgejo-dark. Overrides Forgejo's CSS custom properties for the synthwave palette: deep purple base, hot magenta primary, electric cyan secondary. */ @import url("./theme-forgejo-dark.css"); :root { /* Brand accent — hot magenta primary */ --color-primary: #ff2e88; --color-primary-contrast: #ffffff; --color-primary-dark-1: #e02377; --color-primary-dark-2: #b81960; --color-primary-dark-3: #8d1149; --color-primary-dark-4: #5a0930; --color-primary-dark-5: #2d0418; --color-primary-dark-6: #160209; --color-primary-dark-7: #0a0104; --color-primary-light-1: #ff5ba6; --color-primary-light-2: #ff8cc1; --color-primary-light-3: #ffb5d6; --color-primary-light-4: #ffd0e5; --color-primary-light-5: #ffe7f0; --color-primary-light-6: #fff3f7; --color-primary-light-7: #fffafc; --color-primary-alpha-10: #ff2e8819; --color-primary-alpha-20: #ff2e8833; --color-primary-alpha-30: #ff2e884c; --color-primary-alpha-40: #ff2e8866; --color-primary-alpha-50: #ff2e8880; --color-primary-alpha-60: #ff2e8899; --color-primary-alpha-70: #ff2e88b2; --color-primary-alpha-80: #ff2e88cc; --color-primary-alpha-90: #ff2e88e5; /* Secondary — deep purple */ --color-secondary: #261356; --color-secondary-dark-1: #1a0b3a; --color-secondary-dark-2: #14082b; --color-secondary-light-1: #3a1c6e; --color-secondary-light-2: #4a2a90; --color-secondary-light-3: #5a3aa8; /* Surfaces */ --color-body: #0f0521; --color-box-header: #1a0b3a; --color-box-body: #14082b; --color-box-body-highlight: #1d0e40; --color-text-dark: #f5e8ff; --color-text: #f5e8ff; --color-text-light: #c4a9e8; --color-text-light-1: #9d7fcc; --color-text-light-2: #7d5fac; --color-text-light-3: #6d4f9c; --color-footer: #14082b; --color-timeline: #3a1c6e; --color-input-text: #f5e8ff; --color-input-background: #14082b; --color-input-toggle-background: #1a0b3a; --color-input-border: #3a1c6e; --color-input-border-hover: #ff2e88; --color-light: #1a0b3a; --color-light-mimic-enabled: #1d0e40; --color-light-border: #3a1c6e; --color-hover: #3a1c6e; --color-active: #ff2e88; --color-menu: #1a0b3a; --color-card: #1a0b3a; --color-markup-table-row: #1d0e40; --color-markup-code-block: #08021a; --color-button: #261356; --color-code-bg: #08021a; --color-code-sidebar-bg: #08021a; --color-shadow: #00000080; --color-secondary-bg: #1a0b3a; /* Links — electric cyan */ --color-link: #00f0ff; --color-link-hover: #5cf5ff; --color-link-active: #00d0e0; /* Status / semantic */ --color-green: #00ff9c; --color-green-dark-1: #00d680; --color-green-dark-2: #00ad66; --color-green-light: #5cffbe; --color-yellow: #ffd700; --color-orange: #ff7e00; --color-red: #ff2e88; --color-pink: #ff5ba6; --color-purple: #c879ff; /* Diff colors */ --color-diff-added-row-bg: rgba(0, 255, 156, 0.08); --color-diff-added-word-bg: rgba(0, 255, 156, 0.25); --color-diff-removed-row-bg: rgba(255, 46, 136, 0.08); --color-diff-removed-word-bg: rgba(255, 46, 136, 0.25); /* Contribution heatmap — magenta gradient */ --color-feed-graph-bg: #1a0b3a; --color-feed-graph: #1a0b3a; --color-small-accent: #ff2e88; } /* Heatmap squares — Forgejo uses .feed-graph specific styles */ .heatmap-color-0 { background-color: #1a0b3a !important; } .heatmap-color-1 { background-color: rgba(255, 46, 136, 0.25) !important; } .heatmap-color-2 { background-color: rgba(255, 46, 136, 0.45) !important; } .heatmap-color-3 { background-color: rgba(255, 46, 136, 0.65) !important; } .heatmap-color-4 { background-color: rgba(255, 46, 136, 0.85) !important; } .heatmap-color-5 { background-color: #ff2e88 !important; } /* Neon glow on the primary brand color wherever it shows as text */ .text.primary, .ui.primary.button, a.primary, .header-wrapper .navbar-brand, .repo-header h1 a, .ui.menu .active.item { text-shadow: 0 0 8px rgba(255, 46, 136, 0.5), 0 0 16px rgba(255, 46, 136, 0.25); } /* Glow on primary buttons */ .ui.primary.button, .ui.primary.buttons .button { box-shadow: 0 0 12px rgba(255, 46, 136, 0.4), 0 0 24px rgba(255, 46, 136, 0.2); } /* Glow on the active subnav tab */ .repository .ui.tabular.menu .active.item { border-color: #ff2e88; color: #ff2e88 !important; text-shadow: 0 0 8px rgba(255, 46, 136, 0.5); } /* Subtle Tron grid on the body — extremely faint so it doesn't fight content */ body { background-image: linear-gradient(180deg, transparent 0%, rgba(255, 46, 136, 0.04) 100%), linear-gradient(rgba(0, 240, 255, 0.025) 1px, transparent 1px), linear-gradient(90deg, rgba(0, 240, 255, 0.025) 1px, transparent 1px); background-size: 100% 100%, 40px 40px, 40px 40px; background-attachment: fixed; } /* Top nav bar gets the signature magenta underline glow. Note: NO backdrop-filter here — it creates a new stacking context that traps dropdown menus underneath sibling content. */ #navbar, .full.height > .ui.left.menu, header.ui.menu { border-bottom: 1px solid #ff2e88; box-shadow: 0 0 24px rgba(255, 46, 136, 0.2); background: #1a0b3a; position: relative; z-index: 100; } /* Force dropdown menus above all page content */ #navbar .ui.dropdown .menu, .ui.dropdown .menu, .tippy-box { z-index: 1000 !important; background: #1a0b3a !important; border: 1px solid #3a1c6e !important; box-shadow: 0 8px 32px rgba(0, 0, 0, 0.6), 0 0 16px rgba(255, 46, 136, 0.2) !important; } #navbar .ui.dropdown .menu .item, .ui.dropdown .menu .item { background: transparent !important; color: #f5e8ff !important; } #navbar .ui.dropdown .menu .item:hover, .ui.dropdown .menu .item:hover { background: rgba(255, 46, 136, 0.15) !important; color: #ff5ba6 !important; } /* Branch / commit ref badges — make the orange labels match the palette */ .ui.label.branch-tag, .ui.label, .ref-name { background-color: rgba(255, 46, 136, 0.15) !important; color: #ff5ba6 !important; border: 1px solid rgba(255, 46, 136, 0.4); } /* Code block borders */ pre.code-view, .code-view { border: 1px solid #3a1c6e; }