fix(theme): correct typography and logo accessibility

Declare the Alro heading font with its intended 700 weight and explicitly apply that weight to branded headings. Preserve the homepage logo image in the accessibility tree while rendering the theme-specific visual artwork. Update repository guidance to document the self-contained theme architecture, Gitea 1.27.3 synchronization requirements, production asset hashing, and the complete six-theme verification matrix.
feat(theme): apply branded logos across all themes
2026-09-08 11:24:47 -05:00 · 2026-09-08 11:07:50 -05:00 · 2026-09-07 21:57:59 -05:00 · 2026-09-07 21:34:45 -05:00 · 2026-09-07 19:00:10 -05:00
7 changed files with 848 additions and 559 deletions
@@ -0,0 +1,29 @@
+# Repository Guide
+
+## Scope
+
+- This repository is a static overlay copied into Gitea's custom path; it has no local build, lint, or automated test toolchain.
+- Target Gitea 1.27.x; the current files are synchronized with Gitea 1.27.3. Treat upstream theme variables and template structure as version-coupled behavior.
+
+## Themes
+
+- `theme-codecraftsmen-light.css` and `theme-codecraftsmen-dark.css` are self-contained copies of the Gitea 1.27 theme variable sets with CodeCraftsmen overrides.
+- Keep their variable names synchronized with the built-in themes from the exact target release. Production Gitea theme assets are hashed, so custom themes must not import built-in theme filenames directly.
+- `theme-codecraftsmen-auto.css` selects the custom light and dark themes with `prefers-color-scheme`; verify changes in all three theme modes.
+- Keep font and image URLs relative to `public/assets/css/` (`../fonts/...` and `../img/...`) because Gitea serves these files below `/assets/`.
+- Preserve `gitea-theme-meta-info`, including both display name and color scheme, so Gitea can discover each theme correctly.
+- Do not add overrides under `templates/base/` for branding. Replace the upstream navbar and home page logo images through theme CSS so Gitea template upgrades remain intact.
+
+## Templates
+
+- `templates/custom/header.tmpl` injects Plausible analytics. Every external or inline script must use `nonce="{{ctx.CspScriptNonce}}"` or Gitea's CSP will block it.
+
+## Verification And Deployment
+
+- There is no standalone local renderer. Validate on the target Gitea release across anonymous, authenticated, and administrator pages in light, dark, and auto modes.
+- For Gitea upgrades, compare both custom palettes against the built-in light and dark themes from the exact target release before testing.
+- Deployment is not automated here. After review, synchronize `public/` and `templates/` to `ansible/roles/gitea/files/theme` in the separate homelab repository.
+
+## Assets
+
+- The bundled fonts and logos are project-supplied and do not grant redistribution rights; do not publish or replace them without confirming the applicable licenses.
@@ -4,9 +4,11 @@ Custom themes and branding for the CodeCraftsmen Gitea instance.

 ## Compatibility

-The theme supports Gitea 1.27.x. Each custom theme imports the matching built-in
-Gitea theme and overrides only the CodeCraftsmen palette, typography, and logo.
-This allows new upstream theme variables to retain their Gitea defaults.
+The theme supports Gitea 1.27.x and is currently synchronized with Gitea 1.27.3.
+The light and dark themes are self-contained copies of the matching built-in
+theme variable sets with CodeCraftsmen palette and typography overrides. The
+auto theme conditionally imports those two local theme files according to the
+user's preferred color scheme.

 The repository intentionally avoids overriding Gitea's internal templates. The
 navbar logo is replaced through theme CSS so Gitea template changes are applied
@@ -29,11 +31,12 @@ repository being available from the Gitea instance.

 ## Upgrade Process

-1. Update the imported Gitea version locally.
-2. Compare the custom palette with the built-in light and dark themes for that
-   exact release.
-3. Test anonymous, authenticated, and administrator pages with light, dark, and
-   auto themes.
+1. Compare the custom light and dark variable sets with the built-in themes from
+   the exact target release.
+2. Add, remove, or rename variables to match that release while preserving the
+   CodeCraftsmen palette values.
+3. Test anonymous, authenticated, and administrator pages with all six themes,
+   including both system color schemes for the two auto themes.
 4. Synchronize the reviewed files into the homelab Gitea role.

 ## Assets
@@ -0,0 +1,124 @@
+html:is(
+        [data-theme="gitea-light"],
+        [data-theme="gitea-dark"],
+        [data-theme="gitea-auto"],
+        [data-theme="codecraftsmen-light"],
+        [data-theme="codecraftsmen-dark"],
+        [data-theme="codecraftsmen-auto"]
+    )
+    #navbar
+    #navbar-logo {
+    background-position: center;
+    background-repeat: no-repeat;
+    background-size: 60px 30px;
+}
+
+html:is(
+        [data-theme="gitea-light"],
+        [data-theme="gitea-dark"],
+        [data-theme="gitea-auto"],
+        [data-theme="codecraftsmen-light"],
+        [data-theme="codecraftsmen-dark"],
+        [data-theme="codecraftsmen-auto"]
+    )
+    #navbar
+    #navbar-logo
+    img {
+    visibility: hidden;
+    width: 60px;
+    height: 30px;
+}
+
+html:is(
+        [data-theme="gitea-light"],
+        [data-theme="gitea-dark"],
+        [data-theme="gitea-auto"],
+        [data-theme="codecraftsmen-light"],
+        [data-theme="codecraftsmen-dark"],
+        [data-theme="codecraftsmen-auto"]
+    )
+    .page-content.home
+    img.logo {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    padding: 0;
+    margin: -1px;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    clip-path: inset(50%);
+    white-space: nowrap;
+    border: 0;
+}
+
+html:is(
+        [data-theme="gitea-light"],
+        [data-theme="gitea-dark"],
+        [data-theme="gitea-auto"],
+        [data-theme="codecraftsmen-light"],
+        [data-theme="codecraftsmen-dark"],
+        [data-theme="codecraftsmen-auto"]
+    )
+    .page-content.home
+    .center:has(> img.logo)::before {
+    content: "";
+    display: block;
+    width: 220px;
+    height: 220px;
+    margin: 0 auto;
+    background-position: center;
+    background-repeat: no-repeat;
+    background-size: contain;
+}
+
+html:is([data-theme="gitea-light"], [data-theme="codecraftsmen-light"])
+    #navbar
+    #navbar-logo {
+    background-image: url("../img/logo-light-no-slogan.svg");
+}
+
+html:is([data-theme="gitea-light"], [data-theme="codecraftsmen-light"])
+    .page-content.home
+    .center:has(> img.logo)::before {
+    background-image: url("../img/logo-light.svg");
+}
+
+html:is([data-theme="gitea-dark"], [data-theme="codecraftsmen-dark"])
+    #navbar
+    #navbar-logo {
+    background-image: url("../img/logo-dark-no-slogan.svg");
+}
+
+html:is([data-theme="gitea-dark"], [data-theme="codecraftsmen-dark"])
+    .page-content.home
+    .center:has(> img.logo)::before {
+    background-image: url("../img/logo-dark.svg");
+}
+
+@media (prefers-color-scheme: light) {
+    html:is([data-theme="gitea-auto"], [data-theme="codecraftsmen-auto"])
+        #navbar
+        #navbar-logo {
+        background-image: url("../img/logo-light-no-slogan.svg");
+    }
+
+    html:is([data-theme="gitea-auto"], [data-theme="codecraftsmen-auto"])
+        .page-content.home
+        .center:has(> img.logo)::before {
+        background-image: url("../img/logo-light.svg");
+    }
+}
+
+@media (prefers-color-scheme: dark) {
+    html:is([data-theme="gitea-auto"], [data-theme="codecraftsmen-auto"])
+        #navbar
+        #navbar-logo {
+        background-image: url("../img/logo-dark-no-slogan.svg");
+    }
+
+    html:is([data-theme="gitea-auto"], [data-theme="codecraftsmen-auto"])
+        .page-content.home
+        .center:has(> img.logo)::before {
+        background-image: url("../img/logo-dark.svg");
+    }
+}
@@ -1,22 +1,6 @@
@import "./theme-codecraftsmen-light.css" (prefers-color-scheme: light);
@import "./theme-codecraftsmen-dark.css" (prefers-color-scheme: dark);

-@media (prefers-color-scheme: light) {
-  html[data-theme="codecraftsmen-auto"] #navbar-logo img {
-    content: url("../img/logo-light-no-slogan.svg");
-    width: 60px;
-    height: 30px;
-  }
-}
-
-@media (prefers-color-scheme: dark) {
-  html[data-theme="codecraftsmen-auto"] #navbar-logo img {
-    content: url("../img/logo-dark-no-slogan.svg");
-    width: 60px;
-    height: 30px;
-  }
-}
-
 gitea-theme-meta-info {
    --theme-display-name: "CodeCraftsmen Auto";
    --theme-color-scheme: "auto";
@@ -1,5 +1,3 @@
-@import "./theme-gitea-dark.css";
-
 gitea-theme-meta-info {
    --theme-display-name: "CodeCraftsmen Dark";
    --theme-color-scheme: "dark";
@@ -15,7 +13,7 @@ gitea-theme-meta-info {
@font-face {
    font-family: "alro";
    src: url("../fonts/alro-bold-700.woff2") format("woff2");
-  font-weight: 400;
+    font-weight: 700;
    font-style: normal;
    font-display: swap;
 }
@@ -88,6 +86,7 @@ gitea-theme-meta-info {
    --color-console-active-bg: #2e353b;
    --color-console-menu-bg: #262b31;
    --color-console-menu-border: #414b55;
+    --color-console-link: #969aa1;
    /* named colors */
    --color-red: #d52b1e;
    --color-orange: #cc580c;
@@ -157,17 +156,36 @@ gitea-theme-meta-info {
    --color-ansi-bright-magenta: #d74397;
    --color-ansi-bright-cyan: #00b6ad;
    --color-ansi-bright-white: var(--color-console-fg);
+    /* 16-color series */
+    --color-series-16-0: #7db233;
+    --color-series-16-1: #499a37;
+    --color-series-16-2: #ce4751;
+    --color-series-16-3: #8f9121;
+    --color-series-16-4: #ac32a6;
+    --color-series-16-5: #7445e9;
+    --color-series-16-6: #c67d28;
+    --color-series-16-7: #4db392;
+    --color-series-16-8: #aa4d30;
+    --color-series-16-9: #2a6f84;
+    --color-series-16-10: #c45327;
+    --color-series-16-11: #3d965c;
+    --color-series-16-12: #792a93;
+    --color-series-16-13: #439d73;
+    --color-series-16-14: #103aad;
+    --color-series-16-15: #982e85;
    /* other colors */
    --color-grey: #384149;
    --color-grey-light: #818f9e;
    --color-gold: #b1983b;
    --color-white: #ffffff;
+    --color-diff-added-fg: #93b373;
    --color-diff-added-linenum-bg: #274227;
    --color-diff-added-row-bg: #203224;
    --color-diff-added-row-border: #314a37;
    --color-diff-added-word-bg: #3c653c;
    --color-diff-moved-row-bg: #818044;
    --color-diff-moved-row-border: #bcca6f;
+    --color-diff-removed-fg: #fb5f5b;
    --color-diff-removed-linenum-bg: #482121;
    --color-diff-removed-row-bg: #301e1e;
    --color-diff-removed-row-border: #634343;
@@ -187,6 +205,9 @@ gitea-theme-meta-info {
    --color-info-border: #306090;
    --color-info-bg: #26354c;
    --color-info-text: #38a8e8;
+    --color-priority-border: #4a268d;
+    --color-priority-bg: #251c39;
+    --color-priority-text: #a371f7;
    --color-red-badge: #db2828;
    --color-red-badge-bg: #db28281a;
    --color-red-badge-hover-bg: #db28284d;
@@ -220,7 +241,12 @@ gitea-theme-meta-info {
    --color-input-border: var(--color-secondary);
    --color-input-border-hover: var(--color-secondary-dark-1);
    --color-light: #00001728;
-  --color-light-mimic-enabled: rgba(0, 0, 0, calc(40 / 255 * 222 / 255 / var(--opacity-disabled)));
+    --color-light-mimic-enabled: rgba(
+        0,
+        0,
+        0,
+        calc(40 / 255 * 222 / 255 / var(--opacity-disabled))
+    );
    --color-light-border: #e8f3ff28;
    --color-hover: #e8f3ff19;
    --color-hover-opaque: #21252a; /* TODO: color-mix(in srgb, var(--color-body), var(--color-hover)); */
@@ -238,8 +264,11 @@ gitea-theme-meta-info {
    --color-expand-button: #2f363d;
    --color-placeholder-text: var(--color-text-light-3);
    --color-editor-line-highlight: var(--color-primary-light-5);
+    --color-editor-selection: var(--color-primary-alpha-50);
    --color-project-column-bg: var(--color-secondary-light-2);
-  --color-caret: var(--color-text); /* should ideally be --color-text-dark, see #15651 */
+    --color-caret: var(
+        --color-text
+    ); /* should ideally be --color-text-dark, see #15651 */
    --color-reaction-bg: #e8f3ff12;
    --color-reaction-hover-bg: var(--color-primary-light-4);
    --color-reaction-active-bg: var(--color-primary-light-5);
@@ -258,6 +287,51 @@ gitea-theme-meta-info {
    --color-highlight-fg: #f2b134;
    --color-highlight-bg: #6b5428;
    --color-overlay-backdrop: #080808c0;
+    --color-danger: var(--color-red);
+    --color-transparency-grid-light: #2a2a2a;
+    --color-transparency-grid-dark: #1a1a1a;
+    --color-workflow-edge-hover: #666a73;
+    --color-syntax-keyword: #ff8854;
+    --color-syntax-bool: #25bbc9;
+    --color-syntax-control: #dd9e17;
+    --color-syntax-name: #fabd2f;
+    --color-syntax-type: #eb8cb3;
+    --color-syntax-number: #63b2dd;
+    --color-syntax-operator: #ff8854;
+    --color-syntax-regexp: #b89de4;
+    --color-syntax-string: #95b62a;
+    --color-syntax-comment: #8898b0;
+    --color-syntax-invalid: #ff8686;
+    --color-syntax-link: var(--color-primary);
+    --color-syntax-tag: #ff8854;
+    --color-syntax-attribute: #c792ff;
+    --color-syntax-property: #55afff;
+    --color-syntax-variable: #e29b33;
+    --color-syntax-string-special: #dd9e17;
+    --color-syntax-escape: #c7a618;
+    --color-syntax-entity: #c792ff;
+    --color-syntax-preproc: #4cbe7a;
+    --color-syntax-preproc-file: #63b2dd;
+    --color-syntax-decorator: #4cbe7a;
+    --color-syntax-namespace: #c9d1d9;
+    --color-syntax-name-pseudo: #c792ff;
+    --color-syntax-comment-special: #b89de4;
+    --color-syntax-text: #c9d1d9;
+    --color-syntax-text-alt: #b9bcc7;
+    --color-syntax-punctuation: #d2d4db;
+    --color-syntax-whitespace: #7f8699;
+    --color-syntax-diff-fg: #ffffff;
+    --color-syntax-deleted-bg: #5f3737;
+    --color-syntax-inserted-bg: #3a523a;
+    --color-syntax-emph: #d1a242;
+    --color-syntax-strong: #e29b33;
+    --color-syntax-heading: #dd9e17;
+    --color-syntax-subheading: #95b62a;
+    --color-syntax-output: #8898b0;
+    --color-syntax-prompt: #e29b33;
+    --color-syntax-traceback: #ff8686;
+    --color-syntax-matching-bracket-bg: #00918a48;
+    --color-syntax-nonmatching-bracket-bg: #cc484848;
    accent-color: var(--color-accent);
    color-scheme: dark;
 }
@@ -288,15 +362,15 @@ gitea-theme-meta-info {

 /* CodeCraftsmen brand typography (falls back gracefully if custom fonts are not installed) */
 :root {
-  --cc-font-body: "Gotham", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
-  --cc-font-heading: "alro", "Gotham", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial;
-  --cc-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
-}
-
-html[data-theme="codecraftsmen-dark"] #navbar-logo img {
-  content: url("../img/logo-dark-no-slogan.svg");
-  width: 60px;
-  height: 30px;
+    --cc-font-body:
+        "Gotham", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
+        Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
+    --cc-font-heading:
+        "alro", "Gotham", ui-sans-serif, system-ui, -apple-system, "Segoe UI",
+        Roboto, Helvetica, Arial;
+    --cc-font-mono:
+        ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
+        "Liberation Mono", "Courier New", monospace;
 }

 body,
@@ -318,6 +392,7 @@ h6,
 .page-title,
 .repository .ui.header {
    font-family: var(--cc-font-heading);
+    font-weight: 700;
    letter-spacing: 0.02em;
 }

@@ -1,5 +1,3 @@
-@import "./theme-gitea-light.css";
-
 gitea-theme-meta-info {
    --theme-display-name: "CodeCraftsmen Light";
    --theme-color-scheme: "light";
@@ -15,7 +13,7 @@ gitea-theme-meta-info {
@font-face {
    font-family: "alro";
    src: url("../fonts/alro-bold-700.woff2") format("woff2");
-  font-weight: 400;
+    font-weight: 700;
    font-style: normal;
    font-display: swap;
 }
@@ -88,6 +86,7 @@ gitea-theme-meta-info {
    --color-console-active-bg: #2e353b;
    --color-console-menu-bg: #262b31;
    --color-console-menu-border: #414b55;
+    --color-console-link: #5c656d;
    /* named colors */
    --color-red: #d52b1e;
    --color-orange: #f2711c;
@@ -157,17 +156,36 @@ gitea-theme-meta-info {
    --color-ansi-bright-magenta: #d74397;
    --color-ansi-bright-cyan: #00b6ad;
    --color-ansi-bright-white: var(--color-console-fg);
+    /* 16-color series */
+    --color-series-16-0: #7db233;
+    --color-series-16-1: #499a37;
+    --color-series-16-2: #ce4751;
+    --color-series-16-3: #8f9121;
+    --color-series-16-4: #ac32a6;
+    --color-series-16-5: #7445e9;
+    --color-series-16-6: #c67d28;
+    --color-series-16-7: #4db392;
+    --color-series-16-8: #aa4d30;
+    --color-series-16-9: #2a6f84;
+    --color-series-16-10: #c45327;
+    --color-series-16-11: #3d965c;
+    --color-series-16-12: #792a93;
+    --color-series-16-13: #439d73;
+    --color-series-16-14: #103aad;
+    --color-series-16-15: #982e85;
    /* other colors */
    --color-grey: #697077;
    --color-grey-light: #7c838a;
    --color-gold: #a1882b;
    --color-white: #ffffff;
+    --color-diff-added-fg: #177231;
    --color-diff-added-linenum-bg: #d1f8d9;
    --color-diff-added-row-bg: #e6ffed;
    --color-diff-added-row-border: #e6ffed;
    --color-diff-added-word-bg: #acf2bd;
    --color-diff-moved-row-bg: #f1f8d1;
    --color-diff-moved-row-border: #d0e27f;
+    --color-diff-removed-fg: #c61f2b;
    --color-diff-removed-linenum-bg: #ffcecb;
    --color-diff-removed-row-bg: #ffeef0;
    --color-diff-removed-row-border: #f1c0c0;
@@ -187,6 +205,9 @@ gitea-theme-meta-info {
    --color-info-border: #a9d5de;
    --color-info-bg: #f8ffff;
    --color-info-text: #276f86;
+    --color-priority-border: #b9a1ff66;
+    --color-priority-bg: #f3e7ff;
+    --color-priority-text: #8250df;
    --color-red-badge: #db2828;
    --color-red-badge-bg: #db28281a;
    --color-red-badge-hover-bg: #db28284d;
@@ -220,7 +241,12 @@ gitea-theme-meta-info {
    --color-input-border: var(--color-secondary);
    --color-input-border-hover: var(--color-secondary-dark-1);
    --color-light: #00001706;
-  --color-light-mimic-enabled: rgba(0, 0, 0, calc(6 / 255 * 222 / 255 / var(--opacity-disabled)));
+    --color-light-mimic-enabled: rgba(
+        0,
+        0,
+        0,
+        calc(6 / 255 * 222 / 255 / var(--opacity-disabled))
+    );
    --color-light-border: #0000171d;
    --color-hover: #00001708;
    --color-hover-opaque: #f1f3f5; /* TODO: color-mix(in srgb, var(--color-body), var(--color-hover)); */
@@ -238,6 +264,7 @@ gitea-theme-meta-info {
    --color-expand-button: #cfe8fa;
    --color-placeholder-text: var(--color-text-light-3);
    --color-editor-line-highlight: var(--color-primary-light-6);
+    --color-editor-selection: var(--color-primary-alpha-30);
    --color-project-column-bg: var(--color-secondary-light-4);
    --color-caret: var(--color-text-dark);
    --color-reaction-bg: #0000170a;
@@ -258,21 +285,66 @@ gitea-theme-meta-info {
    --color-highlight-fg: #7a5230;
    --color-highlight-bg: #fae4b8;
    --color-overlay-backdrop: #080808c0;
+    --color-danger: var(--color-red);
+    --color-transparency-grid-light: #fafafa;
+    --color-transparency-grid-dark: #e2e2e2;
+    --color-workflow-edge-hover: #b1b7bd;
+    --color-syntax-keyword: #a73a00;
+    --color-syntax-bool: #076872;
+    --color-syntax-control: #7d5700;
+    --color-syntax-name: #785900;
+    --color-syntax-type: #ae2368;
+    --color-syntax-number: #105ead;
+    --color-syntax-operator: #a73a00;
+    --color-syntax-regexp: #773dc5;
+    --color-syntax-string: #456800;
+    --color-syntax-comment: #506070;
+    --color-syntax-invalid: #c00000;
+    --color-syntax-link: var(--color-primary);
+    --color-syntax-tag: #a73a00;
+    --color-syntax-attribute: #6f41c5;
+    --color-syntax-property: #2060a0;
+    --color-syntax-variable: #944a00;
+    --color-syntax-string-special: #7d5700;
+    --color-syntax-escape: #785900;
+    --color-syntax-entity: #6f41c5;
+    --color-syntax-preproc: #2d6a4b;
+    --color-syntax-preproc-file: #105ead;
+    --color-syntax-decorator: #2d6a4b;
+    --color-syntax-namespace: #555555;
+    --color-syntax-name-pseudo: #6f41c5;
+    --color-syntax-comment-special: #773dc5;
+    --color-syntax-text: inherit;
+    --color-syntax-text-alt: #47525b;
+    --color-syntax-punctuation: inherit;
+    --color-syntax-whitespace: #bbbbbb;
+    --color-syntax-diff-fg: #000000;
+    --color-syntax-deleted-bg: #ffdddd;
+    --color-syntax-inserted-bg: #ddffdd;
+    --color-syntax-emph: #8b5000;
+    --color-syntax-strong: inherit;
+    --color-syntax-heading: #7d5700;
+    --color-syntax-subheading: #456800;
+    --color-syntax-output: #506070;
+    --color-syntax-prompt: #944a00;
+    --color-syntax-traceback: #c00000;
+    --color-syntax-matching-bracket-bg: #00b5ad38;
+    --color-syntax-nonmatching-bracket-bg: #db282838;
    accent-color: var(--color-accent);
    color-scheme: light;
 }

 /* CodeCraftsmen brand typography (falls back gracefully if custom fonts are not installed) */
 :root {
-  --cc-font-body: "Gotham", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
-  --cc-font-heading: "alro", "Gotham", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial;
-  --cc-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
-}
-
-html[data-theme="codecraftsmen-light"] #navbar-logo img {
-  content: url("../img/logo-light-no-slogan.svg");
-  width: 60px;
-  height: 30px;
+    --cc-font-body:
+        "Gotham", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
+        Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
+    --cc-font-heading:
+        "alro", "Gotham", ui-sans-serif, system-ui, -apple-system, "Segoe UI",
+        Roboto, Helvetica, Arial;
+    --cc-font-mono:
+        ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
+        "Liberation Mono", "Courier New", monospace;
 }

 body,
@@ -294,6 +366,7 @@ h6,
 .page-title,
 .repository .ui.header {
    font-family: var(--cc-font-heading);
+    font-weight: 700;
    letter-spacing: 0.02em;
 }

@@ -1,3 +1,4 @@
+<link rel="stylesheet" href="{{AssetUrlPrefix}}/css/branding.css">
 <!-- Privacy-friendly analytics by Plausible -->
 <script nonce="{{ctx.CspScriptNonce}}" async src="https://plausible.colemaxwell.dev/js/pa-IVfYDjRQ-05CMcATP0ha3.js"></script>
 <script nonce="{{ctx.CspScriptNonce}}">
Author	SHA1	Message	Date
cole-maxwell1	5acb05d7cf	fix(theme): correct typography and logo accessibility Declare the Alro heading font with its intended 700 weight and explicitly apply that weight to branded headings. Preserve the homepage logo image in the accessibility tree while rendering the theme-specific visual artwork. Update repository guidance to document the self-contained theme architecture, Gitea 1.27.3 synchronization requirements, production asset hashing, and the complete six-theme verification matrix.	2026-09-08 11:24:47 -05:00
cole-maxwell1	0875dfa276	feat(theme): apply branded logos across all themes Load a shared branding stylesheet globally so built-in and CodeCraftsmen themes display the appropriate navbar and homepage logos. Use fixed artwork for explicit light and dark themes while respecting the system preference for automatic themes. Centralize the logo overrides, remove duplicated theme-specific rules, and make the custom light and dark themes self-contained. Synchronize their palette variables with Gitea 1.27, including syntax, diff, priority, editor, console, workflow, transparency, and chart colors.	2026-09-08 11:07:50 -05:00
cole-maxwell1	b21d961929	fix(theme): switch navbar and home logos through pure css Extend theme-aware logo switching to the home page hero logo, which previously never changed with the active color scheme, and keep the navbar logo switching in the same CSS-only mechanism. Replace the header template synchronization script with theme CSS background images so logos render correctly at first paint, work with JavaScript disabled, and avoid WebKit replaced-element repaint behavior. Hide the upstream images as layout placeholders and use selectors that outrank Gitea's navbar hover styles. Add an AGENTS.md guide documenting repository scope, theme and template constraints, verification expectations, and the manual deployment flow.	2026-09-07 21:57:59 -05:00
cole-maxwell1	8dc216d4e9	fix(theme): synchronize navbar logo with active color scheme Replace CSS background-image switching with direct navbar image source updates to avoid Safari and WebKit repaint failures. Select the appropriate logo during initial DOM construction and update it when the system color scheme changes, Safari restores a cached page, or the document returns to the foreground. Preserve CSP compatibility and Gitea subpath support while retaining the existing logo dimensions.	2026-09-07 21:34:45 -05:00
cole-maxwell1	d8cf7ed29b	fix(theme): refresh navbar logo on iOS Safari Replace CSS content substitution with theme-specific navbar background images to ensure WebKit repaints the logo when the system color scheme changes. Hide the upstream image while preserving its layout dimensions, and use selectors that prevent Gitea's navbar hover styles from clearing the custom logo.	2026-09-07 19:00:10 -05:00