NEXT by SNSA
++ + +
diff --git a/client/css/layout.css b/client/css/layout.css
index 7446dba..c464695 100644
--- a/client/css/layout.css
+++ b/client/css/layout.css
@@ -1,9 +1,75 @@
-body,
+@import url(https://fonts.googleapis.com/css?family=Ubuntu:700);
+
+body {
+ margin: 0;
+ overflow: auto;
+}
+
#viewer,
canvas {
- margin: 0;
+ margin: 0;
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ width: 100%;
+ height: 100%;
+ z-index: -100;
}
-body {
- overflow: hidden;
+.overlay {
+ width: 100%;
+ height: 100vh;
+ background-color: transparent;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ z-index: 2;
+}
+
+.main-panel {
+ background-color: rgba(0, 0, 0, 0.8);
+ color: #ccc;
+ width: 400px;
+ height: 300px;
+ padding: 20px;
+ -webkit-border-radius: 5px;
+ -moz-border-radius: 5px;
+ border-radius: 5px;
+}
+
+#status-box, #leaderboard {
+ position: fixed;
+ display: block;
+ background-color: rgba(0, 0, 0, 0.3);
+ color: white;
+ -webkit-border-radius: 5px;
+ -moz-border-radius: 5px;
+ border-radius: 5px;
+ font-family: 'Ubuntu', sans-serif;
+}
+
+#status-box {
+ left: 10px;
+ bottom: 10px;
+ padding: 10px;
+ font-weight: bold;
+}
+
+#leaderboard {
+ top: 10px;
+ right: 10px;
+ width: 200px;
+ height: 280px;
+
+}
+
+#leaderboard {
+ text-align: center;
+}
+
+#leaderboard h4 a {
+ text-decoration: none;
+ color: #FFC107 !important;
}
diff --git a/client/index.html b/client/index.html
index 978cb7d..dffe905 100644
--- a/client/index.html
+++ b/client/index.html
@@ -4,10 +4,81 @@