KeyArgo
/
csms-claims-and-neighbors
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Revert to previous layout, add legend and update buttons

This commit is contained in:
Daniel LaForce 2024-08-07 16:21:06 -06:00
parent 921f2c77df
commit 064e53d1f9
1 changed files with 10 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
index.html
View File

@ -33,6 +33,7 @@
align-items: center; align-items: center;
flex: 1; flex: 1;
padding: 20px; padding: 20px;
position: relative;
} }
iframe { iframe {
width: 960px; /* 800px + 20% */ width: 960px; /* 800px + 20% */
@ -42,13 +43,16 @@
box-shadow: 0 4px 8px rgba(0,0,0,0.1); box-shadow: 0 4px 8px rgba(0,0,0,0.1);
} }
.legend { .legend {
width: 960px; width: 200px;
margin-bottom: 20px; margin-bottom: 20px;
text-align: left; text-align: left;
padding: 10px; padding: 10px;
background-color: #fff; background-color: #fff;
border: 1px solid #ccc; border: 1px solid #ccc;
box-shadow: 0 4px 8px rgba(0,0,0,0.1); box-shadow: 0 4px 8px rgba(0,0,0,0.1);
position: absolute;
top: 20px;
right: 20px;
} }
.legend h3 { .legend h3 {
margin-top: 0; margin-top: 0;
@ -73,7 +77,7 @@
text-align: center; text-align: center;
margin: 20px 0; margin: 20px 0;
} }
.buttons button { .buttons a {
padding: 10px 20px; padding: 10px 20px;
margin: 0 10px; margin: 0 10px;
font-size: 16px; font-size: 16px;
@ -82,9 +86,10 @@
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 button:hover { .buttons a:hover {
background-color: #3498db; background-color: #3498db;
} }
.footer { .footer {
@ -123,8 +128,8 @@
</div> </div>
</div> </div>
<div class="buttons"> <div class="buttons">
<a href="https://rebrand.ly/csmsgoogle" target="_blank" class="button">View on Google Maps</a> <a href="https://rebrand.ly/csmsgoogle" target="_blank">View on Google Maps</a>
<a href="https://rebrand.ly/csmsgaia" target="_blank" class="button">View on Gaia GPS</a> <a href="https://rebrand.ly/csmsgaia" target="_blank">View on Gaia GPS</a>
</div> </div>
<div class="footer"> <div class="footer">
<p>&copy; 2024 Daniel LaForce. All rights reserved.</p> <p>&copy; 2024 Daniel LaForce. All rights reserved.</p>