diff --git a/secret/asteroidDestroyer/style.css b/secret/asteroidDestroyer/style.css index be1817f..d904269 100644 --- a/secret/asteroidDestroyer/style.css +++ b/secret/asteroidDestroyer/style.css @@ -1,43 +1,43 @@ body { - margin: 0; - overflow: hidden; + margin: 0; + overflow: hidden; } canvas { - display: block; - background: black; - width: 100%; - height: 100%; + display: block; + background: black; + width: 100%; + height: 100%; } .controls { - display: none; - position: absolute; - bottom: 20px; - left: 50%; - transform: translateX(-50%); - display: flex; - justify-content: space-between; - width: 80%; + display: none; + position: absolute; + bottom: 20px; + left: 50%; + transform: translateX(-50%); + display: flex; + justify-content: space-between; + width: 80%; } .control-btn { - display: none; - padding: 10px; - font-size: 18px; - background-color: rgba(0, 0, 0, 0.6); - color: white; - border: 1px solid #fff; - border-radius: 5px; - cursor: pointer; - flex-grow: 1; - margin: 0 5px; + display: none; + padding: 10px; + font-size: 18px; + background-color: rgba(0, 0, 0, 0.6); + color: white; + border: 1px solid #fff; + border-radius: 5px; + cursor: pointer; + flex-grow: 1; + margin: 0 5px; } -@media(max-width: 600px) { - .control-btn { - display: block; - font-size: 16px; - padding: 12px; - } +@media (max-width: 600px) { + .control-btn { + display: block; + font-size: 16px; + padding: 12px; + } } diff --git a/secret/asteroidDestroyer/styles.css b/secret/asteroidDestroyer/styles.css index b72528c..062d406 100644 --- a/secret/asteroidDestroyer/styles.css +++ b/secret/asteroidDestroyer/styles.css @@ -2,10 +2,9 @@ margin: 0; padding: 0; box-sizing: border-box; -} - -body, -html { + } + + body, html { height: 100%; font-family: Arial, sans-serif; display: flex; @@ -14,18 +13,18 @@ html { background-color: #000; color: white; overflow: hidden; -} - -.landing-page { + } + + .landing-page { position: relative; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; -} - -.game-background { + } + + .game-background { position: absolute; top: 0; left: 0; @@ -35,9 +34,9 @@ html { backdrop-filter: blur(8px); /* Apply blur effect to the background */ z-index: -1; /* Ensures it's in the background */ pointer-events: none; /* Prevent interaction with the blurred background */ -} - -.content { + } + + .content { text-align: center; z-index: 1; /* Ensure content appears above the game background */ padding: 20px; @@ -45,19 +44,19 @@ html { position: relative; color: white; backdrop-filter: blur(8px); /* Ensure content has some blur as well for contrast */ -} - -h1 { + } + + h1 { font-size: 2rem; margin-bottom: 20px; -} - -p { + } + + p { font-size: 1.2rem; margin-bottom: 30px; -} - -button { + } + + button { padding: 12px 24px; background-color: #ffcc00; color: black; @@ -67,8 +66,9 @@ button { border-radius: 5px; text-transform: uppercase; transition: background-color 0.3s ease; -} - -button:hover { + } + + button:hover { background-color: #ff9900; -} + } + \ No newline at end of file diff --git a/secret/game.js b/secret/game.js index 8231594..cf84dc9 100644 --- a/secret/game.js +++ b/secret/game.js @@ -341,7 +341,7 @@ function drawGameOver() { // Restart game function restartGame() { - window.location.reload(); + window.location.reload(); } // Main game loop diff --git a/secret/guessMyNumber/styles.css b/secret/guessMyNumber/styles.css index ef9039a..9aa8a3a 100644 --- a/secret/guessMyNumber/styles.css +++ b/secret/guessMyNumber/styles.css @@ -1,6 +1,5 @@ /* Base Reset */ -body, -html { +body, html { margin: 0; padding: 0; font-family: monospace; @@ -17,7 +16,7 @@ html { width: 441px; height: 735px; border-radius: 20px; - box-shadow: 0 8px 16px rgba(0, 0, 0, 0.6); + box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.6); display: flex; flex-direction: column; align-items: center; @@ -25,7 +24,7 @@ html { position: relative; } -@media(max-width: 768px) { +@media (max-width: 768px) { .gameboy { width: 100vw; height: 100vh; @@ -44,7 +43,7 @@ html { display: flex; justify-content: center; align-items: center; - box-shadow: inset 0 4px 8px rgba(0, 0, 0, 0.5); + box-shadow: inset 0px 4px 8px rgba(0, 0, 0, 0.5); overflow: hidden; } @@ -55,7 +54,7 @@ html { /* Titles */ h1 { - font-size: 2rem; /* Increased font size */ + font-size: 2rem; /* Increased font size */ margin-bottom: 10px; text-transform: uppercase; } @@ -65,24 +64,22 @@ h1 { background-color: #9bbc0f; color: #0f380f; border: 2px solid #0f380f; - font-size: 2rem; /* Increased font size */ - width: 80px; /* Increased width */ + font-size: 2rem; /* Increased font size */ + width: 80px; /* Increased width */ text-align: center; margin: 10px auto; - padding: 10px; /* Increased padding */ + padding: 10px; /* Increased padding */ border-radius: 4px; } /* Messages */ -.message, -.score, -.highScore { - font-size: 1.4rem; /* Increased font size */ +.message, .score, .highScore { + font-size: 1.4rem; /* Increased font size */ margin: 5px 0; } .description, -.description p { +.description p{ font-size: 1.2rem; margin: 0 auto; padding: 0 auto; @@ -100,8 +97,8 @@ h1 { /* D-Pad */ .dpad { position: relative; - width: 120px; /* Increased size */ - height: 120px; /* Increased size */ + width: 120px; /* Increased size */ + height: 120px; /* Increased size */ } /* Base Styling for D-Pad Buttons */ @@ -113,7 +110,7 @@ h1 { position: absolute; width: 42px; height: 42px; - font-size: 1.5rem; /* Increased size */ + font-size: 1.5rem; /* Increased size */ display: flex; justify-content: center; align-items: center; @@ -164,7 +161,7 @@ h1 { display: flex; flex-direction: column; justify-content: space-between; - height: 140px; /* Increased height */ + height: 140px; /* Increased height */ } .btn { @@ -174,7 +171,7 @@ h1 { border-radius: 50%; width: 60px; height: 60px; - font-size: 1.8rem; /* Increased font size */ + font-size: 1.8rem; /* Increased font size */ cursor: pointer; transition: transform 0.1s, background-color 0.2s; } diff --git a/secret/styles.css b/secret/styles.css index 7c3550c..69f112b 100644 --- a/secret/styles.css +++ b/secret/styles.css @@ -11,7 +11,7 @@ body { margin: 0; line-height: 1.6; background-image: url('images/background.jpg'); - background-size: cover; /* Adjust size for tape appearance */ + background-size: cover /* Adjust size for tape appearance */ } header { @@ -27,22 +27,51 @@ header { /* Create the flickering neon light effect */ @keyframes neonFlicker { 0% { - 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; + 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; } 20% { - text-shadow: 0 0 3px #ffcc00, 0 0 7px #ffcc00, 0 0 10px #ffcc00, 0 0 15px #ffcc00, 0 0 20px #ffcc00; + text-shadow: + 0 0 3px #ffcc00, + 0 0 7px #ffcc00, + 0 0 10px #ffcc00, + 0 0 15px #ffcc00, + 0 0 20px #ffcc00; } 40% { - text-shadow: 0 0 5px #ffcc00, 0 0 15px #ffcc00, 0 0 25px #ffcc00; + text-shadow: + 0 0 5px #ffcc00, + 0 0 15px #ffcc00, + 0 0 25px #ffcc00; } 60% { - text-shadow: 0 0 5px #ffcc00, 0 0 10px #ffcc00, 0 0 15px #ffcc00, 0 0 20px #ffcc00, 0 0 30px #ffcc00; + text-shadow: + 0 0 5px #ffcc00, + 0 0 10px #ffcc00, + 0 0 15px #ffcc00, + 0 0 20px #ffcc00, + 0 0 30px #ffcc00; } 80% { - text-shadow: 0 0 3px #ffcc00, 0 0 7px #ffcc00, 0 0 10px #ffcc00; + text-shadow: + 0 0 3px #ffcc00, + 0 0 7px #ffcc00, + 0 0 10px #ffcc00; } 100% { - 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; + 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; } } @@ -81,7 +110,7 @@ footer { filter: brightness(0.6); } -.item .description { +.item .description { padding: 30px; font-size: 1rem; color: #ccc; @@ -90,7 +119,7 @@ footer { flex-grow: 1; } -p { +p { text-decoration: none; } @@ -125,7 +154,7 @@ p { transform: translateX(-50%) translateY(-10px); } -@media(max-width: 800px) { +@media (max-width: 800px) { header { font-size: 1.5rem; } diff --git a/webGames/styles.css b/webGames/styles.css index 3f4f099..12800c5 100644 --- a/webGames/styles.css +++ b/webGames/styles.css @@ -58,7 +58,7 @@ footer { object-fit: cover; } -.item .description { +.item .description { padding: 30px; font-size: 1rem; color: #ddd; @@ -67,7 +67,7 @@ footer { flex-grow: 1; /* Allow description to take remaining space */ } -p { +p { text-decoration: none; } @@ -104,7 +104,7 @@ p { } /* Mobile Optimization */ -@media(max-width: 600px) { +@media (max-width: 600px) { header { font-size: 1.2rem; } @@ -114,7 +114,7 @@ p { width: auto; } - .grid-container { + .grid-container{ grid-template-columns: repeat(1, 1fr); } }