admin/dyolink
0
0
Fork 0
Code Issues 24 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

app now responsive for mobile and small devices.

Browse Source
This commit is contained in:
rameen
2026-07-11 17:10:02 +03:30
parent 893cd5b128
commit 2f7df312c1
49 changed files with 1710 additions and 775 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
frontend/src/app/[locale]/(public)/page.tsx
View File

@@ -14,26 +14,33 @@ export default function HomePage() {
const { user } = useAuth();
return (
<div className="min-h-screen app-web-bg text-text-primary">
<div className="min-h-[100dvh] app-web-bg text-text-primary">
<header className="border-b border-border/70 bg-background-secondary/65 backdrop-blur-sm fixed top-0 w-full z-10">
<div className="container mx-auto px-4 py-4 flex justify-between items-center">
<div className="text-2xl font-semibold text-text-primary">
<div className="container mx-auto px-4 py-3 sm:py-4 flex flex-wrap items-center justify-between gap-x-4 gap-y-3">
<Link href="/" className="text-xl sm:text-2xl font-semibold text-text-primary shrink-0">
{tCommon('appName')}
</div>
</Link>
<div className="flex items-center gap-3">
<div className="flex items-center gap-1.5 sm:gap-3 ml-auto shrink-0">
<TopBarControls />
{user ? (
<Link href="/today">
<Button variant="primary">{tAuth('dashboard')}</Button>
<Button variant="primary" size="sm" className="sm:px-4 sm:py-2 sm:text-sm">
{tAuth('dashboard')}
</Button>
</Link>
) : (
<>
<Link href="/login">
<Button variant="outline">{tAuth('login')}</Button>
<Link href="/login" className="hidden sm:block">
<Button variant="outline" size="sm" className="whitespace-nowrap">
{tAuth('login')}
</Button>
</Link>
<Link href="/register">
<Button variant="primary">{tAuth('startTrial')}</Button>
<Button variant="primary" size="sm" className="whitespace-nowrap">
<span className="sm:hidden">{tAuth('startTrialShort')}</span>
<span className="hidden sm:inline">{tAuth('startTrial')}</span>
</Button>
</Link>
</>
)}
@@ -41,27 +48,34 @@ export default function HomePage() {
</div>
</header>
<main className="container mx-auto px-4 pt-32 pb-20">
<main className="container mx-auto px-4 pt-28 sm:pt-32 pb-16 sm:pb-20">
<div className="max-w-4xl mx-auto text-center">
<h1 className="text-5xl md:text-6xl font-semibold mb-6 leading-tight">
<h1 className="text-3xl sm:text-4xl md:text-5xl lg:text-6xl font-semibold mb-4 sm:mb-6 leading-tight">
{t('heroTitle')}
<span className="text-primary"> {t('heroHighlight')}</span>
</h1>
<p className="text-lg text-text-secondary mb-8 max-w-2xl mx-auto">
<p className="text-base sm:text-lg text-text-secondary mb-6 sm:mb-8 max-w-2xl mx-auto">
{t('heroSubtitle')}
</p>
{!user && (
<Link href="/register">
<Button size="lg" variant="primary" className="px-8">
{tAuth('startFreeTrial')}
</Button>
</Link>
<div className="flex flex-col sm:flex-row items-stretch sm:items-center justify-center gap-3">
<Link href="/register" className="w-full sm:w-auto">
<Button size="lg" variant="primary" fullWidth className="sm:w-auto sm:px-8">
{tAuth('startFreeTrial')}
</Button>
</Link>
<Link href="/login" className="w-full sm:hidden">
<Button variant="outline" size="lg" fullWidth>
{tAuth('login')}
</Button>
</Link>
</div>
)}
</div>
<div className="mt-20 grid md:grid-cols-3 gap-6">
<div className="mt-12 sm:mt-20 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4 sm:gap-6">
<FeatureCard
icon={<Building2 className="h-6 w-6 icon-flat" />}
title={t('featureClinicsTitle')}