/* * colors.css -- das Farbvokabular * * Herkunft: guladev, library/gula-custom/css/color-theme.css, Stand * 04.09.2026. Aufgeraeumt am 04.09.2026, jeder Schnitt vorher gemessen: * jede Variable und jede Klasse gegen gula5, gegen den Master-Plugin-Bestand, * gegen alle lokalen Site-Themes UND gegen den Inhalt von 24 lokalen * Datenbanken (post_content und postmeta). * * WAS BEWUSST BLEIBT, obwohl es "unbenutzt" aussieht: * - die Klassen .background-0..100 / .bg-background-0..100, .titlecolor, * .tc-brightred und Verwandte. Sie sind das Vokabular, das die Redaktion * in die Klassenfelder der Bloecke tippt -- im Code steht davon nichts. * Gemessen: background-100 in gaw, bg-background in devwp26, titlecolor * in devwp26 und jagdzuerich, tc-brightred in gaw. Wer hier nach * Code-Treffern aufraeumt, loescht Kundeninhalt weg. * - die volle Rampe --sitefgcolor_t005..t90. Eine Skala wird ganz behalten * oder ganz entfernt, nicht in Stufen zerschnitten. * * ZWILLINGE. Zwei Farben stehen doppelt da, einmal als fertige Farbe und * einmal als "r, g, b"-Tripel fuer rgba(). Das ist kein Versehen, sondern * noetig: die Kurzschreibweise rgba( #hex, .5 ) gibt es nicht. * --brightred <-> --tc_brightred (palette.php zieht den Zwilling mit, * Feld farbe_akzent, 'zwilling') * --orange <-> --orange_rgb (ein Plugin braucht das Tripel) * Wer einen Wert von Hand aendert, aendert beide. * * NICHT HIER, obwohl drei Plugins es rufen: --ht_rgb_maingreen. Es gehoert * den Navi-Plugins; theme-nav-mega definiert es, theme-nav-horizontal (4x) * und theme-nav-onepage (2x) benutzen es, ohne es zu definieren. Laeuft eine * Site ohne mega, faellt die Farbe still aus. Das ist eine Baustelle in den * Plugins, keine im Theme -- siehe README, offene Punkte. * * Document & Code @copyright by SteckDesign * Changes by third parties are not permitted. */ :root { --white: 255,255,255; --black: 0,0,0; /* Die linken Variablennamen nicht ändern */ --sitefgcolor: #ffffff; --sitefgcolor_rgb: 255, 255, 255; --sitebgcolor: var( --sbgcolor-75 ); --site_link_color: var( --sitefgcolor ); --site_linkhover_color: var( --orange ); --nav_linkcurrent_color: var( --lightlime ); --nav_bgcolor: var( --sitebgcolor ); --title_color: color-mix(in oklab, var(--mediumgreen), white 18% ); /* war --mediumgreen-40 */ --selection_color: var( --mediumgreen ); /* Tripel, kein Hex: wird als rgba( var(--tablebg), .. ) eingesetzt. 105,142,150 ist --mediumgreen (#698e96) als Tripel. Hiess frueher --ht_rgb_mediumgreen -- ein Name aus einem fremden Theme, den ausserhalb dieser Datei niemand kannte. */ --tablebg: 105,142,150; --tc_brightred: 222,53,76; --brightred: #DE354C; /* nur anpassen, nicht löschen, wird überall verwendet */ --sitefgcolor_t005: color-mix(in oklab, var(--sitefgcolor), transparent 99.5% ); --sitefgcolor_t01: color-mix(in oklab, var(--sitefgcolor), transparent 99% ); --sitefgcolor_t05: color-mix(in oklab, var(--sitefgcolor), transparent 95% ); --sitefgcolor_t10: color-mix(in oklab, var(--sitefgcolor), transparent 90% ); --sitefgcolor_t15: color-mix(in oklab, var(--sitefgcolor), transparent 85% ); --sitefgcolor_t20: color-mix(in oklab, var(--sitefgcolor), transparent 80% ); --sitefgcolor_t25: color-mix(in oklab, var(--sitefgcolor), transparent 75% ); --sitefgcolor_t30: color-mix(in oklab, var(--sitefgcolor), transparent 70% ); --sitefgcolor_t35: color-mix(in oklab, var(--sitefgcolor), transparent 65% ); --sitefgcolor_t40: color-mix(in oklab, var(--sitefgcolor), transparent 60% ); --sitefgcolor_t45: color-mix(in oklab, var(--sitefgcolor), transparent 55% ); --sitefgcolor_t50: color-mix(in oklab, var(--sitefgcolor), transparent 50% ); --sitefgcolor_t55: color-mix(in oklab, var(--sitefgcolor), transparent 45% ); --sitefgcolor_t60: color-mix(in oklab, var(--sitefgcolor), transparent 40% ); --sitefgcolor_t65: color-mix(in oklab, var(--sitefgcolor), transparent 35% ); --sitefgcolor_t70: color-mix(in oklab, var(--sitefgcolor), transparent 30% ); --sitefgcolor_t75: color-mix(in oklab, var(--sitefgcolor), transparent 25% ); --sitefgcolor_t80: color-mix(in oklab, var(--sitefgcolor), transparent 20% ); --sitefgcolor_t85: color-mix(in oklab, var(--sitefgcolor), transparent 15% ); --sitefgcolor_t90: color-mix(in oklab, var(--sitefgcolor), transparent 10% ); /* nur anpassen, nicht löschen, wird überall verwendet */ /* --sbgcolor: rgb(69, 74, 84); */ --sbgcolor: #747c8b; --sbgcolor-5: color-mix(in oklab, var(--sbgcolor), white 90% ); --sbgcolor-10: color-mix(in oklab, var(--sbgcolor), white 80% ); --sbgcolor-15: color-mix(in oklab, var(--sbgcolor), white 70% ); --sbgcolor-20: color-mix(in oklab, var(--sbgcolor), white 60% ); --sbgcolor-25: color-mix(in oklab, var(--sbgcolor), white 50% ); --sbgcolor-30: color-mix(in oklab, var(--sbgcolor), white 40% ); --sbgcolor-35: color-mix(in oklab, var(--sbgcolor), white 30% ); --sbgcolor-40: color-mix(in oklab, var(--sbgcolor), white 20% ); --sbgcolor-45: color-mix(in oklab, var(--sbgcolor), white 10% ); --sbgcolor-50: var(--sbgcolor); --sbgcolor-55: color-mix(in oklab, var(--sbgcolor), black 7% ); --sbgcolor-60: color-mix(in oklab, var(--sbgcolor), black 14% ); --sbgcolor-65: color-mix(in oklab, var(--sbgcolor), black 21% ); --sbgcolor-70: color-mix(in oklab, var(--sbgcolor), black 28% ); --sbgcolor-75: color-mix(in oklab, var(--sbgcolor), black 35% ); --sbgcolor-80: color-mix(in oklab, var(--sbgcolor), black 42% ); --sbgcolor-85: color-mix(in oklab, var(--sbgcolor), black 49% ); --sbgcolor-90: color-mix(in oklab, var(--sbgcolor), black 56% ); --sbgcolor-95: color-mix(in oklab, var(--sbgcolor), black 63% ); --sbgcolor-100: color-mix(in oklab, var(--sbgcolor), black 70% ); --mediumgreen: #698e96; --orange_rgb: 255, 102, 51; --orange: #ff6633; /* hiess frueher --ht_lightgrey */ --lightlime: #eceee6; /* --black steht oben als Tripel 0,0,0. Eine zweite Definition als #000000 stand frueher hier und gewann -- damit war jedes rgba( var(--black), 1.0 ) ungueltig: 40 Rahmen-Klassen (.btop1-10/.bbot1-10-solid-black in root.css und in den Theme-Options) bekamen gar keinen Rahmen, weil die Kurzschreib- weise komplett verworfen wird, und 4 Hintergruende wurden durchsichtig. Nicht wieder einsetzen: die Rampe unten rechnet darum auf rgb( var(--black) ). */ } .theme_sitecolor { color: var(--sitefgcolor); } .bg-theme_sitecolor { background-color: var(--sitebgcolor); } .titlecolor { color: var(--title_color); } .black, .fg-black { color: rgba( var(--black), 1.0); } .white, .fg-white { color: rgba( var(--white), 1.0); } .bg-black { background-color: rgba( var(--black), 1.0); } .bg-white { background-color: rgba( var(--white), 1.0); } .tc-brightred { color: rgba( var(--tc_brightred), 1.0); } /* Diese zwei bleiben, obwohl die uebrigen Basisfarben-Klassen beim Rampen-Ausbau entfallen sind. Grund: root.css definiert sie ebenfalls, aber als "rgba( var(--orange), 1.0 )" -- und --orange ist eine FERTIGE Farbe (#ff6633), kein Tripel. Die Kurzschreibweise ist damit ungueltig und die Angabe wird verworfen. Ohne die zwei Regeln hier haetten .orange und .bg-orange also lautlos aufgehoert zu wirken; gemessen: Grund rgb(255,102,51) vorher, rgba(0,0,0,0) nachher. Die uebrige Farbkreis-Familie in root.css (.yellow, .red, .redviolett und zehn weitere) ist ohnehin tot -- diese Variablen sind nirgends definiert. Eigene Baustelle. */ .orange { color: var(--orange); } .bg-orange { background-color: var(--orange); } .bg-tc-brightred { background-color: rgba( var(--tc_brightred), 1.0); } /* Namensvariante aus root.css, dort mit dem Farbabschnitt entfallen. Sie war die einzige der acht dortigen Farbklassen, die es nicht auch hier gab -- damit bleibt der gerenderte Zustand gleich. Im Inhalt und im Meta von 14 lokalen Sites: 0 Treffer. */ .tc-bg-brightred { background-color: rgba( var(--tc_brightred), 1.0); } .background { color: var(--sbgcolor); } .background-5 { color: var(--sbgcolor-5); } .background-10 { color: var(--sbgcolor-10); } .background-15 { color: var(--sbgcolor-15); } .background-20 { color: var(--sbgcolor-20); } .background-25 { color: var(--sbgcolor-25); } .background-30 { color: var(--sbgcolor-30); } .background-35 { color: var(--sbgcolor-35); } .background-40 { color: var(--sbgcolor-40); } .background-45 { color: var(--sbgcolor-45); } .background-50 { color: var(--sbgcolor-50); } .background-55 { color: var(--sbgcolor-55); } .background-60 { color: var(--sbgcolor-60); } .background-65 { color: var(--sbgcolor-65); } .background-70 { color: var(--sbgcolor-70); } .background-75 { color: var(--sbgcolor-75); } .background-80 { color: var(--sbgcolor-80); } .background-85 { color: var(--sbgcolor-85); } .background-90 { color: var(--sbgcolor-90); } .background-95 { color: var(--sbgcolor-95); } .background-100 { color: var(--sbgcolor-100); } .bg-background { background-color: var(--sbgcolor); } .bg-background-5 { background-color: var(--sbgcolor-5); } .bg-background-10 { background-color: var(--sbgcolor-10); } .bg-background-15 { background-color: var(--sbgcolor-15); } .bg-background-20 { background-color: var(--sbgcolor-20); } .bg-background-25 { background-color: var(--sbgcolor-25); } .bg-background-30 { background-color: var(--sbgcolor-30); } .bg-background-35 { background-color: var(--sbgcolor-35); } .bg-background-40 { background-color: var(--sbgcolor-40); } .bg-background-45 { background-color: var(--sbgcolor-45); } .bg-background-50 { background-color: var(--sbgcolor-50); } .bg-background-55 { background-color: var(--sbgcolor-55); } .bg-background-60 { background-color: var(--sbgcolor-60); } .bg-background-65 { background-color: var(--sbgcolor-65); } .bg-background-70 { background-color: var(--sbgcolor-70); } .bg-background-75 { background-color: var(--sbgcolor-75); } .bg-background-80 { background-color: var(--sbgcolor-80); } .bg-background-85 { background-color: var(--sbgcolor-85); } .bg-background-90 { background-color: var(--sbgcolor-90); } .bg-background-95 { background-color: var(--sbgcolor-95); } .bg-background-100 { background-color: var(--sbgcolor-100); } /* Passwortformular. Aus guladevs passwordform.css, die sie mitten im Blatt in einem eigenen :root-Block definiert. Die Regeln dazu stehen in components.css. */ :root { --input_bg: 158, 158, 158; --submit_bg: 148, 22, 128; }