Upgrade maplibre and fix goToPost

This commit is contained in:
2024-02-10 23:12:57 +01:00
parent cab899e544
commit 869b084d70
15 changed files with 604 additions and 499 deletions

View File

@@ -95,7 +95,7 @@ $fa-css-prefix: fa;
.#{$fa-css-prefix}-video-shot:before { content: fa-content($fa-var-camcorder); }
.#{$fa-css-prefix}-image-shot:before { content: fa-content($fa-var-camera-alt); }
.#{$fa-css-prefix}-link:before { content: fa-content($fa-var-link); }
.#{$fa-css-prefix}-link.copied:before { content: fa-content($fa-var-check); }
.#{$fa-css-prefix}-copied:before { content: fa-content($fa-var-check); }
/* Feed - Poster */
.#{$fa-css-prefix}-poster:before { content: fa-content($fa-var-comment-edit); }

View File

@@ -65,7 +65,7 @@
padding: 0 $block-spacing;
position: relative;
span {
div {
display: inline-block;
font-size: 0.8em;
padding: $elem-spacing 0px;
@@ -73,7 +73,7 @@
&.index {
width: 25%;
.link, .link:visited, .link_copied {
.link {
margin-left: $elem-spacing;
padding: 0;
line-height: 1;

View File

@@ -0,0 +1,110 @@
#map {
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 100%;
/* Leaflet Popup */
.leaflet-popup-content {
h1 {
font-size: 1.4em;
margin: 0;
font-weight: bold;
}
.separator {
border-top: 1px solid #CCC;
margin: $elem-spacing 0 $block-spacing 0;
}
/* Marker Popup */
.info-window {
h1 .message-type {
color: #CCC;
font-weight: normal;
font-size: calc(1em / 1.4);
margin-left: 0.5em;
vertical-align: text-bottom;
}
p {
font-size: 1.0em;
margin: $elem-spacing 0 0 0;
a {
color: $post-color;
}
}
.medias {
line-height: 0;
a {
display: inline-block;
margin: $block-spacing $block-spacing 0 0;
&:last-child {
margin-right: 0;
}
&.drill {
font-size: 2em;
.fa-drill-image {
color: transparent;
}
.fa-drill-video {
color: rgba(255, 255, 255, 0.5);
}
&:hover {
.fa-drill-video, .fa-drill-image {
color: rgba(255, 255, 255, 0.75);
}
}
}
img {
width: auto;
height: auto;
max-width: 200px;
max-height: 100px;
border-radius: $block-radius;
image-orientation: from-image;
transition: All 0.2s;
}
}
}
}
/* Track Popup */
.track_tooltip {
p {
margin: 0;
&.description {
font-size: 1.15em;
}
}
h1, .description {
@include no-text-overflow();
}
.body {
padding-left: calc(1.25em*1.4 + #{$elem-spacing} );
.details {
margin-top: -$block-spacing;
p.detail {
margin-top: $block-spacing;
width: 50%;
display: inline-block;
}
}
}
}
}
}

View File

@@ -26,6 +26,7 @@ $track-off-track-color: #0000ff;
$track-hitchhiking-color: #FF7814;
$legend-color: $post-color;
@import 'page.project.map';
@import 'page.project.panel';
@import 'page.project.feed';
@import 'page.project.settings';
@@ -64,117 +65,6 @@ $legend-color: $post-color;
}
}
#map {
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 100%;
/* Leaflet Popup */
.leaflet-popup-content {
h1 {
font-size: 1.4em;
margin: 0;
font-weight: bold;
}
.separator {
border-top: 1px solid #CCC;
margin: $elem-spacing 0 $block-spacing 0;
}
/* Marker Popup */
.info-window {
h1 .message-type {
color: #CCC;
font-weight: normal;
font-size: calc(1em / 1.4);
margin-left: 0.5em;
vertical-align: text-bottom;
}
p {
font-size: 1.0em;
margin: $elem-spacing 0 0 0;
a {
color: $post-color;
}
}
.medias {
line-height: 0;
a {
display: inline-block;
margin: $block-spacing $block-spacing 0 0;
&:last-child {
margin-right: 0;
}
&.drill {
font-size: 2em;
.fa-drill-image {
color: transparent;
}
.fa-drill-video {
color: rgba(255, 255, 255, 0.5);
}
&:hover {
.fa-drill-video, .fa-drill-image {
color: rgba(255, 255, 255, 0.75);
}
}
}
img {
width: auto;
height: auto;
max-width: 200px;
max-height: 100px;
border-radius: $block-radius;
image-orientation: from-image;
transition: All 0.2s;
}
}
}
}
/* Track Popup */
.track_tooltip {
p {
margin: 0;
&.description {
font-size: 1.15em;
}
}
h1, .description {
@include no-text-overflow();
}
.body {
padding-left: calc(1.25em*1.4 + #{$elem-spacing} );
.details {
margin-top: -$block-spacing;
p.detail {
margin-top: $block-spacing;
width: 50%;
display: inline-block;
}
}
}
}
}
}
/* Drill & Map icons */
a.drill {

9
src/styles/_vue.scss Normal file
View File

@@ -0,0 +1,9 @@
.fade-enter-active,
.fade-leave-active {
transition: opacity 0.3s ease;
}
.fade-enter-from,
.fade-leave-to {
opacity: 0;
}

View File

@@ -5,7 +5,8 @@
/* Modules */
@import 'fa';
@import 'lightbox';
@import '../../node_modules/simplebar/dist/simplebar.css';
@import '../../node_modules/simplebar-vue/dist/simplebar.min.css';
@import 'vue';
/* Pages Specific CSS */
@import 'page.project';