canastack-admin
/
sw-fe
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update frontend

This commit is contained in:
Your Name 2025-12-20 23:22:34 -05:00
parent 04dc5f695c
commit acee536d8b
1 changed files with 17 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

71
src/styles/map.css
View File

@ -76,6 +76,7 @@
left:50%;
transform:translateX(-50%);
max-width: min(980px, calc(100vw - 24px));
width:100%;
}
/* Left / right: filtres */
@ -242,6 +243,7 @@
box-shadow: 0 5px 12px rgba(0,0,0,.70), 0 0 14px rgba(56,189,248,.22);
backdrop-filter: blur(10px);
min-height: 38px;
width:100%;
}
.sw-searchbar:focus-within{
@ -261,8 +263,9 @@
color: #e5e7eb;
font-size: 0.80rem;
font-weight: 800;
width: min(52vw, 360px);
min-width: 160px;
width: 100%;
max-width: 100%;
min-width: 0;
}
.sw-search-input::placeholder{
@ -305,14 +308,6 @@ body[data-theme="light"] .sw-search-clear{
border-color: rgba(148,163,184,.55);
}
/* Tight phones: keep it clean */
@media (max-width: 420px){
.sw-search-input{
width: min(72vw, 320px);
min-width: 120px;
}
}
/* ===== TOP ROW: search + 2 icônes ===== */
.sw-top-row{
@ -320,18 +315,23 @@ body[data-theme="light"] .sw-search-clear{
align-items:center;
justify-content:space-between;
gap:0.75rem;
width:100%;
}
/* search = prend la place à gauche */
/* search = 50% à gauche */
.sw-top-search{
flex:1 1 auto;
flex:0 0 50%;
max-width:50%;
}
/* bloc des 2 boutons à droite */
/* bloc des 2 boutons = 50% à droite */
.map-top-actions{
flex:0 0 50%;
max-width:50%;
display:flex;
flex-direction:row;
align-items:center;
justify-content:flex-end;
gap:0.5rem;
}
@ -369,49 +369,12 @@ body[data-theme="light"] .sw-search-clear{
letter-spacing:0.04em;
}
.map-top-actions .map-action-btn i{
display:block;
font-size:1.05rem;
margin-bottom:0.15rem;
}
.map-top-actions .map-action-btn span{
font-size:0.65rem;
font-weight:600;
letter-spacing:0.03em;
}
/* TOP layout: 75% search / 25% boutons */
.map-overlay-top .sw-top-row{
display:flex;
align-items:center;
justify-content:space-between;
gap:0.75rem;
}
.map-overlay-top .sw-searchbar{
flex:0 0 75%;
max-width:75%;
}
.map-overlay-top .map-top-actions{
flex:0 0 25%;
max-width:25%;
display:flex;
justify-content:flex-end;
gap:0.5rem;
}
/* petits écrans */
/* petits écrans : on laisse 50/50 mais on compresse un peu les boutons */
@media (max-width:480px){
.map-overlay-top .sw-top-row{
gap:0.4rem;
.sw-top-row{
gap:0.5rem;
}
.map-top-actions .map-action-btn{
.map-action-btn{
padding:0.3rem 0.45rem;
}
.map-overlay-top .sw-searchbar{
flex:1 1 auto;
max-width:100%;
}
}