Joururi/leim-maps
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added translations switch button

Browse Source
This commit is contained in:
Alexis
2025-03-23 16:53:09 +01:00
parent 4c34f8e644
commit fe1a657c04
14 changed files with 278 additions and 1473 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
src/components/maps/overlay/SearchMapSwitch.vue
View File

@@ -96,7 +96,7 @@ const menus: Menu[] = [
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><rect width="256" height="256" fill="none"/><path d="M228.92,49.69a8,8,0,0,0-6.86-1.45L160.93,63.52,99.58,32.84a8,8,0,0,0-5.52-.6l-64,16A8,8,0,0,0,24,56V200a8,8,0,0,0,9.94,7.76l61.13-15.28,61.35,30.68A8.15,8.15,0,0,0,160,224a8,8,0,0,0,1.94-.24l64-16A8,8,0,0,0,232,200V56A8,8,0,0,0,228.92,49.69ZM96,176a8,8,0,0,0-1.94.24L40,189.75V62.25L95.07,48.48l.93.46Zm120,17.75-55.07,13.77-.93-.46V80a8,8,0,0,0,1.94-.23L216,66.25Z"/></svg>
</button>
</PopoverTrigger>
<PopoverContent side="bottom" :side-offset="6" :collision-padding="10" class="card" style="z-index: 100;">
<PopoverContent side="bottom" :side-offset="6" :collision-padding="16" class="card" style="z-index: 100;">
<PopoverArrow class="card-arrow" />
<template v-for="menu in menus">
@@ -141,15 +141,9 @@ const menus: Menu[] = [
@media screen and (width < 900px) {
position: absolute;
top: 10px;
left: 10px;
}
}
button {
cursor: pointer;
}
.menu-title {
font-size: .9em;
font-weight: 600;
@@ -157,52 +151,6 @@ button {
margin-left: .25rem;
}
.btn-round {
display: grid;
place-items: center;
height: 45px;
aspect-ratio: 1;
background-color: var(--white);
border: 1px solid var(--slate-400);
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
border-radius: 100vmax;
pointer-events: all;
outline: .2rem solid transparent;
transition-property: color, background-color, border-color, outline-color;
transition-duration: .15s;
transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
svg {
transition-property: fill;
transition-duration: .15s;
transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}
&:hover,
&:focus-visible {
outline-color: color-mix(in srgb, var(--blue-500) 20%, transparent);
border-color: var(--blue-500);
svg {
fill: var(--blue-500);
}
}
&.active {
color: var(--white);
background-color: var(--blue-500);
border-color: var(--blue-700);
svg {
fill: var(--white);
}
}
}
svg {
width: 1.15em;
}
.map-menu {
margin-top: .25rem;
margin-bottom: .5rem;
@@ -249,6 +197,7 @@ svg {
position: absolute;
top: -0.3rem;
right: -0.3rem;
width: 1.15em;
z-index: 10;
pointer-events: none;