From 0bea1f5a594b8adfccb59783b0ec10b33443d2b3 Mon Sep 17 00:00:00 2001
From: Noah Loomans <noahloomans@gmail.com>
Date: Fri, 19 Jan 2018 14:58:31 +0100
Subject: Split style into files

---
 src/client/style/_component-search.scss | 52 +++++++++++++++++++++++++++++++++
 1 file changed, 52 insertions(+)
 create mode 100644 src/client/style/_component-search.scss

(limited to 'src/client/style/_component-search.scss')

diff --git a/src/client/style/_component-search.scss b/src/client/style/_component-search.scss
new file mode 100644
index 0000000..cac1ae3
--- /dev/null
+++ b/src/client/style/_component-search.scss
@@ -0,0 +1,52 @@
+.search {
+  border-radius: 2px;
+  background-color: white;
+
+  &--has-focus {
+    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
+  }
+
+  &__results--has-results {
+    border-top: 1px #BDBDBD solid;
+  }
+
+  &__icon-wrapper {
+    height: 54px;
+    padding: 15px;
+    svg {
+      height: 24px;
+      width: 24px;
+    }
+  }
+
+  &__input-wrapper {
+    display: flex;
+    height: 54px;
+
+    input {
+      border: 0;
+      background-color: transparent;
+      flex-grow: 1;
+      height: inherit;
+      padding: 16px;
+      padding-left: 0px;
+      font-size: 16px;
+      outline: none;
+    }
+  }
+
+  &__result {
+    display: flex;
+
+    &--selected {
+      background-color: lightgray;
+    }
+
+    &__text {
+      padding: 15px;
+      padding-left: 0px;
+      font-size: 16px;
+      transform: translate(0, 3px);
+    }
+  }
+}
-- 
cgit v1.1


From 0bddf7661d7ece709a18f2d167b928749638f318 Mon Sep 17 00:00:00 2001
From: Noah Loomans <noahloomans@gmail.com>
Date: Wed, 24 Jan 2018 15:44:31 +0100
Subject: Add animation to results

---
 src/client/style/_component-search.scss | 5 +++++
 1 file changed, 5 insertions(+)

(limited to 'src/client/style/_component-search.scss')

diff --git a/src/client/style/_component-search.scss b/src/client/style/_component-search.scss
index cac1ae3..d819e6f 100644
--- a/src/client/style/_component-search.scss
+++ b/src/client/style/_component-search.scss
@@ -35,6 +35,11 @@
     }
   }
 
+  &__results {
+    transition: 0.1s ease-in-out min-height;
+    overflow: hidden;
+  }
+
   &__result {
     display: flex;
 
-- 
cgit v1.1


From 16723546de81e29fa8a31acc4070df5acb182b24 Mon Sep 17 00:00:00 2001
From: Noah Loomans <noahloomans@gmail.com>
Date: Wed, 24 Jan 2018 16:08:49 +0100
Subject: Add basic styling to user page

---
 src/client/style/_component-search.scss | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

(limited to 'src/client/style/_component-search.scss')

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);
-- 
cgit v1.1