feat: Page now uses max height + new logo

client/scss/base/base.scss

@@ -1,6 +1,7 @@
 html {
   box-sizing: border-box;
   font-family: $core-font-standard;
+  height: 100%;
 }
 *, *:before, *:after {
   box-sizing: inherit;
@@ -10,12 +11,19 @@ html {
   display: none;
 }
 
+#root {
+  padding-bottom: 67px;
+  position: relative;
+  min-height: 100%;
+}
+
 body {
-	background-color: mc('blue-grey','100');
+	background-color: lighten(mc('blue-grey','50'), 5%);
+  height: 100%;
 }
 
 main {
-	background-color: #FFF;
+	background-color: lighten(mc('blue-grey','50'), 5%);
 }
 
 a {

client/scss/components/footer.scss

@@ -1,13 +1,17 @@
 .footer {
 	background-color: mc('blue-grey','50');
-	border-bottom: 5px solid mc('blue-grey','100');
 	display: flex;
 	justify-content: space-between;
 	align-items: center;
-	padding: 25px;
+	padding: 0 25px;
+  height: 70px;
 	font-size: 13px;
 	font-weight: 500;
 	color: mc('blue-grey','500');
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  left: 0;
 
 	ul {
 		padding: 0;

client/scss/components/panel.scss

@@ -32,8 +32,8 @@
     &.is-featured {
       border-top-left-radius: 4px;
       border-top-right-radius: 4px;
-      background-color: mc('indigo', '300');
-      border-bottom-color: mc('indigo', '400');
+      background-color: mc($primary, '400');
+      border-bottom-color: mc($primary, '500');
       color: #FFF;
 
       > i::before {

client/scss/components/sidebar.scss

@@ -4,7 +4,7 @@
 	color: mc('blue-grey', '50');
 	width: 250px;
 	max-width: 250px;
-	min-height: 80vh;
+	min-height: calc(100vh - 120px);
 
 	aside {
     padding: 1px 0 15px 0;

client/scss/configure.scss

@@ -22,13 +22,9 @@ $primary: 'indigo';
 
 .welcome {
 	text-align: center;
-	padding: 25px 0 0;
+	padding: 50px 0 15px 0;
 	color: mc('grey', '700');
 
-	h1 {
-		margin-top: 5px;
-	}
-
 	h2 {
 		margin: 0;
 	}