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.
This commit is contained in:
2025-08-07 19:32:42 +02:00
parent 017f88846e
commit dd5923a03e

View File

@@ -14,19 +14,20 @@
muted></video> muted></video>
</div> </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 --> <!-- Search box and suggestions -->
<div class="d-flex justify-content-center mt-4"> <div class="d-flex justify-content-center mt-4">
<div class="input-group" style="max-width: 500px; width: 100%;"> <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"> <input type="text" id="search-box" class="form-control" placeholder="Search..." autocomplete="off">
<button id="go-button" class="btn btn-success">Go</button> <button id="go-button" class="btn btn-success">Go</button>
</div> </div>
<!-- Suggestions -->
<ul id="suggestions" class="list-group position-absolute w-100 mt-1" style="z-index: 1000;"></ul>
</div> </div>
</div>
<!-- Suggestions list --> <!-- Suggestions list -->
<div class="d-flex justify-content-center"> <div class="d-flex justify-content-center">