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

Unify calendar code
Some checks failed
Build and Deploy / build-and-push (push) Failing after 1m16s
Details

Browse Source
This commit is contained in:
Rafał
2026-04-20 23:44:18 +02:00
parent c43b3766cd
commit 08a275093c
7 changed files with 783 additions and 486 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
js/views/Pantry.js
View File

@@ -10,6 +10,11 @@ import {
createSwipePopoverCalendarHTML,
initSwipePopoverCalendar,
} from '../ui/swipePopoverCalendar.js';
import {
createCalendarPopoverHTML,
stabilizeSwipeCalendarLayout,
syncCalendarPopoverVisibility,
} from '../ui/calendarPopover.js';
import { createIngredientCardController, getIngredientCardHTML } from '../ui/ingredientCard.js?v=20260417-116';
/* ── helpers ── */
@@ -202,9 +207,10 @@ export function getPantryHTML() {
</div>
<div id="pantry-calendar-popover" class="absolute left-0 right-0 top-full mt-2 rounded-[1.35rem] py-3 transition-all duration-200 pointer-events-none" style="background:rgb(var(--sunken-rgb)) !important; border:1px solid rgb(var(--border-input-rgb)) !important; box-shadow:var(--shadow-shell) !important; opacity:0; transform:translateY(-6px) scale(0.98);">
${createSwipePopoverCalendarHTML({ idPrefix: 'pantry-cal' })}
</div>
${createCalendarPopoverHTML({
id: 'pantry-calendar-popover',
calendarHTML: createSwipePopoverCalendarHTML({ idPrefix: 'pantry-cal' }),
})}
<div id="pantry-search-shell" class="absolute inset-0 flex items-center gap-2 rounded-full px-3 transition-all duration-200 pointer-events-none" style="background:rgb(var(--sunken-rgb)) !important; border:1px solid rgb(var(--border-input-rgb)) !important; box-shadow:var(--shadow-shell) !important; opacity:0; transform:translateY(-2px) scale(0.98);">
<i class="fas fa-search text-[13px] shrink-0" style="color:rgb(var(--text-dim-rgb));"></i>
@@ -254,19 +260,13 @@ function syncHorizonUI() {
defaultRow.style.pointerEvents = showDefault ? 'auto' : 'none';
}
if (compactPill) {
compactPill.style.setProperty('background', showCalendar ? 'rgb(var(--sunken-rgb))' : 'rgb(var(--card-rgb))', 'important');
compactPill.style.setProperty('border-color', showCalendar ? 'rgb(var(--border-input-rgb))' : 'rgb(var(--border-card-rgb))', 'important');
}
if (popover) {
popover.style.opacity = showCalendar ? '1' : '0';
popover.style.transform = showCalendar ? 'translateY(0) scale(1)' : 'translateY(-6px) scale(0.98)';
popover.style.pointerEvents = showCalendar ? 'auto' : 'none';
}
if (chevron) {
chevron.style.transform = showCalendar ? 'rotate(180deg)' : 'rotate(0deg)';
}
syncCalendarPopoverVisibility({
popup: popover,
isOpen: showCalendar,
chevron,
trigger: compactPill,
triggerImportant: true,
});
if (filterPopover) {
filterPopover.style.opacity = showFilter ? '1' : '0';
@@ -415,9 +415,9 @@ function openCalendar() {
isFilterOpen = false;
isCalendarOpen = true;
syncHorizonUI();
requestAnimationFrame(() => {
pantryCalendar?.reapplyLayout();
pantryCalendar?.resetTrackPosition();
stabilizeSwipeCalendarLayout({
calendar: pantryCalendar,
viewport: 'pantry-cal-viewport',
});
}