dschlueter/jamulix-homepage
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Fix: Hell-Dunkel-Modus wiederhergestellt

Browse source 
- Light-Mode: Originale helle Farben beibehalten
- Dark-Mode: Fly.io-inspirierte dunkle Farben mit Pink-Akzent
- Gradient-Mesh nur im Dark-Mode sichtbar
This commit is contained in:
Dieter Schlüter 2026-04-25 05:20:47 +02:00
commit 3b6854329f
2 changed files with 33 additions and 33 deletions
Download patch file Download diff file Expand all files Collapse all files

60
app/globals.css
View file

@ -4,50 +4,50 @@
@custom-variant dark (&:is(.dark *)); @custom-variant dark (&:is(.dark *));
:root { :root {
/* Fly.io-inspired: Deep navy with vibrant accents */ /* Light mode - warm paper tones */
--background: oklch(0.08 0.02 260); --background: oklch(0.98 0.005 90);
--foreground: oklch(0.95 0.01 100); --foreground: oklch(0.18 0.01 270);
--card: oklch(0.12 0.02 260); --card: oklch(0.96 0.005 90);
--card-foreground: oklch(0.95 0.01 100); --card-foreground: oklch(0.18 0.01 270);
--popover: oklch(0.12 0.02 260); --popover: oklch(0.98 0.005 90);
--popover-foreground: oklch(0.95 0.01 100); --popover-foreground: oklch(0.18 0.01 270);
--primary: oklch(0.95 0.01 100); --primary: oklch(0.18 0.01 270);
--primary-foreground: oklch(0.08 0.02 260); --primary-foreground: oklch(0.98 0.005 90);
--secondary: oklch(0.18 0.02 260); --secondary: oklch(0.94 0.005 90);
--secondary-foreground: oklch(0.90 0.01 100); --secondary-foreground: oklch(0.25 0.01 270);
--muted: oklch(0.15 0.02 260); --muted: oklch(0.92 0.005 90);
--muted-foreground: oklch(0.65 0.01 100); --muted-foreground: oklch(0.45 0.01 270);
--accent: oklch(0.70 0.18 320); --accent: oklch(0.65 0.15 145);
--accent-foreground: oklch(0.98 0.01 100); --accent-foreground: oklch(0.15 0.02 145);
--destructive: oklch(0.396 0.141 25.723); --destructive: oklch(0.577 0.245 27.325);
--destructive-foreground: oklch(0.95 0.01 100); --destructive-foreground: oklch(0.577 0.245 27.325);
--border: oklch(0.25 0.02 260); --border: oklch(0.88 0.005 90);
--input: oklch(0.18 0.02 260); --input: oklch(0.92 0.005 90);
--ring: oklch(0.70 0.18 320); --ring: oklch(0.65 0.15 145);
--radius: 0.5rem; --radius: 0.5rem;
} }
.dark { .dark {
/* Fly.io-inspired: Deep navy with vibrant accents */ /* Fly.io-inspired: Deep navy with vibrant accents */
--background: oklch(0.08 0.02 260); --background: oklch(0.10 0.02 260);
--foreground: oklch(0.95 0.01 100); --foreground: oklch(0.95 0.01 100);
--card: oklch(0.12 0.02 260); --card: oklch(0.14 0.02 260);
--card-foreground: oklch(0.95 0.01 100); --card-foreground: oklch(0.95 0.01 100);
--popover: oklch(0.12 0.02 260); --popover: oklch(0.14 0.02 260);
--popover-foreground: oklch(0.95 0.01 100); --popover-foreground: oklch(0.95 0.01 100);
--primary: oklch(0.95 0.01 100); --primary: oklch(0.95 0.01 100);
--primary-foreground: oklch(0.08 0.02 260); --primary-foreground: oklch(0.10 0.02 260);
--secondary: oklch(0.18 0.02 260); --secondary: oklch(0.20 0.02 260);
--secondary-foreground: oklch(0.90 0.01 100); --secondary-foreground: oklch(0.90 0.01 100);
--muted: oklch(0.15 0.02 260); --muted: oklch(0.18 0.02 260);
--muted-foreground: oklch(0.65 0.01 100); --muted-foreground: oklch(0.65 0.01 100);
--accent: oklch(0.70 0.18 320); --accent: oklch(0.72 0.18 330);
--accent-foreground: oklch(0.98 0.01 100); --accent-foreground: oklch(0.98 0.01 100);
--destructive: oklch(0.396 0.141 25.723); --destructive: oklch(0.396 0.141 25.723);
--destructive-foreground: oklch(0.95 0.01 100); --destructive-foreground: oklch(0.95 0.01 100);
--border: oklch(0.25 0.02 260); --border: oklch(0.28 0.02 260);
--input: oklch(0.18 0.02 260); --input: oklch(0.20 0.02 260);
--ring: oklch(0.70 0.18 320); --ring: oklch(0.72 0.18 330);
} }
@theme inline { @theme inline {

6
components/hero.tsx
View file

@ -9,13 +9,13 @@ import { ProgrammerGraphic } from './programmer-graphic'
export function Hero() { export function Hero() {
return ( return (
<section className="relative min-h-screen flex items-center pt-20 lg:pt-0"> <section className="relative min-h-screen flex items-center pt-20 lg:pt-0">
{/* Fly.io-style gradient mesh background */} {/* Fly.io-style gradient mesh background (dark mode only) */}
<div className="absolute inset-0 bg-gradient-mesh" /> <div className="absolute inset-0 bg-gradient-mesh hidden dark:block" />
{/* Subtle grid overlay */} {/* Subtle grid overlay */}
<div className="absolute inset-0 overflow-hidden"> <div className="absolute inset-0 overflow-hidden">
<div <div
className="absolute inset-0 opacity-[0.03]" className="absolute inset-0 opacity-[0.02] dark:opacity-[0.04]"
style={{ style={{
backgroundImage: ` backgroundImage: `
linear-gradient(to right, currentColor 1px, transparent 1px), linear-gradient(to right, currentColor 1px, transparent 1px),