Interactive Map
body, html {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
font-family: "Inter", Arial, Helvetica, sans-serif;
}
#map {
height: 550px;
width: 100%;
}
.popup-content {
text-align: center;
padding: 15px;
border-radius: 10px;
background: #ffffff;
max-width: 280px;
}
.popup-content img {
width: 100px;
height: auto;
display: block;
margin: 0 auto 10px;
border-radius: 8px;
}
.popup-content .info {
font-size: 14px;
margin-bottom: 10px;
color: #333;
}
.popup-content .info a {
color: #dd3333;
text-decoration: none;
font-weight: bold;
}
.popup-content .info a:hover {
text-decoration: underline;
}
.popup-content .btn {
display: inline-block;
background: #dd3333;
color: white;
padding: 8px 12px;
text-decoration: none;
font-weight: bold;
border-radius: 5px;
transition: background-color 0.3s;
}
.popup-content .btn:hover {
background: #cf2e2e;
}
}
.popup-content .btn:hover a {
color: #fff;
}
var map = L.map('map', {
center: [-24.692, 25.883], // Botswana (Example coords)
zoom: 16
});
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© OpenStreetMap contributors'
}).addTo(map);
// Dynamic contact details
var contactNumber = '+267 390 82 42';
var contactEmail = 'enquiries@medronix.co.bw';
var contactEmail1 = 'support@medronix.co.bw';
var locationAddress = 'Plot 52, Unit 2, Gaborone International Commerce Park';
var googleMapsUrl = `https://www.google.com/maps?q=-24.692,25.883`;
var popupContent = `
`;
var marker = L.marker([-24.692, 25.883]).addTo(map);
marker.bindPopup(popupContent).openPopup();
map.on('popupopen', function (e) {
var px = map.project(e.popup._latlng);
px.y -= map.getSize().y / 1; // Adjusted to ensure the popup is fully visible
map.panTo(map.unproject(px), { animate: true });
});
