Adjust height of the tab bar

This commit is contained in:
2026-05-07 18:07:56 +02:00
parent 53a7212dfe
commit 544df5175d
6 changed files with 49 additions and 46 deletions

View File

@@ -139,12 +139,12 @@ export function getShoppingListHTML() {
</div>
<!-- ── scrollable list ── -->
<div id="sl-scroll" class="flex-1 overflow-y-auto no-scrollbar px-4 pb-24" style="background:rgb(var(--app-bg-rgb)) !important; padding-top:calc(1rem + var(--recipe-control-size, 3.05rem) + 0.9rem); scroll-padding-top:calc(1rem + var(--recipe-control-size, 3.05rem) + 0.9rem);">
<div id="sl-scroll" class="flex-1 overflow-y-auto no-scrollbar px-4 pb-32" style="background:rgb(var(--app-bg-rgb)) !important; padding-top:calc(1rem + var(--recipe-control-size, 3.05rem) + 0.9rem); scroll-padding-top:calc(1rem + var(--recipe-control-size, 3.05rem) + 0.9rem);">
<div id="sl-board"></div>
</div>
<div id="shopping-bottom-controls" class="pointer-events-none absolute inset-x-0 z-[24] h-[3.05rem]" style="bottom:calc(1.58rem + env(safe-area-inset-bottom) + var(--recipe-controls-lift, 0.335rem)); height:var(--recipe-control-size, 3.05rem); background:transparent !important; border:none !important; box-shadow:none !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important;">
<div id="sl-bought-wrap" class="pointer-events-auto absolute bottom-0" style="left:calc(var(--catalog-menu-left, 1rem) + var(--recipe-dock-width, calc(100% - 2rem)) - var(--recipe-control-size, 3.05rem));">
<div id="shopping-bottom-controls" class="pointer-events-none absolute inset-x-0 z-[24] h-[3.9rem]" style="bottom:calc(1.58rem + env(safe-area-inset-bottom) + var(--recipe-controls-lift, 0.335rem)); height:var(--recipe-bottom-control-size, 3.9rem); background:transparent !important; border:none !important; box-shadow:none !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important;">
<div id="sl-bought-wrap" class="pointer-events-auto absolute bottom-0" style="left:calc(var(--catalog-menu-left, 1rem) + var(--recipe-dock-width, calc(100% - 2rem)) - var(--recipe-bottom-control-size, 3.9rem));">
<button type="button" id="sl-bought-btn" class="recipe-glass-btn recipe-bottom-action relative flex items-center justify-center transition-all duration-200" aria-label="Kupione">
<i class="fas fa-check" aria-hidden="true"></i>
<span id="sl-bought-badge" class="absolute -top-0.5 -right-0.5 min-w-[16px] h-4 px-1 rounded-full text-[9px] font-bold items-center justify-center" style="background:rgb(var(--success-rgb)); color:rgb(var(--on-accent-rgb)); display:none;">0</span>