diff --git a/secret/guessMyNumber/index.html b/secret/guessMyNumber/index.html index 5a5f5d5..17856e5 100644 --- a/secret/guessMyNumber/index.html +++ b/secret/guessMyNumber/index.html @@ -25,7 +25,7 @@
A = check
B = Reload
▲ = increases guess by one
-▲ = decreases guess by one
+▼ = decreases guess by one
diff --git a/secret/guessMyNumber/styles.css b/secret/guessMyNumber/styles.css index 10ba922..9aa8a3a 100644 --- a/secret/guessMyNumber/styles.css +++ b/secret/guessMyNumber/styles.css @@ -105,16 +105,17 @@ h1 { .dpad-btn { background-color: #0f380f; color: #9bbc0f; - border: 2px solid #9cbc0f00; + border: none; border-radius: 5px; position: absolute; - width: 40px; - height: 40px; + width: 42px; + height: 42px; font-size: 1.5rem; /* Increased size */ display: flex; justify-content: center; align-items: center; cursor: pointer; + z-index: 1; } .dpad-btn.up { @@ -151,6 +152,7 @@ h1 { width: 40px; height: 40px; border: 2px solid #9cbc0f00; + z-index: 0; border-radius: 5px; } diff --git a/secret/guessMyNumber/styles.js b/secret/guessMyNumber/styles.js index 58c9c0b..d7357df 100644 --- a/secret/guessMyNumber/styles.js +++ b/secret/guessMyNumber/styles.js @@ -6,18 +6,22 @@ const html = document.documentElement; const body = document.body; const screen = document.querySelector('.screen'); const dpadButtons = document.querySelectorAll('.dpad-btn'); +const dpadCenter = document.querySelector('.dpad-center'); // Darker variant const actionButtons = document.querySelectorAll('.btn'); - const colors = [ - { gameboyColor: '#A77BCA', htmlColor: '#E8D3E0', screenColor: '#A8D5BA', buttonColor: '#6B8E23', buttonTextColor: '#FFFFFF' }, // Lavender - { gameboyColor: '#F6D02F', htmlColor: '#F9E79F', screenColor: '#A3D9F1', buttonColor: '#FF5733', buttonTextColor: '#FFFFFF' }, // Bright Yellow - { gameboyColor: '#4CAF50', htmlColor: '#C8E6C9', screenColor: '#B2DFDB', buttonColor: '#FF9800', buttonTextColor: '#FFFFFF' }, // Vibrant Green - { gameboyColor: '#FF5252', htmlColor: '#FFCCCB', screenColor: '#FFABAB', buttonColor: '#FF4081', buttonTextColor: '#FFFFFF' }, // Bright Red - { gameboyColor: '#2196F3', htmlColor: '#BBDEFB', screenColor: '#90CAF9', buttonColor: '#FFEB3B', buttonTextColor: '#000000' }, // Sky Blue - { gameboyColor: '#FF6F61', htmlColor: '#FFCCBC', screenColor: '#FFAB91', buttonColor: '#FF7043', buttonTextColor: '#FFFFFF' }, // Coral - { gameboyColor: '#8E24AA', htmlColor: '#E1BEE7', screenColor: '#D1C4E9', buttonColor: '#7B1FA2', buttonTextColor: '#FFFFFF' }, // Purple - { gameboyColor: '#FFD700', htmlColor: '#FFF9C4', screenColor: '#FFF59D', buttonColor: '#FF9800', buttonTextColor: '#FFFFFF' }, // Gold + { gameboyColor: '#B39DDB', htmlColor: '#D1C4E9', screenColor: '#E1BEE7', buttonColor: '#673AB7', buttonTextColor: '#FFFFFF', dpadCenterColor: '#5E35B1' }, + { gameboyColor: '#FFC107', htmlColor: '#FFF9C4', screenColor: '#FFEB3B', buttonColor: '#FF9800', buttonTextColor: '#000000', dpadCenterColor: '#EF6C00' }, + { gameboyColor: '#8BC34A', htmlColor: '#C5E1A5', screenColor: '#A5D6A7', buttonColor: '#FF5722', buttonTextColor: '#FFFFFF', dpadCenterColor: '#E64A19' }, + { gameboyColor: '#F44336', htmlColor: '#FFCDD2', screenColor: '#EF9A9A', buttonColor: '#E91E63', buttonTextColor: '#FFFFFF', dpadCenterColor: '#C2185B' }, + { gameboyColor: '#03A9F4', htmlColor: '#BBDEFB', screenColor: '#90CAF9', buttonColor: '#FFEB3B', buttonTextColor: '#000000', dpadCenterColor: '#0277BD' }, + { gameboyColor: '#FF7043', htmlColor: '#FFCCBC', screenColor: '#FFAB91', buttonColor: '#FF5722', buttonTextColor: '#FFFFFF', dpadCenterColor: '#D84315' }, + { gameboyColor: '#9C27B0', htmlColor: '#E1BEE7', screenColor: '#D1C4E9', buttonColor: '#7B1FA2', buttonTextColor: '#FFFFFF', dpadCenterColor: '#6A1B9A' }, + { gameboyColor: '#FFD700', htmlColor: '#FFF9C4', screenColor: '#FFF59D', buttonColor: '#FF9800', buttonTextColor: '#FFFFFF', dpadCenterColor: '#F57F17' }, + { gameboyColor: '#009688', htmlColor: '#B2DFDB', screenColor: '#80CBC4', buttonColor: '#4CAF50', buttonTextColor: '#FFFFFF', dpadCenterColor: '#00796B' }, + { gameboyColor: '#795548', htmlColor: '#D7CCC8', screenColor: '#A1887F', buttonColor: '#9E9E9E', buttonTextColor: '#000000', dpadCenterColor: '#5D4037' }, + { gameboyColor: '#FF5733', htmlColor: '#FFCCCB', screenColor: '#FFABAB', buttonColor: '#C70039', buttonTextColor: '#FFFFFF', dpadCenterColor: '#B71C1C' }, + { gameboyColor: '#00BCD4', htmlColor: '#B2EBF2', screenColor: '#80DEEA', buttonColor: '#00ACC1', buttonTextColor: '#FFFFFF', dpadCenterColor: '#00838F' } ]; let currentColorIndex = localStorage.getItem('gameboyColorIndex') ? parseInt(localStorage.getItem('gameboyColorIndex')) : 0; @@ -33,6 +37,10 @@ function updateGameBoyColor() { button.style.color = colors[currentColorIndex].buttonTextColor; }); + // Using darker dpad center color + dpadCenter.style.backgroundColor = colors[currentColorIndex].dpadCenterColor; + dpadCenter.style.color = colors[currentColorIndex].buttonTextColor; + actionButtons.forEach(button => { button.style.backgroundColor = colors[currentColorIndex].buttonColor; button.style.color = colors[currentColorIndex].buttonTextColor;