| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8"> |
| <title>LeRobot Worldwide Hackathon Map</title> |
| <link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" /> |
| <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;700&display=swap" rel="stylesheet"> |
| <link href="https://fonts.googleapis.com/css2?family=Source+Code+Pro:wght@400;700&display=swap" rel="stylesheet"> |
| <style> |
| body { |
| margin: 0; |
| } |
| |
| #map { |
| height: 100vh; |
| width: 100%; |
| font-family: 'IBM Plex Mono', monospace; |
| } |
| |
| #title_map{ |
| text-align:center; |
| font-family: 'Source Code Pro', monospace !important; |
| font-weight: 700; |
| font-size: 16px; |
| padding: 2rem 2rem 0.5rem 2rem; |
| } |
| |
| #description_map{ |
| text-align:center; |
| font-family: 'IBM Plex Mono', monospace; |
| font-size: 14px; |
| padding: 0 2rem 2rem 2rem; |
| } |
| |
| #event-info { |
| position: absolute; |
| top: 20px; |
| left: 20px; |
| z-index: 999; |
| font-family: 'IBM Plex Mono', monospace; |
| color: #000; |
| font-size: 0.7vw; |
| letter-spacing: 1px; |
| text-align: left; |
| padding: 8px 12px; |
| border-radius: 6px; |
| max-width: 40vw; |
| } |
| |
| @media (max-width: 600px) { |
| #event-info { |
| position: static; |
| font-size: 3.5vw; |
| max-width: 90vw; |
| margin: 0 auto; |
| color: #000; |
| text-align: center; |
| margin-top: 1rem; |
| } |
| } |
| |
| |
| |
| p { |
| color: rgb(107, 114, 128); |
| font-size: 15px; |
| margin-bottom: 10px; |
| margin-top: 5px; |
| } |
| |
| .card { |
| max-width: 620px; |
| margin: 0 auto; |
| padding: 16px; |
| border: 1px solid lightgray; |
| border-radius: 16px; |
| } |
| |
| .card p:last-child { |
| margin-bottom: 0; |
| } |
| </style> |
| </head> |
| <body> |
| <div id="title_map"> π Let's build this event together and share our passion worldwide! π <br> |
| </div> |
| <div id="description_map"> Host a Local Hackathon: Register <a rel="nofollow" href="https://forms.gle/fYQteWn2R2DGBSUy5" target="_blank">here</a></div> |
| <div id="event-info"> |
| Start: Saturday 14 June 2025 at 09:00 local time<br> |
| End: Sunday 15 June 2025 at 06:00 PM local time |
| </div> |
| <div id="map"></div> |
| <script src="https://unpkg.com/leaflet/dist/leaflet.js"></script> |
| <script src="script.js"></script> |
| </body> |
| </html> |
|
|