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

Replace panels movements with translateX

Browse Source
This commit is contained in:
Franzz
2024-02-13 23:33:57 +01:00
parent 8c812f6b0a
commit 6e614042d1
4 changed files with 69 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
src/styles/_mobile.scss
View File

@@ -1,6 +1,8 @@
@media only screen and (max-width: 800px) {
$panel-width: "100vw - #{$button-width} - 2 * #{$block-spacing}";
$panel-width-max: $panel-width;
$panel-actual-width: $panel-width;
.desktop {
display: none !important;
@@ -12,40 +14,37 @@
max-width: calc(#{$panel-width});
}
.map-container-left {
left: calc((#{$panel-width}) * -1);
}
.map-container-right {
right: calc((#{$panel-width}) * -1);
}
#title {
width: calc(#{$panel-width} - #{$button-width} - 3 * #{$block-spacing});
max-width: calc(#{$panel-width} - #{$button-width} - 3 * #{$block-spacing});
text-align: center;
}
&.with-feed, &.with-settings {
#title {
max-width: calc(100vw - #{$block-spacing} - #{$panel-actual-width} - (#{$button-width} + #{$block-spacing} * 2) * 2);
}
#submap {
transform: translateX(0);
}
}
&.with-feed {
.map-container-left {
left: calc((#{$panel-width}) * -2);
transform: translateX(-200vw);
}
}
&.with-settings {
.map-container-right {
right: calc((#{$panel-width}) * -2);
transform: translateX(calc(#{$button-width} + #{$block-spacing} * 2));
}
}
&.with-feed, &.with-settings {
#submap {
width: 100%;
left: 0;
&.with-settings {
.map-container-left {
transform: translateX(0);
}
#title {
max-width: calc(#{$panel-width} - #{$button-width} - 3 * #{$block-spacing});
.map-container-right {
transform: translateX(200vw);
}
}
}