Joururi/leim-tools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Moved event and colored element logic to css variables

Browse Source
This commit is contained in:
Alexis
2025-04-16 19:52:19 +02:00
parent 3e973dd0e9
commit 687b96cf12
8 changed files with 408 additions and 117 deletions
Download Patch File Download Diff File Expand all files Collapse all files

96
assets/main.css
View File

@@ -2,6 +2,10 @@
@config '../tailwind.config.js';
@import "./theme.css" layer(theme);
@import "./_events.css" layer(theme);
@import "./_events.css" layer(utilities);
/*
The default border color has changed to `currentcolor` in Tailwind CSS v4,
so we've added these compatibility styles to make sure everything still
@@ -20,91 +24,13 @@
}
}
@layer base {
:root {
--background: 0 0% 100%;
--foreground: 222.2 84% 4.9%;
--muted: 210 40% 96.1%;
--muted-foreground: 215.4 16.3% 46.9%;
--popover: 0 0% 100%;
--popover-foreground: 222.2 84% 4.9%;
--card: 0 0% 100%;
--card-foreground: 222.2 84% 4.9%;
--border: 214.3 31.8% 91.4%;
--input: 214.3 31.8% 91.4%;
--primary: 245 58% 51%;
--primary-foreground: 0 0% 100%;
--secondary: 210 50% 95%;
--secondary-foreground: 222.2 47.4% 11.2%;
--accent: 210 40% 96.1%;
--accent-foreground: 222.2 47.4% 11.2%;
--destructive: 0 84.2% 60.2%;
--destructive-foreground: 210 40% 98%;
--success: 156 72% 67%;
--success-muted: 156 72% 90%;
--success-foreground: 222.2 84% 4.9%;
--ring: 222.2 84% 4.9%;
--radius: 0.5rem;
}
.dark {
--background: 180 0 4.9%;
--foreground: 210 40% 98%;
--muted: 244 47% 20%;
--muted-foreground: 215 20.2% 65.1%;
--popover: 180 0 4.9%;
--popover-foreground: 210 40% 98%;
--card: 180 0 4.9%;
--card-foreground: 210 40% 98%;
--border: 217 0 10%;
--input: 244 47% 20%;
--primary: 245 58% 51%;
--primary-foreground: 0 0% 100%;
--secondary: 244 47% 20%;
--secondary-foreground: 210 40% 98%;
--accent: 244 47% 20%;
--accent-foreground: 210 40% 98%;
--destructive: 0 62.8% 30.6%;
--destructive-foreground: 210 40% 98%;
--success: 142 72% 29%;
--success-muted: 142 72% 10%;
--success-foreground: 210 40% 98%;
--ring: 212.7 26.8% 83.9%;
}
}
@layer base {
* {
@apply border-border;
}
body {
@apply bg-background text-foreground;
}
body {
color: var(--color-foreground);
background-color: var(--color-background);
}
/* Colors */
.event-red:not(.is-hidden) {
/* .event-red:not(.is-hidden) {
@apply text-slate-900 bg-red-500 hover:bg-red-600 focus-visible:bg-red-600
}
.event-orange:not(.is-hidden) {
@@ -338,9 +264,9 @@
}
.event-details-white {
--base-color: var(--color-white);
}
} */
.event-details {
/* .event-details {
--bg-color: color-mix(in srgb, var(--base-color), var(--color-white) 80%);
--border-color: color-mix(in srgb, var(--base-color), var(--color-white) 50%);
background-color: var(--bg-color);
@@ -354,7 +280,7 @@
.dark .event-details {
--bg-color: color-mix(in srgb, var(--base-color), var(--color-slate-950) 80%);
--border-color: color-mix(in srgb, var(--base-color), var(--color-slate-800) 50%);
}
} */
.bgc {
display: flex;