From 2991dfbe27bcd2e4e3147221aa90e4809cb52562 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?P=C5=91cze=20Bence?= <bence@pocze.ch>
Date: Wed, 20 May 2020 01:07:01 +0200
Subject: [PATCH] MAPG-6 add styles for score and result

---
 public/static/css/mapguesser.css | 29 +++++++++++++++++++++++++----
 1 file changed, 25 insertions(+), 4 deletions(-)

diff --git a/public/static/css/mapguesser.css b/public/static/css/mapguesser.css
index d271969..0c8b591 100644
--- a/public/static/css/mapguesser.css
+++ b/public/static/css/mapguesser.css
@@ -75,7 +75,7 @@ button:disabled {
     transition-delay: 0s;
 }
 
-#guess #guessMap {
+#guess > #guessMap {
     height: 115px;
     width: 100%;
     transition-property: height;
@@ -84,7 +84,7 @@ button:disabled {
     border-radius: 3px;
 }
 
-#guess:hover #guessMap {
+#guess:hover > #guessMap {
     height: 315px;
     transition-delay: 0s;
 }
@@ -122,12 +122,33 @@ button:disabled {
 #resultInfo {
     height: 30%;
     width: 100%;
-    padding: 20px;
+    padding: 10px 20px;
     text-align: center;
     box-sizing: border-box;
 }
 
+#resultInfo > div {
+    height: 25%;
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
 #resultInfo p {
-    margin-bottom: 20px;
     font-size: 24px;
 }
+
+#scoreBarBase {
+    height: 20px;
+    width: 60%;
+    margin: 0 auto;
+    background-color: #eeeeee;
+    border-radius: 3px;
+}
+
+#scoreBar {
+    height: 100%;
+    transition-property: width;
+    transition-duration: 1.0s;
+}