Update: Remove heart icons and replace with green geometric logo and Users icons

README.md

@@ -1,3 +1,22 @@
-# Welcome to your Lovable project
+# FXCraft - إضافات ماين كرافت
 
-TODO: Document your project here
+![FXCraft Logo](public/logo.png)
+
+يعتبر موقع **FXCraft** منصة رائدة ومخصصة لمجتمع ماين كرافت العربي، حيث يهدف إلى توفير تجربة سلسة للمستخدمين في اكتشاف وتحميل أفضل الإضافات البرمجية. يتيح الموقع الوصول المباشر إلى المودات وحزم الموارد والخرائط من مصادر عالمية موثوقة مثل **Modrinth** و **CurseForge**، مع التركيز على تقديم واجهة مستخدم تدعم اللغة العربية بشكل كامل وتسهل عملية التصفح.
+
+| الميزة | الوصف |
+| :--- | :--- |
+| **البحث المتقدم** | إمكانية البحث عن الإضافات باللغتين العربية والإنجليزية مع نتائج دقيقة ومحدثة. |
+| **التكامل مع المنصات** | ربط مباشر مع Modrinth و CurseForge لضمان الحصول على أحدث الإصدارات والملفات. |
+| **واجهة عصرية** | تصميم متجاوب (Responsive) يدعم اتجاه النص من اليمين إلى اليسار (RTL) لتجربة عربية مثالية. |
+| **التصنيفات** | تنظيم الإضافات في فئات متنوعة حسب النوع أو إصدار اللعبة لتسهيل الوصول إليها. |
+
+يعتمد المشروع في بنائه التقني على أحدث الأدوات والتقنيات لضمان الأداء العالي وسهولة الصيانة. تم استخدام **React** مع **TypeScript** لبناء واجهة المستخدم، بينما تم الاعتماد على **Tailwind CSS** لتنسيق التصميم بشكل عصري. كما يتم استخدام **TanStack Query** لإدارة البيانات وجلبها بكفاءة من الواجهات البرمجية الخارجية، مما يوفر سرعة واستجابة عالية للموقع.
+
+| التقنية | الاستخدام |
+| :--- | :--- |
+| **Vite** | أداة التطوير والتحزيم الأساسية لضمان سرعة بناء المشروع. |
+| **Lucide React** | مكتبة الأيقونات المستخدمة لتوفير رموز بصرية واضحة ومعبرة. |
+| **Radix UI** | مجموعة من المكونات الأساسية لبناء واجهات مستخدم سهلة الوصول. |
+
+جميع الحقوق محفوظة لموقع **FXCraft** © 2026، ويهدف المشروع دائماً لدعم وتطوير مجتمع اللاعبين العرب وتوفير أفضل الأدوات والموارد لهم في عالم ماين كرافت.

src/components/Footer.tsx

@@ -1,4 +1,4 @@
-import { Heart } from "lucide-react";
+import { Sparkles } from "lucide-react";
 
 const Footer = () => {
   return (
@@ -9,7 +9,7 @@ const Footer = () => {
           <span className="text-xl font-black text-foreground">Craft</span>
         </div>
         <p className="flex items-center justify-center gap-1 text-xs text-muted-foreground">
-          صُنع بـ <Heart className="h-3 w-3 text-destructive" /> لمجتمع ماين كرافت العربي
+          صُنع بـ <Sparkles className="h-3 w-3 text-primary" /> لمجتمع ماين كرافت العربي
         </p>
         <p className="mt-1 text-xs text-muted-foreground/60">
           © {new Date().getFullYear()} FXCraft

src/components/ModCard.tsx

@@ -1,5 +1,5 @@
 import { Link } from "react-router-dom";
-import { Download, Heart } from "lucide-react";
+import { Download, Users } from "lucide-react";
 import { Card, CardContent } from "@/components/ui/card";
 import { Badge } from "@/components/ui/badge";
 
@@ -89,7 +89,7 @@ const ModCard = ({ id, slug, title, description, iconUrl, downloads, followers,
                 {formatNumber(downloads)}
               </span>
               <span className="hidden items-center gap-1 sm:flex">
-                <Heart className="h-3 w-3" />
+                <Users className="h-3 w-3" />
                 {formatNumber(followers)}
               </span>
             </div>
@@ -127,7 +127,7 @@ const ModCard = ({ id, slug, title, description, iconUrl, downloads, followers,
                 {formatNumber(downloads)}
               </span>
               <span className="flex items-center gap-1">
-                <Heart className="h-3 w-3" />
+                <Users className="h-3 w-3" />
                 {formatNumber(followers)}
               </span>
             </div>

src/components/Navbar.tsx

@@ -28,9 +28,12 @@ const Navbar = () => {
   return (
     <nav className="sticky top-0 z-50 border-b border-border/50 bg-background/90 backdrop-blur-lg">
       <div className="container mx-auto flex items-center justify-between px-4 py-3">
-        <Link to="/" className="flex items-center gap-1.5 transition-opacity hover:opacity-80">
-          <span className="text-xl font-black text-primary sm:text-2xl">FX</span>
-          <span className="text-xl font-black text-foreground sm:text-2xl">Craft</span>
+        <Link to="/" className="flex items-center gap-2 transition-opacity hover:opacity-80">
+          <img src="/logo.png" alt="Logo" className="h-8 w-8 rounded-sm object-contain" />
+          <div className="flex items-center gap-0.5">
+            <span className="text-xl font-black text-primary sm:text-2xl">FX</span>
+            <span className="text-xl font-black text-foreground sm:text-2xl">Craft</span>
+          </div>
         </Link>
 
         {/* Desktop */}

src/pages/CurseForgeDetails.tsx

@@ -6,7 +6,7 @@ import { Button } from "@/components/ui/button";
 import { Badge } from "@/components/ui/badge";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Skeleton } from "@/components/ui/skeleton";
-import { Download, Heart, Calendar } from "lucide-react";
+import { Download, Users, Calendar } from "lucide-react";
 import { getCurseForgeMod, getCurseForgeFiles } from "@/lib/api";
 
 const formatNumber = (num: number) => {
@@ -76,7 +76,7 @@ const CurseForgeDetails = () => {
                       {formatNumber(project.downloadCount)} تحميل
                     </span>
                     <span className="flex items-center gap-1">
-                      <Heart className="h-4 w-4" />
+                      <Users className="h-4 w-4" />
                       {formatNumber(project.thumbsUpCount || 0)} إعجاب
                     </span>
                     <span className="flex items-center gap-1">

src/pages/ModDetails.tsx

@@ -6,7 +6,7 @@ import { Button } from "@/components/ui/button";
 import { Badge } from "@/components/ui/badge";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Skeleton } from "@/components/ui/skeleton";
-import { Download, Heart, Calendar, ExternalLink } from "lucide-react";
+import { Download, Users, Calendar, ExternalLink } from "lucide-react";
 import { getProject, getProjectVersions } from "@/lib/api";
 
 const formatNumber = (num: number) => {
@@ -74,7 +74,7 @@ const ModDetails = () => {
                       {formatNumber(project.downloads)} تحميل
                     </span>
                     <span className="flex items-center gap-1">
-                      <Heart className="h-4 w-4" />
+                      <Users className="h-4 w-4" />
                       {formatNumber(project.followers)} متابع
                     </span>
                     <span className="flex items-center gap-1">