From d4878655be6ae6b88bdffc1afe2ff953119b7916 Mon Sep 17 00:00:00 2001 From: Mark Powers Date: Sun, 19 Apr 2020 13:01:19 -0500 Subject: Add bunny styling --- src/quiz-bunny/server.js | 1 + src/quiz-bunny/static/bunny.jpg | Bin 0 -> 457095 bytes src/quiz-bunny/static/styles.css | 19 ++++++++++++++++--- 3 files changed, 17 insertions(+), 3 deletions(-) create mode 100644 src/quiz-bunny/static/bunny.jpg diff --git a/src/quiz-bunny/server.js b/src/quiz-bunny/server.js index 3a36baf..80c50c3 100644 --- a/src/quiz-bunny/server.js +++ b/src/quiz-bunny/server.js @@ -7,6 +7,7 @@ function setUpRoutes(server, models, jwtFunctions, database) { server.get('/quiz-bunny', (req, res) => res.sendFile(__dirname + "/index.html")) server.get('/quiz-bunny/main.js', (req, res) => res.sendFile(__dirname + "/static/main.js")) server.get('/quiz-bunny/styles.css', (req, res) => res.sendFile(__dirname + "/static/styles.css")) + server.get('/quiz-bunny/bunny.jpg', (req, res) => res.sendFile(__dirname + "/static/bunny.jpg")) // a list of games var games = [] diff --git a/src/quiz-bunny/static/bunny.jpg b/src/quiz-bunny/static/bunny.jpg new file mode 100644 index 0000000..9173a51 Binary files /dev/null and b/src/quiz-bunny/static/bunny.jpg differ diff --git a/src/quiz-bunny/static/styles.css b/src/quiz-bunny/static/styles.css index e128102..45da568 100644 --- a/src/quiz-bunny/static/styles.css +++ b/src/quiz-bunny/static/styles.css @@ -1,3 +1,13 @@ +body { + background-image: url("/quiz-bunny/bunny.jpg"); + background-position: center; + background-repeat: no-repeat; +} +h1, h2, h3, h4, li, span { + text-shadow: 0px 0px 5px #000; + color: white; +} + .center{ margin: auto; width: 350px; @@ -18,17 +28,20 @@ input[type=button]{ background-color: coral; color: white; white-space: normal; + box-shadow: 0 2px 5px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19); } input[type=button]:disabled { color: #eeeeee; background-color: #dddddd; } input[type=button]:disabled:hover { - box-shadow: none; - cursor: default + box-shadow: 0 2px 5px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19); + cursor: default; + background-color: #dddddd; } input[type=button]:hover{ - box-shadow: 0 2px 5px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19) + box-shadow: 0 5px 10px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19); + background-color: rgb(255, 179, 151); } span { margin-right: 1em; -- cgit v1.2.3