robin/Dramlog-Prod
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: optimize layout for mobile devices (Pixel 9 Pro)

Browse Source
This commit is contained in:
robin
2025-12-18 09:59:31 +01:00
parent 9ba1f8bd56
commit 330c8e1cc0
5 changed files with 29 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/CameraCapture.tsx
View File

@@ -158,8 +158,8 @@ export default function CameraCapture({ onImageCaptured, onAnalysisComplete, onS
};
return (
<div className="flex flex-col items-center gap-6 w-full max-w-md mx-auto p-6 bg-white dark:bg-zinc-900 rounded-3xl shadow-2xl border border-zinc-200 dark:border-zinc-800 transition-all hover:shadow-whisky-amber/20">
<h2 className="text-2xl font-bold text-zinc-800 dark:text-zinc-100 italic">Magic Shot</h2>
<div className="flex flex-col items-center gap-4 md:gap-6 w-full max-w-md mx-auto p-4 md:p-6 bg-white dark:bg-zinc-900 rounded-3xl shadow-2xl border border-zinc-200 dark:border-zinc-800 transition-all hover:shadow-whisky-amber/20">
<h2 className="text-xl md:text-2xl font-bold text-zinc-800 dark:text-zinc-100 italic">Magic Shot</h2>
<div
className="relative group cursor-pointer w-full aspect-square rounded-2xl border-2 border-dashed border-zinc-300 dark:border-zinc-700 overflow-hidden flex items-center justify-center bg-zinc-50 dark:bg-zinc-800/50 hover:border-amber-500 transition-colors"
@@ -273,10 +273,10 @@ export default function CameraCapture({ onImageCaptured, onAnalysisComplete, onS
</div>
{analysisResult && (
<div className="p-4 bg-zinc-50 dark:bg-zinc-800/50 rounded-2xl border border-zinc-200 dark:border-zinc-700">
<div className="flex items-center gap-2 mb-3 text-amber-600 dark:text-amber-500">
<div className="p-3 md:p-4 bg-zinc-50 dark:bg-zinc-800/50 rounded-2xl border border-zinc-200 dark:border-zinc-700">
<div className="flex items-center gap-2 mb-2 md:mb-3 text-amber-600 dark:text-amber-500">
<Sparkles size={18} />
<span className="font-bold text-sm uppercase tracking-wider">Ergebnisse</span>
<span className="font-bold text-[10px] md:text-sm uppercase tracking-wider">Ergebnisse</span>
</div>
<div className="space-y-2">
<div className="flex justify-between text-sm">