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

Moved some variables to root

Browse Source
This commit is contained in:
Alexis
2025-06-20 20:06:07 +02:00
parent 1cb77dd6f0
commit c88133a9a3
13 changed files with 51 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/assets/scss/_buttons.scss
View File

@@ -22,7 +22,7 @@
&:hover,
&:focus-visible {
color: var(--white);
color: var(--background);
background-color: var(--blue-500);
}
}
@@ -39,7 +39,7 @@
&:hover,
&:focus-visible {
color: var(--white);
color: var(--background);
background-color: var(--blue-500);
}
}
@@ -51,7 +51,7 @@
&:hover,
&:focus-visible {
color: var(--white);
color: var(--background);
background-color: var(--red-500);
}
}
@@ -76,7 +76,7 @@
}
&.btn-shadow {
box-shadow: color-mix(in srgb, var(--black) 10%, transparent) 0 .2rem .3rem;
box-shadow: var(--shadow);
}
}
@@ -85,9 +85,9 @@
place-items: center;
height: 45px;
aspect-ratio: 1;
background-color: var(--white);
border: 1px solid var(--slate-400);
box-shadow: color-mix(in srgb, var(--black) 10%, transparent) 0px 4px 12px;
background-color: var(--background);
border: 1px solid var(--border);
box-shadow: var(--shadow);
border-radius: 100vmax;
pointer-events: all;
cursor: pointer;
@@ -114,12 +114,12 @@
}
&.active {
color: var(--white);
color: var(--background);
background-color: var(--blue-500);
border-color: var(--blue-700);
svg {
fill: var(--white);
fill: var(--background);
}
}
}

8
src/assets/scss/_card.scss
View File

@@ -2,13 +2,13 @@
padding-block: 0.75rem;
padding-inline: .75rem;
border-radius: 8px;
background-color: var(--white);
border: 1px solid var(--slate-100);
box-shadow: color-mix(in srgb, var(--black) 10%, transparent) 0px 4px 12px;
background-color: var(--background);
border: 1px solid var(--border);
box-shadow: var(--shadow);
min-width: 15rem;
.card-arrow {
fill: var(--white);
fill: var(--background);
}
&.p-sm {

2
src/assets/scss/_forms.scss
View File

@@ -16,7 +16,7 @@
padding: .4rem .5rem;
border: 1px solid var(--slate-300);
font-size: .8em;
border-radius: .2rem;
border-radius: var(--border-radius);
transition-property: box-shadow;
transition-duration: .2s;
transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);

2
src/assets/scss/_leaflet.scss
View File

@@ -10,7 +10,7 @@
.leaflet-map-pane {
.leaflet-popup-pane {
.leaflet-popup-content-wrapper {
border-radius: .25rem;
border-radius: var(--border-radius);
overflow: clip;
.leaflet-popup-content {

8
src/assets/scss/radix/_dialog.scss
View File

@@ -19,10 +19,10 @@
padding: 25px;
display: grid;
grid-template-rows: auto 1fr;
border-radius: 8px;
background-color: var(--white);
border: 1px solid var(--slate-100);
box-shadow: color-mix(in srgb, var(--black) 10%, transparent) 0px 4px 12px;
border-radius: var(--border-radius);
background-color: var(--background);
border: 1px solid var(--border);
box-shadow: var(--shadow);
animation: show-content 150ms cubic-bezier(0.16, 1, 0.3, 1);
&:focus {

10
src/assets/scss/radix/_toast.scss
View File

@@ -23,16 +23,16 @@
grid-template-columns: auto max-content;
column-gap: 15px;
align-items: center;
color: var(--slate-800);
border: 1px solid var(--slate-400);
background-color: var(--white);
border-radius: 6px;
color: var(--foreground);
border: 1px solid var(--border);
background-color: var(--background);
border-radius: var(--border-radius);
box-shadow: hsl(206 22% 7% / 35%) 0px 10px 38px -10px, hsl(206 22% 7% / 20%) 0px 10px 20px -15px;
&.toast-success {
color: var(--green-700);
border: 1px solid var(--green-700);
background-color: color-mix(in srgb, var(--green-500) 17.5%, var(--white));
background-color: color-mix(in srgb, var(--green-500) 17.5%, var(--background));
.toast-icon svg {
fill: var(--green-700);

8
src/assets/scss/theme.scss
View File

@@ -37,11 +37,17 @@
--orange-700: #c2410c;
--purple-500: #8b5cf6;
--purple-700: #6d28d9;
--foreground: var(--black);
--background: var(--white);
--border: var(--slate-400);
--border-radius: .25rem;
--shadow: color-mix(in srgb, var(--foreground) 10%, transparent) 0px 4px 12px;
}
html {
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
color: var(--slate-900);
color: var(--foreground);
}
a[href^='http'] {

4
src/components/maps/MapOverlayBreadcrumbs.astro
View File

@@ -48,8 +48,8 @@ menu {
margin-top: .5rem;
padding-block: .25rem;
padding-inline: .8rem;
border: 1px solid var(--slate-400);
background: var(--white);
border: 1px solid var(--border);
background: var(--background);
border-radius: 100vmax;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
pointer-events: all;

4
src/components/maps/MarkerContent.astro
View File

@@ -101,7 +101,7 @@ const seeMapText = t('maps.go-to-map', lang)
font-weight: 600;
bottom: .5rem;
right: 1rem;
color: var(--white);
color: var(--background);
z-index: 20;
opacity: .6;
transition-property: opacity;
@@ -110,7 +110,7 @@ const seeMapText = t('maps.go-to-map', lang)
a {
padding-right: 0;
color: var(--white);
color: var(--background);
text-decoration: underline;
text-underline-offset: .15rem;

12
src/components/maps/overlay/MarkerCreator.vue
View File

@@ -275,10 +275,10 @@ menu {
padding-block: .25rem;
top: calc(var(--mouse-y) - .5rem);
left: calc(var(--mouse-x) + .75rem);
background-color: var(--white);
border: 1px solid var(--slate-400);
background-color: var(--background);
border: 1px solid var(--border);
border-radius: .3rem;
box-shadow: rgba(0, 0, 0, 0.3) 0px 4px 12px;
box-shadow: var(--shadow);
z-index: 1000;
transition-property: top, left;
transition-duration: .16s;
@@ -313,10 +313,10 @@ dialog {
max-width: calc(100% - 6rem);
padding: 1.5rem 2rem;
z-index: 9999;
background-color: var(--white);
border: 1px solid var(--slate-400);
background-color: var(--background);
border: 1px solid var(--border);
border-radius: .75rem;
box-shadow: rgba(0, 0, 0, 0.3) 0px 4px 12px;
box-shadow: var(--shadow);
overflow: visible;
transform: translateY(1rem);
transition: visibility 0s ease-out .3s, opacity .3s ease-out, transform .3s ease-out;

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

@@ -251,7 +251,7 @@ const menus: Menu[] = [
img {
display: block;
border-radius: .3rem;
border: .1rem solid var(--white);
border: .1rem solid var(--background);
outline: .15rem solid transparent;
}
@@ -264,7 +264,7 @@ const menus: Menu[] = [
pointer-events: none;
.fill { fill: var(--orange-500); }
.stroke { fill: var(--white); }
.stroke { fill: var(--background); }
}
}

6
src/components/maps/overlay/SearchMarkers.vue
View File

@@ -308,10 +308,10 @@ function resetAllFields(actionAfter?: "focusAfter") {
margin-left: calc(45px + .5rem);
padding: .5rem 1.2rem;
width: calc(100% - 3rem);
background: var(--white);
border: 1px solid var(--slate-400);
background: var(--background);
border: 1px solid var(--border);
border-radius: 25px;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
box-shadow: var(--shadow);
pointer-events: all;
@media screen and (width >= 900px) {

10
src/components/maps/overlay/SearchMarkersTags.vue
View File

@@ -125,10 +125,10 @@ function emitCategorySwitch(newCategory: MapMarkerGroup) {
padding-inline: .8rem;
font-weight: 600;
font-size: .85em;
background: var(--white);
border: 1px solid var(--slate-400);
background: var(--background);
border: 1px solid var(--border);
border-radius: 100vmax;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
box-shadow: var(--shadow);
white-space: nowrap;
pointer-events: all;
cursor: pointer;
@@ -154,12 +154,12 @@ function emitCategorySwitch(newCategory: MapMarkerGroup) {
@each $c in $colors {
&.#{$c} {
&.active {
color: var(--white);
color: var(--background);
background-color: var(--#{$c}-500);
border-color: var(--#{$c}-700);
.icon {
fill: var(--white);
fill: var(--background);
}
}