Improved frontend (not sure about #777)

2 files changed, 13 insertions, 9 deletions

diff --git a/admin/public/index.html b/admin/public/index.html
index 815b6aa..389157c 100644
--- a/admin/public/index.html
+++ b/admin/public/index.html
@@ -20,10 +20,12 @@
         </div>
         <div class="card">
             <h2>Admin</h2>
-            <ul>
-                <li><a href="ranking.html">Ranking</a></li>
-                <li><a href="votes.html">Votes</a></li>
-            </ul>
+            <div class="pure-menu">
+                <ul class="pure-menu-list">
+                    <li class="pure-menu-item"><a href="ranking.html" class="pure-menu-link">Ranking</a></li>
+                    <li class="pure-menu-item"><a href="votes.html" class="pure-menu-link">Votes</a></li>
+                </ul>
+            </div>
         </div>
     </body>
 </html>
diff --git a/admin/public/style.css b/admin/public/style.css
index 4e3cffc..e7941e0 100644
--- a/admin/public/style.css
+++ b/admin/public/style.css
@@ -4,15 +4,17 @@ body {
     margin: 0;
     height: 100%;
     width: 100%;
+    color: #777;
+    line-height: 1.6;
     background-color: #eec0c6;
     background-image: linear-gradient(315deg, #eec0c6 0%, #7ee8fa 74%);
 }
 
 .card {
     position: absolute;
-    max-height: 80%;
-    overflow: auto;
-    width: 40%;
+    max-height: calc(100% - 140px);
+    overflow-y: auto;
+    width: 50%;
     left: 50%;
     top: 50%;
     -webkit-transform: translate(-50%, -50%);
@@ -26,8 +28,8 @@ div {
     background: white;
 }
 
-@media only screen and (max-width: 800px) {
+@media only screen and (max-width: 700px) {
     .card {
-        width: calc(100% - 50px);
+        width: calc(100% - 20%);
     }
 }