Changed string values to use i18n

src/Components/Pages/Services/WesiteCards.tsx

@@ -3,14 +3,33 @@ import IdealizeImg from "../../../assets/imgs/Idealize.png";
 import DesignImg from "../../../assets/imgs/Design.png";
 import CodeImg from "../../../assets/imgs/Code.jpg";
 import BuildImg from "../../../assets/imgs/Build.png";
+import { useTranslation } from "react-i18next";
 
 const WesiteCards = () => {
+  const { t } = useTranslation();
+
   return (
     <div className="h-full flex lg:mt-20 flex-col flex-wrap gap-4 xl:flex-row mx-4">
-      <Card title="Idealize" description="Website" imgSrc={IdealizeImg} />
-      <Card title="Design" description="Website" imgSrc={DesignImg} />
-      <Card title="Code" description="Website" imgSrc={CodeImg} />
-      <Card title="Build" description="Website" imgSrc={BuildImg} />
+      <Card
+        title={t("services.cards.website.card1.title")}
+        description={t("services.cards.website.card1.description")}
+        imgSrc={IdealizeImg}
+      />
+      <Card
+        title={t("services.cards.website.card2.title")}
+        description={t("services.cards.website.card2.description")}
+        imgSrc={DesignImg}
+      />
+      <Card
+        title={t("services.cards.website.card3.title")}
+        description={t("services.cards.website.card3.description")}
+        imgSrc={CodeImg}
+      />
+      <Card
+        title={t("services.cards.website.card4.title")}
+        description={t("services.cards.website.card4.description")}
+        imgSrc={BuildImg}
+      />
     </div>
   );
 };