mirror of
https://github.com/Termix-SSH/Termix.git
synced 2026-07-15 21:03:47 +00:00
fix: font legibility (#1019)
* chore: fix release workflow to merge docs branch * fix: svg donation generator push fail * fix: svg donation generator push fail * Update termix.rb * fix: svg donation generator push fail * chore: move donation badge to badges branch to avoid ruleset conflicts * chore: remove unneeded token from donation badge workflow * chore: debug donation badge commit step * fix: escape < character in donation SVG * fix: point donation badge to badges branch * chore: remove unused donation badge svg from main * Add Rack Genius logo to README Added Rack Genius logo to the README. * chore: improve donation goal svg generator to include stablecoins * chore: donation goal generator syntax error * chore: donation goal generator incorrect docs url usage * fix: font legibility Text was entirely unreadable in places for me. Especially with themes like Catppuccin. The muted-foreground text and the tags too similiar to the background. --------- Co-authored-by: LukeGus <bugattiguy527@gmail.com> Co-authored-by: Luke Gustafson <88517757+LukeGus@users.noreply.github.com> Co-authored-by: russell <git@0896c69e.com>
This commit is contained in:
Russell Poovey
+124
-122
@@ -176,24 +176,24 @@
|
|||||||
.dracula {
|
.dracula {
|
||||||
--background: #282a36;
|
--background: #282a36;
|
||||||
--foreground: #f8f8f2;
|
--foreground: #f8f8f2;
|
||||||
--card: #21222c;
|
--card: #2d303d;
|
||||||
--card-foreground: #f8f8f2;
|
--card-foreground: #f8f8f2;
|
||||||
--popover: #21222c;
|
--popover: #2d303d;
|
||||||
--popover-foreground: #f8f8f2;
|
--popover-foreground: #f8f8f2;
|
||||||
--primary: #f8f8f2;
|
--primary: #8be9fd;
|
||||||
--primary-foreground: #282a36;
|
--primary-foreground: #282a36;
|
||||||
--secondary: #44475a;
|
--secondary: #50536b;
|
||||||
--secondary-foreground: #f8f8f2;
|
--secondary-foreground: #f8f8f2;
|
||||||
--surface: #21222c;
|
--surface: #2d303d;
|
||||||
--surface-dim: #191a21;
|
--surface-dim: #21222c;
|
||||||
--muted: #44475a;
|
--muted: #50536b;
|
||||||
--muted-foreground: #6272a4;
|
--muted-foreground: #a8b3d9;
|
||||||
--accent: #44475a;
|
--accent: #5a5e7a;
|
||||||
--accent-foreground: #f8f8f2;
|
--accent-foreground: #f8f8f2;
|
||||||
--destructive: #ff5555;
|
--destructive: #ff5555;
|
||||||
--border: rgba(98, 114, 164, 0.25);
|
--border: rgba(168, 179, 217, 0.18);
|
||||||
--input: rgba(98, 114, 164, 0.2);
|
--input: rgba(168, 179, 217, 0.14);
|
||||||
--ring: #6272a4;
|
--ring: #8be9fd;
|
||||||
--chart-1: #ff79c6;
|
--chart-1: #ff79c6;
|
||||||
--chart-2: #8be9fd;
|
--chart-2: #8be9fd;
|
||||||
--chart-3: #50fa7b;
|
--chart-3: #50fa7b;
|
||||||
@@ -202,36 +202,36 @@
|
|||||||
--radius: 0.625rem;
|
--radius: 0.625rem;
|
||||||
--sidebar: #21222c;
|
--sidebar: #21222c;
|
||||||
--sidebar-foreground: #f8f8f2;
|
--sidebar-foreground: #f8f8f2;
|
||||||
--sidebar-primary: #bd93f9;
|
--sidebar-primary: #8be9fd;
|
||||||
--sidebar-primary-foreground: #282a36;
|
--sidebar-primary-foreground: #282a36;
|
||||||
--sidebar-accent: #44475a;
|
--sidebar-accent: #5a5e7a;
|
||||||
--sidebar-accent-foreground: #f8f8f2;
|
--sidebar-accent-foreground: #f8f8f2;
|
||||||
--sidebar-border: rgba(98, 114, 164, 0.25);
|
--sidebar-border: rgba(168, 179, 217, 0.18);
|
||||||
--sidebar-ring: #6272a4;
|
--sidebar-ring: #8be9fd;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ── Catppuccin Mocha ───────────────────────────────────────── */
|
/* ── Catppuccin Mocha ───────────────────────────────────────── */
|
||||||
.catppuccin {
|
.catppuccin {
|
||||||
--background: #1e1e2e;
|
--background: #1e1e2e;
|
||||||
--foreground: #cdd6f4;
|
--foreground: #cdd6f4;
|
||||||
--card: #181825;
|
--card: #202235;
|
||||||
--card-foreground: #cdd6f4;
|
--card-foreground: #cdd6f4;
|
||||||
--popover: #181825;
|
--popover: #202235;
|
||||||
--popover-foreground: #cdd6f4;
|
--popover-foreground: #cdd6f4;
|
||||||
--primary: #cdd6f4;
|
--primary: #89b4fa;
|
||||||
--primary-foreground: #1e1e2e;
|
--primary-foreground: #1e1e2e;
|
||||||
--secondary: #313244;
|
--secondary: #3b3d52;
|
||||||
--secondary-foreground: #cdd6f4;
|
--secondary-foreground: #cdd6f4;
|
||||||
--surface: #181825;
|
--surface: #202235;
|
||||||
--surface-dim: #11111b;
|
--surface-dim: #181825;
|
||||||
--muted: #313244;
|
--muted: #3b3d52;
|
||||||
--muted-foreground: #6c7086;
|
--muted-foreground: #b8c0e0;
|
||||||
--accent: #313244;
|
--accent: #45475a;
|
||||||
--accent-foreground: #cdd6f4;
|
--accent-foreground: #cdd6f4;
|
||||||
--destructive: #f38ba8;
|
--destructive: #f38ba8;
|
||||||
--border: rgba(108, 112, 134, 0.25);
|
--border: rgba(186, 194, 222, 0.18);
|
||||||
--input: rgba(108, 112, 134, 0.2);
|
--input: rgba(186, 194, 222, 0.14);
|
||||||
--ring: #6c7086;
|
--ring: #89b4fa;
|
||||||
--chart-1: #f38ba8;
|
--chart-1: #f38ba8;
|
||||||
--chart-2: #89dceb;
|
--chart-2: #89dceb;
|
||||||
--chart-3: #a6e3a1;
|
--chart-3: #a6e3a1;
|
||||||
@@ -240,35 +240,35 @@
|
|||||||
--radius: 0.625rem;
|
--radius: 0.625rem;
|
||||||
--sidebar: #181825;
|
--sidebar: #181825;
|
||||||
--sidebar-foreground: #cdd6f4;
|
--sidebar-foreground: #cdd6f4;
|
||||||
--sidebar-primary: #cba6f7;
|
--sidebar-primary: #89b4fa;
|
||||||
--sidebar-primary-foreground: #1e1e2e;
|
--sidebar-primary-foreground: #1e1e2e;
|
||||||
--sidebar-accent: #313244;
|
--sidebar-accent: #45475a;
|
||||||
--sidebar-accent-foreground: #cdd6f4;
|
--sidebar-accent-foreground: #cdd6f4;
|
||||||
--sidebar-border: rgba(108, 112, 134, 0.25);
|
--sidebar-border: rgba(186, 194, 222, 0.18);
|
||||||
--sidebar-ring: #6c7086;
|
--sidebar-ring: #89b4fa;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ── Nord ───────────────────────────────────────────────────── */
|
/* ── Nord ───────────────────────────────────────────────────── */
|
||||||
.nord {
|
.nord {
|
||||||
--background: #2e3440;
|
--background: #2e3440;
|
||||||
--foreground: #eceff4;
|
--foreground: #eceff4;
|
||||||
--card: #303642;
|
--card: #353c4a;
|
||||||
--card-foreground: #eceff4;
|
--card-foreground: #eceff4;
|
||||||
--popover: #303642;
|
--popover: #353c4a;
|
||||||
--popover-foreground: #eceff4;
|
--popover-foreground: #eceff4;
|
||||||
--primary: #eceff4;
|
--primary: #88c0d0;
|
||||||
--primary-foreground: #2e3440;
|
--primary-foreground: #2e3440;
|
||||||
--secondary: #3b4252;
|
--secondary: #434c5e;
|
||||||
--secondary-foreground: #eceff4;
|
--secondary-foreground: #eceff4;
|
||||||
--surface: #303642;
|
--surface: #353c4a;
|
||||||
--surface-dim: #262b35;
|
--surface-dim: #2a303b;
|
||||||
--muted: #3b4252;
|
--muted: #434c5e;
|
||||||
--muted-foreground: #8899b0;
|
--muted-foreground: #b4c0d4;
|
||||||
--accent: #3b4252;
|
--accent: #4c566a;
|
||||||
--accent-foreground: #eceff4;
|
--accent-foreground: #eceff4;
|
||||||
--destructive: #bf616a;
|
--destructive: #bf616a;
|
||||||
--border: rgba(136, 192, 208, 0.2);
|
--border: rgba(180, 192, 212, 0.18);
|
||||||
--input: rgba(136, 192, 208, 0.15);
|
--input: rgba(180, 192, 212, 0.14);
|
||||||
--ring: #88c0d0;
|
--ring: #88c0d0;
|
||||||
--chart-1: #bf616a;
|
--chart-1: #bf616a;
|
||||||
--chart-2: #88c0d0;
|
--chart-2: #88c0d0;
|
||||||
@@ -276,38 +276,38 @@
|
|||||||
--chart-4: #ebcb8b;
|
--chart-4: #ebcb8b;
|
||||||
--chart-5: #b48ead;
|
--chart-5: #b48ead;
|
||||||
--radius: 0.625rem;
|
--radius: 0.625rem;
|
||||||
--sidebar: #282d39;
|
--sidebar: #2a303b;
|
||||||
--sidebar-foreground: #eceff4;
|
--sidebar-foreground: #eceff4;
|
||||||
--sidebar-primary: #88c0d0;
|
--sidebar-primary: #88c0d0;
|
||||||
--sidebar-primary-foreground: #2e3440;
|
--sidebar-primary-foreground: #2e3440;
|
||||||
--sidebar-accent: #3b4252;
|
--sidebar-accent: #4c566a;
|
||||||
--sidebar-accent-foreground: #eceff4;
|
--sidebar-accent-foreground: #eceff4;
|
||||||
--sidebar-border: rgba(136, 192, 208, 0.2);
|
--sidebar-border: rgba(180, 192, 212, 0.18);
|
||||||
--sidebar-ring: #88c0d0;
|
--sidebar-ring: #88c0d0;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ── Solarized Dark ─────────────────────────────────────────── */
|
/* ── Solarized Dark ─────────────────────────────────────────── */
|
||||||
.solarized {
|
.solarized {
|
||||||
--background: #002b36;
|
--background: #002b36;
|
||||||
--foreground: #839496;
|
--foreground: #b7c4c4;
|
||||||
--card: #073642;
|
--card: #073642;
|
||||||
--card-foreground: #93a1a1;
|
--card-foreground: #b7c4c4;
|
||||||
--popover: #073642;
|
--popover: #073642;
|
||||||
--popover-foreground: #93a1a1;
|
--popover-foreground: #b7c4c4;
|
||||||
--primary: #93a1a1;
|
--primary: #268bd2;
|
||||||
--primary-foreground: #002b36;
|
--primary-foreground: #002b36;
|
||||||
--secondary: #073642;
|
--secondary: #0b4654;
|
||||||
--secondary-foreground: #839496;
|
--secondary-foreground: #b7c4c4;
|
||||||
--surface: #073642;
|
--surface: #073642;
|
||||||
--surface-dim: #00212b;
|
--surface-dim: #00212b;
|
||||||
--muted: #073642;
|
--muted: #0b4654;
|
||||||
--muted-foreground: #586e75;
|
--muted-foreground: #9fb3b3;
|
||||||
--accent: #073642;
|
--accent: #105667;
|
||||||
--accent-foreground: #93a1a1;
|
--accent-foreground: #d5dddd;
|
||||||
--destructive: #dc322f;
|
--destructive: #dc322f;
|
||||||
--border: rgba(88, 110, 117, 0.3);
|
--border: rgba(159, 179, 179, 0.2);
|
||||||
--input: rgba(88, 110, 117, 0.25);
|
--input: rgba(159, 179, 179, 0.16);
|
||||||
--ring: #586e75;
|
--ring: #268bd2;
|
||||||
--chart-1: #dc322f;
|
--chart-1: #dc322f;
|
||||||
--chart-2: #2aa198;
|
--chart-2: #2aa198;
|
||||||
--chart-3: #859900;
|
--chart-3: #859900;
|
||||||
@@ -315,37 +315,38 @@
|
|||||||
--chart-5: #6c71c4;
|
--chart-5: #6c71c4;
|
||||||
--radius: 0.625rem;
|
--radius: 0.625rem;
|
||||||
--sidebar: #073642;
|
--sidebar: #073642;
|
||||||
--sidebar-foreground: #93a1a1;
|
--sidebar-foreground: #b7c4c4;
|
||||||
--sidebar-primary: #268bd2;
|
--sidebar-primary: #268bd2;
|
||||||
--sidebar-primary-foreground: #002b36;
|
--sidebar-primary-foreground: #002b36;
|
||||||
--sidebar-accent: #073642;
|
--sidebar-accent: #105667;
|
||||||
--sidebar-accent-foreground: #93a1a1;
|
--sidebar-accent-foreground: #d5dddd;
|
||||||
--sidebar-border: rgba(88, 110, 117, 0.3);
|
--sidebar-border: rgba(159, 179, 179, 0.2);
|
||||||
--sidebar-ring: #586e75;
|
--sidebar-ring: #268bd2;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ── Tokyo Night ────────────────────────────────────────────── */
|
/* ── Tokyo Night ────────────────────────────────────────────── */
|
||||||
|
|
||||||
.tokyo-night {
|
.tokyo-night {
|
||||||
--background: #1a1b26;
|
--background: #1a1b26;
|
||||||
--foreground: #a9b1d6;
|
--foreground: #c0caf5;
|
||||||
--card: #16161e;
|
--card: #1f2335;
|
||||||
--card-foreground: #a9b1d6;
|
--card-foreground: #c0caf5;
|
||||||
--popover: #16161e;
|
--popover: #1f2335;
|
||||||
--popover-foreground: #a9b1d6;
|
--popover-foreground: #c0caf5;
|
||||||
--primary: #a9b1d6;
|
--primary: #7aa2f7;
|
||||||
--primary-foreground: #1a1b26;
|
--primary-foreground: #1a1b26;
|
||||||
--secondary: #24283b;
|
--secondary: #2a2f47;
|
||||||
--secondary-foreground: #a9b1d6;
|
--secondary-foreground: #c0caf5;
|
||||||
--surface: #16161e;
|
--surface: #1f2335;
|
||||||
--surface-dim: #13131a;
|
--surface-dim: #16161e;
|
||||||
--muted: #24283b;
|
--muted: #2a2f47;
|
||||||
--muted-foreground: #565f89;
|
--muted-foreground: #8b93bd;
|
||||||
--accent: #24283b;
|
--accent: #2f3654;
|
||||||
--accent-foreground: #a9b1d6;
|
--accent-foreground: #c0caf5;
|
||||||
--destructive: #f7768e;
|
--destructive: #f7768e;
|
||||||
--border: rgba(86, 95, 137, 0.25);
|
--border: rgba(139, 147, 189, 0.2);
|
||||||
--input: rgba(86, 95, 137, 0.2);
|
--input: rgba(139, 147, 189, 0.16);
|
||||||
--ring: #565f89;
|
--ring: #7aa2f7;
|
||||||
--chart-1: #f7768e;
|
--chart-1: #f7768e;
|
||||||
--chart-2: #7dcfff;
|
--chart-2: #7dcfff;
|
||||||
--chart-3: #9ece6a;
|
--chart-3: #9ece6a;
|
||||||
@@ -353,37 +354,37 @@
|
|||||||
--chart-5: #bb9af7;
|
--chart-5: #bb9af7;
|
||||||
--radius: 0.625rem;
|
--radius: 0.625rem;
|
||||||
--sidebar: #16161e;
|
--sidebar: #16161e;
|
||||||
--sidebar-foreground: #a9b1d6;
|
--sidebar-foreground: #c0caf5;
|
||||||
--sidebar-primary: #7aa2f7;
|
--sidebar-primary: #7aa2f7;
|
||||||
--sidebar-primary-foreground: #1a1b26;
|
--sidebar-primary-foreground: #1a1b26;
|
||||||
--sidebar-accent: #24283b;
|
--sidebar-accent: #2f3654;
|
||||||
--sidebar-accent-foreground: #a9b1d6;
|
--sidebar-accent-foreground: #c0caf5;
|
||||||
--sidebar-border: rgba(86, 95, 137, 0.25);
|
--sidebar-border: rgba(139, 147, 189, 0.2);
|
||||||
--sidebar-ring: #565f89;
|
--sidebar-ring: #7aa2f7;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ── One Dark ───────────────────────────────────────────────── */
|
/* ── One Dark ───────────────────────────────────────────────── */
|
||||||
.one-dark {
|
.one-dark {
|
||||||
--background: #282c34;
|
--background: #282c34;
|
||||||
--foreground: #abb2bf;
|
--foreground: #abb2bf;
|
||||||
--card: #21252b;
|
--card: #2f343d;
|
||||||
--card-foreground: #abb2bf;
|
--card-foreground: #abb2bf;
|
||||||
--popover: #21252b;
|
--popover: #2f343d;
|
||||||
--popover-foreground: #abb2bf;
|
--popover-foreground: #abb2bf;
|
||||||
--primary: #abb2bf;
|
--primary: #61afef;
|
||||||
--primary-foreground: #282c34;
|
--primary-foreground: #282c34;
|
||||||
--secondary: #2c313a;
|
--secondary: #3a404b;
|
||||||
--secondary-foreground: #abb2bf;
|
--secondary-foreground: #abb2bf;
|
||||||
--surface: #21252b;
|
--surface: #2f343d;
|
||||||
--surface-dim: #1b1f23;
|
--surface-dim: #21252b;
|
||||||
--muted: #2c313a;
|
--muted: #3a404b;
|
||||||
--muted-foreground: #5c6370;
|
--muted-foreground: #9aa3b2;
|
||||||
--accent: #2c313a;
|
--accent: #424957;
|
||||||
--accent-foreground: #abb2bf;
|
--accent-foreground: #abb2bf;
|
||||||
--destructive: #e06c75;
|
--destructive: #e06c75;
|
||||||
--border: rgba(92, 99, 112, 0.25);
|
--border: rgba(154, 163, 178, 0.18);
|
||||||
--input: rgba(92, 99, 112, 0.2);
|
--input: rgba(154, 163, 178, 0.14);
|
||||||
--ring: #5c6370;
|
--ring: #61afef;
|
||||||
--chart-1: #e06c75;
|
--chart-1: #e06c75;
|
||||||
--chart-2: #56b6c2;
|
--chart-2: #56b6c2;
|
||||||
--chart-3: #98c379;
|
--chart-3: #98c379;
|
||||||
@@ -394,48 +395,49 @@
|
|||||||
--sidebar-foreground: #abb2bf;
|
--sidebar-foreground: #abb2bf;
|
||||||
--sidebar-primary: #61afef;
|
--sidebar-primary: #61afef;
|
||||||
--sidebar-primary-foreground: #282c34;
|
--sidebar-primary-foreground: #282c34;
|
||||||
--sidebar-accent: #2c313a;
|
--sidebar-accent: #424957;
|
||||||
--sidebar-accent-foreground: #abb2bf;
|
--sidebar-accent-foreground: #abb2bf;
|
||||||
--sidebar-border: rgba(92, 99, 112, 0.25);
|
--sidebar-border: rgba(154, 163, 178, 0.18);
|
||||||
--sidebar-ring: #5c6370;
|
--sidebar-ring: #61afef;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ── Gruvbox Dark ───────────────────────────────────────────── */
|
/* ── Gruvbox Dark ───────────────────────────────────────────── */
|
||||||
|
|
||||||
.gruvbox {
|
.gruvbox {
|
||||||
--background: #282828;
|
--background: #282828;
|
||||||
--foreground: #ebdbb2;
|
--foreground: #ebdbb2;
|
||||||
--card: #1d2021;
|
--card: #32302f;
|
||||||
--card-foreground: #ebdbb2;
|
--card-foreground: #ebdbb2;
|
||||||
--popover: #1d2021;
|
--popover: #32302f;
|
||||||
--popover-foreground: #ebdbb2;
|
--popover-foreground: #ebdbb2;
|
||||||
--primary: #ebdbb2;
|
--primary: #fabd2f;
|
||||||
--primary-foreground: #282828;
|
--primary-foreground: #282828;
|
||||||
--secondary: #3c3836;
|
--secondary: #45403d;
|
||||||
--secondary-foreground: #ebdbb2;
|
--secondary-foreground: #ebdbb2;
|
||||||
--surface: #1d2021;
|
--surface: #32302f;
|
||||||
--surface-dim: #181a1a;
|
--surface-dim: #1d2021;
|
||||||
--muted: #3c3836;
|
--muted: #45403d;
|
||||||
--muted-foreground: #928374;
|
--muted-foreground: #c4b59d;
|
||||||
--accent: #3c3836;
|
--accent: #504945;
|
||||||
--accent-foreground: #ebdbb2;
|
--accent-foreground: #ebdbb2;
|
||||||
--destructive: #cc241d;
|
--destructive: #fb4934;
|
||||||
--border: rgba(146, 131, 116, 0.2);
|
--border: rgba(196, 181, 157, 0.18);
|
||||||
--input: rgba(146, 131, 116, 0.15);
|
--input: rgba(196, 181, 157, 0.14);
|
||||||
--ring: #928374;
|
--ring: #fabd2f;
|
||||||
--chart-1: #cc241d;
|
--chart-1: #fb4934;
|
||||||
--chart-2: #689d6a;
|
--chart-2: #8ec07c;
|
||||||
--chart-3: #98971a;
|
--chart-3: #b8bb26;
|
||||||
--chart-4: #d79921;
|
--chart-4: #fabd2f;
|
||||||
--chart-5: #b16286;
|
--chart-5: #d3869b;
|
||||||
--radius: 0.625rem;
|
--radius: 0.625rem;
|
||||||
--sidebar: #1d2021;
|
--sidebar: #1d2021;
|
||||||
--sidebar-foreground: #ebdbb2;
|
--sidebar-foreground: #ebdbb2;
|
||||||
--sidebar-primary: #fabd2f;
|
--sidebar-primary: #fabd2f;
|
||||||
--sidebar-primary-foreground: #282828;
|
--sidebar-primary-foreground: #282828;
|
||||||
--sidebar-accent: #3c3836;
|
--sidebar-accent: #504945;
|
||||||
--sidebar-accent-foreground: #ebdbb2;
|
--sidebar-accent-foreground: #ebdbb2;
|
||||||
--sidebar-border: rgba(146, 131, 116, 0.2);
|
--sidebar-border: rgba(196, 181, 157, 0.18);
|
||||||
--sidebar-ring: #928374;
|
--sidebar-ring: #fabd2f;
|
||||||
}
|
}
|
||||||
|
|
||||||
@layer base {
|
@layer base {
|
||||||
|
|||||||
Reference in New Issue
Block a user