ulfr/recipe-mockup
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add titles to menu
Some checks failed
Build and Deploy / build-and-push (push) Failing after 1m15s
Details

Browse Source
This commit is contained in:
Rafał
2026-04-21 22:44:08 +02:00
parent e914f93781
commit 2f362a7e56
6 changed files with 55 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
js/ui/bottomNav.js
View File

@@ -5,21 +5,25 @@ export function getBottomNavHTML() {
<div class="nav-slot">
<button type="button" data-tab="planner" id="nav-planner" class="nav-tab is-active" aria-label="Planer" aria-current="page">
<i class="far fa-calendar-alt" aria-hidden="true"></i>
<span class="nav-label">Planer</span>
</button>
</div>
<div class="nav-slot">
<button type="button" data-tab="recipes" id="nav-recipes" class="nav-tab" aria-label="Przepisy">
<button type="button" data-tab="recipes" id="nav-recipes" class="nav-tab" aria-label="Katalog">
<i class="fas fa-search" aria-hidden="true"></i>
<span class="nav-label">Katalog</span>
</button>
</div>
<div class="nav-slot">
<button type="button" data-tab="pantry" id="nav-pantry" class="nav-tab" aria-label="Spiżarnia">
<i class="fas fa-warehouse" aria-hidden="true"></i>
<span class="nav-label">Spiżarnia</span>
</button>
</div>
<div class="nav-slot" style="position:relative;">
<button type="button" data-tab="shopping" id="nav-shopping" class="nav-tab" aria-label="Zakupy">
<i class="fas fa-cart-shopping" aria-hidden="true"></i>
<span class="nav-label">Zakupy</span>
</button>
</div>
</div>

3
js/views/MealPlanner.js
View File

@@ -74,8 +74,7 @@ export function getMealPlannerHTML() {
return `
<div id="planner-view" class="hidden flex flex-col h-full absolute inset-0 overflow-hidden bg-[rgb(var(--app-bg-rgb))] z-10">
<div id="planner-cal-bar" class="shrink-0 bg-[rgb(var(--app-bg-rgb))] border-b border-[rgb(var(--card-strong-rgb))] mt-3 relative z-10">
<div class="min-h-12 px-4 pt-4 pb-3 flex items-center justify-between gap-3 min-w-0">
<h1 class="min-w-0 flex-1 truncate" style="margin:0;padding:0;color:rgb(var(--text-emphasis-rgb));font-family:var(--app-font);font-size:18px;font-weight:700;line-height:1.2;letter-spacing:-0.02em;">Plan posiłków</h1>
<div class="min-h-12 px-4 pt-4 pb-3 flex items-center justify-end gap-3 min-w-0">
${createCalendarTopbarHTML({
todayId: 'cal-go-today',
wrapperClass: 'flex shrink-0 items-center justify-end',

4
js/views/Pantry.js
View File

@@ -174,9 +174,7 @@ export function getPantryHTML() {
<div id="pantry-topbar-outer" class="pointer-events-none absolute inset-x-0 top-0 z-[12] px-4 pt-4 pb-4" style="background:rgb(var(--app-bg-rgb)) !important; border:none !important;">
<div class="pointer-events-auto relative z-[1] w-full">
<div id="pantry-topbar" class="relative min-h-12">
<div id="pantry-default-row" class="flex min-h-12 items-center gap-2 transition-all duration-200" style="opacity:1; transform:translateY(0) scale(1);">
<h1 class="flex-1 min-w-0 truncate" style="margin:0;padding:0;color:rgb(var(--text-emphasis-rgb));font-family:var(--app-font);font-size:18px;font-weight:700;line-height:1.2;letter-spacing:-0.02em;">Zapasy</h1>
<div id="pantry-default-row" class="flex min-h-12 items-center justify-end gap-2 transition-all duration-200" style="opacity:1; transform:translateY(0) scale(1);">
<div id="pantry-horizon-wrap" class="relative shrink">
<button type="button" id="pantry-horizon-compact" class="min-w-0 max-w-[12rem] h-10 rounded-full flex items-center gap-1.5 px-2.5 transition-all" style="background:rgb(var(--card-rgb)) !important; border:1px solid rgb(var(--border-card-rgb)) !important; box-shadow:var(--shadow-shell) !important;">
<span id="pantry-horizon-compact-label" class="min-w-0 flex-1 text-left text-[13px] font-normal truncate" style="color:rgb(var(--text-body-rgb));"></span>

4
js/views/RecipeList.js
View File

@@ -115,9 +115,7 @@ export function getRecipeListHTML() {
<div class="pointer-events-auto relative z-[1] w-full">
<div id="recipe-topbar" class="relative min-h-12">
<div id="recipe-default-row" class="flex min-h-12 items-center gap-2 transition-all duration-200" style="opacity:1; transform:translateY(0) scale(1);">
<h1 class="min-w-0 flex-1 truncate" style="margin:0;padding:0;color:rgb(var(--text-emphasis-rgb));font-family:var(--app-font);font-size:18px;font-weight:700;line-height:1.2;letter-spacing:-0.02em;">Katalog przepisów</h1>
<div id="recipe-default-row" class="flex min-h-12 items-center justify-end gap-2 transition-all duration-200" style="opacity:1; transform:translateY(0) scale(1);">
<div id="recipe-filter-wrap" class="relative shrink-0">
<button type="button" id="recipe-filter-btn" class="relative w-11 h-11 rounded-full shrink-0 flex items-center justify-center transition-all duration-200" style="background:rgb(var(--card-rgb)); border:1px solid rgb(var(--border-card-rgb)); box-shadow:var(--shadow-shell); color:rgb(var(--text-body-rgb));" aria-label="Otwórz filtry">
<i class="fas fa-sliders-h text-[12px]" aria-hidden="true"></i>

3
js/views/ShoppingList.js
View File

@@ -123,8 +123,7 @@ export function getShoppingListHTML() {
<div class="shrink-0 px-4 pt-5 pb-0">
<!-- title row + pill + bought button (position:relative anchors the popups) -->
<div class="flex items-center gap-2 mb-4" style="position:relative;">
<h1 class="flex-1 text-[18px] font-bold" style="color:rgb(var(--text-emphasis-rgb));">Lista zakupów</h1>
<div class="flex items-center justify-end gap-2 mb-4" style="position:relative;">
<button type="button" id="sl-range-pill" class="min-w-0 max-w-[10rem] h-10 rounded-full flex items-center gap-1.5 px-2.5 transition-all shrink" style="background:rgb(var(--card-rgb)); border:1px solid rgb(var(--border-card-rgb)); box-shadow:var(--shadow-shell);">
<span id="sl-range-label" class="min-w-0 flex-1 text-left text-[13px] font-normal truncate" style="color:rgb(var(--text-body-rgb));"></span>
<i id="sl-range-chevron" class="fas fa-chevron-down text-[10px] shrink-0 transition-transform duration-200" style="color:rgb(var(--text-dim-rgb));"></i>