add navbar

This commit is contained in:
ThePetrovich 2025-04-05 01:23:03 +08:00
parent cd98f04622
commit 859966c48d
5 changed files with 118 additions and 61 deletions

View file

@ -75,8 +75,8 @@
<div class="map-container">
<div id="map"></div>
<div class="coordinates-display">
Lat: {mouseLat}, Long: {mouseLng}
<div class="card coordinates-display">
<p class="card-text"><b>Lat:</b> {mouseLat}, <b>Lon:</b> {mouseLng}</p>
</div>
<div class="panel-container">
<slot></slot>
@ -92,23 +92,24 @@
#map {
width: 100%;
height: 100%;
height: calc(100% - 44px); /* Adjust height to account for navbar */
position: absolute;
top: 0;
top: 40px;
left: 0;
}
.coordinates-display {
position: absolute;
top: 10px;
top: 54px;
right: 10px;
background: rgba(255, 255, 255, 0.8);
padding: 5px 10px;
border-radius: 3px;
background: #fff; /* Remove transparency */
padding: 3px 8px; /* Reduce padding */
font-family: Arial, sans-serif;
font-size: 14px;
z-index: 1000; /* Ensure it's above the map */
box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
border: 1px solid #ccc; /* Add card border */
width: 150px; /* Fixed width */
}
.panel-container {