2526-web/Kelompok09-SPOILER
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update

Browse Source
This commit is contained in:
Hijau-dev 2025-12-01 11:25:02 +07:00
parent c6d7ffc56f
commit 16953dd3c7
2 changed files with 42 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
Main.html
View File

@ -14,7 +14,7 @@
<div id="startMenu"> <div id="startMenu">
<h1 class="title">GALAXY STRIKER</h1> <h1 class="title">SPACE ODDYSEY</h1>
<button class="menuButton" id="startBtn">Start</button> <button class="menuButton" id="startBtn">Start</button>
<button class="menuButton" id="optionsBtn">Options</button> <button class="menuButton" id="optionsBtn">Options</button>

70
Style.css
View File

@ -25,15 +25,6 @@ body {
} }
#startMenu { #startMenu {
position: absolute; position: absolute;
width: 1280px; width: 1280px;
@ -50,7 +41,6 @@ body {
align-items: center; align-items: center;
z-index: 10; z-index: 10;
font-family: 'Poppins', Arial, sans-serif; font-family: 'Poppins', Arial, sans-serif;
animation: fadeIn 1s ease-out; animation: fadeIn 1s ease-out;
@ -62,45 +52,65 @@ body {
} }
.title { .title {
font-size: 70px; font-size: 90px;
margin-bottom: 40px; margin-bottom: 40px;
color: #ffffff; color: #ffffff;
letter-spacing: 4px; letter-spacing: 4px;
font-weight: 900;
text-shadow: text-shadow:
0 0 10px #00eaff, 2px 2px 0px #00bcd4,
0 0 20px #00eaff, 4px 4px 0px #009bb0,
0 0 30px rgba(0, 234, 255, 0.7); 6px 6px 0px #007a8c,
8px 8px 0px #005a68,
10px 10px 12px rgba(0, 234, 255, 0.7),
0 0 25px #00eaff;
animation: glow 3s infinite alternate ease-in-out; animation: pixelGlow 2s infinite alternate ease-in-out;
} }
@keyframes glow { @keyframes pixelGlow {
from { text-shadow: 0 0 8px #00eaff, 0 0 16px #00eaff; } from {
to { text-shadow: 0 0 20px #00eaff, 0 0 40px #00eaff; } text-shadow:
2px 2px 0px #00eaff,
4px 4px 0px #00bcd4,
6px 6px 0px #009bb0,
8px 8px 0px #007a8c,
10px 10px 14px rgba(0, 234, 255, 0.9),
0 0 35px #00eaff;
}
to {
text-shadow:
2px 2px 0px #00eaff,
3px 3px 0px #00bcd4,
5px 5px 0px #009bb0,
7px 7px 0px #007a8c,
9px 9px 12px rgba(0, 234, 255, 0.7),
0 0 20px #00eaff;
}
} }
.menuButton { .menuButton {
font-size: 28px; font-size: 28px;
padding: 12px 50px; padding: 15px 55px;
margin: 10px; margin: 12px;
cursor: pointer; cursor: pointer;
background: linear-gradient(145deg, #111, #1b1b1b);
background: rgba(20, 20, 20, 0.8);
color: white; color: white;
border: 2px solid #00eaff; border: 2px solid #00eaff;
border-radius: 12px; border-radius: 40px;
box-shadow:
box-shadow: 0 0 10px rgba(0, 234, 255, 0.4); 0 4px 0 #00bcd4,
0 0 12px rgba(0, 234, 255, 0.4),
inset 0 0 15px rgba(0, 234, 255, 0.2);
transition: 0.3s ease-in-out; transition: 0.3s ease-in-out;
} }
.menuButton:hover { .menuButton:hover {
background: #00eaff; background: #00eaff;
color: #000; color: #000;
box-shadow: 0 0 20px #00eaff; transform: translateY(-5px) scale(1.08);
transform: scale(1.05) box-shadow:
0 10px 20px rgba(0, 234, 255, 0.6),
0 0 30px #00eaff;
} }