diff --git a/web/spin-wheel/index.html b/web/spin-wheel/index.html index 4e66d53..466ade4 100644 --- a/web/spin-wheel/index.html +++ b/web/spin-wheel/index.html @@ -19,7 +19,6 @@ questions.onreadystatechange = function() { } questions.send(); -console.log("hey there"); function preload(){ img=loadImage('wheel.svg'); } @@ -90,7 +89,8 @@ function draw() {
@@ -105,6 +105,10 @@ function draw() { + + + + \ No newline at end of file diff --git a/web/spin-wheel/photo-slide.jpg b/web/spin-wheel/photo-slide.jpg new file mode 100644 index 0000000..ac42bfb Binary files /dev/null and b/web/spin-wheel/photo-slide.jpg differ diff --git a/web/spin-wheel/style.css b/web/spin-wheel/style.css index 34c422a..8fa5f99 100644 --- a/web/spin-wheel/style.css +++ b/web/spin-wheel/style.css @@ -46,10 +46,37 @@ html { top: 0px; left: 0px; transform: translate(-50%,-50%); - width: 50vw; + width: 40vw; filter: hue-rotate(180deg); } + .top-right-corner { + position: fixed; + top: 0px; + right: 0px; + transform: translate(50%,-50%); + width: 40vw; + filter: hue-rotate(180deg); +} + + .bottom-left-corner { + position: fixed; + bottom: 0px; + left: 0px; + transform: translate(-50%,50%); + width: 40vw; + filter: hue-rotate(180deg); +} + + .bottom-right-corner{ + position: fixed; + bottom: 0px; + right: 0px; + transform: translate(50%,50%); + width: 40vw; + filter: hue-rotate(180deg); +} + #wheel{ text-align: center; } @@ -72,8 +99,9 @@ html { position: fixed; top: 50%; left: 50%; - width: 5cm; - height: 5cm; + width: fit-content; + height: fit-content; + padding: 5%; background-color: azure; z-index: 3; transform: translate(-50%,-50%); @@ -83,9 +111,10 @@ html { h1{ position: relative; margin-top: 5%; + margin-bottom: 0; text-align: center; font-family: fantasy; - font-size:larger; + font-size:5em; color:antiquewhite; } @@ -94,10 +123,19 @@ html { font-family: fantasy; color:antiquewhite; } + + h3 { + text-align: center; + font-family: fantasy; + color:antiquewhite; + } p { text-align: center; font-family: monospace; color:antiquewhite; - padding: 5%; + font-size: 1.2em; + padding-right: 15%; + padding-left: 15%; + padding-bottom: 5%; }