This commit is contained in:
2025-04-09 13:14:42 +00:00
parent 755cad55de
commit 0ff97c4163
+43 -28
View File
@@ -12,17 +12,17 @@
:root {
/* Light mode variables */
--background-color-light: #ffffff;
--text-color-light: #000000;
--text-color-light: #333333;
--button-bg-light: #f0f0f0;
--button-hover-bg-light: #e0e0e0;
--button-hover-text-light: #000000;
--button-hover-bg-light: #333333;
--button-hover-text-light: #ffffff;
/* Dark mode variables (consistent with WebGames-master) */
--background-color-dark: #0d1117;
--text-color-dark: #c9d1d9;
--button-bg-dark: #21262d;
--button-hover-bg-dark: #30363d;
--button-hover-text-dark: #ffffff;
--background-color-dark: #0d0d0d;
--text-color-dark: #00ffcc;
--button-bg-dark: #1a1a1a;
--button-hover-bg-dark: #00ffcc;
--button-hover-text-dark: #0d0d0d;
}
body {
@@ -32,42 +32,57 @@
color: var(--text-color);
font-family: 'Orbitron', sans-serif;
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100vh;
overflow: hidden;
transition: background-color 0.3s, color 0.3s;
}
h1 {
font-size: 3rem;
text-transform: uppercase;
animation: glow 1.5s infinite alternate;
}
@keyframes glow {
from {
text-shadow: 0 0 10px var(--text-color), 0 0 20px var(--text-color), 0 0 30px var(--text-color), 0 0 40px var(--text-color);
}
to {
text-shadow: 0 0 20px var(--text-color), 0 0 30px var(--text-color), 0 0 40px var(--text-color), 0 0 50px var(--text-color);
}
}
.button-container {
display: flex;
gap: 20px;
margin-top: 20px;
}
.button {
padding: 10px 20px;
margin: 5px;
background-color: var(--button-bg);
padding: 15px 30px;
font-size: 1.2rem;
font-family: 'Press Start 2P', cursive;
color: var(--text-color);
border: none;
background-color: var(--button-bg);
border: 2px solid var(--text-color);
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s ease, color 0.3s ease;
text-transform: uppercase;
transition: background-color 0.3s, color 0.3s, transform 0.2s;
}
.button:hover {
background-color: var(--button-hover-bg);
color: var(--button-hover-text);
transform: scale(1.1);
}
.dark-mode-toggle {
margin-top: 20px;
padding: 10px 20px;
background-color: var(--button-bg);
color: var(--text-color);
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s ease, color 0.3s ease;
}
.dark-mode-toggle:hover {
background-color: var(--button-hover-bg);
color: var(--button-hover-text);
.button:active {
transform: scale(0.95);
}
.calendar-button {
@@ -77,7 +92,7 @@
padding: 10px 15px;
background-color: var(--button-bg);
color: var(--text-color);
border: none;
border: 2px solid var(--text-color);
border-radius: 5px;
font-size: 14px;
cursor: pointer;