ajout page /avec-piscine

package-lock.json

@@ -25,6 +25,7 @@
         "lenis": "^1.1.18",
         "preline": "^2.6.0",
         "rimraf": "^6.0.1",
+        "schema-dts": "^1.1.2",
         "sharp": "^0.33.5",
         "sharp-ico": "^0.1.5",
         "tailwindcss": "^3.4.17"
@@ -6170,6 +6171,15 @@
       "resolved": "https://registry.npmjs.org/sax/-/sax-1.4.1.tgz",
       "integrity": "sha512-+aWOz7yVScEGoKNd4PA10LZ8sk0A/z5+nXQG5giUO5rprX9jgYsTdov9qCchZiPIZezbZH+jRut8nPodFAX4Jg=="
     },
+    "node_modules/schema-dts": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/schema-dts/-/schema-dts-1.1.2.tgz",
+      "integrity": "sha512-MpNwH0dZJHinVxk9bT8XUdjKTxMYrA5bLtrrGmFA6PTLwlOKnhi67XoRd6/ty+Djt6ZC0slR57qFhZDNMI6DhQ==",
+      "license": "Apache-2.0",
+      "peerDependencies": {
+        "typescript": ">=4.1.0"
+      }
+    },
     "node_modules/select": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/select/-/select-1.1.2.tgz",

package.json

@@ -28,6 +28,7 @@
     "lenis": "^1.1.18",
     "preline": "^2.6.0",
     "rimraf": "^6.0.1",
+    "schema-dts": "^1.1.2",
     "sharp": "^0.33.5",
     "sharp-ico": "^0.1.5",
     "tailwindcss": "^3.4.17"

src/components/GrandePhotoCentrale.astro

@@ -0,0 +1,22 @@
+---
+import { Image } from "astro:assets";
+import type { ImageMetadata } from "astro";
+
+const { src, alt } = Astro.props;
+
+interface Props {
+  src: ImageMetadata
+  alt: string;
+}
+---
+
+<div class="relative mb-6 overflow-hidden md:mb-8">
+  <Image
+    src={src}
+    alt={alt}
+    class="h-full w-full object-cover object-center"
+    draggable={"false"}
+    format={"avif"}
+    loading={"eager"}
+  />
+</div>

src/components/sections/features/FeaturesGeneral.astro

@@ -3,6 +3,7 @@
 import { Image } from "astro:assets";
 import IconBlock from "@components/ui/blocks/IconBlock.astro";
 import Icon from "@components/ui/icons/Icon.astro";
+import GrandePhotoCentrale from "../../GrandePhotoCentrale.astro";
 
 interface Feature {
   heading: string;
@@ -14,8 +15,8 @@ interface Props {
   title?: string;
   subTitle?: string;
   features?: Feature[];
-  src?: any;
-  alt?: string;
+  src: any;
+  alt: string;
 }
 // Define props from Astro
 const { title, subTitle, src, alt, features } = Astro.props;
@@ -25,20 +26,7 @@ const { title, subTitle, src, alt, features } = Astro.props;
   class="mx-auto max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 2xl:max-w-full"
 >
   <!-- Block to display the feature image -->
-  <div class="relative mb-6 overflow-hidden md:mb-8">
-    {
-      src && alt && (
-        <Image
-          src={src}
-          alt={alt}
-          class="h-full w-full object-cover object-center"
-          draggable={"false"}
-          format={"avif"}
-          loading={"eager"}
-        />
-      )
-    }
-  </div>
+  <GrandePhotoCentrale src={src} alt={alt} />
 
   <!-- Displaying the main content consisting of title, subtitle, and several `IconBlock` components -->
   <div class="mt-5 grid gap-8 lg:mt-16 lg:grid-cols-3 lg:gap-12">

src/components/sections/navbar&footer/Navbar.astro

@@ -1,10 +1,7 @@
 ---
-//Import relevant dependencies
 import ThemeIcon from "@components/ThemeIcon.astro";
 import NavLink from "@components/ui/links/NavLink.astro";
-import Authentication from "../misc/Authentication.astro";
 import strings from "@utils/navigation.ts";
-import LanguagePicker from "@components/ui/LanguagePicker.astro";
 
 ---
 

src/data_files/constants.ts

@@ -1,4 +1,5 @@
 import ogImageSrc from "@images/vue-de-la-piscine.jpg";
+import type { WebPage, WebSite, WithContext } from "schema-dts";
 
 export const SITE = {
   title: "Maison à vendre à Albi",
@@ -9,10 +10,15 @@ export const SITE = {
   author: "Jalil Arfaoui",
 };
 
-export const SEO = {
-  title: SITE.title,
-  description: SITE.description,
-  structuredData: {
+export const websiteStructuredDescription = {
+  "@type": "WebSite",
+  "url": "https://screwfast.uk",
+  "name": "ScrewFast",
+  "description":
+    "ScrewFast offers top-tier hardware tools and expert construction services to meet all your project needs.",
+} satisfies WebSite
+
+const defaultStructuredData = {
   "@context": "https://schema.org",
   "@type": "WebPage",
   inLanguage: "fr-FR",
@@ -26,7 +32,12 @@ export const SEO = {
     name: SITE.title,
     description: SITE.description,
   },
-  },
+} satisfies WithContext<WebPage>
+
+export const SEO = {
+  title: SITE.title,
+  description: SITE.description,
+  structuredData: defaultStructuredData,
 };
 
 export const OG = {

src/layouts/MainLayout.astro

@@ -4,6 +4,7 @@ import Meta from "@components/Meta.astro";
 import Navbar from "@components/sections/navbar&footer/Navbar.astro";
 import FooterSection from "@components/sections/navbar&footer/FooterSection.astro";
 import { SITE } from "@data/constants";
+import type { Thing, WithContext } from "schema-dts";
 
 // Setting expected props
 const { title = SITE.title, meta, structuredData, lang = "en" } = Astro.props;
@@ -12,7 +13,7 @@ const { title = SITE.title, meta, structuredData, lang = "en" } = Astro.props;
 interface Props {
   title?: string;
   meta?: string;
-  structuredData?: object;
+  structuredData?: WithContext<Thing>;
   lang?: string;
 }
 ---

src/pages/avec-piscine.astro

@@ -0,0 +1,36 @@
+---
+import { websiteStructuredDescription } from "../data_files/constants";
+import MainLayout from "@/layouts/MainLayout.astro";
+import type { WebPage, WithContext } from "schema-dts";
+import MainSection from "../components/ui/blocks/MainSection.astro";
+import GrandePhotoCentrale from "../components/GrandePhotoCentrale.astro";
+
+
+const structuredDescription = {
+  "@context": "https://schema.org",
+  "@type": "WebPage",
+  "@id": "https://achat-maison-albi.fr/avec-piscine",
+  "url": "https://achat-maison-albi.fr/avec-piscine",
+  "name": "Maison individuelle avec piscine à Albi",
+  "description":
+    "Piscine de 4m x 8m, soit 50m3, à l’abri des regards et fraiche toute l’année",
+  "isPartOf": websiteStructuredDescription,
+  "inLanguage": "fr-FR"
+} satisfies WithContext<WebPage>
+
+import photoDeLaPiscine from "@images/vue-piscine.jpg"
+---
+
+<MainLayout
+  title="Maison individuelle avec piscine de 50 m3 à Albi"
+  structuredData={structuredDescription}
+>
+  <MainSection
+    title="Baignez-vous au calme"
+    subTitle="Piscine de 4m x 8m, soit 50m3, à l’abri des regards et fraiche toute l’année"
+    btnExists={true}
+    btnURL="/pieces"
+    btnTitle="Entrer dans la maison"
+  />
+  <GrandePhotoCentrale src={photoDeLaPiscine} alt="Photo de la piscine" />
+</MainLayout>

src/pages/contact.astro

@@ -25,7 +25,7 @@ const pageTitle: string = `Contact | ${SITE.title}`;
       "description":
         "ScrewFast offers top-tier hardware tools and expert construction services to meet all your project needs.",
     },
-    "inLanguage": "en-US"
+    "inLanguage": "fr-FR"
   }}
 >
   <ContactSection />

src/pages/index.astro

@@ -1,5 +1,4 @@
 ---
-// Import the necessary components
 import MainLayout from "@/layouts/MainLayout.astro";
 import HeroSection from "@components/sections/landing/HeroSection.astro";
 import HeroSectionAlt from "@components/sections/landing/HeroSectionAlt.astro";

src/pages/pieces.astro

@@ -114,7 +114,7 @@ const pageTitle: string = `Pièces | ${SITE.title}`;
         "name": "ScrewFast",
         "description": "ScrewFast offers top-tier hardware tools and expert construction services to meet all your project needs."
     },
-    "inLanguage": "en-US"
+    "inLanguage": "fr-FR"
   }}
 >
   <!--MainSection is the introductory section of the page, it also contains a CTA button-->

src/pages/products/index.astro

@@ -79,7 +79,7 @@ const pageTitle: string = `Products | ${SITE.title}`;
       "name": "ScrewFast",
       "description": "ScrewFast offers top-tier hardware tools and expert construction services to meet all your project needs."
     },
-    "inLanguage": "en-US"
+    "inLanguage": "fr-FR"
   }}
 >
   <div

src/utils/navigation.ts

@@ -2,6 +2,7 @@
 const navBarLinks = [
   { name: "Accueil", url: "/" },
   { name: "Pièces", url: "/pieces" },
+  { name: "Piscine", url: "/avec-piscine" },
   { name: "Contact", url: "/contact" },
 ];