Giovanni/SAE-BUT2-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix some responsive

Browse Source
This commit is contained in:
Giovanni
2025-12-10 11:51:14 +01:00
parent 6a416abadb
commit 516277c77d
4 changed files with 56 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/SearchBar/SearchBar.jsx
+29 -28
View File
@@ -65,36 +65,37 @@ function SearchBar() {
) : null}
</div>
{searchResults.map((result, i) => (
(location.pathname.includes("events")) ? (
<Link to={`/event/` + result.id}>
<div className={styles.searchedEvent} key={i}>
<div className={`${styles.eventImageDiv}`}>
{result.image == null ? (
<img src="empty.png" className={styles.eventImage} alt="Pas de photo de l'événement" />
) : (
<img src={result.image + `.png`} alt="Photo de l'événement" />
)}
<div className={styles.elementList}>
{searchResults.map((result, i) => (
(location.pathname.includes("events")) ? (
<Link to={`/event/` + result.id}>
<div className={styles.searchedEvent} key={i}>
<div className={`${styles.eventImageDiv}`}>
{result.image == null ? (
<img src="empty.png" className={styles.eventImage} alt="Pas de photo de l'événement" />
) : (
<img src={result.image + `.png`} alt="Photo de l'événement" />
)}
</div>
<p>{result.name}</p>
</div>
<p>{result.name}</p>
</div>
</Link>
) : location.pathname.includes("volunteers") ? (
<Link to={`/profile/` + result.id}>
<div className={styles.searchedEvent} key={i}>
<div className={`${styles.eventImageDiv}`}>
{result.image == null ? (
<img src="empty.png" className={styles.eventImage} alt="Pas de photo de l'événement" />
) : (
<img src={result.image + `.png`} alt="Photo de l'événement" />
)}
</Link>
) : location.pathname.includes("volunteers") ? (
<Link to={`/profile/` + result.id}>
<div className={styles.searchedEvent} key={i}>
<div className={`${styles.eventImageDiv}`}>
{result.image == null ? (
<img src="empty.png" className={styles.eventImage} alt="Pas de photo de l'événement" />
) : (
<img src={result.image + `.png`} alt="Photo de l'événement" />
)}
</div>
<p>{result.name} {result.lastname}</p>
</div>
<p>{result.name} {result.lastname}</p>
</div>
</Link>
) : null
))}
</Link>
) : null
))}
</div>
</div>
);
}
src/components/SearchBar/SearchBar.module.css
+13 -1
View File
@@ -1,6 +1,6 @@
.searchBarContainer{
position: fixed;
top: 10rem;
top: 4rem;
z-index: 100;
width: 60%;
background: #fff;
@@ -11,6 +11,11 @@
display: flex;
}
.elementList {
max-height: 60vh;
overflow-y: auto;
}
.eventImageDiv {
@@ -72,3 +77,10 @@
.searchBarForm input:focus{
outline: none;
}
@media screen and (max-width: 480px) {
.searchBarContainer{
width: 80%;
}
}