217 lines
6.0 KiB
CSS
217 lines
6.0 KiB
CSS
/* skillfactor — Factorial-Look für Gitea.
|
|
Tokens live von factorialhr.com extrahiert (Edge headless, 2026-07-06):
|
|
Font "DM Sans" · Ink #25253D · Text #515164 · Brand #FF355E (hover #E51943)
|
|
· Teal-Links #007C85 · Card-Grau #F4F4F5 · weiße Nav · Pill-Buttons (9999px)
|
|
· Karten-Radius 16px. Basis ist das helle Gitea-Theme. */
|
|
|
|
@import url("theme-gitea-light.css");
|
|
|
|
/* DM Sans lokal (variable font, 100-1000) — OFFLINE_MODE-freundlich, kein CDN. */
|
|
@font-face {
|
|
font-family: "DM Sans";
|
|
font-style: normal;
|
|
font-weight: 100 1000;
|
|
font-display: swap;
|
|
src: url("../fonts/dmsans-latin.woff2") format("woff2");
|
|
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2013-2014, U+2018-201A,
|
|
U+201C-201E, U+2026, U+20AC, U+2122;
|
|
}
|
|
@font-face {
|
|
font-family: "DM Sans";
|
|
font-style: normal;
|
|
font-weight: 100 1000;
|
|
font-display: swap;
|
|
src: url("../fonts/dmsans-latin-ext.woff2") format("woff2");
|
|
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
|
|
U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
|
|
U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
|
}
|
|
|
|
:root {
|
|
--fonts-override: "DM Sans";
|
|
|
|
/* Markenfarben */
|
|
--color-primary: #ff355e;
|
|
--color-primary-contrast: #ffffff;
|
|
--color-primary-dark-1: #e51943;
|
|
--color-primary-dark-2: #cc123a;
|
|
--color-primary-dark-3: #b30d32;
|
|
--color-primary-dark-4: #99092a;
|
|
--color-primary-dark-5: #800622;
|
|
--color-primary-dark-6: #66041a;
|
|
--color-primary-dark-7: #4d0213;
|
|
--color-primary-light-1: #ff4d70;
|
|
--color-primary-light-2: #ff6682;
|
|
--color-primary-light-3: #ff8094;
|
|
--color-primary-light-4: #ff99a6;
|
|
--color-primary-light-5: #ffb3bf;
|
|
--color-primary-light-6: #ffe0e6;
|
|
--color-primary-light-7: #fff0f3;
|
|
--color-primary-alpha-10: rgba(255, 53, 94, 0.1);
|
|
--color-primary-alpha-20: rgba(255, 53, 94, 0.2);
|
|
--color-primary-alpha-30: rgba(255, 53, 94, 0.3);
|
|
--color-primary-alpha-40: rgba(255, 53, 94, 0.4);
|
|
--color-primary-alpha-50: rgba(255, 53, 94, 0.5);
|
|
--color-primary-alpha-60: rgba(255, 53, 94, 0.6);
|
|
--color-primary-alpha-70: rgba(255, 53, 94, 0.7);
|
|
--color-primary-alpha-80: rgba(255, 53, 94, 0.8);
|
|
--color-primary-alpha-90: rgba(255, 53, 94, 0.9);
|
|
|
|
/* Typografie-Farben */
|
|
--color-text: #25253d;
|
|
--color-text-dark: #17172a;
|
|
--color-text-light: #515164;
|
|
--color-text-light-1: #515164;
|
|
--color-text-light-2: #6b6b7d;
|
|
--color-text-light-3: #8a8a99;
|
|
|
|
/* Flächen */
|
|
--color-body: #ffffff;
|
|
--color-box-body: #ffffff;
|
|
--color-box-header: #f9f9fa;
|
|
--color-navbar: #ffffff;
|
|
--color-navbar-transparent: rgba(255, 255, 255, 0);
|
|
--color-menu: #ffffff;
|
|
--color-card: #ffffff;
|
|
--color-secondary-bg: #f4f4f5;
|
|
--color-light: rgba(37, 37, 61, 0.04);
|
|
--color-hover: rgba(37, 37, 61, 0.04);
|
|
--color-active: rgba(37, 37, 61, 0.07);
|
|
|
|
/* Ränder */
|
|
--color-secondary: #ececee;
|
|
--color-secondary-dark-1: #dededf;
|
|
--color-light-border: #ececee;
|
|
|
|
/* Links: Factorial-Teal */
|
|
--color-link: #007c85;
|
|
--color-link-hover: #00565c;
|
|
--color-accent: #007c85;
|
|
|
|
--border-radius: 8px;
|
|
--border-radius-medium: 12px;
|
|
--border-radius-full: 9999px;
|
|
}
|
|
|
|
/* Grundschrift überall durchsetzen (DM Sans wie factorialhr.com) */
|
|
body,
|
|
.ui.button,
|
|
.ui.input > input,
|
|
.ui.form input,
|
|
.ui.menu,
|
|
.ui.header {
|
|
font-family: "DM Sans", -apple-system, "Segoe UI", Helvetica, Arial, sans-serif !important;
|
|
}
|
|
|
|
/* Navbar: Markenrot, sticky; wird beim Scrollen leicht transparent (Glas-Effekt).
|
|
Transparenz via CSS scroll-driven animation (Chromium 115+); Fallback = volles Rot. */
|
|
#navbar {
|
|
position: sticky;
|
|
top: 0;
|
|
z-index: 1000;
|
|
background: #ff355e;
|
|
border-bottom: none;
|
|
min-height: 68px;
|
|
}
|
|
@supports (animation-timeline: scroll()) {
|
|
#navbar {
|
|
animation: sf-nav-glass linear both;
|
|
animation-timeline: scroll();
|
|
animation-range: 0 140px;
|
|
}
|
|
}
|
|
@keyframes sf-nav-glass {
|
|
to {
|
|
background: rgba(255, 53, 94, 0.9);
|
|
backdrop-filter: blur(10px);
|
|
box-shadow: 0 8px 30px rgba(37, 37, 61, 0.18);
|
|
}
|
|
}
|
|
#navbar .item,
|
|
#navbar .item * {
|
|
color: #ffffff !important;
|
|
}
|
|
#navbar .item:hover {
|
|
background: rgba(255, 255, 255, 0.14);
|
|
border-radius: 9999px;
|
|
}
|
|
/* Wortmarke: neue, versionierte URL als Cache-Buster (alte logo.svg klebte
|
|
durch einen zu breiten Caddy-Cache-Header in Browsern fest) + praesenter. */
|
|
#navbar-logo img,
|
|
#navbar .navbar-left img {
|
|
content: url("../img/skillfactor_logo_white.png?v=2");
|
|
height: 30px !important;
|
|
width: auto !important;
|
|
}
|
|
/* Dropdowns unter der roten Navbar bleiben hell und lesbar */
|
|
#navbar .ui.dropdown .menu .item,
|
|
#navbar .ui.dropdown .menu .item * {
|
|
color: #25253d !important;
|
|
}
|
|
|
|
/* Buttons: Pills. Primär = Markenrot, Rest = weiß mit feinem Rand */
|
|
.ui.button {
|
|
border-radius: 9999px;
|
|
font-weight: 500;
|
|
}
|
|
.ui.primary.button,
|
|
.ui.green.button {
|
|
background: #ff355e;
|
|
color: #ffffff;
|
|
}
|
|
.ui.primary.button:hover,
|
|
.ui.green.button:hover {
|
|
background: #e51943;
|
|
}
|
|
.ui.basic.button {
|
|
box-shadow: inset 0 0 0 1px #dededf;
|
|
color: #25253d !important;
|
|
}
|
|
|
|
/* Karten & Boxen: 16px-Radius, sanfte Grenzen, kein hartes Grau */
|
|
.ui.segment,
|
|
.ui.segments,
|
|
.ui.attached.segment,
|
|
.ui.card,
|
|
.ui.message,
|
|
.file-view,
|
|
.markup {
|
|
border-radius: 12px;
|
|
}
|
|
.repository-summary,
|
|
.ui.attached.header {
|
|
border-radius: 12px 12px 0 0;
|
|
}
|
|
|
|
/* Labels/Badges runder */
|
|
.ui.label {
|
|
border-radius: 9999px;
|
|
}
|
|
|
|
/* Fokusring in Markenfarbe statt Standardblau */
|
|
input:focus,
|
|
textarea:focus {
|
|
border-color: #ff355e !important;
|
|
}
|
|
|
|
/* Landing-Hotfix ohne Neustart: Chips auf die Kartenraender statt ueber den Text.
|
|
(Gleiche Werte stehen im home.tmpl; CSS-Datei laedt ohne Template-Reload.) */
|
|
.sf-page .sf-chip-2 {
|
|
bottom: -22px !important;
|
|
left: -28px !important;
|
|
}
|
|
.sf-page .sf-chip-3 {
|
|
top: 46% !important;
|
|
bottom: auto !important;
|
|
right: -30px !important;
|
|
}
|
|
.sf-page .sf-code-card {
|
|
padding-bottom: 48px !important;
|
|
}
|
|
|
|
/* Footer: "Powered by Gitea", Version und Ladezeiten ausblenden (sofort wirksam;
|
|
zusaetzlich per app.ini [other]-Flags ab dem naechsten Neustart serverseitig aus). */
|
|
.page-footer .left-links {
|
|
display: none !important;
|
|
}
|