From a6047e0ad5820e08308d3c7d5f54c14ba57fca5e Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 3 Sep 2018 22:12:18 +0300
Subject: Kinda went back to using align-items: stretch. Fixed error message
 floating.

---
 src/App.scss | 23 ++++++++++++++++++++---
 1 file changed, 20 insertions(+), 3 deletions(-)

(limited to 'src/App.scss')

diff --git a/src/App.scss b/src/App.scss
index dd43c5ca..6ae4a1bb 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -325,18 +325,35 @@ main-router {
   background-size: cover;
   padding: .6em .6em;
   text-align: left;
-  font-size: 1.3em;
-  line-height: 24px;
+  line-height: 28px;
   background-color: $fallback--btn;
   background-color: var(--btn, $fallback--btn);
   align-items: baseline;
 
   .title {
     flex: 1 0 auto;
+    font-size: 1.3em;
+  }
+
+  .alert {
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow-x: hidden;
   }
 
   button {
-    height: 100%;
+    flex-shrink: 0;
+  }
+
+  button, .alert {
+    // height: 100%;
+    line-height: 21px;
+    min-height: 0;
+    box-sizing: border-box;
+    margin: 0;
+    margin-left: .25em;
+    min-width: 1px;
+    align-self: stretch;
   }
 }
 
-- 
cgit v1.2.3-70-g09d2


From 08b044c365527492b1f6d20f2f5a2acb125799b4 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 3 Sep 2018 22:18:59 +0300
Subject: Fixed non-masked image looking weird in chrome.

---
 src/App.scss | 4 ++++
 1 file changed, 4 insertions(+)

(limited to 'src/App.scss')

diff --git a/src/App.scss b/src/App.scss
index 6ae4a1bb..056a235e 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -248,6 +248,7 @@ nav {
     justify-content: center;
     flex: 0 0 auto;
     z-index: -1;
+
     .mask {
       mask-repeat: no-repeat;
       mask-position: center;
@@ -260,7 +261,10 @@ nav {
       left: 0;
       right: 0;
     }
+
     img {
+      height: 100%;
+      object-fit: contain;
       display: block;
       flex: 0;
     }
-- 
cgit v1.2.3-70-g09d2