diff --git a/css/style.css b/css/style.css index 411564ba..0abe77eb 100644 --- a/css/style.css +++ b/css/style.css @@ -5,7 +5,7 @@ --bg: #202020; --block-color: #2b2b2b; --button-color: #373737; - --games-color: #373737a6; + --games-color: #373737; --hover-color: #3c3c3c; --scrollbar-color: #434343; --scroll-track-color: #111; @@ -281,7 +281,8 @@ img[alt='Proxy Icon'] { margin: -1rem 0; } -@media screen and (max-height: 700px) { +@media screen and (max-height: 700px), +(max-width: 1000px) { .card .img-container { margin: 1rem 0; max-width: 128px; @@ -352,7 +353,7 @@ svg { text-align: center; background-color: var(--button-color); border-radius: 50px; - font-size: 1.2rem; + font-size: 2.2vmin; text-decoration: none; color: var(--font-color); font-family: var(--font-family); diff --git a/js/index.js b/js/index.js index e181ba74..3dd9273a 100644 --- a/js/index.js +++ b/js/index.js @@ -707,14 +707,22 @@ function saveColorChanges() { // Save to local storage localStorage.setItem('colorSettings', JSON.stringify(newColorSettings)); - alert('Colors saved! Changes will take place upon reload'); + + // Set CSS variables + Object.entries(newColorSettings).forEach(([key, value]) => { + document.documentElement.style.setProperty(`--${key}`, value); + }); } // Restore defaults button event listener function restoreColorChanges() { // Reset to default values localStorage.removeItem('colorSettings'); - alert('Defaults Restored! Changes will take place upon reload'); + + // Set CSS variables + Object.entries(colorSettings).forEach(([key, value]) => { + document.documentElement.style.setProperty(`--${key}`, value); + }); } function randomGame() {