mirror of
https://github.com/tiennm99/loto.git
synced 2026-08-31 04:30:03 +00:00
tiennm99
7f25a8e462
Replace vanilla HTML/JS/CSS with Next.js App Router, TypeScript, and Tailwind CSS. Responsive design with dark mode support. All original game logic preserved: grid generation, click-to-cross, localStorage persistence.
45 lines
831 B
CSS
45 lines
831 B
CSS
@import "tailwindcss";
|
|
|
|
:root {
|
|
--background: #fafaf9;
|
|
--foreground: #1c1917;
|
|
}
|
|
|
|
@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: #0c0a09;
|
|
--foreground: #e7e5e4;
|
|
}
|
|
}
|
|
|
|
body {
|
|
background: var(--background);
|
|
color: var(--foreground);
|
|
font-family: var(--font-sans), Arial, Helvetica, sans-serif;
|
|
}
|
|
|
|
/* Crossed cell diagonal line */
|
|
.cell-crossed {
|
|
position: relative;
|
|
}
|
|
|
|
.cell-crossed::after {
|
|
content: "";
|
|
position: absolute;
|
|
inset: 4px;
|
|
background-image: linear-gradient(
|
|
to bottom right,
|
|
transparent calc(50% - 1.5px),
|
|
currentColor,
|
|
transparent calc(50% + 1.5px)
|
|
);
|
|
pointer-events: none;
|
|
}
|