diff options
| author | Yuval Adam <_@yuv.al> | 2025-03-05 12:21:25 +0100 |
|---|---|---|
| committer | Yuval Adam <_@yuv.al> | 2025-03-05 12:21:25 +0100 |
| commit | 5bf781f3ac381744fbec035f938d69a201f75fa4 (patch) | |
| tree | 2ec82a90ce2cd1c279d77bdd6ca83b256ac4856a /morsehero/src/base.css | |
| parent | c6612a8b6dde5a5a9776d424ed33f5ca685699c6 (diff) | |
Replace all impl with vite
Diffstat (limited to 'morsehero/src/base.css')
| -rw-r--r-- | morsehero/src/base.css | 183 |
1 files changed, 0 insertions, 183 deletions
diff --git a/morsehero/src/base.css b/morsehero/src/base.css deleted file mode 100644 index d5afb78..0000000 --- a/morsehero/src/base.css +++ /dev/null @@ -1,183 +0,0 @@ -/* Morse Hero Base Styles */ -:root { - --primary-color: #3498db; - --primary-dark: #2980b9; - --secondary-color: #f39c12; - --secondary-dark: #e67e22; - --accent-color: #e74c3c; - --accent-dark: #c0392b; - --success-color: #2ecc71; - --success-dark: #27ae60; - --bg-dark: #2c3e50; - --bg-darker: #1a2530; - --bg-light: #34495e; - --text-light: #ecf0f1; - --text-dim: rgba(255, 255, 255, 0.7); - --border-radius-sm: 12px; - --border-radius-md: 20px; - --border-radius-lg: 30px; - --shadow-sm: 0 4px 6px rgba(0, 0, 0, 0.1); - --shadow-md: 0 10px 20px rgba(0, 0, 0, 0.15); - --shadow-lg: 0 15px 30px rgba(0, 0, 0, 0.2); - --transition-fast: 0.2s ease; - --transition-normal: 0.3s ease; -} - -* { - box-sizing: border-box; - margin: 0; - padding: 0; -} - -body { - font-family: 'Poppins', 'Fredoka', sans-serif; - margin: 0; - padding: 0; - background: radial-gradient(ellipse at top, var(--bg-dark) 0%, var(--bg-darker) 100%); - color: var(--text-light); - min-height: 100vh; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - font-size: 18px; - line-height: 1.6; -} - -.container { - max-width: 900px; - margin: 0 auto; - padding: 30px 20px; - text-align: center; - width: 100%; -} - -h1 { - color: var(--secondary-color); - text-shadow: 3px 3px 0px rgba(0, 0, 0, 0.3), - 0 0 15px rgba(243, 156, 18, 0.5); - margin-bottom: 20px; - font-family: 'Fredoka', sans-serif; - font-weight: 600; - position: relative; - display: inline-block; -} - -h1::after { - content: ""; - position: absolute; - bottom: -10px; - left: 50%; - transform: translateX(-50%); - width: 60px; - height: 4px; - background: linear-gradient(90deg, var(--accent-color), var(--secondary-color)); - border-radius: 2px; -} - -button { - cursor: pointer; - font-family: 'Poppins', 'Fredoka', sans-serif; - transition: all var(--transition-normal); - font-weight: 600; - letter-spacing: 1px; - text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.2); - border: none; - outline: none; - position: relative; - overflow: hidden; -} - -button::after { - content: ""; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: linear-gradient(rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0)); - opacity: 0; - transition: opacity var(--transition-fast); -} - -button:hover::after { - opacity: 1; -} - -.title-link { - color: inherit; - text-decoration: none; - transition: all var(--transition-normal); - position: relative; - display: inline-block; -} - -.title-link:hover { - color: var(--secondary-color); - text-shadow: 0 0 15px rgba(243, 156, 18, 0.6); -} - -.footer { - margin-top: 40px; - padding: 20px; - text-align: center; - font-size: 16px; - color: var(--text-dim); - width: 100%; - border-top: 1px solid rgba(255, 255, 255, 0.1); -} - -.footer a { - color: var(--primary-color); - text-decoration: none; - font-weight: bold; - transition: color var(--transition-normal); - position: relative; -} - -.footer a::after { - content: ''; - position: absolute; - width: 100%; - transform: scaleX(0); - height: 2px; - bottom: -2px; - left: 0; - background-color: var(--primary-color); - transform-origin: bottom right; - transition: transform 0.3s ease-out; -} - -.footer a:hover { - color: var(--secondary-color); -} - -.footer a:hover::after { - transform: scaleX(1); - transform-origin: bottom left; -} - -/* Common Media Queries */ -@media (max-width: 768px) { - .container { - padding: 20px 15px; - } - - h1 { - font-size: 36px; - } - - button { - font-size: 16px; - } -} - -@media (max-width: 480px) { - h1 { - font-size: 28px; - } - - .container { - padding: 15px 10px; - } -} |
