/* theme-qcore-dark — Gitea theme matching the qcore web UI palette. * * Loaded by Gitea when [ui] DEFAULT_THEME = qcore-dark (the file must be * named theme-.css and live under custom/public/assets/css/). * * Brand: * QTS Red #D11F2D — primary action, links, accent * QTS Blue #3F6CB0 — secondary, info * Ink #16181D — page background * Surface #1E2128 — card / panel * Surface-2 #262A33 — input / hovered card * Border #2F343F * Text #E6E8EE * Text-2 #A6ADBA — muted * * Note: Gitea uses a long list of CSS variables (--color-text, * --color-body, --color-primary, --color-secondary, --color-menu, etc.). * We map the ones that drive visible color; structural defaults stay. */ :root[data-theme="qcore-dark"] { /* Brand */ --color-primary: #D11F2D; --color-primary-contrast: #FFFFFF; --color-primary-dark-1: #B81927; --color-primary-dark-2: #9F1722; --color-primary-dark-3: #88141C; --color-primary-dark-4: #6E1117; --color-primary-light-1: #DA424F; --color-primary-light-2: #E36571; --color-primary-light-3: #EC8893; --color-primary-light-4: #F5ABB4; --color-primary-hover: #DA424F; --color-primary-active: #9F1722; --color-primary-alpha-10: rgba(209,31,45,0.10); --color-primary-alpha-20: rgba(209,31,45,0.20); --color-primary-alpha-30: rgba(209,31,45,0.30); --color-primary-alpha-40: rgba(209,31,45,0.40); --color-primary-alpha-50: rgba(209,31,45,0.50); --color-primary-alpha-60: rgba(209,31,45,0.60); --color-primary-alpha-70: rgba(209,31,45,0.70); --color-primary-alpha-80: rgba(209,31,45,0.80); --color-primary-alpha-90: rgba(209,31,45,0.90); --color-secondary: #3F6CB0; --color-secondary-dark-1: #355D9A; --color-secondary-dark-2: #2D5085; --color-secondary-light-1: #5B83BC; --color-secondary-light-2: #779AC8; --color-secondary-alpha-30: rgba(63,108,176,0.30); --color-secondary-alpha-50: rgba(63,108,176,0.50); /* Surfaces */ --color-body: #16181D; --color-box-body: #1E2128; --color-box-body-hover: #262A33; --color-box-header: #1A1D24; --color-menu: #1A1D24; --color-card: #1E2128; --color-markup-code-block: #262A33; --color-markup-table-row: #1E2128; /* Borders / dividers */ --color-light: #262A33; --color-light-mimic-enabled:#262A33; --color-light-border: #2F343F; --color-hover: #262A33; --color-active: #2F343F; --color-secondary-bg: #1E2128; --color-border: #2F343F; --color-border-secondary: #262A33; /* Text */ --color-text: #E6E8EE; --color-text-light: #C8CDD6; --color-text-light-1: #A6ADBA; --color-text-light-2: #828995; --color-text-light-3: #6F7682; --color-text-dark: #E6E8EE; --color-footer: #A6ADBA; --color-placeholder-text: #6F7682; /* Links */ --color-link: #DA424F; --color-link-hover: #F5ABB4; /* Status */ --color-error-bg: #3A1D22; --color-error-text: #F5ABB4; --color-error-border: #5A2A30; --color-warning-bg: #3D2F1B; --color-warning-text: #F1D08F; --color-warning-border: #5B4524; --color-success-bg: #1E2D2A; --color-success-text: #7DD3B5; --color-success-border: #2E4641; --color-info-bg: #1F2A3D; --color-info-text: #779AC8; --color-info-border: #2D3E5C; /* Inputs */ --color-input-background: #262A33; --color-input-toggle-background: #262A33; --color-input-text: #E6E8EE; --color-input-border: #2F343F; --color-input-border-hover:#3F6CB0; /* Diff */ --color-diff-added-row-bg: rgba(125,211,181,0.08); --color-diff-added-row-border: rgba(125,211,181,0.20); --color-diff-removed-row-bg: rgba(245,171,180,0.08); --color-diff-removed-row-border: rgba(245,171,180,0.20); /* Code highlighter (Gitea uses chroma) — keep Gitea's defaults except * for the page background, which we want to match our box-body. */ --color-code-bg: #1E2128; --color-code-sidebar-bg: #1A1D24; } /* Force the qcore-dark color-scheme for the page so the scrollbar + * form controls follow the dark UI in browsers that honor it. */ :root[data-theme="qcore-dark"] { color-scheme: dark; } /* Nav active-tab underline — Gitea uses a teal border by default; remap. */ :root[data-theme="qcore-dark"] .ui.tabular.menu .item.active, :root[data-theme="qcore-dark"] .ui.secondary.pointing.menu .active.item { border-color: var(--color-primary) !important; color: var(--color-primary) !important; } /* Primary buttons — Gitea's default has a baked-in green for some * "create" actions; force brand red. */ :root[data-theme="qcore-dark"] .ui.primary.button, :root[data-theme="qcore-dark"] .ui.primary.buttons .button, :root[data-theme="qcore-dark"] .ui.button.primary { background-color: var(--color-primary); color: #fff; } :root[data-theme="qcore-dark"] .ui.primary.button:hover, :root[data-theme="qcore-dark"] .ui.primary.buttons .button:hover, :root[data-theme="qcore-dark"] .ui.button.primary:hover { background-color: var(--color-primary-hover); } /* Link hover — accent the underline */ :root[data-theme="qcore-dark"] a:hover { color: var(--color-link-hover); } /* --- footer cleanup (universal, not theme-scoped) --- * * Only hide the explicit "Powered by Gitea" link. NEVER hide siblings * (the previous :first-child / .gt-mr-3 catch-all also hid our custom * extra_links_footer items). */ .page-footer .left-links a[href*="about.gitea.com"], .page-footer .left-links a[href="https://about.gitea.com"], footer.page-footer .left-links > a:first-of-type { display: none !important; } /* Footer text — push to full --color-text (#E6E8EE), not the light-1 gray * which read as nearly-invisible against the ink bg. Language dropdown + * Licenses + API + qcore web/qcore-qcore are the only visible items now; * make them readable. Brand red still applies on hover. */ .page-footer, .page-footer a, .page-footer .item, .page-footer .dropdown, .page-footer .ui.dropdown { color: var(--color-text) !important; } .page-footer a:hover, .page-footer .item:hover { color: var(--color-link) !important; /* brand red on hover */ } /* Right-links separator — small bullet between items so they don't run together */ .page-footer .right-links > a + a::before, .page-footer .right-links > .dropdown + a::before { content: "·"; margin: 0 0.6rem; color: var(--color-text-light-2); } /* --- signin partial cleanup --- * * Hide the bundled signin_inner's H3 "Sign In" title (our outer shell * provides the heading) but DO NOT flatten the form layout — the * previous wholesale segment reset let the inputs overflow the 420px * card. Just target the title text and let Gitea's defaults handle * everything else. */ .qcore-auth-shell .ui.attached.header.ui.center { display: none !important; } .qcore-auth-shell form > h3.ui.top.attached.header, .qcore-auth-shell form > h4.ui.top.attached.header, .qcore-auth-shell .ui.attached.segment > h2:first-child, .qcore-auth-shell .ui.attached.segment > h3:first-child { display: none !important; } /* Soften (but don't remove) the inner segment so it visually fits inside * the qcore-auth-shell card instead of looking like a stacked box. */ .qcore-auth-shell .ui.attached.segment, .qcore-auth-shell .ui.attached:not(.header), .qcore-auth-shell .ui.segment { border: 0 !important; background: transparent !important; box-shadow: none !important; margin: 0 !important; padding: 0 !important; max-width: 100% !important; } /* Force every form descendant to respect the card width so inputs don't * blow out the right edge — Gitea's default form max-width is wider than * our 420px shell. */ .qcore-auth-shell, .qcore-auth-shell form, .qcore-auth-shell .ui.form, .qcore-auth-shell .field, .qcore-auth-shell input[type="text"], .qcore-auth-shell input[type="email"], .qcore-auth-shell input[type="password"] { max-width: 100% !important; box-sizing: border-box !important; }