FUNCT Update launcher

4 files changed, 30 insertions, 53 deletions

diff --git a/src/styles/720.scss b/src/styles/720.scss
index e69de29..2e9bd3c 100644
--- a/src/styles/720.scss
+++ b/src/styles/720.scss
@@ -0,0 +1,5 @@
+@media (orientation: portrait) {
+    html {
+        height: 992px;
+    }
+}
\ No newline at end of file
diff --git a/src/styles/app.scss b/src/styles/app.scss
index 1cdeb22..02bfead 100644
--- a/src/styles/app.scss
+++ b/src/styles/app.scss
@@ -1,35 +1,31 @@
-$colors: (
-  primary:          #00ADDC,
-  font:             #999999
-);
+$body-bg: transparent;
+$body-color: #FFFFFF;
+$list-group-bg: transparent;
+$font-size-base: 1.5rem;
+$input-bg: transparent;
+$input-color: #FFFFFF;
+@import "~bootstrap/scss/bootstrap";
 @media (max-device-width: 720px) and (orientation: portrait) {
-    $header_size: 145px;
-
     @import "main.scss";
     @import "portrait.scss";
     @import "720.scss";
 }
 
 @media (max-device-width: 1280px) and (orientation: landscape) {
-    $header_size: 145px;
-
     @import "main.scss";
     @import "landscape.scss";
     @import "720.scss";
 }
 
 @media (min-device-width: 1080px) and (orientation: portrait) {
-    $header_size: 218px;
-
     @import "main.scss";
     @import "portrait.scss";
     @import "1080.scss";
 }
 
-@media (min-device-width: 1920px) and (orientation: landscape) {
-    $header_size: 218px;
-
+@media (min-device-width: 1490px) and (orientation: landscape) {
     @import "main.scss";
     @import "landscape.scss";
     @import "1080.scss";
 }
+@import "~@fortawesome/fontawesome-free/css/all.min.css";
diff --git a/src/styles/main.scss b/src/styles/main.scss
index 6861663..4cededc 100644
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -24,56 +24,29 @@ html {
 }
 
 body {
-    font-size: 1.2rem;
-    font-family: Arial;
-    color: map-get($colors, font);
-    margin: 0 5%;
-
-    .parent {
+    .list-group.scrollable {
+        height: 720px;
+        overflow: scroll;
+    }
+    .grid {
         display: flex;
         flex-direction: row;
         flex-wrap: wrap;
         justify-content: flex-start;
-        align-items: flex-start;
+        align-items: center;
         height: 100%;
 
         .item {
-            &:active {
-                .icon {
-                    &.inactive {
-                        display: none;
-                    }
-
-                    &.enabled{
-                        display: block;
-                    }
-                }
-            }
-
-            color: map-get($colors, font);
-            text-decoration: none;
+            display: flex;
+            justify-content: center;
 
-            -webkit-animation-name: animation;
-            -webkit-animation-duration: 2s;
+            button {
+                width: 300px;
+                height: 300px;
 
-            .icon {
-
-                &.inactive {
-                    display: block;
-                }
-
-                &.enabled{
-                    display: none;
+                .icon {
+                    font-size: 7rem;
                 }
-
-                width: 70%;
-                margin: 5% 15%;
-            }
-
-            .name {
-                width: 100%;
-                text-align: center;
-                text-transform: uppercase;
             }
         }
     }
diff --git a/src/styles/portrait.scss b/src/styles/portrait.scss
index a4eb732..18ba52c 100644
--- a/src/styles/portrait.scss
+++ b/src/styles/portrait.scss
@@ -2,6 +2,9 @@
 
     html {
         background-image: url('../images/vertical_background.png');
+        background-position: top center;
+        background-repeat: no-repeat;
+        background-color: transparent;
     }
 
     body {