Pour tout problème contactez-nous par mail : support@froggit.fr | La FAQ :grey_question: | Rejoignez-nous sur le Chat :speech_balloon:

Skip to content
Snippets Groups Projects
Commit 34c22a62 authored by Julie Thezenas's avatar Julie Thezenas
Browse files

feat: conditionning carousel

parent 4f702279
No related branches found
No related tags found
No related merge requests found
This commit is part of merge request !62. Comments created here will be created in the context of that merge request.
......@@ -6,80 +6,40 @@ import "slick-carousel/slick/slick-theme.css";
import useBaseUrl from "@docusaurus/useBaseUrl";
// console.log("coucou")
//on retrouve ttes les var du composant CarouselElement
//Les images doivent avoir toute la même taille
//si le link est null/empty, alors ne pas afficher d'hyperlien
// si le nombre d'image ne vaut pas la "taille",
// function CarouselElement({name, img, link}) {
// console.log("Coucou deux")
// if (CarouselList) {
// link == null;
// console.log(delete CarouselList.link)
// return (
// delete CarouselList.link;
// )
// }
// else {
// console.log("salut");
// }
// }
// CarouselElement = (linkdel) => {
// const newLinkDel = this.state.links.filter(element.name !== (linkdel.name));
// this.setState({links:newLinkDel});
// console.log(newLinkDel + "c'est ici");
// }
// console.log(CarouselElement.names);
// return (
/* <div className="text--center"> */
// si le nombre d'image ne vaut pas la "taille",
function CarouselElement({name, img, link}) {
if (typeof link === 'undefined') {
console.log(" salut, pas défini ");
} else {
console.log(link + " salut c'est défini ");
}
// on affiche a uniquement si ya des liens existants
return (
<div className="img_carousel">
<a href={link} target="_blank" rel="noopener noreferrer">
if (typeof link === "undefined") {
return (
<div className="img_carousel">
<img src={useBaseUrl(img)} className="carousel-img" />
<h6>{name}</h6>
</a>
</div>
);
</div>
);
} else {
return (
<div className="img_carousel">
<a href={link} target="_blank" rel="noopener noreferrer">
<img src={useBaseUrl(img)} className="carousel-img" />
<h6>{name}</h6>
</a>
</div>
);
}
}
// cptm par defaut sauf si le link est plein
{/* <div className="img_carousel">
<img src={useBaseUrl(img)} className="carousel-img" />
<h6>{name}</h6>
</div> */}
// https://fr.reactjs.org/docs/lists-and-keys.html
export default function Carousel(props) {
const list = props.list;
//Ralentir la vitesse
//augmenter le nombre d'éléments à afficher
const settings = {
dots: true,
infinite: true,
slidesToShow: 5,
slidesToShow: 2,
slidesToScroll: 1,
autoplay: true,
speed: 4000,
......
......@@ -11,21 +11,6 @@ const CarouselList = [
name: "FAQ",
img: "/img/bouclier.svg",
},
{
name: "Communauté",
img: "/img/docusaurus.png",
link: "/communaute",
},
{
name: "Acceuil",
img: "/img/docusaurus.png",
link: "https://froggit.fr/",
},
{
name: "Tarifs",
img: "/img/logo_typo_froggit.png",
link: "/tarifs",
},
{
name: "Communauté",
img: "/img/docusaurus.png",
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment