sysadmin/openfreemap
1
0
Fork 0
mirror of https://github.com/hyperknot/openfreemap.git synced 2026-05-22 06:22:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

astro

Browse Source
This commit is contained in:
Zsolt Ero
2024-06-12 16:29:10 +02:00
parent 61111872d9
commit 2cad287c09
4 changed files with 23 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
website_astro/src/components/Logo.astro Normal file
View File

@@ -0,0 +1,12 @@
---
---
<img src="/logo.jpg" alt="logo" height="200" class="logo" />
<h1>OpenFreeMap</h1>
<div class="icons">
<a href="https://github.com/hyperknot/openfreemap" target="_blank"
><img src="/github.svg" alt="github" height="28" /></a
>
<a href="https://x.com/hyperknot" target="_blank"><img src="/x.svg" alt="x" height="28" /></a>
</div>

11
website_astro/src/components/Map.astro
View File

@@ -2,9 +2,6 @@
--- ---
<p>Use the following style in a MapLibre map:</p>
<pre><code id="style-url-code">https://tiles.openfreemap.org/styles/liberty</code></pre>
<h2>How can I use it?</h2> <h2>How can I use it?</h2>
<!--<p>(Click below, it's interactive!)</p>--> <!--<p>(Click below, it's interactive!)</p>-->
@@ -25,8 +22,12 @@
<button data-style="liberty-3d" class="btn">3D</button> <button data-style="liberty-3d" class="btn">3D</button>
</div> </div>
<p>You use OpenFreeMap by adding it to a website or mobile app.</p> <p>
<p><a href="#">How to use in detail</a></p> Have a look at the default styles and read more about how to integrate it to your website or app
here:
</p>
<p><a href="#">How to use OpenFreeMap</a></p>
<script is:inline src="https://unpkg.com/maplibre-gl/dist/maplibre-gl.js"></script> <script is:inline src="https://unpkg.com/maplibre-gl/dist/maplibre-gl.js"></script>
<script is:inline src="/scripts/map.js"></script> <script is:inline src="/scripts/map.js"></script>

3
website_astro/src/pages/_howto_use.astro
View File

@@ -1,3 +1,6 @@
<h1>How to use OpenFreeMap in my website or app</h1>
<input type="checkbox" id="col1" class="col-chk" /> <input type="checkbox" id="col1" class="col-chk" />
<label for="col1" class="col-lbl">How to load MapLibre?</label> <label for="col1" class="col-lbl">How to load MapLibre?</label>
<div class="col-cnt"> <div class="col-cnt">

11
website_astro/src/pages/index.astro
View File

@@ -1,6 +1,7 @@
--- ---
import Layout from '../layouts/Layout.astro' import Layout from '../layouts/Layout.astro'
import Map from '../components/Map.astro' import Map from '../components/Map.astro'
import Logo from '../components/Logo.astro'
import { Content as WhatIs } from '../content/index/whatis.md' import { Content as WhatIs } from '../content/index/whatis.md'
import { Content as Pricing } from '../content/index/pricing.md' import { Content as Pricing } from '../content/index/pricing.md'
@@ -8,15 +9,7 @@ import { Content as Rest } from '../content/index/rest.md'
--- ---
<Layout title="OpenFreeMap"> <Layout title="OpenFreeMap">
<img src="/logo.jpg" alt="logo" height="200" class="logo" /> <Logo />
<h1>OpenFreeMap</h1>
<div class="icons">
<a href="https://github.com/hyperknot/openfreemap" target="_blank"
><img src="/github.svg" alt="github" height="28" /></a
>
<a href="https://x.com/hyperknot" target="_blank"><img src="/x.svg" alt="x" height="28" /></a>
</div>
<WhatIs /> <WhatIs />
<Map /> <Map />