From 195046d244d49351140700f45fca4f03fc78d68e Mon Sep 17 00:00:00 2001
From: NikolaBorislavovHristov <hristovnikola@protonmail.com>
Date: Wed, 18 Sep 2019 22:59:23 +0300
Subject: [PATCH] basic search bar placeholder implemented

---
 src/routes/Addons/Addons.js   |  1 +
 src/routes/Addons/styles.less | 37 ++++++++++++++++++++---------------
 2 files changed, 22 insertions(+), 16 deletions(-)

diff --git a/src/routes/Addons/Addons.js b/src/routes/Addons/Addons.js
index 620931749..f3c11713a 100644
--- a/src/routes/Addons/Addons.js
+++ b/src/routes/Addons/Addons.js
@@ -19,6 +19,7 @@ const Addons = ({ urlParams }) => {
                     {dropdowns.map((dropdown) => (
                         <Dropdown {...dropdown} key={dropdown.name} className={styles['dropdown']} />
                     ))}
+                    <div className={styles['search-bar-container']} />
                 </div>
                 <div className={styles['addons-list-container']} >
                     {addons.map((addon) => (
diff --git a/src/routes/Addons/styles.less b/src/routes/Addons/styles.less
index 9426efe74..1e9edc91a 100644
--- a/src/routes/Addons/styles.less
+++ b/src/routes/Addons/styles.less
@@ -19,26 +19,14 @@
             flex-direction: row;
             margin: 2rem;
 
-            .dropdown, .add-button-container {
-                flex-grow: 0;
-                flex-shrink: 1;
-                height: 3rem;
-
-                &:not(:last-child) {
-                    margin-right: 1rem;
-                }
-            }
-
-            .dropdown {
-                flex-basis: 15rem;
-            }
-
             .add-button-container {
-                flex-basis: auto;
+                flex: none;
                 display: flex;
                 flex-direction: row;
                 align-items: center;
+                height: 3rem;
                 max-width: 15rem;
+                margin-right: 1rem;
                 padding: 0 1rem;
                 background-color: var(--color-signal5);
 
@@ -55,12 +43,29 @@
                 }
 
                 .add-button-label {
-                    flex: 1;
+                    flex-grow: 0;
+                    flex-shrink: 1;
+                    flex-basis: auto;
                     max-height: 2.4em;
                     font-size: 1.1rem;
                     color: var(--color-surfacelighter);
                 }
             }
+
+            .dropdown {
+                flex-grow: 0;
+                flex-shrink: 1;
+                flex-basis: 15rem;
+                height: 3rem;
+                margin-right: 1rem;
+            }
+
+            .search-bar-container {
+                flex-grow: 0;
+                flex-shrink: 1;
+                flex-basis: 19rem;
+                height: 3rem;
+            }
         }
 
         .addons-list-container {