ayrisdev/menulio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: simplify QR stand presets to single urban qr-1.svg template

Browse Source
This commit is contained in:
AyrisAI
2026-08-20 18:44:44 +03:00
parent 04863c8a78
commit 984a41d0e5
3 changed files with 90 additions and 176 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/components/QrStandGeneratorClient.tsx
+42 -40
View File
@@ -108,49 +108,51 @@ export function QrStandGeneratorClient({
<main className="flex-1 max-w-6xl w-full mx-auto p-4 sm:p-8 flex flex-col lg:flex-row gap-8 items-center lg:items-start justify-center">
{/* Left Panel: Preset Selectors & Download Controls */}
<div className="w-full lg:w-96 flex flex-col gap-6">
<div className="bg-stone-900/80 border border-stone-800 p-6 rounded-3xl space-y-4 shadow-xl">
<div>
<span className="text-xs font-bold uppercase tracking-wider text-amber-400">
1. Stant Teması Seçin
</span>
<h1 className="text-xl sm:text-2xl font-extrabold text-white mt-1">
Masa Kartı Şablonları
</h1>
<p className="text-xs text-stone-400 mt-1 leading-relaxed">
Restoranınızın konseptine uygun masa stant tasarımını seçin.
</p>
</div>
{Object.values(QR_STAND_PRESETS).length > 1 && (
<div className="bg-stone-900/80 border border-stone-800 p-6 rounded-3xl space-y-4 shadow-xl">
<div>
<span className="text-xs font-bold uppercase tracking-wider text-amber-400">
1. Stant Teması Seçin
</span>
<h1 className="text-xl sm:text-2xl font-extrabold text-white mt-1">
Masa Kartı Şablonları
</h1>
<p className="text-xs text-stone-400 mt-1 leading-relaxed">
Restoranınızın konseptine uygun masa stant tasarımını seçin.
</p>
</div>
{/* Presets List */}
<div className="space-y-2.5 pt-2">
{Object.values(QR_STAND_PRESETS).map((preset) => {
const isSelected = preset.key === selectedKey;
return (
<button
key={preset.key}
onClick={() => setSelectedKey(preset.key)}
className={`w-full p-3.5 rounded-2xl border text-left transition-all flex items-center justify-between ${
isSelected
? "bg-amber-500/10 border-amber-500 text-amber-400 shadow-md shadow-amber-500/5"
: "bg-stone-950/60 border-stone-800 text-stone-300 hover:border-stone-700"
}`}
>
<div className="flex items-center gap-3">
<div
className="w-4 h-4 rounded-full border border-white/20 shadow-sm"
style={{ background: preset.plaqueBg }}
/>
<div>
<div className="text-xs font-bold">{preset.name}</div>
<div className="text-[10px] text-stone-400">{preset.categoryName}</div>
{/* Presets List */}
<div className="space-y-2.5 pt-2">
{Object.values(QR_STAND_PRESETS).map((preset) => {
const isSelected = preset.key === selectedKey;
return (
<button
key={preset.key}
onClick={() => setSelectedKey(preset.key)}
className={`w-full p-3.5 rounded-2xl border text-left transition-all flex items-center justify-between ${
isSelected
? "bg-amber-500/10 border-amber-500 text-amber-400 shadow-md shadow-amber-500/5"
: "bg-stone-950/60 border-stone-800 text-stone-300 hover:border-stone-700"
}`}
>
<div className="flex items-center gap-3">
<div
className="w-4 h-4 rounded-full border border-white/20 shadow-sm"
style={{ background: preset.plaqueBg }}
/>
<div>
<div className="text-xs font-bold">{preset.name}</div>
<div className="text-[10px] text-stone-400">{preset.categoryName}</div>
</div>
</div>
</div>
{isSelected && <span className="text-xs font-bold">✓</span>}
</button>
);
})}
{isSelected && <span className="text-xs font-bold">✓</span>}
</button>
);
})}
</div>
</div>
</div>
)}
{/* Action Download Buttons */}
<div className="bg-stone-900/80 border border-stone-800 p-6 rounded-3xl space-y-3.5 shadow-xl">