fix mobile responsive

l4rm4nd · Jul 8, 2024 · 236ab22 · 236ab22
1 parent 5698794
commit 236ab22
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 21 deletions.
diff --git a/database/db.sqlite3 b/database/db.sqlite3
diff --git a/myapp/templates/base.html b/myapp/templates/base.html
@@ -58,13 +58,6 @@
     <nav class="header-nav ms-auto">
       <ul class="d-flex align-items-center">
 
-        <li class="nav-item d-block d-lg-none">
-          <a class="nav-link nav-icon search-bar-toggle " href="#">
-            <i class="bi bi-search"></i>
-          </a>
-        </li><!-- End Search Icon-->
-        </li><!-- End Messages Nav -->
-
         <li class="nav-item dropdown pe-3">
 
           <a class="nav-link nav-profile d-flex align-items-center pe-0" href="#" data-bs-toggle="dropdown">

diff --git a/myapp/templates/show-item.html b/myapp/templates/show-item.html
@@ -11,37 +11,44 @@ <h1>Inventory</h1>
       </nav>
     </div><!-- End Page Title -->
 
-    <section class="section dashboard">
-      <div class="row">
-        <!-- Filter Dropdown -->
-        <div class="col-12 mb-3">
-          <form method="GET" action="">
-            <div class="d-flex">
-              <select name="type" onchange="this.form.submit()" class="form-select me-2">
+  <section class="section dashboard">
+    <div class="row">
+      <!-- Filter Dropdown -->
+      <div class="col-12 mb-3">
+        <form method="GET" action="">
+          <div class="row g-2">
+            <div class="col-12 col-md-3">
+              <select name="type" onchange="this.form.submit()" class="form-select">
                 <option value="">All Items</option>
                 <option value="voucher" {% if item_type == 'voucher' %}selected{% endif %}>Vouchers</option>
                 <option value="giftcard" {% if item_type == 'giftcard' %}selected{% endif %}>Gift Cards</option>
                 <option value="coupon" {% if item_type == 'coupon' %}selected{% endif %}>Coupons</option>
               </select>
-              <select name="status" onchange="this.form.submit()" class="form-select me-2">
+            </div>
+            <div class="col-12 col-md-3">
+              <select name="status" onchange="this.form.submit()" class="form-select">
                 <option value="">All Status</option>
                 <option value="available" {% if item_status == 'available' %}selected{% endif %}>Available</option>
                 <option value="used" {% if item_status == 'used' %}selected{% endif %}>Used</option>
                 <option value="expired" {% if item_status == 'expired' %}selected{% endif %}>Expired</option>
               </select>
-              <input type="text" name="query" placeholder="Search" value="{{ search_query }}" class="form-control me-2">
+            </div>
+            <div class="col-12 col-md-4">
+              <input type="text" name="query" placeholder="Search" value="{{ search_query }}" class="form-control">
+            </div>
+            <div class="col-12 col-md-2 d-grid">
               <button type="submit" class="btn btn-primary">Search</button>
             </div>
-          </form>
-        </div><!-- End Filter Dropdown -->
-
+          </div>
+        </form>
+      </div><!-- End Filter Dropdown -->
         <!-- Full width columns -->
-        <div class="col-lg-12">
+        <div class="col-12">
           <div class="row">
 
             <!-- Items Card -->
             {% for entry in items_with_qr %}
-            <div title="{{ entry.item.description }}" class="col-9 col-md-6 col-lg-6">
+            <div title="{{ entry.item.description }}" class="col-12 col-md-12 col-lg-12">
               <a href="{% url 'view_item' item_uuid=entry.item.id %}" style="text-decoration: none; color: inherit;">
                 <div class="card info-card sales-card">
                   <div class="card-body">