Merge branch 'master' into ink_edits

1 files changed, 32 insertions, 37 deletions

diff --git a/src/client/views/search/SearchBox.scss b/src/client/views/search/SearchBox.scss
index bb62113a1..3f06ba7d3 100644
--- a/src/client/views/search/SearchBox.scss
+++ b/src/client/views/search/SearchBox.scss
@@ -17,10 +17,9 @@
 .searchBox-bar {
     height: 32px;
     display: flex;
-    justify-content: flex-end;
+    justify-content: center;
     align-items: center;
-    padding-left: 2px;
-
+    background-color: black;
     .searchBox-barChild {
 
         &.searchBox-collection {
@@ -30,24 +29,29 @@
         }
 
         &.searchBox-input {
+            margin:5px;
+            border-radius:20px;
+            border:black;    
             display: block;
             width: 130px;
             -webkit-transition: width 0.4s;
             transition: width 0.4s;
             align-self: stretch;
-
+            outline:none;
         }
 
         .searchBox-input:focus {
             width: 500px;
-            outline: 3px solid lightblue;
+            outline:none;
         }
 
         &.searchBox-filter {
             align-self: stretch;
+            button{
+                transform:none;
+            }
             button:hover{
-                transform:scale(1.0);
-                background:"#121721";
+                transform:none;
             }
         }
 
@@ -81,8 +85,6 @@
     .no-result {
         width: 500px;
         background: $light-color-secondary;
-        border-color: $intermediate-color;
-        border-bottom-style: solid;
         padding: 10px;
         height: 50px;
         text-transform: uppercase;
@@ -96,20 +98,20 @@
     background: #121721;
     flex-direction: column;
     transform-origin: top;
-    transition: height 0.3s ease, display 0.6s ease;
+    transition: height 0.3s ease, display 0.6s ease, overflow 0.6s ease;
     height:0px;
     overflow:hidden;
 
 
     .filter-header {
-        display: flex;
+        //display: flex;
         position: relative;
-        flex-wrap:wrap;
+        //flex-wrap:wrap;
         right: 1px;
         color: grey;
-        flex-direction: row-reverse;
+        //flex-direction: row-reverse;
         transform-origin: top;
-        justify-content: space-evenly;
+        //justify-content: space-evenly;
         margin-bottom: 5px;
         overflow:hidden;
         transition:height 0.3s ease-out;
@@ -130,9 +132,7 @@
         color: grey;
         transform-origin: top;
         border-top: 0px;
-        //padding-top: 5px;
-        margin-left: 10px;
-        margin-right: 10px;
+
         overflow:hidden;
         transition:height 0.3s ease-out;
         height:0px;
@@ -144,30 +144,25 @@
         color: grey;
         transform-origin: top;
         border-top: 0px;
-        //padding-top: 5px;
-        margin-left: 10px;
-        margin-right: 10px;
         overflow:hidden;
         transition:height 0.3s ease-out;
         height:0px;
-        .filter-keybar {
-            display: flex;
-            flex-wrap: wrap;
-            justify-content: space-evenly;
-            height: auto;
-            width: 100%;
-            flex-direction: row-reverse;
-            margin-top:5px;
+        
+        // .filter-keybar {
+        //     display: flex;
+        //     flex-wrap: wrap;
+        //     justify-content: space-evenly;
+        //     height: auto;
+        //     width: 100%;
+        //     flex-direction: row-reverse;
+        //     margin-top:5px;
             
-            .filter-item {
-                position: relative;
-                border:1px solid grey;
-                border-radius: 16px;
-    
-            }
-        }
-
-
+        //     .filter-item {
+        //         position: relative;
+        //         border:1px solid grey;
+        //         border-radius: 16px;
+        //     }
+        // }
     }
 }