Edit style
This commit is contained in:
@ -724,24 +724,37 @@ export default function ClientLayout({ children }) {
|
||||
</nav>
|
||||
)}
|
||||
|
||||
{isHomePage && (
|
||||
<div className="fixed inset-0 -z-10">
|
||||
<motion.div
|
||||
className="absolute inset-0 bg-cover bg-center bg-no-repeat"
|
||||
style={{ backgroundImage: 'url(/hero.jpg)' }}
|
||||
initial={{ scale: 1.1 }}
|
||||
animate={{ scale: 1 }}
|
||||
transition={{ duration: 1.5, ease: "easeOut" }}
|
||||
/>
|
||||
<div className="absolute inset-0 bg-gradient-to-r from-black/70 via-black/60 to-black/50" />
|
||||
</div>
|
||||
)}
|
||||
|
||||
<main
|
||||
className={`${!isAuthPage && !isProfilePage && !isAuthenticated ? "pt-20" : ""} flex-1 flex flex-col bg-gray-50 ${currentLanguage === "ar" ? "text-right" : "text-left"} ${isHomePage ? "relative" : ""} ${isAuthenticated && !isAuthPage ? "pb-20" : ""}`}
|
||||
className={`${!isAuthPage && !isProfilePage && !isAuthenticated ? "pt-20" : ""} flex-1 flex flex-col ${isHomePage ? "bg-transparent" : "bg-gray-50"} ${currentLanguage === "ar" ? "text-right" : "text-left"} ${isHomePage ? "relative" : ""} ${isAuthenticated && !isAuthPage ? "pb-20" : ""}`}
|
||||
>
|
||||
{!isAuthPage && (
|
||||
<div className={`flex items-center justify-between px-4 py-2 sticky top-0 z-20 ${isHomePage ? "bg-transparent backdrop-blur-3xl" : "border-b border-gray-200/20 bg-white/10 backdrop-blur-lg"}`}>
|
||||
<div className={`flex items-center justify-between px-4 py-2 sticky top-0 z-20 bg-transparent backdrop-blur-3xl ${isHomePage ? "" : "border-b border-gray-200/20"}`}>
|
||||
<div className="flex items-center gap-2">
|
||||
<span className={`text-sm font-semibold px-3 py-1 rounded-lg ${!isAuthenticated ? (isHomePage ? 'bg-white/20 text-white' : 'bg-gray-200 text-gray-600') : isOwner ? (isHomePage ? 'bg-amber-500/30 text-amber-200' : 'bg-amber-100 text-amber-700') : (isHomePage ? 'bg-blue-500/30 text-blue-200' : 'bg-blue-100 text-blue-700')}`}>
|
||||
{!isAuthenticated ? 'زائر' : isOwner ? 'مالك' : 'عميل'}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-3">
|
||||
<Link href="/favorites" className={`relative group flex items-center justify-center w-9 h-9 rounded-full transition-colors ${isHomePage ? "text-white/80 hover:text-amber-300 hover:bg-white/10" : "text-gray-600 hover:text-amber-600 hover:bg-gray-100"}`}>
|
||||
<Link href="/favorites" className={`relative group flex items-center justify-center w-9 h-9 rounded-full transition-colors hover:bg-white/10 ${pathname === '/favorites' ? 'text-amber-400' : 'nav-icon'}`}>
|
||||
<Heart className="w-5 h-5" />
|
||||
<div className="absolute -bottom-8 left-1/2 -translate-x-1/2 bg-gray-800 text-white text-xs rounded-lg px-2 py-1 opacity-0 group-hover:opacity-100 transition-opacity whitespace-nowrap pointer-events-none shadow-lg">
|
||||
المفضلة
|
||||
</div>
|
||||
</Link>
|
||||
<Link href="/notifications" className={`relative group flex items-center justify-center w-9 h-9 rounded-full transition-colors ${isHomePage ? "text-white/80 hover:text-amber-300 hover:bg-white/10" : "text-gray-600 hover:text-amber-600 hover:bg-gray-100"}`}>
|
||||
<Link href="/notifications" className={`relative group flex items-center justify-center w-9 h-9 rounded-full transition-colors hover:bg-white/10 ${pathname === '/notifications' ? 'text-amber-400' : 'nav-icon'}`}>
|
||||
<Bell className="w-5 h-5" />
|
||||
{isMounted && unreadCount > 0 && (
|
||||
<div className="absolute -top-1 -right-1 bg-red-500 text-white text-xs font-bold rounded-full w-5 h-5 flex items-center justify-center">
|
||||
@ -752,13 +765,13 @@ export default function ClientLayout({ children }) {
|
||||
الإشعارات
|
||||
</div>
|
||||
</Link>
|
||||
<Link href="/settings" className={`relative group flex items-center justify-center w-9 h-9 rounded-full transition-colors ${isHomePage ? "text-white/80 hover:text-amber-300 hover:bg-white/10" : "text-gray-600 hover:text-amber-600 hover:bg-gray-100"}`}>
|
||||
<Link href="/settings" className={`relative group flex items-center justify-center w-9 h-9 rounded-full transition-colors hover:bg-white/10 ${pathname === '/settings' ? 'text-amber-400' : 'nav-icon'}`}>
|
||||
<Settings className="w-5 h-5" />
|
||||
<div className="absolute -bottom-8 left-1/2 -translate-x-1/2 bg-gray-800 text-white text-xs rounded-lg px-2 py-1 opacity-0 group-hover:opacity-100 transition-opacity whitespace-nowrap pointer-events-none shadow-lg">
|
||||
الإعدادات
|
||||
</div>
|
||||
</Link>
|
||||
<button onClick={toggleTheme} className={`relative group flex items-center justify-center w-9 h-9 rounded-full transition-colors ${isHomePage ? "text-white/80 hover:text-amber-300 hover:bg-white/10" : "text-gray-600 hover:text-amber-600 hover:bg-gray-100"}`}>
|
||||
<button onClick={toggleTheme} className="relative group flex items-center justify-center w-9 h-9 rounded-full transition-colors hover:bg-white/10 nav-icon">
|
||||
{theme === 'dark' ? <Sun className="w-5 h-5" /> : <Moon className="w-5 h-5" />}
|
||||
<div className="absolute -bottom-8 left-1/2 -translate-x-1/2 bg-gray-800 text-white text-xs rounded-lg px-2 py-1 opacity-0 group-hover:opacity-100 transition-opacity whitespace-nowrap pointer-events-none shadow-lg">
|
||||
{theme === 'dark' ? 'وضع نهاري' : 'وضع ليلي'}
|
||||
|
||||
Reference in New Issue
Block a user