Update index.html with preview map and legend

This commit is contained in:
Daniel LaForce 2024-08-07 16:51:53 -06:00
parent 78dcbbc2fb
commit 3595d9ec44
1 changed files with 6 additions and 33 deletions

View File

@ -3,13 +3,16 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CSMS Claims and Neighbors</title> <title>CSMS Claims and Neighbors - Preview</title>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
<style> <style>
body { body {
font-family: 'Roboto', sans-serif; font-family: 'Roboto', sans-serif;
margin: 0; margin: 0;
padding: 0; padding: 0;
display: flex;
flex-direction: column;
align-items: center;
background-color: #f4f4f4; background-color: #f4f4f4;
color: #333; color: #333;
} }
@ -23,22 +26,6 @@
top: 0; top: 0;
z-index: 1000; z-index: 1000;
} }
.navbar {
display: flex;
justify-content: center;
background-color: #2c3e50;
padding: 10px 0;
}
.navbar a {
color: white;
padding: 14px 20px;
text-decoration: none;
text-align: center;
}
.navbar a:hover {
background-color: #2980b9;
border-radius: 5px;
}
.map-container { .map-container {
width: 100%; width: 100%;
display: flex; display: flex;
@ -86,7 +73,7 @@
text-align: center; text-align: center;
margin: 20px 0; margin: 20px 0;
} }
.buttons a { .buttons button {
padding: 10px 20px; padding: 10px 20px;
margin: 0 10px; margin: 0 10px;
font-size: 16px; font-size: 16px;
@ -95,10 +82,9 @@
color: white; color: white;
border: none; border: none;
border-radius: 5px; border-radius: 5px;
text-decoration: none;
transition: background-color 0.3s ease; transition: background-color 0.3s ease;
} }
.buttons a:hover { .buttons button:hover {
background-color: #3498db; background-color: #3498db;
} }
.footer { .footer {
@ -114,24 +100,11 @@
margin-left: 5px; margin-left: 5px;
} }
</style> </style>
<script async src="https://www.googletagmanager.com/gtag/js?id=G-CC1B9CQ691"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-CC1B9CQ691');
</script>
</head> </head>
<body> <body>
<div class="header"> <div class="header">
<h1>CSMS Claims and Neighbors</h1> <h1>CSMS Claims and Neighbors</h1>
</div> </div>
<div class="navbar">
<a href="#home">Home</a>
<a href="#claims">Claims</a>
<a href="#events">Events</a>
<a href="#contact">Contact</a>
</div>
<div class="map-container"> <div class="map-container">
<iframe src="https://www.google.com/maps/d/embed?mid=1CH09O8Gp7sQ6H2GdybFvRdLB-1vElVc&ehbc=2E312F"></iframe> <iframe src="https://www.google.com/maps/d/embed?mid=1CH09O8Gp7sQ6H2GdybFvRdLB-1vElVc&ehbc=2E312F"></iframe>
<iframe src="https://www.gaiagps.com/public/VVXcZPvEfvAbvRWi5F0DQPNT/?embed=True"></iframe> <iframe src="https://www.gaiagps.com/public/VVXcZPvEfvAbvRWi5F0DQPNT/?embed=True"></iframe>