Moved styling from local static files into work space

blizzardblast/static/css/styles.css

@@ -120,3 +120,66 @@ header {
     background-color: #BFCDE0;
     color: #3B3355;
 }
+
+#filter-area {
+    display: flex;
+    justify-content: center;
+}
+
+#filter-area>button {
+    padding: 0.5rem 7rem;
+    background-color: #BFCDE0;
+    color: #3B3355;
+    border-radius: 2rem;
+}
+
+.search-bar {
+    border:none;
+    padding: 12px;
+    margin: 0 12px;
+}
+
+#filter-area>.search-button {
+    border: none;
+    background-color: #BFCDE0;
+    color: #3B3355;
+    margin: 0.3rem 4rem;
+    padding: 0.5rem 8rem;
+    border-radius: 2rem;
+}
+
+#filter-area>.search-button:hover {
+    text-decoration: underline;
+    cursor: pointer;
+    background-color: #3B3355;
+    color:#FEFCFD;
+}
+
+#search-filter {
+    border: #3B3355 1px solid;;
+    border-radius: 2rem;
+    padding: 0.6rem;
+}
+
+#CRUD-features {
+    display: flex;
+    justify-content: center;
+    margin: 4px auto;
+    padding: 10px;
+}
+
+#CRUD-features>button {
+    border: none;
+    background-color: #BFCDE0;
+    color: #3B3355;
+    margin: 0.3rem 4rem;
+    padding: 0.5rem 8rem;
+    border-radius: 2rem;
+}
+
+#CRUD-features>button:hover {
+    text-decoration: underline;
+    cursor: pointer;
+    background-color: #3B3355;
+    color:#FEFCFD;
+}
\ No newline at end of file

blizzardblast/templates/inventory.html

@@ -8,5 +8,18 @@
 
 {% block content %}
 <h1 class='view-title'>Inventory</h1>
+<!-- SEARCH BOX -->
+<div id="filter-area">
+    <select name="search-filter" id="search-filter">
+        <option selected="selected">Filter</option>
+        <option value="category">Category</option>
+    </select>
+    <input class="search-bar" size=60 type="text" placeholder="Search..">
+    <button class="search-button">Search</button>
+</div>
 
+<div id="CRUD-features">
+    <button id="add-to-inventory">Add to Inventory</button>
+    <button id="update">Refresh</button>
+</div>
 {% endblock %}

blizzardblast/templates/order.html

@@ -8,10 +8,21 @@
 
 {% block content %}
 
-<h1 class='view-title'>Create Order</h1>
-<div class='button-container'>
-    <button class='order-button'>Add Order</button>
-    <button class='order-button'>Update Order</button>
-    <button class='order-button'>Delete Order</button>
+<h1 class='view-title'>Order</h1>
+<!-- SEARCH BOX -->
+<div id="filter-area">
+    <select name="search-filter" id="search-filter">
+        <option selected="selected">Filter</option>
+        <option value="total-sales-monthly">Total Monthly Sales</option>
+        <option value="Receipt">Individual Receipt</option>
+    </select>
+    <input class="search-bar" size=60 type="text" placeholder="Search..">
+    <button class="search-button">Search</button>
+</div>
+
+<div id="CRUD-features">
+    <button id="addorder">Add Order</button>
+    <button id="deleteorder">Delete Order</button>
+    <button id="update">Refresh</button>
 </div>
 {% endblock %}