FUNCT Added first visual version

1 files changed, 71 insertions, 1 deletions

diff --git a/src/app.scss b/src/app.scss
index c489d30..a15beb4 100644
--- a/src/app.scss
+++ b/src/app.scss
@@ -1,3 +1,73 @@
+@media (orientation: portrait) {
+
+    html {
+        background-image: url('./images/vertical_background.png');
+    }
+
+    body {
+        .item {
+            flex-basis: 33%;
+        }
+    }
+}
+
+@media (orientation: landscape) {
+
+    html {
+        background-image: url('./images/horizontal_background.png');
+    }
+
+    body {
+        .item {
+            flex-basis: 25%;
+        }
+    }
+}
+
+html {
+    height: 100%;
+}
+
 body {
-    background: red;
+    font-size: 2rem;
+    font-family: Roboto, Arial;
+    color: #CCCCCC;
+    height: 100%;
+    width: 100%;
+    margin: 0;
+
+    svg {
+        path,
+        polygon,
+        linearGradient,
+        rect {
+            fill: #00ADDC !important;
+        }
+
+        circle {
+            fill: rgba(0,0,0, 0.4) !important;
+        }
+
+        text {
+            display: none !important;
+        }
+    }
+
+    .parent {
+        display: flex;
+        flex-direction: row;
+        flex-wrap: wrap;
+        justify-content: flex-start;
+        align-items: center;
+        height: 100%;
+
+        .item {
+            .name {
+                width: 100%;
+                text-align: center;
+                text-transform: uppercase;
+                margin-top: -20%;
+            }
+        }
+    }
 }
\ No newline at end of file