tknuth/QR-master
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

responsivness Phone

Browse Source
This commit is contained in:
Timo Knuth
2026-01-11 11:50:17 +01:00
parent 268689f2ee
commit d64459b200
19 changed files with 75 additions and 94 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/app/(marketing)/tools/tiktok-qr-code/TikTokGenerator.tsx
View File

@@ -93,7 +93,7 @@ export default function TiktokGenerator() {
<div className="grid lg:grid-cols-2">
{/* LEFT: Input Section */}
<div className="p-8 lg:p-10 space-y-8 border-r border-slate-100">
<div className="p-6 md:p-8 lg:p-10 space-y-8 border-r border-slate-100">
{/* TikTok Details */}
<div className="space-y-6">
@@ -148,7 +148,7 @@ export default function TiktokGenerator() {
{/* Frame Selector */}
<div>
<label className="block text-sm font-medium text-slate-700 mb-3">Frame Label</label>
<div className="grid grid-cols-4 gap-2">
<div className="grid grid-cols-2 sm:grid-cols-4 gap-2">
{FRAME_OPTIONS.map((frame) => (
<button
key={frame.id}
@@ -169,13 +169,12 @@ export default function TiktokGenerator() {
</div>
{/* RIGHT: Preview Section */}
<div className="p-8 lg:p-10 flex flex-col items-center justify-center" style={{ backgroundColor: BRAND.paleGrey }}>
<div className="p-6 md:p-8 lg:p-10 flex flex-col items-center justify-center" style={{ backgroundColor: BRAND.paleGrey }}>
{/* QR Card with Frame */}
<div
ref={qrRef}
className="bg-white rounded-3xl shadow-xl p-8 flex flex-col items-center"
style={{ minWidth: '320px' }}
className="bg-white rounded-3xl shadow-xl p-6 sm:p-8 flex flex-col items-center w-full max-w-[320px]"
>
{/* Frame Label */}
{getFrameLabel() && (