Edit style

2026-06-30 17:17:00 +03:00
parent 03b39317c9
commit 409cb41dd6
4 changed files with 43 additions and 30 deletions
--- a/app/ClientLayout.js
+++ b/app/ClientLayout.js
@ -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' ? 'وضع نهاري' : 'وضع ليلي'}
--- a/app/globals.css
+++ b/app/globals.css
@ -96,7 +96,7 @@

 .dark {
  --background: #0f172a;
-  --foreground: #e2e8f0;
+  --foreground: #f5e6d3;
  color-scheme: dark;
 }

@ -106,12 +106,12 @@
  --color-gray-100: #1e293b;
  --color-gray-200: #334155;
  --color-gray-300: #475569;
-  --color-gray-400: #94a3b8;
-  --color-gray-500: #64748b;
-  --color-gray-600: #475569;
-  --color-gray-700: #cbd5e1;
-  --color-gray-800: #e2e8f0;
-  --color-gray-900: #f1f5f9;
+  --color-gray-400: #64748b;
+  --color-gray-500: #94a3b8;
+  --color-gray-600: #cbd5e1;
+  --color-gray-700: #e2e8f0;
+  --color-gray-800: #f1f5f9;
+  --color-gray-900: #f8fafc;
 }

 html, body {
@ -157,6 +157,13 @@ body {
  transform: scale(1.1);
 }

+.nav-icon {
+  color: #1e293b;
+}
+.dark .nav-icon {
+  color: #ffffff;
+}
+
 .property-tooltip {
  background: white !important;
  color: #1f2937 !important;
--- a/app/page.js
+++ b/app/page.js
@ -276,18 +276,6 @@ export default function HomePage() {
  return (
    <div className="min-h-screen">
      <section className="relative min-h-screen flex items-center justify-center overflow-hidden">
-        <div className="absolute inset-0 z-0">
-          <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>
        <div className="relative z-10 container mx-auto px-4 sm:px-6 lg:px-8">
          <div className="max-w-6xl mx-auto">
            <motion.div
@ -303,7 +291,7 @@ export default function HomePage() {
              }}
            >
              <motion.h1
-                className="text-3xl sm:text-4xl md:text-5xl lg:text-6xl font-bold text-white mb-6 leading-tight tracking-tight"
+                className="text-3xl sm:text-4xl md:text-5xl lg:text-6xl font-bold text-amber-50 mb-6 leading-tight tracking-tight"
                variants={{
                  hidden: { opacity: 0, y: 20 },
                  visible: { opacity: 1, y: 0 }
@ -311,7 +299,7 @@ export default function HomePage() {
              >
                إيجاد منزلك الجديد<br />
                <motion.span
-                  className="text-amber-400"
+                  className="text-amber-300"
                  animate={{
                    y: [0, -10, 0],
                  }}
@ -325,7 +313,7 @@ export default function HomePage() {
                </motion.span>
              </motion.h1>
              <motion.p
-                className="text-base sm:text-lg text-gray-200 max-w-2xl mx-auto leading-relaxed"
+                className="text-base sm:text-lg text-amber-50 max-w-2xl mx-auto leading-relaxed"
                variants={{
                  hidden: { opacity: 0, y: 20 },
                  visible: { opacity: 1, y: 0 }
@ -344,10 +332,10 @@ export default function HomePage() {
                transition={{ delay: 0.5 }}
                className="bg-white/10 backdrop-blur-lg rounded-2xl p-8 text-center border border-white/20"
              >
-                <h2 className="text-2xl font-bold text-white mb-2">
+                <h2 className="text-2xl font-bold text-amber-50 mb-2">
                  مرحباً {user?.name}!
                </h2>
-                <p className="text-gray-200 mb-4">
+                <p className="text-amber-50/80 mb-4">
                  يمكنك إدارة عقاراتك من خلال لوحة التحكم الخاصة بك
                </p>
                <Link
--- a/next.config.mjs
+++ b/next.config.mjs
@ -14,6 +14,11 @@ const nextConfig = {
        hostname: "45.93.137.91",
        pathname: "/api/Pictures/**",
      },
+      {
+        protocol: "http",
+        hostname: "45.93.137.91",
+        pathname: "/Pictures/**",
+      },
    ],
  },
  // basePath: "/sweetHome",