Add search bar for new recipes without functionality.

views/dashboardPage/css/sidebars/newRecipe.css

@@ -12,6 +12,11 @@
         justify-content: left;
         background: rgb(240, 252, 255);
         color: black;
+        margin: 2px 0;
+        width: 100%;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
     }
 
     #newRecipeContent{
@@ -22,15 +27,28 @@
         padding: 10px;
     }
 
-        #recipeChoices{
+        #newRecipeLeft{
+            display: flex;
+            flex-direction: column;
+            align-items: center;
             width: 40%;
-            border-right: 1px solid rgb(255, 99, 107);
             height: 100%;
-            overflow-y: auto;
-            padding: 10px;
-            box-sizing: border-box;
+            border-right: 1px solid rgb(255, 99, 107);
+            padding-right: 10px;
         }
 
+            #newRecipeLeft input{
+                width: 100%;
+                margin-bottom: 15px;
+                box-sizing: border-box;
+            }
+
+            #recipeChoices{
+                width: 100%;
+                overflow-y: auto;
+                flex-grow: 2;
+            }
+
         #newRecipeData{
             display: flex;
             flex-direction: column;

views/dashboardPage/ejs/sidebars/newRecipe.ejs

@@ -11,7 +11,12 @@
     <h1>NEW RECIPE</h1>
 
     <div id="newRecipeContent">
-        <div id="recipeChoices"></div>
+        <div id="newRecipeLeft">
+            <input id="newRecipeSearch" type="text" placeholder="SEARCH">
+
+            <div id="recipeChoices"></div>
+        </div>
+        
 
         <div id="newRecipeData">
             <div id="newRecipeDataInputs">