romfast/gomag-vending
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(design): FINDING-004 — fix mobile pills horizontal overflow

Browse Source 
Mobile segmented control (7 buttons, 431px) overflowed 375px viewport.
Added overflow-x:auto on segmented containers and min-width:0 on
flex-grow child. Body scroll width now matches viewport.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Claude Agent
2026-03-27 12:00:50 +00:00
parent 2fabce7c5b
commit ef996a45b2
2 changed files with 3 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
api/app/templates/dashboard.html
View File

@@ -78,8 +78,8 @@
<button class="filter-pill d-none d-md-inline-flex" data-status="CANCELLED">Anulate <span class="filter-count fc-dark" id="cntCanc">0</span></button> <button class="filter-pill d-none d-md-inline-flex" data-status="CANCELLED">Anulate <span class="filter-count fc-dark" id="cntCanc">0</span></button>
<button class="btn btn-sm btn-outline-secondary d-none d-md-inline-flex" id="btnRefreshInvoices" onclick="refreshInvoices()" title="Actualizeaza status facturi din Oracle">&#8635;</button> <button class="btn btn-sm btn-outline-secondary d-none d-md-inline-flex" id="btnRefreshInvoices" onclick="refreshInvoices()" title="Actualizeaza status facturi din Oracle">&#8635;</button>
</div> </div>
<div class="d-md-none mb-2 d-flex align-items-center gap-2"> <div class="d-md-none mb-2 d-flex align-items-center gap-2" style="max-width:100%;overflow:hidden">
<div class="flex-grow-1" id="dashMobileSeg"></div> <div class="flex-grow-1" id="dashMobileSeg" style="min-width:0;overflow-x:auto"></div>
<button class="btn btn-sm btn-outline-secondary" id="btnRefreshInvoicesMobile" onclick="refreshInvoices()" title="Actualizeaza facturi" style="padding:4px 8px; font-size:1rem; line-height:1">&#8635;</button> <button class="btn btn-sm btn-outline-secondary" id="btnRefreshInvoicesMobile" onclick="refreshInvoices()" title="Actualizeaza facturi" style="padding:4px 8px; font-size:1rem; line-height:1">&#8635;</button>
</div> </div>
</div> </div>

2
api/app/templates/logs.html
View File

@@ -57,7 +57,7 @@
<button class="filter-pill d-none d-md-inline-flex" data-log-status="SKIPPED">Omise <span class="filter-count fc-yellow" id="countSkipped">0</span></button> <button class="filter-pill d-none d-md-inline-flex" data-log-status="SKIPPED">Omise <span class="filter-count fc-yellow" id="countSkipped">0</span></button>
<button class="filter-pill d-none d-md-inline-flex" data-log-status="ERROR">Erori <span class="filter-count fc-red" id="countError">0</span></button> <button class="filter-pill d-none d-md-inline-flex" data-log-status="ERROR">Erori <span class="filter-count fc-red" id="countError">0</span></button>
</div> </div>
<div class="d-md-none mb-2" id="logsMobileSeg"></div> <div class="d-md-none mb-2" id="logsMobileSeg" style="overflow-x:auto"></div>
<!-- Orders table --> <!-- Orders table -->
<div class="card mb-3"> <div class="card mb-3">