Files
blog/app/globals.css
Gabriel Kaszewski 2e7309434d
All checks were successful
Build and Deploy Blog / build-and-deploy-local (push) Successful in 43s
Add cursor hiding effect for improved user experience
2025-09-04 00:37:41 +02:00

67 lines
1.5 KiB
CSS

@import "tailwindcss";
@plugin "@tailwindcss/typography";
:root {
--background: #ffffff;
--foreground: #171717;
}
@theme {
--color-aero-blue: #7cb9e8;
--color-aero-green: #8ff0a4;
--color-sky-blue: #87ceeb;
--color-grass-green: #7cfc00;
--color-water: #00bfff;
--color-window-title: #0058e1;
--background-start: var(--color-sky-blue);
--background-end: var(--color-lime-300);
--font-display: var(--font-frutiger), "Arial", "Helvetica", "sans-serif";
}
@theme inline {
--color-background: var(--background);
--color-foreground: var(--foreground);
--font-sans: var(--font-geist-sans);
--font-mono: var(--font-geist-mono);
}
@media (prefers-color-scheme: dark) {
:root {
--background: #0a0a0a;
--foreground: #ededed;
}
}
body {
background-color: #3cb1e7;
background-image:
/* A subtle white radial gradient for a "lens flare" or glossy spot effect */ radial-gradient(
circle at 10% 20%,
rgba(255, 255, 255, 0.4) 0%,
rgba(255, 255, 255, 0) 25%
),
/* The main blue sky gradient */
linear-gradient(to bottom, #54c5f9 0%, #87e0fd 70%),
/* The green hill at the bottom */
radial-gradient(circle at 50% 100%, #9cff9c 0%, #3cdc5c 40%, #24a844 80%);
background-attachment: fixed;
min-height: 100vh;
color: #333;
}
::selection {
background-color: #0058e1;
color: white;
}
.window-shadow {
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2), 0 1px 3px rgba(0, 0, 0, 0.1);
}
.hide-native-cursor,
.hide-native-cursor * {
cursor: none;
}