diff --git a/index.html b/index.html index 0364db4..6f31da7 100644 --- a/index.html +++ b/index.html @@ -7,6 +7,7 @@ superdimensional + diff --git a/script.js b/script.js new file mode 100644 index 0000000..082c582 --- /dev/null +++ b/script.js @@ -0,0 +1,30 @@ +let randomthemes = [ + ["#ff8008", "#ffc837"], + ["#4A00E0", "#8E2DE2"], + ["#FF512F", "#F09819"], + ["#FF5F6D", "#FFC371"], + ["#FF416C", "#FF4B2B"], + ["#ee0979", "#ff6a00"], + ["#ec008c", "#fc6767"], + ["#f857a6", "#ff5858"], + ["#00c3ff", "#ffff1c"], + ["#e1eec3", "#f05053"], + ["#a8ff78", "#78ffd6"], + ["#B3FFAB", "#12FFF7"], + ["#AAFFA9", "#11FFBD"], + ["#5433FF", "#20BDFF"], + ["#00c6ff", "#0072ff"], + ["#4e54c8", "#8f94fb"], + ["#396afc", "#2948ff"], + ["#673AB7", "#512DA8"], + ["#4776E6", "#8E54E9"], + ["#DA22FF", "#9733EE"] + ]; + + //grab a random gradient + function rand(items) { + return items[~~(items.length * Math.random())]; + } + let randcolor = rand(randomthemes); + document.documentElement.style.setProperty("--left", randcolor[0]); + document.documentElement.style.setProperty("--right", randcolor[1]); \ No newline at end of file diff --git a/style.css b/style.css index bd67a45..6982ff1 100644 --- a/style.css +++ b/style.css @@ -454,11 +454,15 @@ a:hover { margin-left:0 } } +:root { + --left: #4A00E0; + --right: #8E2DE2; +} .page-header { color:#fff; text-align:center; background-color:#159957; - background-image:linear-gradient(120deg, #155799, #159957) + background-image:linear-gradient(120deg,var(--left), var(--right)) } @media screen and (min-width: 64em) { .page-header {