Compare commits
2 commits
8e361050d9
...
26fabc37e9
Author | SHA1 | Date | |
---|---|---|---|
26fabc37e9 | |||
24d01959c1 |
6 changed files with 90 additions and 116 deletions
|
@ -4,7 +4,8 @@
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
body, html {
|
body,
|
||||||
|
html {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
font-family: Arial, sans-serif;
|
font-family: Arial, sans-serif;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -71,4 +72,3 @@
|
||||||
button:hover {
|
button:hover {
|
||||||
background-color: #ff9900;
|
background-color: #ff9900;
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
/* Base Reset */
|
/* Base Reset */
|
||||||
body, html {
|
body,
|
||||||
|
html {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
|
@ -16,7 +17,7 @@ body, html {
|
||||||
width: 441px;
|
width: 441px;
|
||||||
height: 735px;
|
height: 735px;
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.6);
|
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.6);
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
@ -43,7 +44,7 @@ body, html {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
box-shadow: inset 0px 4px 8px rgba(0, 0, 0, 0.5);
|
box-shadow: inset 0 4px 8px rgba(0, 0, 0, 0.5);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -73,7 +74,9 @@ h1 {
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Messages */
|
/* Messages */
|
||||||
.message, .score, .highScore {
|
.message,
|
||||||
|
.score,
|
||||||
|
.highScore {
|
||||||
font-size: 1.4rem; /* Increased font size */
|
font-size: 1.4rem; /* Increased font size */
|
||||||
margin: 5px 0;
|
margin: 5px 0;
|
||||||
}
|
}
|
||||||
|
|
|
@ -11,7 +11,7 @@ body {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
background-image: url('images/background.jpg');
|
background-image: url('images/background.jpg');
|
||||||
background-size: cover /* Adjust size for tape appearance */
|
background-size: cover; /* Adjust size for tape appearance */
|
||||||
}
|
}
|
||||||
|
|
||||||
header {
|
header {
|
||||||
|
@ -27,51 +27,22 @@ header {
|
||||||
/* Create the flickering neon light effect */
|
/* Create the flickering neon light effect */
|
||||||
@keyframes neonFlicker {
|
@keyframes neonFlicker {
|
||||||
0% {
|
0% {
|
||||||
text-shadow:
|
text-shadow: 0 0 5px #ffcc00, 0 0 10px #ffcc00, 0 0 15px #ffcc00, 0 0 20px #ffcc00, 0 0 30px #ffcc00, 0 0 40px #ffcc00, 0 0 50px #ffcc00;
|
||||||
0 0 5px #ffcc00,
|
|
||||||
0 0 10px #ffcc00,
|
|
||||||
0 0 15px #ffcc00,
|
|
||||||
0 0 20px #ffcc00,
|
|
||||||
0 0 30px #ffcc00,
|
|
||||||
0 0 40px #ffcc00,
|
|
||||||
0 0 50px #ffcc00;
|
|
||||||
}
|
}
|
||||||
20% {
|
20% {
|
||||||
text-shadow:
|
text-shadow: 0 0 3px #ffcc00, 0 0 7px #ffcc00, 0 0 10px #ffcc00, 0 0 15px #ffcc00, 0 0 20px #ffcc00;
|
||||||
0 0 3px #ffcc00,
|
|
||||||
0 0 7px #ffcc00,
|
|
||||||
0 0 10px #ffcc00,
|
|
||||||
0 0 15px #ffcc00,
|
|
||||||
0 0 20px #ffcc00;
|
|
||||||
}
|
}
|
||||||
40% {
|
40% {
|
||||||
text-shadow:
|
text-shadow: 0 0 5px #ffcc00, 0 0 15px #ffcc00, 0 0 25px #ffcc00;
|
||||||
0 0 5px #ffcc00,
|
|
||||||
0 0 15px #ffcc00,
|
|
||||||
0 0 25px #ffcc00;
|
|
||||||
}
|
}
|
||||||
60% {
|
60% {
|
||||||
text-shadow:
|
text-shadow: 0 0 5px #ffcc00, 0 0 10px #ffcc00, 0 0 15px #ffcc00, 0 0 20px #ffcc00, 0 0 30px #ffcc00;
|
||||||
0 0 5px #ffcc00,
|
|
||||||
0 0 10px #ffcc00,
|
|
||||||
0 0 15px #ffcc00,
|
|
||||||
0 0 20px #ffcc00,
|
|
||||||
0 0 30px #ffcc00;
|
|
||||||
}
|
}
|
||||||
80% {
|
80% {
|
||||||
text-shadow:
|
text-shadow: 0 0 3px #ffcc00, 0 0 7px #ffcc00, 0 0 10px #ffcc00;
|
||||||
0 0 3px #ffcc00,
|
|
||||||
0 0 7px #ffcc00,
|
|
||||||
0 0 10px #ffcc00;
|
|
||||||
}
|
}
|
||||||
100% {
|
100% {
|
||||||
text-shadow:
|
text-shadow: 0 0 5px #ffcc00, 0 0 10px #ffcc00, 0 0 15px #ffcc00, 0 0 20px #ffcc00, 0 0 30px #ffcc00, 0 0 40px #ffcc00;
|
||||||
0 0 5px #ffcc00,
|
|
||||||
0 0 10px #ffcc00,
|
|
||||||
0 0 15px #ffcc00,
|
|
||||||
0 0 20px #ffcc00,
|
|
||||||
0 0 30px #ffcc00,
|
|
||||||
0 0 40px #ffcc00;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue