Add basic styling to user page

4 files changed, 23 insertions, 3 deletions

diff --git a/src/client/style/_component-search.scss b/src/client/style/_component-search.scss
index d819e6f..51d6b4a 100644
--- a/src/client/style/_component-search.scss
+++ b/src/client/style/_component-search.scss
@@ -1,6 +1,13 @@
 .search {
-  border-radius: 2px;
-  background-color: white;
+  height: 54px;
+  position: relative;
+
+  &-overflow {
+    border-radius: 2px;
+    background-color: white;
+    position: absolute;
+    width: 100%;
+  }
 
   &--has-focus {
     box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
diff --git a/src/client/style/_page-index.scss b/src/client/style/_page-index.scss
index 6fe7739..c09f996 100644
--- a/src/client/style/_page-index.scss
+++ b/src/client/style/_page-index.scss
@@ -6,7 +6,7 @@
   .container {
     max-width: 600px;
     margin: 0 auto;
-    padding: 20px;
+    padding: 8px;
 
     img {
       display: block;
@@ -14,6 +14,7 @@
     }
 
     .search {
+      z-index: 1; // Position search above help-box
       margin-top: 64px;
     }
   }
diff --git a/src/client/style/_page-user.scss b/src/client/style/_page-user.scss
new file mode 100644
index 0000000..395e492
--- /dev/null
+++ b/src/client/style/_page-user.scss
@@ -0,0 +1,11 @@
+.page-user {
+  .menu {
+    background-color: #F44336;
+
+    &-container {
+      max-width: 600px;
+      margin: 0 auto;
+      padding: 8px;
+    }
+  }
+}
diff --git a/src/client/style/index.scss b/src/client/style/index.scss
index d2ad825..763a329 100644
--- a/src/client/style/index.scss
+++ b/src/client/style/index.scss
@@ -8,6 +8,7 @@ body {
 }
 
 @import "page-index";
+@import "page-user";
 
 @import "component-search";
 @import "component-help-box";