DHBW-WE/MeetUp
5
0
Fork 0
Code Issues 7 Pull requests 5 Projects 1 Releases 5 Packages 1 Wiki Activity Actions

feat: add button font and enhance muted color variables for improved accessibility

Browse source
This commit is contained in:
Maximilian Liebmann 2025-05-30 19:46:53 +02:00
parent 327b984974
commit 7cefd39652
1 changed files with 22 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

26
src/app/globals.css
View file

@ -8,6 +8,7 @@
--font-heading: 'Comfortaa', sans-serif; --font-heading: 'Comfortaa', sans-serif;
--font-label: 'Varela Round', sans-serif; --font-label: 'Varela Round', sans-serif;
--font-button: 'Varela Round', sans-serif;
--transparent: transparent; --transparent: transparent;
@ -26,6 +27,7 @@
--neutral-900: oklch(1 0 0); --neutral-900: oklch(1 0 0);
--background: var(--neutral-800); --background: var(--neutral-800);
--background-reversed: var(--neutral-000);
--base: var(--neutral-800); --base: var(--neutral-800);
--text: var(--neutral-000); --text: var(--neutral-000);
--text-alt: var(--neutral-900); --text-alt: var(--neutral-900);
@ -46,6 +48,11 @@
--active-secondary: oklch(0.4254 0.133 272.15); --active-secondary: oklch(0.4254 0.133 272.15);
--disabled-secondary: oklch(0.4937 0.1697 271.26 / 0.5); --disabled-secondary: oklch(0.4937 0.1697 271.26 / 0.5);
--muted: var(--color-neutral-700);
--hover-muted: var(--color-neutral-600);
--active-muted: var(--color-neutral-400);
--disabled-muted: var(--color-neutral-400);
--card: var(--neutral-800); --card: var(--neutral-800);
/* ------------------- */ /* ------------------- */
@ -64,8 +71,6 @@
--secondary-foreground: oklch(0.21 0.034 264.665); --secondary-foreground: oklch(0.21 0.034 264.665);
--muted: oklch(0.967 0.003 264.542);
--muted-foreground: oklch(0.551 0.027 264.364); --muted-foreground: oklch(0.551 0.027 264.364);
--accent: oklch(0.967 0.003 264.542); --accent: oklch(0.967 0.003 264.542);
@ -125,6 +130,7 @@
@theme inline { @theme inline {
--font-heading: var(--font-heading); --font-heading: var(--font-heading);
--font-label: var(--font-label); --font-label: var(--font-label);
--font-button: var(--font-button);
--transparent: var(--transparent); --transparent: var(--transparent);
@ -136,12 +142,14 @@
--color-neutral-400: var(--neutral-400); --color-neutral-400: var(--neutral-400);
--color-neutral-500: var(--neutral-500); --color-neutral-500: var(--neutral-500);
--color-neutral-600: var(--neutral-600); --color-neutral-600: var(--neutral-600);
--color-neutral-650: var(--neutral-650);
--color-neutral-700: var(--neutral-700); --color-neutral-700: var(--neutral-700);
--color-neutral-750: var(--neutral-750); --color-neutral-750: var(--neutral-750);
--color-neutral-800: var(--neutral-800); --color-neutral-800: var(--neutral-800);
--color-neutral-900: var(--neutral-900); --color-neutral-900: var(--neutral-900);
--color-background: var(--neutral-750); --color-background: var(--neutral-750);
--color-background-reversed: var(--background-reversed);
--color-base: var(--neutral-800); --color-base: var(--neutral-800);
--color-text: var(--text); --color-text: var(--text);
--color-text-alt: var(--text-alt); --color-text-alt: var(--text-alt);
@ -163,6 +171,11 @@
--color-active-secondary: var(--active-secondary); --color-active-secondary: var(--active-secondary);
--color-disabled-secondary: var(--disabled-secondary); --color-disabled-secondary: var(--disabled-secondary);
--color-muted: var(--muted);
--color-hover-muted: var(--hover-muted);
--color-active-muted: var(--active-muted);
--color-disabled-muted: var(--disabled-muted);
/* Custom values */ /* Custom values */
--radius-sm: calc(var(--radius) - 4px); --radius-sm: calc(var(--radius) - 4px);
@ -252,12 +265,14 @@
--neutral-450: oklch(0.6 0 0); --neutral-450: oklch(0.6 0 0);
--neutral-500: oklch(0.5486 0 0); --neutral-500: oklch(0.5486 0 0);
--neutral-600: oklch(0.4495 0 0); --neutral-600: oklch(0.4495 0 0);
--neutral-650: oklch(0.425 0 0);
--neutral-700: oklch(0.3407 0 0); --neutral-700: oklch(0.3407 0 0);
--neutral-750: oklch(0.2972 0 0); --neutral-750: oklch(0.2972 0 0);
--neutral-800: oklch(0.2264 0 0); --neutral-800: oklch(0.2264 0 0);
--neutral-900: oklch(0 0 0); --neutral-900: oklch(0 0 0);
--background: var(--neutral-750); --background: var(--neutral-750);
--background-reversed: var(--neutral-000);
--base: var(--neutral-750); --base: var(--neutral-750);
--text: var(--neutral-000); --text: var(--neutral-000);
--text-alt: var(--neutral-900); --text-alt: var(--neutral-900);
@ -277,6 +292,11 @@
--active-secondary: oklch(0.4471 0.15 271.61); --active-secondary: oklch(0.4471 0.15 271.61);
--disabled-secondary: oklch(0.6065 0.213 271.11 / 0.4); --disabled-secondary: oklch(0.6065 0.213 271.11 / 0.4);
--muted: var(--color-neutral-650);
--hover-muted: var(--color-neutral-500);
--active-muted: var(--color-neutral-400);
--disabled-muted: var(--color-neutral-400);
--card: var(--neutral-750); --card: var(--neutral-750);
/* ------------------- */ /* ------------------- */
@ -295,8 +315,6 @@
--secondary-foreground: oklch(0.985 0.002 247.839); --secondary-foreground: oklch(0.985 0.002 247.839);
--muted: oklch(0.278 0.033 256.848);
--muted-foreground: oklch(0.707 0.022 261.325); --muted-foreground: oklch(0.707 0.022 261.325);
--accent: oklch(0.278 0.033 256.848); --accent: oklch(0.278 0.033 256.848);