Files
octo-gitea/themes/theme-octo-light.css
T
hykocx 7bc8d8b1ce style(themes): adjust color values for card, button, and project column backgrounds
- update `--color-card` to pure/near-pure values in both dark and light themes
- update `--color-button` to more distinct static colors in both themes
- replace variable-based `--color-project-column-bg` with explicit hex values
2026-04-28 20:16:46 -04:00

294 lines
10 KiB
CSS

gitea-theme-meta-info {
--theme-display-name: "Octo Light";
--theme-color-scheme: "light";
}
:root {
--is-dark-theme: false;
--color-primary: #0366d6;
--color-primary-contrast: #ffffff;
--color-primary-dark-1: #035cc1;
--color-primary-dark-2: #0252ac;
--color-primary-dark-3: #024897;
--color-primary-dark-4: #013e82;
--color-primary-dark-5: #00316a;
--color-primary-dark-6: #002550;
--color-primary-dark-7: #001838;
--color-primary-light-1: #1f78dc;
--color-primary-light-2: #4a92e3;
--color-primary-light-3: #6ba6e9;
--color-primary-light-4: #8fbcef;
--color-primary-light-5: #b5d2f5;
--color-primary-light-6: #d8e7fa;
--color-primary-light-7: #ecf3fc;
--color-primary-alpha-10: #0366d619;
--color-primary-alpha-20: #0366d633;
--color-primary-alpha-30: #0366d64b;
--color-primary-alpha-40: #0366d666;
--color-primary-alpha-50: #0366d680;
--color-primary-alpha-60: #0366d699;
--color-primary-alpha-70: #0366d6b3;
--color-primary-alpha-80: #0366d6cc;
--color-primary-alpha-90: #0366d6e1;
--color-primary-hover: var(--color-primary-dark-1);
--color-primary-active: var(--color-primary-dark-2);
--color-secondary: #d1d5da;
--color-secondary-dark-1: #c6cad0;
--color-secondary-dark-2: #b8bcc2;
--color-secondary-dark-3: #a0a4ab;
--color-secondary-dark-4: #8b8f96;
--color-secondary-dark-5: #6a737d;
--color-secondary-dark-6: #586069;
--color-secondary-dark-7: #444d56;
--color-secondary-dark-8: #2f363d;
--color-secondary-dark-9: #24292e;
--color-secondary-dark-10: #1b1f23;
--color-secondary-dark-11: #14171a;
--color-secondary-dark-12: #0c0e10;
--color-secondary-dark-13: #000000;
--color-secondary-light-1: #e1e4e8;
--color-secondary-light-2: #eaedf0;
--color-secondary-light-3: #f2f4f5;
--color-secondary-light-4: #fafbfc;
--color-secondary-alpha-10: #d1d5da19;
--color-secondary-alpha-20: #d1d5da33;
--color-secondary-alpha-30: #d1d5da4b;
--color-secondary-alpha-40: #d1d5da66;
--color-secondary-alpha-50: #d1d5da80;
--color-secondary-alpha-60: #d1d5da99;
--color-secondary-alpha-70: #d1d5dab3;
--color-secondary-alpha-80: #d1d5dacc;
--color-secondary-alpha-90: #d1d5dae1;
--color-secondary-button: var(--color-secondary-dark-4);
--color-secondary-hover: var(--color-secondary-dark-5);
--color-secondary-active: var(--color-secondary-dark-6);
/* console colors - used for actions console and console files */
--color-console-fg: #24292e;
--color-console-fg-subtle: #586069;
--color-console-bg: #fafbfc;
--color-console-border: #e1e4e8;
--color-console-hover-bg: #f2f4f5;
--color-console-active-bg: #e1e4e8;
--color-console-menu-bg: #ffffff;
--color-console-menu-border: #e1e4e8;
--color-console-link: #0366d6;
/* named colors */
--color-red: #d73a49;
--color-orange: #e36209;
--color-yellow: #9a6700;
--color-olive: #735c0f;
--color-green: #22863a;
--color-teal: #1b7c83;
--color-blue: #0366d6;
--color-violet: #5a32a3;
--color-purple: #6f42c1;
--color-pink: #b5258f;
--color-brown: #735c0f;
--color-black: #1b1f23;
/* light variants - produced via Sass scale-color(color, $lightness: +25%) */
--color-red-light: #e3636e;
--color-orange-light: #ed8438;
--color-yellow-light: #c89200;
--color-olive-light: #a08518;
--color-green-light: #34ad51;
--color-teal-light: #25a8b3;
--color-blue-light: #2e87e8;
--color-violet-light: #7747c4;
--color-purple-light: #8c61cf;
--color-pink-light: #c84cab;
--color-brown-light: #a08518;
--color-black-light: #4b5258;
/* dark 1 variants - produced via Sass scale-color(color, $lightness: -10%) */
--color-red-dark-1: #c12b39;
--color-orange-dark-1: #cb5708;
--color-yellow-dark-1: #845800;
--color-olive-dark-1: #614e0d;
--color-green-dark-1: #1d7331;
--color-teal-dark-1: #176b71;
--color-blue-dark-1: #035cc1;
--color-violet-dark-1: #4d2b8b;
--color-purple-dark-1: #5d3aa3;
--color-pink-dark-1: #99207a;
--color-brown-dark-1: #614e0d;
--color-black-dark-1: #16191e;
/* dark 2 variants - produced via Sass scale-color(color, $lightness: -20%) */
--color-red-dark-2: #ab2632;
--color-orange-dark-2: #b34d07;
--color-yellow-dark-2: #6e4900;
--color-olive-dark-2: #51410b;
--color-green-dark-2: #18602a;
--color-teal-dark-2: #135a5e;
--color-blue-dark-2: #0252ac;
--color-violet-dark-2: #41267a;
--color-purple-dark-2: #4f308f;
--color-pink-dark-2: #841c69;
--color-brown-dark-2: #51410b;
--color-black-dark-2: #0c0e10;
/* ansi colors used for actions console and console files */
--color-ansi-black: #24292e;
--color-ansi-red: #d73a49;
--color-ansi-green: #28a745;
--color-ansi-yellow: #9a6700;
--color-ansi-blue: #0366d6;
--color-ansi-magenta: #5a32a3;
--color-ansi-cyan: #1b7c83;
--color-ansi-white: var(--color-console-fg-subtle);
--color-ansi-bright-black: #6a737d;
--color-ansi-bright-red: #cb2431;
--color-ansi-bright-green: #22863a;
--color-ansi-bright-yellow: #b08800;
--color-ansi-bright-blue: #005cc5;
--color-ansi-bright-magenta: #5a32a3;
--color-ansi-bright-cyan: #3192aa;
--color-ansi-bright-white: var(--color-console-fg);
/* other colors */
--color-grey: #6a737d;
--color-grey-light: #959da5;
--color-gold: #b08800;
--color-white: #ffffff;
--color-diff-added-fg: #22863a;
--color-diff-added-linenum-bg: #d1f8d9;
--color-diff-added-row-bg: #e6ffed;
--color-diff-added-row-border: #d1f8d9;
--color-diff-added-word-bg: #acf2bd;
--color-diff-moved-row-bg: #fff8c5;
--color-diff-moved-row-border: #eed99c;
--color-diff-removed-fg: #d73a49;
--color-diff-removed-linenum-bg: #ffcecb;
--color-diff-removed-row-bg: #ffeef0;
--color-diff-removed-row-border: #ffcecb;
--color-diff-removed-word-bg: #fdb8c0;
--color-diff-inactive: #f2f4f5;
--color-error-border: #d73a4966;
--color-error-bg: #ffeef0;
--color-error-bg-active: #ffcecb;
--color-error-bg-hover: #ffdcd7;
--color-error-text: var(--color-text);
--color-success-border: #22863a66;
--color-success-bg: #dafbe1;
--color-success-text: var(--color-text);
--color-warning-border: #9a670066;
--color-warning-bg: #fff8c5;
--color-warning-text: var(--color-text);
--color-info-border: #0366d666;
--color-info-bg: #ddf4ff;
--color-info-text: var(--color-text);
--color-red-badge: #d73a49;
--color-red-badge-bg: #d73a491a;
--color-red-badge-hover-bg: #d73a494d;
--color-green-badge: #22863a;
--color-green-badge-bg: #22863a1a;
--color-green-badge-hover-bg: #22863a4d;
--color-yellow-badge: #9a6700;
--color-yellow-badge-bg: #9a67001a;
--color-yellow-badge-hover-bg: #9a67004d;
--color-orange-badge: #e36209;
--color-orange-badge-bg: #e362091a;
--color-orange-badge-hover-bg: #e362094d;
--color-git: #f05133;
--color-logo: #0366d6;
/* target-based colors */
--color-body: #ffffff;
--color-box-header: #ffffff;
--color-box-body: #ffffff;
--color-box-body-highlight: #fafbfc;
--color-text-dark: #000000;
--color-text: #000000;
--color-text-light: #353535;
--color-text-light-1: #616161;
--color-text-light-2: #808080;
--color-text-light-3: #9c9c9c;
--color-footer: var(--color-nav-bg);
--color-timeline: #e1e4e8;
--color-input-text: var(--color-text-dark);
--color-input-background: #ffffff;
--color-input-toggle-background: #e1e4e8;
--color-input-border: var(--color-secondary);
--color-light: #1b1f2306;
--color-light-border: #1b1f231d;
--color-hover: #1b1f2308;
--color-hover-opaque: #f2f4f5;
--color-active: #1b1f2314;
--color-menu: #fafbfc;
--color-card: #ffffff;
--color-markup-table-row: #1b1f230a;
--color-markup-code-block: #f2f4f5;
--color-markup-code-inline: #1b1f2312;
--color-button: #f5f5f5;
--color-code-bg: #f2f4f5;
--color-shadow: #1b1f2326;
--color-shadow-opaque: #c6cad0;
--color-secondary-bg: #f2f4f5;
--color-expand-button: #dbedff;
--color-placeholder-text: var(--color-text-light-3);
--color-editor-line-highlight: var(--color-secondary-alpha-30);
--color-editor-selection: var(--color-primary-alpha-30);
--color-project-column-bg: #fbfbfb;
--color-caret: var(--color-text-dark);
--color-reaction-bg: #1b1f230a;
--color-reaction-hover-bg: var(--color-primary-light-5);
--color-reaction-active-bg: var(--color-primary-light-6);
--color-tooltip-text: #ffffff;
--color-tooltip-bg: #24292ef0;
--color-nav-bg: #ffffff;
--color-nav-hover-bg: var(--color-secondary-light-2);
--color-nav-text: var(--color-text);
--color-secondary-nav-bg: #fafbfc;
--color-label-text: var(--color-text);
--color-label-bg: #959da54b;
--color-label-hover-bg: #959da5a0;
--color-label-active-bg: #959da5ff;
--color-accent: #fd8c73;
--color-small-accent: var(--color-primary-light-6);
--color-highlight-fg: #735c0f;
--color-highlight-bg: #fff8c5;
--color-overlay-backdrop: #1b1f234d;
--color-danger: var(--color-red);
--color-transparency-grid-light: #fafafa;
--color-transparency-grid-dark: #e2e2e2;
--color-workflow-edge-hover: #b8bcc2;
--color-syntax-keyword: #d73a49;
--color-syntax-bool: #005cc5;
--color-syntax-control: #d73a49;
--color-syntax-name: #6f42c1;
--color-syntax-type: #6f42c1;
--color-syntax-number: #005cc5;
--color-syntax-operator: #d73a49;
--color-syntax-regexp: #032f62;
--color-syntax-string: #032f62;
--color-syntax-comment: #6a737d;
--color-syntax-invalid: #cb2431;
--color-syntax-link: var(--color-primary);
--color-syntax-tag: #22863a;
--color-syntax-attribute: #005cc5;
--color-syntax-property: #005cc5;
--color-syntax-variable: #e36209;
--color-syntax-string-special: #005cc5;
--color-syntax-escape: #005cc5;
--color-syntax-entity: #6f42c1;
--color-syntax-preproc: #d73a49;
--color-syntax-preproc-file: #032f62;
--color-syntax-decorator: #6f42c1;
--color-syntax-namespace: #e36209;
--color-syntax-name-pseudo: #005cc5;
--color-syntax-comment-special: #6a737d;
--color-syntax-text: #24292e;
--color-syntax-text-alt: #444d56;
--color-syntax-punctuation: #24292e;
--color-syntax-whitespace: #d1d5da;
--color-syntax-diff-fg: #24292e;
--color-syntax-deleted-bg: #ffeef0;
--color-syntax-inserted-bg: #e6ffed;
--color-syntax-emph: #e36209;
--color-syntax-strong: #e36209;
--color-syntax-heading: #005cc5;
--color-syntax-subheading: #032f62;
--color-syntax-output: #6a737d;
--color-syntax-prompt: #e36209;
--color-syntax-traceback: #cb2431;
--color-syntax-matching-bracket-bg: #34d05840;
--color-syntax-nonmatching-bracket-bg: #d73a4940;
accent-color: var(--color-accent);
color-scheme: light;
}