committing ui bug fixes

Author: nusanam

Dockerfile

@@ -1,4 +1,4 @@
 FROM node:10.16.2
-WORKDIR /usr/src/app
+WORKDIR /usr/src/app 
 COPY package*.json ./
 RUN npm i

assets/readme_logo.png

@@ -0,0 +1,23 @@
+.body-container {
+  height: 94%;
+  display: grid;
+  grid-template-columns: 1fr 2fr;
+  grid-template-rows: 8fr 1fr;
+  grid-template-areas:
+    'actions states'
+    'travel travel'
+    'buttons buttons';
+}
+
+/* if extension width is less than 500px, stack the body containers */
+@media (max-width: 500px) {
+  .body-container {
+    grid-template-rows: 3fr 5fr 1fr;
+    grid-template-columns: auto;
+    grid-template-areas:
+      'actions'
+      'states'
+      'travel'
+      'buttons';
+  }
+}

demo.gif

@@ -0,0 +1,14 @@
+.error-container {
+  height: 100%;
+  margin: 0 auto;
+  background-color: $brand-color;
+  overflow: hidden;
+
+  display: grid;
+  justify-content: center;
+  a {
+    color: white;
+    margin-top: 5%;
+    height: 3%;
+  }
+}

src/app/styles/layout/_bodyContainer.scss

@@ -0,0 +1,6 @@
+.main-container {
+  height: 100%;
+  margin: 0 auto;
+  background-color: $brand-color;
+  overflow: hidden;
+}