Add panel transition on mobile

This commit is contained in:
2022-04-08 20:44:13 +02:00
parent 30a7c56fe5
commit c8be679634
4 changed files with 45 additions and 40 deletions

View File

@@ -231,5 +231,6 @@
@include lightbox-icon(cancel);
@extend .flicker;
color: #CCC;
text-decoration: none;
}
}

View File

@@ -7,47 +7,9 @@
}
#projects {
.leaflet-right, .leaflet-left {
transition: none;
}
&.with-feed, &.with-settings {
#submap {
width: 100%;
}
.leaflet-right {
right: calc(#{$panel-width});
}
.leaflet-left {
left: calc(#{$panel-width});
}
.leaflet-control-container .leaflet-top.leaflet-right {
display: none;
}
#title {
display: none;
}
}
&.with-feed #settings-button {
display:none;
}
&.with-settings #feed-button {
display:none;
}
.leaflet-control-container .leaflet-top.leaflet-left {
display: none;
}
#feed, #settings {
width: calc(#{$panel-width});
max-width: calc(#{$panel-width});
transition: none;
}
#feed {
@@ -60,8 +22,50 @@
#title {
width: calc(#{$panel-width} - #{$button-width} - 4 * #{$block-spacing});
max-width: calc(#{$panel-width} - #{$button-width} - 4 * #{$block-spacing});
text-align: center;
}
.leaflet-right, .leaflet-left {
width: 100%;
}
&.with-feed, &.with-settings {
#submap {
width: 100%;
}
.leaflet-control-container .leaflet-top.leaflet-right {
display: none;
}
#title {
width: calc(#{$panel-width} - #{$button-width} - 4 * #{$block-spacing});
max-width: calc(#{$panel-width} - #{$button-width} - 4 * #{$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 {

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long