From e05225d8ee19f8cd0aa49c05fb56018fb4b21268 Mon Sep 17 00:00:00 2001 From: karim Date: Sat, 9 May 2026 02:34:47 +0200 Subject: [PATCH] Add Rapport theme for Gitea --- theme-rapport.css | 280 ++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 280 insertions(+) create mode 100644 theme-rapport.css diff --git a/theme-rapport.css b/theme-rapport.css new file mode 100644 index 0000000..c731a83 --- /dev/null +++ b/theme-rapport.css @@ -0,0 +1,280 @@ +/* Rapport Theme für Gitea */ + +:root { + /* Primärfarbe: warmes Amber/Gold wie in Rapport */ + --color-primary: #b07848; + --color-primary-dark-1: #9a6638; + --color-primary-dark-2: #85552a; + --color-primary-dark-3: #70451e; + --color-primary-dark-4: #5c3714; + --color-primary-dark-5: #4a2b0c; + --color-primary-light-1: #bf8a5e; + --color-primary-light-2: #cc9d76; + --color-primary-light-3: #d8b090; + --color-primary-light-4: #e4c4ac; + --color-primary-light-5: #f0d8c8; + --color-primary-alpha-30: rgba(176, 120, 72, 0.30); + --color-primary-alpha-40: rgba(176, 120, 72, 0.40); + --color-primary-alpha-60: rgba(176, 120, 72, 0.60); + --color-primary-alpha-80: rgba(176, 120, 72, 0.80); + + /* Hintergründe */ + --color-body: #f7f5f2; + --color-box-body: #ffffff; + --color-nav-bg: #1a1a18; + --color-sidebar-bg: #f0ede8; + --color-card: #ffffff; + + /* Text */ + --color-text: #1a1a18; + --color-text-dark: #0e0e0c; + --color-text-light-1: #555550; + --color-text-light-2: #888880; + --color-text-light-3: #aaaaaa; + + /* Rahmen */ + --color-secondary: #e8e3dc; + --color-secondary-dark-1: #d8d2ca; + --color-secondary-dark-2: #c8c1b8; + --color-secondary-dark-3: #b8b0a5; + --color-secondary-dark-4: #a8a098; + --color-secondary-dark-5: #98908a; + --color-secondary-light-1: #eeebe6; + --color-secondary-light-2: #f2efec; + --color-secondary-light-3: #f5f3f0; + --color-secondary-light-4: #f8f6f4; + --color-secondary-light-5: #faf9f7; + --color-secondary-alpha-30: rgba(232, 227, 220, 0.30); + --color-secondary-alpha-60: rgba(232, 227, 220, 0.60); + + /* Input / Formular */ + --color-input-background: #ffffff; + --color-input-border: #d8d2ca; + + /* Badges / Status */ + --color-green: #2d6a4f; + --color-green-dark-1: #245840; + --color-green-light-1: #3d8a65; + --color-green-light-2: #e8f5ee; + --color-red: #8a1a1a; + --color-red-dark-1: #721414; + --color-red-light-1: #a02020; + --color-red-light-2: #fdf0f0; + --color-orange: #b07848; + --color-orange-light-1: #cc9d76; + --color-orange-light-2: #fff3e8; + --color-yellow: #9a7a00; + --color-yellow-light-2: #fffbe6; + --color-blue: #1a4e8a; + --color-blue-light-1: #2a6ab0; + --color-blue-light-2: #e8f0f8; + + /* Schatten */ + --shadow-1: 0 1px 3px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.05); + --shadow-2: 0 2px 8px rgba(0,0,0,0.10), 0 1px 3px rgba(0,0,0,0.06); + --shadow-3: 0 4px 16px rgba(0,0,0,0.12), 0 2px 6px rgba(0,0,0,0.08); + + /* Radius */ + --border-radius: 6px; + --border-radius-sm: 4px; + --border-radius-lg: 10px; +} + +/* ─── Navbar ────────────────────────────────────────────── */ +.ui.top.attached.header, +.navbar, +#navbar { + background: #1a1a18 !important; + border-bottom: 1px solid #2d2d28 !important; + box-shadow: 0 2px 8px rgba(0,0,0,0.18) !important; +} + +.navbar .item, +#navbar .item, +.navbar a, +#navbar a { + color: #c8c4be !important; +} + +.navbar .item:hover, +#navbar .item:hover, +.navbar a:hover, +#navbar a:hover { + color: #f0ede8 !important; + background: rgba(255,255,255,0.07) !important; +} + +/* Gitea-Logo / Sitename in Navbar */ +.navbar .header.item, +#navbar .header.item { + font-family: 'Georgia', serif; + letter-spacing: -0.01em; + color: #f0ede8 !important; +} + +/* ─── Seitenleiste ──────────────────────────────────────── */ +.ui.attached.sidebar, +.repository.file.list .sidebar, +.sidebar { + background: #f0ede8 !important; + border-right: 1px solid #e0dbd4 !important; +} + +/* ─── Cards & Segmente ──────────────────────────────────── */ +.ui.segment, +.ui.segments, +.ui.card, +.ui.cards > .card { + border-radius: var(--border-radius-lg) !important; + border: 1px solid #e8e3dc !important; + box-shadow: var(--shadow-1) !important; +} + +/* ─── Buttons ───────────────────────────────────────────── */ +.ui.button, +.ui.buttons .button { + border-radius: var(--border-radius) !important; + transition: all 0.15s !important; +} + +.ui.primary.button, +.ui.primary.buttons .button { + background: #b07848 !important; + color: #fff !important; + border: none !important; +} + +.ui.primary.button:hover, +.ui.primary.buttons .button:hover { + background: #9a6638 !important; +} + +.ui.basic.button, +.ui.basic.buttons .button { + border: 1.5px solid #e0dbd4 !important; + color: #555550 !important; + box-shadow: var(--shadow-1) !important; +} + +.ui.basic.button:hover { + border-color: #b07848 !important; + color: #b07848 !important; +} + +/* ─── Labels / Badges ───────────────────────────────────── */ +.ui.label { + border-radius: 20px !important; + font-size: 11px !important; + letter-spacing: 0.04em !important; +} + +/* ─── Inputs ────────────────────────────────────────────── */ +input[type="text"], +input[type="email"], +input[type="password"], +input[type="search"], +textarea, +.ui.input > input, +.ui.form input, +.ui.form textarea, +.ui.form select { + border-radius: var(--border-radius) !important; + border: 1.5px solid #d8d2ca !important; + background: #fff !important; + transition: border-color 0.15s !important; +} + +input[type="text"]:focus, +input[type="email"]:focus, +input[type="password"]:focus, +textarea:focus, +.ui.input > input:focus { + border-color: #b07848 !important; + box-shadow: 0 0 0 2px rgba(176,120,72,0.15) !important; +} + +/* ─── Tabellen ──────────────────────────────────────────── */ +.ui.table { + border: 1px solid #e8e3dc !important; + border-radius: var(--border-radius-lg) !important; + overflow: hidden !important; +} + +.ui.table thead th { + background: #f7f5f2 !important; + color: #888880 !important; + font-size: 11px !important; + letter-spacing: 0.08em !important; + text-transform: uppercase !important; + border-bottom: 1px solid #e8e3dc !important; +} + +.ui.table tbody tr:hover td { + background: #faf8f5 !important; +} + +/* ─── Repository-Header ─────────────────────────────────── */ +.repository.header { + background: #fff !important; + border-bottom: 1px solid #e8e3dc !important; +} + +/* ─── Code / Diff ───────────────────────────────────────── */ +.ui.attached.segment.sub.header, +.diff-file-box { + border-radius: var(--border-radius) !important; + border: 1px solid #e8e3dc !important; +} + +/* ─── Tabs ──────────────────────────────────────────────── */ +.ui.tabular.menu .active.item { + border-color: #e8e3dc !important; + border-bottom-color: #fff !important; + color: #b07848 !important; + font-weight: 600 !important; +} + +.ui.tabular.menu .item:hover { + color: #b07848 !important; +} + +/* ─── Flash-Meldungen ───────────────────────────────────── */ +.ui.positive.message { + background: #e8f5ee !important; + border-color: #a8d8b8 !important; + color: #2d6a4f !important; +} + +.ui.negative.message, +.ui.error.message { + background: #fdf0f0 !important; + border-color: #e0b0b0 !important; + color: #8a1a1a !important; +} + +/* ─── Links ─────────────────────────────────────────────── */ +a { + color: #b07848; +} + +a:hover { + color: #9a6638; +} + +/* ─── Commits / Activity ────────────────────────────────── */ +.ui.feed .event .label .icon, +.timeline-item .badge { + background: #b07848 !important; + color: #fff !important; +} + +/* ─── Footer ────────────────────────────────────────────── */ +#footer { + background: #1a1a18 !important; + border-top: 1px solid #2d2d28 !important; + color: #555 !important; +} + +#footer a { + color: #888 !important; +}