Move UI to BoardUI with slate + salmon theme; add PDF plan export
- Adopt BoardUI (Pro init): theme tokens, Inter, .dark mode, Button, SegmentedControl, Meter, Skeleton and ThemeToggle; remap the app's color aliases onto BoardUI tokens and swap lucide for Remix icons - Retint BoardUI's neutral ramp to cool slate with a salmon accent; drop the dotted background; raise muted text contrast - Simplify the landing page and remove the overlap explorer - Planner: explicit "I have this" toggle on grocery lines, pantry panel above the menu with the staples list spelled out, sticky aisle header fix, and a "Download PDF" plan export (jsPDF, lazy-loaded) - Recipes: replace the family cabbage soup with Cade's Cabbage Soup (adds Bone-In Ham Steak to the catalog); remove Ham, Bean & Cabbage Soup - Remove unused BoardUI components, dependencies and exports Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
parent
b02c7a024b
commit
df5dd3a70e
56 changed files with 4749 additions and 788 deletions
|
|
@ -1,12 +1,13 @@
|
|||
"use client";
|
||||
|
||||
import { ArrowRight, CalendarPlus, Check, X } from "lucide-react";
|
||||
import { RiArrowRightLine as ArrowRight, RiCalendarCheckLine as CalendarPlus, RiCheckLine as Check, RiCloseLine as X } from "@remixicon/react";
|
||||
import Link from "next/link";
|
||||
import { useEffect, useRef, useState } from "react";
|
||||
import { DAY_NAMES, mealLabel, slotKey, visibleMeals } from "@/app/lib/plan";
|
||||
import { RECIPES_BY_ID } from "@/app/lib/recipes";
|
||||
import { DEFAULT_STATE, sanitizeState } from "@/app/lib/sanitize";
|
||||
import type { MealPlanState } from "@/app/types";
|
||||
import { Button } from "@/components/base/buttons/button";
|
||||
|
||||
const STORAGE_KEY = "budget-meal-planner:v2";
|
||||
|
||||
|
|
@ -56,17 +57,15 @@ export function AddToPlanControl({ recipeId, recipeTitle }: { recipeId: string;
|
|||
|
||||
return (
|
||||
<div className="flex flex-wrap items-center gap-3">
|
||||
<button
|
||||
type="button"
|
||||
<Button
|
||||
leadingIcon={CalendarPlus}
|
||||
onClick={() => {
|
||||
setPlan(readPlan());
|
||||
setOpen(true);
|
||||
}}
|
||||
className="trim-cap inline-flex min-h-10 items-center gap-2 rounded-lg bg-brand-600 px-4 py-2 text-sm font-semibold text-on-accent shadow-2xs transition-colors hover:bg-brand-500"
|
||||
>
|
||||
<CalendarPlus className="size-4" strokeWidth={2} aria-hidden />
|
||||
Add to meal plan
|
||||
</button>
|
||||
</Button>
|
||||
|
||||
{addedLabel && (
|
||||
<span className="inline-flex flex-wrap items-center gap-2 rounded-lg border border-status-ok-line bg-status-ok-bg px-3 py-1.5 text-xs font-medium text-status-ok">
|
||||
|
|
@ -84,7 +83,7 @@ export function AddToPlanControl({ recipeId, recipeTitle }: { recipeId: string;
|
|||
onClose={() => setOpen(false)}
|
||||
onClick={(e) => e.target === dialogRef.current && setOpen(false)}
|
||||
aria-labelledby="add-to-plan-title"
|
||||
className="m-0 mt-auto max-h-[85dvh] w-full max-w-none overflow-y-auto rounded-t-2xl border border-line bg-surface p-0 text-ink shadow-2xl sm:m-auto sm:max-w-lg sm:rounded-2xl"
|
||||
className="m-0 mt-auto max-h-[85dvh] w-full max-w-none overflow-y-auto rounded-t-3xl border border-line bg-surface p-0 text-ink shadow-2xl sm:m-auto sm:max-w-lg sm:rounded-3xl"
|
||||
>
|
||||
<div className="p-5 sm:p-6">
|
||||
<div className="flex items-start justify-between gap-4 border-b border-line pb-3">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue