Update Forgejo theme (squash)

- Incorporate changes from 79a4c80f8d into the Forgejo themes.
- Fix that there's no focus or active coloring on primary and secondary
buttons for Forgejo themes caused by
023e937141 that moved variablse from
base.css (shared) to the themes.
- Extend hack to make red buttons darker on dark Forgejo theme to
include active styling and remove the unnecessary `!important`.

(cherry picked from commit 2e32da4419)
(cherry picked from commit a4eca09543)
This commit is contained in:
Gusted 2023-11-09 22:33:29 +01:00 committed by Earl Warren
parent ea7bd8022f
commit e6e452811d
No known key found for this signature in database
GPG key ID: 0579CB2928A78A00
2 changed files with 66 additions and 4 deletions

View file

@ -44,6 +44,8 @@
--color-primary-alpha-70: #ea580cb3; --color-primary-alpha-70: #ea580cb3;
--color-primary-alpha-80: #ea580ccc; --color-primary-alpha-80: #ea580ccc;
--color-primary-alpha-90: #ea580ce1; --color-primary-alpha-90: #ea580ce1;
--color-primary-hover: var(--color-primary-light-1);
--color-primary-active: var(--color-primary-light-2);
--color-secondary: var(--steel-700); --color-secondary: var(--steel-700);
--color-secondary-dark-1: var(--steel-550); --color-secondary-dark-1: var(--steel-550);
--color-secondary-dark-2: var(--steel-500); --color-secondary-dark-2: var(--steel-500);
@ -71,6 +73,8 @@
--color-secondary-alpha-70: #2B3642b3; --color-secondary-alpha-70: #2B3642b3;
--color-secondary-alpha-80: #2B3642cc; --color-secondary-alpha-80: #2B3642cc;
--color-secondary-alpha-90: #2B3642e1; --color-secondary-alpha-90: #2B3642e1;
--color-secondary-hover: var(--color-secondary-light-1);
--color-secondary-active: var(--color-secondary-light-2);
/* colors */ /* colors */
--color-red: #b91c1c; --color-red: #b91c1c;
--color-orange: #ea580c; --color-orange: #ea580c;
@ -99,6 +103,32 @@
--color-brown-light: #94674a; --color-brown-light: #94674a;
--color-grey-light: var(--steel-300); --color-grey-light: var(--steel-300);
--color-black-light: #1f2937; --color-black-light: #1f2937;
/* dark 1 variants produced via Sass scale-color(color, $lightness: -10%) */
--color-red-dark-1: #a71919;
--color-orange-dark-1: #d34f0b;
--color-yellow-dark-1: #b67c04;
--color-olive-dark-1: #839311;
--color-green-dark-1: #137337;
--color-teal-dark-1: #0c857a;
--color-blue-dark-1: #1554e0;
--color-violet-dark-1: #6a1feb;
--color-purple-dark-1: #8519e7;
--color-pink-dark-1: #c7216b;
--color-brown-dark-1: #94674a;
--color-black-dark-1: #0f1623;
/* dark 2 variants produced via Sass scale-color(color, $lightness: -20%) */
--color-red-dark-2: #941616;
--color-orange-dark-2: #bb460a;
--color-yellow-dark-2: #ca8a04;
--color-olive-dark-2: #91a313;
--color-green-dark-2: #15803d;
--color-teal-dark-2: #0a766d;
--color-blue-dark-2: #2563eb;
--color-violet-dark-2: #5c14d8;
--color-purple-dark-2: #7c3aed;
--color-pink-dark-2: #b11d5f;
--color-brown-dark-2: #a47252;
--color-black-dark-2: #111827;
/* other colors */ /* other colors */
--color-gold: #b1983b; --color-gold: #b1983b;
--color-white: #ffffff; --color-white: #ffffff;
@ -226,13 +256,15 @@ i.grey.icon.icon.icon.icon {
} }
.ui.red.button, .ui.red.button,
.ui.negative.button { .ui.negative.button {
background-color: #7f1d1d !important; background-color: #7f1d1d;
color: #fff !important;
border-color: var(--color-light-border) !important;
} }
.ui.red.button:hover, .ui.red.button:hover,
.ui.negative.button:hover { .ui.negative.button:hover {
background-color: #991b1b !important; background-color: #991b1b;
}
.ui.red.button:active,
.ui.negative.button:active {
background-color: #aa1919;
} }
.ui.secondary.vertical.menu { .ui.secondary.vertical.menu {
border-radius: 0.28571429rem !important; border-radius: 0.28571429rem !important;

View file

@ -59,6 +59,8 @@
--color-primary-alpha-70: #c2410cb3; --color-primary-alpha-70: #c2410cb3;
--color-primary-alpha-80: #c2410ccc; --color-primary-alpha-80: #c2410ccc;
--color-primary-alpha-90: #c2410ce1; --color-primary-alpha-90: #c2410ce1;
--color-primary-hover: var(--color-primary-dark-2);
--color-primary-active: var(--color-primary-dark-4);
--color-secondary: var(--zinc-200); --color-secondary: var(--zinc-200);
--color-secondary-dark-1: var(--zinc-200); --color-secondary-dark-1: var(--zinc-200);
--color-secondary-dark-2: var(--zinc-300); --color-secondary-dark-2: var(--zinc-300);
@ -86,6 +88,8 @@
--color-secondary-alpha-70: #d4d4d8b3; --color-secondary-alpha-70: #d4d4d8b3;
--color-secondary-alpha-80: #d4d4d8cc; --color-secondary-alpha-80: #d4d4d8cc;
--color-secondary-alpha-90: #d4d4d8e1; --color-secondary-alpha-90: #d4d4d8e1;
--color-secondary-hover: var(--color-secondary-dark-2);
--color-secondary-active: var(--color-secondary-dark-4);
/* colors */ /* colors */
--color-red: #dc2626; --color-red: #dc2626;
--color-orange: #ea580c; --color-orange: #ea580c;
@ -114,6 +118,32 @@
--color-brown-light: #94674a; --color-brown-light: #94674a;
--color-grey-light: #6b7280; --color-grey-light: #6b7280;
--color-black-light: #181818; --color-black-light: #181818;
/* dark 1 variants - produced via Sass scale-color(color, $lightness: -10%) */
--color-red-dark-1: #c82020;
--color-orange-dark-1: #d34f0b;
--color-yellow-dark-1: #b67c04;
--color-olive-dark-1: #839311;
--color-green-dark-1: #137337;
--color-teal-dark-1: #0c857a;
--color-blue-dark-1: #1554e0;
--color-violet-dark-1: #6a1feb;
--color-purple-dark-1: #8519e7;
--color-pink-dark-1: #c7216b;
--color-brown-dark-1: #94674a;
--color-black-dark-1: #000000;
/* dark 2 variants - produced via Sass scale-color(color, $lightness: -20%) */
--color-red-dark-2: #b21d1d;
--color-orange-dark-2: #bb460a;
--color-yellow-dark-2: #a26e03;
--color-olive-dark-2: #74820f;
--color-green-dark-2: #116631;
--color-teal-dark-2: #0a766d;
--color-blue-dark-2: #124bc7;
--color-violet-dark-2: #5c14d8;
--color-purple-dark-2: #7715cf;
--color-pink-dark-2: #b11d5f;
--color-brown-dark-2: #835b42;
--color-black-dark-2: #000000;
/* other colors */ /* other colors */
--color-gold: #b1983b; --color-gold: #b1983b;
--color-white: #ffffff; --color-white: #ffffff;