Replace leaflet with maplibre GL

src/styles/_leaflet.scss

@@ -1,114 +0,0 @@
-$theme : "spot-theme";
-$base-color : #CCC;
-$highlight-color : #FFF;
-$background : rgba($base-color, 0.2);
-$drag-color : rgba($highlight-color, 0.2);
-$axis-color : darken($base-color,20%);
-$stroke-color : darken($base-color,40%);
-$stroke-width-mouse-focus : 1;
-$stroke-width-height-focus: 2;
-$stroke-width-axis : 2;
-
-@import '../../node_modules/leaflet/dist/leaflet.css';
-@import '../../node_modules/leaflet.heightgraph/src/L.Control.Heightgraph.css';
-
-/* Leaflet fixes */
-.leaflet-container {
-	background: none;
-}
-
-.leaflet-popup {
-	.leaflet-popup-content-wrapper {
-		border-radius: 5px;
-		padding: 0;
-
-		.leaflet-popup-content {
-			margin: 0;
-			padding: 1rem;
-			box-sizing: border-box;
-		}
-	}
-}
-
-.leaflet-control.spot-control, .leaflet-control.heightgraph .heightgraph-toggle {
-	@extend .clickable;
-	width: 44px;
-	height: 44px;
-	text-align: center;
-	box-shadow: none;
-
-	.fa {
-		@extend .control-icon;
-		width: 100%;
-	}
-}
-
-/* Leaflet Heightgraph fixes */
-
-.legend-text, .tick, .tick text, .focusbox, .height-focus.circle, .height-focus.label, .lineSelection, .horizontalLineText {
-    fill: #333 !important;
-}
-
-.axis path, .focusbox rect, .focusLine line, .height-focus.label rect, .height-focus.line, .horizontalLine {
-    stroke: #333 !important;
-}
-
-.focusbox rect, .height-focus.label rect {
-	stroke-width: 0;
-}
-
-.focusLine line, .focusbox rect, .height-focus.label rect {
-	-webkit-filter: drop-shadow(1px 0px 2px rgba(0, 0, 0, 0.6));
-	filter: drop-shadow(1px 0px 2px rgba(0, 0, 0, 0.6));
-}
-
-.height-focus.label rect, .focusbox rect {
-	fill: rgba(255,255,255,.6);
-}
-
-.heightgraph.leaflet-control {
-	svg.heightgraph-container {
-		background: none;
-		border-radius: 0;
-
-		.area {
-			@include drop-shadow(0.6);
-		}
-	}
-
-	.horizontalLine {
-		stroke-width: 2px;
-	}
-
-	.heightgraph-toggle {
-		background: none;
-
-		.heightgraph-toggle-icon {
-			@extend .control-icon;
-			@extend .fa-elev-chart;
-			height: 44px;
-			position: static;
-			background: none;
-		}
-	}
-
-	.heightgraph-close-icon {
-		@extend .control-icon;
-		@extend .fa-unsubscribe;
-		background: none;
-		font-size: 20px;
-		line-height: 26px;
-		width: 26px;
-		text-align: center;
-		display: none;
-
-		&:before {
-			width: 26px;
-			height: 26px;
-		}
-	}
-}
-
-.leaflet-default-icon-path {
-	background-image: none;
-}

src/styles/_page.project.scss

@@ -422,26 +422,18 @@ $legend-color: $post-color;
 			width: 100%;
 			padding-top: $block-spacing;
 			
-			#posts_list {
-				position: relative;
-			}
-
-			#poster {
-				&.histo-mode .poster, &:not(.histo-mode) .archived {
-					display: none;
-				}
-
+			#feed-header {
 				.poster {
-					textarea#post {
+					textarea[name=post] {
 						margin-bottom: 1em;
 						width: calc(100% - 2em);
 					}
 
-					input#name {
+					input[name=name] {
 						width: calc(100% - 6em);
 					}
 
-					button#submit {
+					button[name=submit] {
 						margin-left: 1em;
 						margin-bottom: 0.5em;
 					}
@@ -452,6 +444,10 @@ $legend-color: $post-color;
 				}
 			}
 
+			#feed-posts {
+				position: relative;
+			}
+
 			.body-box {
 				position:relative;
 				display: flex;

src/styles/spot.scss

@@ -5,7 +5,6 @@
 /* Modules */
 @import 'fa';
 @import 'lightbox';
-@import 'leaflet';
 @import '../../node_modules/simplebar/dist/simplebar.css';
 
 /* Pages Specific CSS */