From dd5923a03e8cbb00466962e99bcd493f9d3c714f Mon Sep 17 00:00:00 2001
From: Stef <stbuwalda@gmail.com>
Date: Thu, 7 Aug 2025 19:32:42 +0200
Subject: [PATCH] Refactor search box and suggestions layout in
 scan_barcode.html

Reorganized the search input and suggestions into a single container with improved positioning and removed the duplicate suggestions list. Also removed the start/stop scanning buttons section for a cleaner UI.
---
 .../add_meal/templates/scan_barcode.html      | 19 ++++++++++---------
 1 file changed, 10 insertions(+), 9 deletions(-)

diff --git a/application/add_meal/templates/scan_barcode.html b/application/add_meal/templates/scan_barcode.html
index 0a07d4d..7909fca 100644
--- a/application/add_meal/templates/scan_barcode.html
+++ b/application/add_meal/templates/scan_barcode.html
@@ -14,20 +14,21 @@
             muted></video>
     </div>
 
-    <!-- Start/Stop buttons -->
-    <div class="d-flex justify-content-center gap-3 mb-4">
-        <button id="startButton" class="btn btn-primary px-4">Start Scanning</button>
-        <button id="stopButton" class="btn btn-danger px-4">Stop</button>
-    </div>
-
     <!-- Search box and suggestions -->
     <div class="d-flex justify-content-center mt-4">
-        <div class="input-group" style="max-width: 500px; width: 100%;">
-            <input type="text" id="search-box" class="form-control" placeholder="Search..." autocomplete="off">
-            <button id="go-button" class="btn btn-success">Go</button>
+        <div class="w-100 position-relative" style="max-width: 500px;">
+            <!-- Input group (search + go button) -->
+            <div class="input-group">
+                <input type="text" id="search-box" class="form-control" placeholder="Search..." autocomplete="off">
+                <button id="go-button" class="btn btn-success">Go</button>
+            </div>
+
+            <!-- Suggestions -->
+            <ul id="suggestions" class="list-group position-absolute w-100 mt-1" style="z-index: 1000;"></ul>
         </div>
     </div>
 
+
     <!-- Suggestions list -->
     <div class="d-flex justify-content-center">
         <ul id="suggestions" class="list-group position-absolute mt-1 w-100" style="max-width: 500px; z-index: 1000;">