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

change tool bar svg by img tag

Browse Source
This commit is contained in:
Giovanni
2025-12-10 15:34:41 +01:00
parent 76f7d16733
commit 7fff6177b4
3 changed files with 4 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/filter.svg
+1
View File
@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#000000"><path d="M440-160q-17 0-28.5-11.5T400-200v-240L168-736q-15-20-4.5-42t36.5-22h560q26 0 36.5 22t-4.5 42L560-440v240q0 17-11.5 28.5T520-160h-80Zm40-308 198-252H282l198 252Zm0 0Z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 290 B

src/components/ToolBar/ToolBar.jsx
+2 -6
View File
@@ -43,16 +43,12 @@ function ToolBar({setFilters, filters}) {
</Link> </Link>
<button className={`${styles.searchButton} glassCard`} onClick={() => setIsSearchVisible(true)}> <button className={`${styles.searchButton} glassCard`} onClick={() => setIsSearchVisible(true)}>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -960 960 960" fill="#currentColor"> <img src="search.svg" alt="Rechercher"/>
<path d="M784-120 532-372q-30 24-69 38t-83 14q-109 0-184.5-75.5T120-580q0-109 75.5-184.5T380-840q109 0 184.5 75.5T640-580q0 44-14 83t-38 69l252 252-56 56ZM380-400q75 0 127.5-52.5T560-580q0-75-52.5-127.5T380-760q-75 0-127.5 52.5T200-580q0 75 52.5 127.5T380-400Z"/>
</svg>
</button> </button>
<div className={`${styles.filterContainer} ${isFilterVisible ? "glassCard" : ""}`}> <div className={`${styles.filterContainer} ${isFilterVisible ? "glassCard" : ""}`}>
<button className={`${isFilterVisible ? "" : styles.mobileFilter} ${styles.sortButton} glassCard`} onClick={toggleFilters}> <button className={`${isFilterVisible ? "" : styles.mobileFilter} ${styles.sortButton} glassCard`} onClick={toggleFilters}>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -960 960 960" fill="currentColor"> <img src="filter.svg" alt="Filtrer"/>
<path d="M440-160q-17 0-28.5-11.5T400-200v-240L168-736q-15-20-4.5-42t36.5-22h560q26 0 36.5 22t-4.5 42L560-440v240q0 17-11.5 28.5T520-160h-80Zm40-308 198-252H282l198 252Zm0 0Z"/>
</svg>
</button> </button>
<div className={styles.filterMenu}> <div className={styles.filterMenu}>
<Filter isFilterVisible={isFilterVisible} filters={filters} setFilters={setFilters}/> <Filter isFilterVisible={isFilterVisible} filters={filters} setFilters={setFilters}/>
src/components/ToolBar/ToolBar.module.css
+1 -6
View File
@@ -39,7 +39,7 @@
.createButton { .createButton {
font-size: 2rem; font-size: 2rem;
color: #019AFF; color: black;
} }
.createButton:hover, .searchButton:hover, .mobileFilter:hover { .createButton:hover, .searchButton:hover, .mobileFilter:hover {
@@ -63,11 +63,6 @@
justify-content: center; justify-content: center;
} }
.sortButton svg, .searchButton svg {
transform: scale(0.5);
fill: #019AFF;
}
.sortButton:focus, .searchButton:focus { .sortButton:focus, .searchButton:focus {
outline: none; outline: none;