franzz/spot
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Rebuild panel navigation

Browse Source
This commit is contained in:
Franzz
2024-02-06 21:22:36 +01:00
parent b6fc305111
commit cab899e544
11 changed files with 800 additions and 713 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
src/styles/_mobile.scss
View File

@@ -7,65 +7,47 @@
}
#projects {
#feed, #settings {
.map-container {
width: calc(#{$panel-width});
max-width: calc(#{$panel-width});
}
#feed {
right: calc((#{$panel-width}) * -1);
}
#settings {
.map-container-left {
left: calc((#{$panel-width}) * -1);
}
.map-container-right {
right: calc((#{$panel-width}) * -1);
}
#title {
width: calc(#{$panel-width} - #{$button-width} - 4 * #{$block-spacing});
max-width: calc(#{$panel-width} - #{$button-width} - 4 * #{$block-spacing});
width: calc(#{$panel-width} - #{$button-width} - 3 * #{$block-spacing});
max-width: calc(#{$panel-width} - #{$button-width} - 3 * #{$block-spacing});
text-align: center;
}
.leaflet-right, .leaflet-left {
width: 100%;
&.with-feed {
.map-container-left {
left: calc((#{$panel-width}) * -2);
}
}
&.with-settings {
.map-container-right {
right: calc((#{$panel-width}) * -2);
}
}
&.with-feed, &.with-settings {
#submap {
width: 100%;
}
.leaflet-control-container .leaflet-top.leaflet-right {
display: none;
left: 0;
}
#title {
width: calc(#{$panel-width} - #{$button-width} - 4 * #{$block-spacing});
max-width: calc(#{$panel-width} - #{$button-width} - 4 * #{$block-spacing});
max-width: calc(#{$panel-width} - #{$button-width} - 3 * #{$block-spacing});
}
}
&.with-feed {
.leaflet-right {
right: calc(#{$panel-width});
}
.leaflet-left {
left: calc((#{$panel-width}) * -1);
}
}
&.with-settings {
.leaflet-right {
right: calc((#{$panel-width}) * -1);
}
.leaflet-left {
left: calc(#{$panel-width});
}
}
.leaflet-control-container .leaflet-top.leaflet-left {
display: none;
}
}
.lightbox .lb-outerContainer .lb-container .lb-nav {
@@ -81,11 +63,9 @@
a.lb-next::before {
right: 1em;
}
}
}
@media only screen and (min-width: 801px) {
.mobile {
display: none !important;
}
}
#mobile {
display: block;
}
}