<my-map
  lat="53.0927188976536"
  long="-4.100231207663924"
  zoom="13"
  geojson=
  "https://nfreear.github.io/elements/demo/data/llanberis-path.geo.json"
  tile-url=
  "https://tile.thunderforest.com/cycle/{z}/{x}/{y}.png?apikey={apikey}"
  api-key="3d10f1bf1b9847069090c03a4bbc4f82"
  attribution="© {TF}, © {OSM} contributors."
>
  <h1> Llanberis path up <i lang="cy">Yr Wyddfa</i> </h1>
  <details>
    <summary>Details</summary
    
  <p> A map of the popular route up to the summit of  <i lang="cy">Yr Wyddfa</i> (Snowdon) from Llanberis, in the Snowdonia National Park, Wales. See <a href="https://mudandroutes.com/routes/llanberis-path-up-snowdon/">Mud & Routes</a>. </p>
  <ul>
    <li>  Distance: 7.41 km
    <li>  Ascent:  945 m
    <li>  Time:  3.5 hours
  </ul>
  
  <p> Powered by <code>&lt;my-map></code> and <a href="https://leafletjs.com/">Leaflet.js</a>.</p>
  </details>

  <my-fork-me href="https://github.com/nfreear/elements">Fork My Elements</my-fork-me>
</my-map>


<my-options template-host="ghp"></my-options>

h1,
details {
  margin: .5rem 0;
}
details {
  line-height: 1.5;
}

:root {
  --my-map-path-color: darkorange;
}

import customImport from 'https://nfreear.github.io/elements/custom.js';

await customImport([ 'my-map', 'my-fork-me' ]);

// End.