nouveau fichier : public/pictures/sea.gif

modifié :         src/components/Button.tsx
	modifié :         src/components/ClickableLink.tsx
	nouveau fichier : src/components/FstSection.tsx
	modifié :         src/components/NavBar.tsx
	modifié :         src/pages/MainPage.tsx

ajout de la première section

front/src/components/FstSection.tsx

@@ -0,0 +1,38 @@
+import Button from "./Button";
+import NavBar from "./NavBar";
+
+interface FstSectionProps {
+    centertxt: string;
+    txtbt1:string;
+    txtbt2:string;
+    image:string;
+}
+
+export default function FstSection ({centertxt, txtbt1, txtbt2, image}: FstSectionProps) {
+    return (
+        <div style={{
+            textAlign: "center",
+            color: "yellow",
+            backgroundImage: image,
+            backgroundSize: "cover",
+            backgroundPosition: "center",
+            backgroundRepeat: "no-repeat",
+            height: "75vh"}}>
+        <NavBar />
+        <div
+            style={{
+                display: "flex",
+                flexDirection: "column",
+                justifyContent: "center",
+                alignItems: "center",
+            }}
+        >
+            <div style={{height:"150px"}} />
+            <h1>{centertxt}</h1><br />
+            <div style={{display:"flex", justifyContent: "center", gap: "20px"}}>
+                <Button onClick={() => alert("One")} color="primary" children={txtbt1} />
+                <Button onClick={() => {alert("Two")}} color="secondary" children={txtbt2} /> 
+            </div>
+        </div></div>
+    )
+}