-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Showing
70 changed files
with
2,879 additions
and
17 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,23 @@ | ||
import React from "react"; | ||
import { Link } from "react-router-dom"; | ||
import '../sass/cardLocation.scss'; | ||
import '../data/dataloges.json' | ||
|
||
|
||
function LogementCard(props) { | ||
|
||
return ( | ||
<Link | ||
to={`/logement/${props.id}`} | ||
state={{logementById: props.id}} | ||
className="logementCard"> | ||
|
||
<img src={props.imageUrl} alt={props.title} className="logementCard__image"/> | ||
<h3 className="logementCard__title">{props.title}</h3> | ||
|
||
</Link> | ||
); | ||
}; | ||
|
||
|
||
export default LogementCard; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,50 @@ | ||
import React, { useState, useEffect } from "react"; | ||
import { useParams } from 'react-router-dom'; | ||
|
||
import "../sass/carousel.scss"; | ||
import Dataloges from '../data/dataloges.json'; | ||
|
||
import arrowLeft from '../assets/arrowLeft.png'; | ||
import arrowRight from '../assets/arrowRight.png'; | ||
|
||
const Carousel = () => { | ||
const [src, setSrc] = useState(0); | ||
let { id } = useParams(); | ||
|
||
const logement = Dataloges.find((element) => element.id == id); | ||
|
||
useEffect(() => { | ||
setSrc(0); | ||
}, [id]); | ||
|
||
const previousClick = () => { | ||
setSrc((prevIndex) => | ||
prevIndex === 0 ? logement.pictures.length - 1 : prevIndex - 1 | ||
); | ||
}; | ||
|
||
const nextClick = () => { | ||
setSrc((prevIndex) => | ||
prevIndex === logement.pictures.length - 1 ? 0 : prevIndex + 1 | ||
); | ||
}; | ||
|
||
return ( | ||
<div className="carousel"> | ||
<button className="carousel__button carousel__button--left" onClick={previousClick}> | ||
<img src={arrowLeft} alt="Image précédente" /> | ||
</button> | ||
<div className="carrousel__image--container"> | ||
<img className="carousel__image" src={logement.pictures[src]} alt="Logement" /> | ||
<div className="carousel__counter"> | ||
{src + 1} / {logement.pictures.length} | ||
</div> | ||
</div> | ||
<button className="carousel__button carousel__button--right" onClick={nextClick}> | ||
<img src={arrowRight} alt="Image suivante" /> | ||
</button> | ||
</div> | ||
); | ||
}; | ||
|
||
export default Carousel; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,40 @@ | ||
import React from "react"; | ||
import { useState } from "react"; | ||
|
||
import "../sass/collapse.scss"; | ||
|
||
import ArrowUp from '../assets/fleche-haut.png'; | ||
import ArrowDown from '../assets/fleche-bas.png'; | ||
|
||
|
||
const Collapse = ({description, title, className}) => { | ||
|
||
const [openDescription, setOpenDescription] = useState(false); | ||
|
||
const toggleDescription = () => { | ||
setOpenDescription(!openDescription); | ||
}; | ||
|
||
return ( | ||
<div className={`collapse ${className}`}> | ||
<button onClick={toggleDescription} className="collapse__button"> | ||
{title} <img src={openDescription ? ArrowDown : ArrowUp} alt="Toggle Arrow" /> | ||
</button> | ||
{openDescription && ( | ||
<div className="collapse__content"> | ||
{Array.isArray(description) ? ( | ||
<ul className="collapse__list"> | ||
{description.map((item, index) => ( | ||
<li key={index} className="collapse__list-item">{item}</li> | ||
))} | ||
</ul> | ||
) : ( | ||
<p>{description}</p> | ||
)} | ||
</div> | ||
)} | ||
</div> | ||
); | ||
} | ||
|
||
export default Collapse; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
import React from "react"; | ||
import '../sass/footer.scss'; | ||
import logoFooter from '../assets/logoFooter.png' | ||
|
||
|
||
const Footer = () => { | ||
return ( | ||
|
||
<section className="footer"> | ||
<img className="logoFooter"src={logoFooter} alt='Logo Kasa' /> | ||
<p> <i className="fa-regular fa-copyright"/> 2020 Kasa. All rights reserved </p> | ||
</section> | ||
); | ||
} | ||
|
||
export default Footer; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
import CardLocation from '../components/CardLocation' | ||
import dataLogements from '../data/dataloges.json'; | ||
|
||
const Logements = () => { | ||
|
||
return ( | ||
<div className='gallery-logement'> | ||
{dataLogements.map((logement) => ( | ||
<CardLocation title={logement.title} key={logement.id} | ||
imageUrl={logement.cover} | ||
id={logement.id} /> | ||
))} | ||
</div> | ||
); | ||
}; | ||
|
||
export default Logements; | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,4 +1,24 @@ | ||
import React from "react"; | ||
import {NavLink} from 'react-router-dom' | ||
import { NavLink } from 'react-router-dom'; | ||
import logoKasa from '../assets/logoKasa.png'; | ||
import '../sass/navigation.scss' | ||
|
||
const | ||
const Navigation = () => { | ||
return ( | ||
<div className="navigation"> | ||
<img src={logoKasa} alt='Logo Kasa' /> | ||
<nav> | ||
<ul> | ||
<NavLink to="/" className={({isActive}) => (isActive ? "underline" : "" )}> | ||
<li>Accueil</li> | ||
</NavLink> | ||
<NavLink to="/about" className={({isActive}) => (isActive ? "underline" : "" )}> | ||
<li>À Propos</li> | ||
</NavLink> | ||
</ul> | ||
</nav> | ||
</div> | ||
); | ||
}; | ||
|
||
export default Navigation; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,20 @@ | ||
import EtoileActive from '../assets/etoile-pleine.png'; | ||
import EtoileInactive from '../assets/etoile-vide.png'; | ||
import '../sass/rating.scss' | ||
|
||
function Rating({ rating }) { | ||
|
||
const stars = []; | ||
|
||
for (let i = 1; i <= 5; i++) { | ||
if (i <= rating) { | ||
stars.push(<img className='stars' key={i} src={EtoileActive} />); // étoile pleine | ||
} else { | ||
stars.push(<img className='stars' key={i} src={EtoileInactive} />); // étoile vide | ||
} | ||
} | ||
|
||
return <div className='rating'>{stars}</div>; | ||
} | ||
|
||
export default Rating; |
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
This file was deleted.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Large diffs are not rendered by default.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
[ | ||
{ | ||
"title": "Fiabilité", | ||
"description": "Les annonces postées sur Kasa garantissent une fiabilité totale. Les photos sont conformes aux logements, et toutes les informations sont régulièrement vérifiées par nos équipes." | ||
}, | ||
{ | ||
"title": "Respect", | ||
"description": "La bienveillance fait partie des valeurs fondatrices de Kasa. Tout comportement discriminatoire ou de perturbation du voisinage entraînera une exclusion de notre plateforme." | ||
}, | ||
{ | ||
"title": "Service", | ||
"description": "Nos équipes se tiennent à votre disposition pour vous fournir une expérience parfaite. N'hésitez pas à nous contacter si vous avez la moindre question." | ||
}, | ||
{ | ||
"title": "Sécurité", | ||
"description": "La sécurité est la priorité de Kasa. Aussi bien pour nos hôtes que pour les voyageurs, chaque logement correspond aux critères de sécurité établis par nos services. En laissant une note aussi bien à l'hôte qu'au locataire, cela permet à nos équipes de vérifier que les standards sont bien respectés. Nous organisons également des ateliers sur la sécurité domestique pour nos hôtes." | ||
} | ||
] |
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,11 +1,37 @@ | ||
import React from "react"; | ||
import Navigation from "../components/Navigation"; | ||
import Banner from '../assets/img-about.png'; | ||
import '../sass/about.scss' | ||
import Footer from "../components/Footer"; | ||
import Collapse from "../components/Collapse"; | ||
import aboutJson from "../data/data-about.json" | ||
|
||
const About = () => { | ||
|
||
const fiabilite = aboutJson.find((element) => element.title == "Fiabilité") | ||
const respect = aboutJson.find((element) => element.title == "Respect") | ||
const service = aboutJson.find((element) => element.title == "Service") | ||
const securite = aboutJson.find((element) => element.title == "Sécurité") | ||
|
||
return ( | ||
<div> | ||
<h1>À propos</h1> | ||
<Navigation /> | ||
<div className="about"> | ||
<div className="banner"> | ||
<img src={Banner} alt="Paysage" /> | ||
</div> | ||
<div className="collapse"> | ||
<Collapse description={fiabilite.description} title={fiabilite.title} /> | ||
<Collapse description={respect.description} title={respect.title} /> | ||
<Collapse description={service.description} title={service.title} /> | ||
<Collapse description={securite.description} title={securite.title} /> | ||
</div> | ||
</div> | ||
<Footer /> | ||
</div> | ||
); | ||
}; | ||
|
||
export default About; | ||
export default About; | ||
|
||
// |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,24 @@ | ||
|
||
import { Link } from 'react-router-dom'; | ||
import '../sass/error.scss' | ||
import Navigation from '../components/Navigation'; | ||
import Footer from '../components/Footer'; | ||
|
||
function Error() { | ||
|
||
return ( | ||
<div> | ||
<Navigation /> | ||
|
||
<section className="contenuError"> | ||
<h1 className="titleError">404</h1> | ||
<p className="textError">Oups! La page que vous demandez n'hésite pas</p> | ||
<Link to='/' className="linkError">Retourner sur la page d'accueil</Link> | ||
</section> | ||
|
||
<Footer /> | ||
</div> | ||
) | ||
} | ||
|
||
export default Error; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,70 @@ | ||
import React, { useEffect } from "react"; | ||
import { useNavigate } from "react-router-dom"; | ||
|
||
import Navigation from "../components/Navigation"; | ||
import '../sass/location.scss' | ||
import '../sass/collapse.scss' | ||
import Carousel from "../components/Carousel"; | ||
import Rating from "../components/Rating"; | ||
import Footer from "../components/Footer"; | ||
import Error from "./Error"; | ||
|
||
//import Error from "./Error"; | ||
import { Routes, Route, useParams } from 'react-router-dom'; | ||
|
||
import Dataloges from '../data/dataloges.json' | ||
import Collapse from "../components/Collapse"; | ||
|
||
const Location = () => { | ||
|
||
// Get the userId param from the URL. | ||
let { id } = useParams(); | ||
const navigate = useNavigate(); | ||
|
||
const logement = Dataloges.find((element) => element.id == id) | ||
|
||
if (!logement) { | ||
return <Error /> | ||
} | ||
|
||
return ( | ||
<div> | ||
<Navigation /> | ||
|
||
<section className="cardLogement"> | ||
<Carousel /> | ||
<div className="container"> | ||
<div className="container__infoLocation"> | ||
<h1 className="container__infoLocation--title">{logement.title}</h1> | ||
<p className="container__infoLocation--localisation">{logement.location}</p> | ||
<ul className="container__infoLocation--ul"> | ||
{logement.tags.map(tag => ( | ||
<li className="container__infoLocation--li" key={tag}>{tag}</li> | ||
))} | ||
</ul> | ||
</div> | ||
|
||
<div className="cardOwner"> | ||
<div className="mediaQueries"> | ||
<div className="cardOwner__info"> | ||
<p className="cardOwner__info--name">{logement.host.name}</p> | ||
<img className="cardOwner__info--img" src={logement.host.picture} /> | ||
</div> | ||
<div className="rating"> | ||
<Rating rating={logement.rating} /> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
<div className="collapseLocation"> | ||
<Collapse className="collapseLocation__description" description={logement.description} title="Description" /> | ||
<Collapse className="collapseLocation__equipements" description={logement.equipments} title="Équipements" /> | ||
</div> | ||
</section> | ||
|
||
<Footer /> | ||
</div> | ||
); | ||
}; | ||
|
||
export default Location; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,47 @@ | ||
.about { | ||
margin-left: 25px; | ||
margin-right: 25px; | ||
|
||
.banner { | ||
width: 100%; | ||
height: 150px; | ||
position: relative; | ||
margin-top: 20px; | ||
margin-bottom: 50px; | ||
@media (max-width: 700px) { | ||
margin-top: 30px; | ||
margin-bottom: 5px; | ||
} | ||
|
||
img { | ||
width: 100%; | ||
height: 100%; | ||
object-fit: cover; | ||
border-radius: 20px; | ||
@media (max-width: 700px) { | ||
height: 80%; | ||
} | ||
} | ||
|
||
&::after { | ||
content: ""; | ||
position: absolute; | ||
//top: 0; | ||
left: 0; | ||
width: 100%; | ||
height: 100%; | ||
background-color: rgba(71, 70, 70, 0.629); // Couleur gris clair avec transparence | ||
border-radius: 20px; | ||
z-index: 1; | ||
//pointer-events: none; // Assure que l'overlay n'intercepte pas les clics | ||
@media (max-width: 700px) { | ||
height: 80%; | ||
} | ||
} | ||
} | ||
} | ||
|
||
|
||
|
||
|
||
|
This file was deleted.
Oops, something went wrong.
Empty file.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,69 @@ | ||
.carousel { | ||
position: relative; | ||
//margin: auto; | ||
|
||
&__image { | ||
width: 100%; | ||
height: 450px; | ||
object-fit: cover; | ||
border-radius: 25px; | ||
//margin-left: 5px; | ||
margin-top: 30px; | ||
@media (max-width: 700px) { | ||
margin-top: 20px; | ||
border-radius: 15px; | ||
height: 280px; | ||
} | ||
} | ||
|
||
&__counter { | ||
position: absolute; | ||
bottom: 10px; | ||
left: 50%; | ||
|
||
color: #fff; | ||
padding: 5px 10px; | ||
border-radius: 5px; | ||
font-size: 16px; | ||
@media (max-width: 700px) { | ||
display: none; | ||
} | ||
} | ||
|
||
&__button { | ||
position: absolute; | ||
top: 50%; | ||
transform: translateY(-50%); | ||
background: none; | ||
border: none; | ||
cursor: pointer; | ||
outline: none; | ||
width: 60px; | ||
height: 50px; | ||
display: flex; | ||
align-items: center; | ||
justify-content: center; | ||
|
||
&--left { | ||
left: 10px;@media (max-width: 700px) { | ||
left: 0; | ||
} | ||
} | ||
|
||
&--right { | ||
right: 10px; | ||
@media (max-width: 700px) { | ||
right: 0; | ||
} | ||
} | ||
@media (max-width: 700px){ | ||
width: 20px; | ||
height: 10px; | ||
} | ||
|
||
img { | ||
width: 100%; | ||
height: auto; | ||
} | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,52 @@ | ||
|
||
.collapse { | ||
margin-bottom: 20px; | ||
|
||
&__button { | ||
display: flex; | ||
justify-content: space-between; | ||
align-items: center; | ||
padding: 10px; | ||
font-size: 1.2em; | ||
background-color: #FF6060; | ||
color: white; | ||
border: none; | ||
border-radius: 10px; | ||
cursor: pointer; | ||
transition: background 0.3s ease; | ||
width: 97%; | ||
margin: auto; | ||
height: 50px; | ||
@media (max-width: 700px) { | ||
margin-left: 0; | ||
width: 100%; | ||
} | ||
} | ||
|
||
&__button img { | ||
margin-left: auto; | ||
width: 25px; | ||
height: 15px; | ||
} | ||
|
||
&__button:hover { | ||
background: rgb(166, 70, 70); | ||
} | ||
|
||
&__content { | ||
margin: auto; | ||
padding: 5px; | ||
background: #fafafa; | ||
width: 96%; | ||
border-radius: 10px; | ||
} | ||
|
||
&__list { | ||
list-style: none; | ||
padding: 0; | ||
margin: 0; | ||
display: flex; | ||
flex-direction: column; | ||
gap: 10px; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,28 @@ | ||
.contenuError { | ||
display: flex; | ||
flex-direction: column; | ||
align-items: center; | ||
justify-content: center; | ||
height: 50vh; | ||
text-align: center; | ||
|
||
|
||
.titleError { | ||
font-size: 13rem; | ||
margin: 0; | ||
color: #FF6060; | ||
} | ||
|
||
.textError { | ||
font-size: 1.5rem; | ||
color: #FF6060; | ||
} | ||
|
||
.linkError { | ||
margin-top: 20px; | ||
font-size: 1.2rem; | ||
color: black; | ||
text-decoration: underline; | ||
cursor: pointer; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,23 @@ | ||
.footer { | ||
display: flex; | ||
justify-content: center; | ||
align-items: center; | ||
flex-direction: column; | ||
margin-top: 30px; | ||
height: 250px; | ||
background-color: black; | ||
color: white; | ||
|
||
img { | ||
width: 100%; | ||
height: 250px; | ||
object-fit: cover; | ||
margin-top: 30px; | ||
} | ||
|
||
.logoFooter { | ||
color: white; | ||
width: 140px; | ||
height: 40px; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,59 @@ | ||
.home { | ||
margin-left: 25px; | ||
margin-right: 25px; | ||
|
||
.banner { | ||
width: 100%; | ||
height: 150px; | ||
position: relative; | ||
//overflow: hidden; | ||
margin-bottom: 50px; | ||
@media (max-width: 700px) { | ||
margin-top: 30px; | ||
margin-bottom: 5px; | ||
} | ||
|
||
img { | ||
width: 100%; | ||
height: 100%; | ||
object-fit: cover; | ||
border-radius: 20px; | ||
@media (max-width: 700px) { | ||
height: 80%; | ||
} | ||
} | ||
|
||
&::after { | ||
content: ""; | ||
position: absolute; | ||
//top: 0; | ||
left: 0; | ||
width: 100%; | ||
height: 100%; | ||
background-color: rgba(10, 9, 9, 0.629); // Couleur gris clair avec transparence | ||
border-radius: 20px; | ||
z-index: 1; | ||
//pointer-events: none; // Assure que l'overlay n'intercepte pas les clics | ||
@media (max-width: 700px) { | ||
height: 80%; | ||
} | ||
} | ||
} | ||
|
||
h1 { | ||
position: absolute; | ||
top: 40%; | ||
left: 50%; | ||
transform: translate(-50%, -50%); | ||
font-size: 1.7rem; | ||
color: white; | ||
z-index: 2; | ||
|
||
@media (max-width: 700px) { | ||
font-size: 1.5em; | ||
left: 0; | ||
margin-left: 20px; | ||
transform: translateY(-100%); | ||
} | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,147 @@ | ||
.cardLogement { | ||
margin-left: 25px; | ||
margin-right: 25px; | ||
|
||
.container { | ||
display: flex; | ||
justify-content: space-between; | ||
margin-top: 30px; | ||
|
||
@media (max-width: 700px) { | ||
margin-top: 5px; | ||
flex-direction: column; | ||
} | ||
|
||
|
||
&__infoLocation { | ||
flex: 1; | ||
margin-left: 5px; | ||
|
||
&--title { | ||
color: #FF6060; | ||
font-size: 1.7em; | ||
|
||
@media (max-width: 700px) { | ||
font-size: 1.2em; | ||
} | ||
} | ||
|
||
&--localisation { | ||
margin-top: -10px; | ||
} | ||
|
||
&--ul { | ||
display: flex; | ||
gap: 10px; | ||
list-style: none; | ||
padding: 0; | ||
flex-wrap: wrap; | ||
} | ||
|
||
&--li { | ||
border: 1px solid #FF6060; | ||
background-color: #FF6060; | ||
color: white; | ||
border-radius: 10px; | ||
padding: 5px 15px; | ||
|
||
@media (max-width: 700px) { | ||
font-size: 0.6em; | ||
} | ||
} | ||
} | ||
} | ||
|
||
.cardOwner { | ||
flex: 1; | ||
display: flex; | ||
flex-direction: column; | ||
align-items: flex-end; | ||
|
||
&__info { | ||
display: flex; | ||
align-items: center; | ||
margin-bottom: 10px; | ||
|
||
&--name { | ||
display: flex; | ||
color: #FF6060; | ||
margin-right: 10px; | ||
font-size: 1.7em; | ||
|
||
@media (max-width: 700px) { | ||
font-size: 1em; | ||
margin-right: 3px; | ||
} | ||
} | ||
|
||
&--img { | ||
border-radius: 50%; | ||
width: 50px; | ||
height: 50px; | ||
object-fit: cover; | ||
|
||
@media (max-width: 700px) { | ||
width: 30px; | ||
height: 30px; | ||
} | ||
} | ||
} | ||
|
||
.rating { | ||
display: flex; | ||
gap: 20px; | ||
|
||
@media (max-width: 700px) { | ||
//justify-content: flex-start; | ||
} | ||
} | ||
|
||
.mediaQueries { | ||
@media (max-width: 700px) { | ||
margin: auto; | ||
display: flex; | ||
flex-direction: row-reverse; | ||
gap: 200px; | ||
margin-left: 0; | ||
//align-items: stretch; | ||
//justify-content: space-between; | ||
|
||
&__info { | ||
margin: 0; | ||
align-items: center; | ||
justify-content: space-between; | ||
} | ||
|
||
} | ||
} | ||
} | ||
|
||
.collapseLocation { | ||
display: flex; | ||
flex-direction: row; | ||
width: 100%; | ||
margin-top: 30px; | ||
|
||
&__description { | ||
width: 80%; | ||
} | ||
|
||
&__equipements { | ||
width: 80%; | ||
} | ||
|
||
@media (max-width: 700px) { | ||
display: flex; | ||
flex-direction: column; | ||
|
||
&__description { | ||
width: 100%; | ||
} | ||
|
||
&__equipements { | ||
width: 100%; | ||
} | ||
} | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,54 @@ | ||
.gallery-logement { | ||
display: flex; | ||
flex-wrap: wrap; | ||
align-content: space-around; | ||
justify-content: center; | ||
gap: 30px; | ||
background-color: rgb(241, 240, 240); | ||
border-radius: 20px; | ||
margin: 25px; | ||
padding-top: 30px; | ||
padding-left: 10px; | ||
padding-right: 10px; | ||
cursor: pointer; | ||
@media (max-width: 700px) { | ||
background-color: white; | ||
} | ||
|
||
a { | ||
text-decoration: none; | ||
color: black; | ||
position: relative; | ||
|
||
img { | ||
background: linear-gradient(#FF6060, #040404); | ||
padding: 5px; | ||
object-fit: cover; | ||
border-radius: 15px; | ||
width: 350px; | ||
height: 300px; | ||
@media (max-width: 700px) { | ||
width: 300px; | ||
height: 250px; | ||
} | ||
} | ||
|
||
h3 { | ||
position: absolute; | ||
bottom: 4px; | ||
left: 0px; | ||
font-size: 1.3rem; | ||
color: white; | ||
background-color: rgba(129, 54, 54, 0.5); | ||
margin: 0; | ||
height: 20%; | ||
width: 100%; | ||
border-radius: 0 0 15px 15px; | ||
text-align: center; | ||
padding-top: 10px; | ||
&:hover{ | ||
background-color: rgba(90, 58, 58, 0.8); | ||
} | ||
} | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
@use "./about.scss"; | ||
@use "./cardLocation.scss"; | ||
@use "./carousel.scss"; | ||
@use "./collapse.scss"; | ||
@use "./error.scss"; | ||
@use "./footer.scss"; | ||
@use "./home.scss"; | ||
@use "./location.scss"; | ||
@use "./logement.scss"; | ||
@use "./navigation.scss"; | ||
@use "./rating.scss"; | ||
|
||
body { | ||
font-family: 'Montserrat'; | ||
} | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,44 @@ | ||
.navigation { | ||
display: flex; | ||
justify-content: space-between; | ||
align-items: center; | ||
margin: 30px; | ||
@media (max-width: 700px) { | ||
margin-bottom: 5px; | ||
} | ||
img{ | ||
object-fit: contain; | ||
height: 50px; | ||
width: 130px; | ||
} | ||
|
||
nav{ | ||
ul{ | ||
display: flex; | ||
gap: 30px; | ||
@media (max-width: 700px) { | ||
gap: 5px; | ||
} | ||
a{ | ||
font-size: 1.5em; | ||
text-decoration: none; | ||
color: black; | ||
&.underline{ | ||
text-decoration: underline; | ||
} | ||
@media (max-width: 700px) { | ||
font-size: 0.6em; | ||
} | ||
} | ||
li{ | ||
margin: 0 20px; | ||
list-style: none; | ||
font-family: 'Montserrat'; | ||
@media (max-width : 700px) { | ||
text-transform: uppercase; | ||
margin: 0 6px; | ||
} | ||
} | ||
} | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,14 @@ | ||
.rating { | ||
display: flex; | ||
gap: 25px; | ||
.stars { | ||
object-fit: contain; | ||
margin-top: 10px; | ||
height: 25px; | ||
width: 25px; | ||
color:#FF6060; | ||
} | ||
@media (max-width: 700px) { | ||
margin-top: 0; | ||
} | ||
} |