Move various tabs into buttons, more work on a11y

This commit is contained in:
Pieter Vander Vennet 2023-12-20 02:49:34 +01:00
parent 58fa9a4cd4
commit cce9b879f2
5 changed files with 105 additions and 25 deletions

46
privacy.html Normal file
View file

@ -0,0 +1,46 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' https://gc.zgo.at/; img-src *; connect-src 'self' https://www.openstreetmap.org/ https://api.openstreetmap.org/ https://pietervdvn.goatcounter.com/;">
<link href="./css/mobile.css" rel="stylesheet"/>
<link href="./css/openinghourstable.css" rel="stylesheet"/>
<link href="./css/tagrendering.css" rel="stylesheet"/>
<link href="css/ReviewElement.css" rel="stylesheet"/>
<link href="./css/index-tailwind-output.css" rel="stylesheet"/>
<link href="./css/wikipedia.css" rel="stylesheet"/>
<meta content="website" property="og:type">
<title>MapComplete privacy policy</title>
<link href="./assets/svg/add.svg" rel="icon" sizes="any" type="image/svg+xml">
<meta content="./assets/SocialImage.png" property="og:image">
<meta content="MapComplete - editable, thematic maps with OpenStreetMap" property="og:title">
<meta content="MapComplete is a platform to visualize OpenStreetMap on a specific topic and to easily contribute data back to it."
property="og:description">
<link href="./assets/generated/images/assets_svg_mapcomplete_logo512.png" rel="apple-touch-icon" sizes="512x512">
<link href="./assets/generated/images/assets_svg_mapcomplete_logo384.png" rel="apple-touch-icon" sizes="384x384">
<link href="./assets/generated/images/assets_svg_mapcomplete_logo192.png" rel="apple-touch-icon" sizes="192x192">
<link href="./assets/generated/images/assets_svg_mapcomplete_logo180.png" rel="apple-touch-icon" sizes="180x180">
<link href="./assets/generated/images/assets_svg_mapcomplete_logo152.png" rel="apple-touch-icon" sizes="152x152">
<link href="./assets/generated/images/assets_svg_mapcomplete_logo144.png" rel="apple-touch-icon" sizes="144x144">
<link href="./assets/generated/images/assets_svg_mapcomplete_logo128.png" rel="apple-touch-icon" sizes="128x128">
<link href="./assets/generated/images/assets_svg_mapcomplete_logo120.png" rel="apple-touch-icon" sizes="120x120">
<link href="./assets/generated/images/assets_svg_mapcomplete_logo96.png" rel="apple-touch-icon" sizes="96x96">
<link href="./assets/generated/images/assets_svg_mapcomplete_logo72.png" rel="apple-touch-icon" sizes="72x72">
</head>
<body>
<div id="main"></div>
<script type="module" src="./src/privacy_index.ts"></script>
<script async data-goatcounter="https://pietervdvn.goatcounter.com/count" src="https://gc.zgo.at/count.js" crossorigin="anonymous"
integrity="sha384-gtO6vSydQeOAGGK19NHrlVLNtaDSJjN4aGMWschK+dwAZOdPQWbjXgL+FM5XsgFJ"></script>
</body>
</html>

View file

@ -0,0 +1,34 @@
<script lang="ts">
import Tr from "../Base/Tr.svelte"
import Translations from "../i18n/Translations"
const t = Translations.t.privacy
</script>
<div class="link-underline flex flex-col">
<Tr t={t.intro} />
<h3>
<Tr t={t.trackingTitle} />
</h3>
<Tr t={t.tracking} />
<h3>
<Tr t={t.geodataTitle} />
</h3>
<Tr t={t.geodataTitle} />
<h3>
<Tr t={t.editingTitle} />
</h3>
<Tr t={t.editing} />
<h3>
<Tr t={t.miscCookiesTitle} />
</h3>
<Tr t={t.miscCookies} />
<h3>
<Tr t={t.whileYoureHere} />
</h3>
<Tr t={t.surveillance} />
</div>

View file

@ -1,25 +0,0 @@
import Combine from "../Base/Combine"
import Translations from "../i18n/Translations"
import Title from "../Base/Title"
export default class PrivacyPolicy extends Combine {
constructor() {
const t = Translations.t.privacy
super([
new Title(t.title, 2),
t.intro,
new Title(t.trackingTitle),
t.tracking,
new Title(t.geodataTitle),
t.geodata,
new Title(t.editingTitle),
t.editing,
new Title(t.miscCookiesTitle),
t.miscCookies,
new Title(t.whileYoureHere),
t.surveillance,
])
this.SetClass("link-underline")
}
}

22
src/UI/PrivacyGui.svelte Normal file
View file

@ -0,0 +1,22 @@
<script lang="ts">
import PrivacyPolicy from "./BigComponents/PrivacyPolicy.svelte"
import Tr from "./Base/Tr.svelte"
import { EyeIcon } from "@rgossiaux/svelte-heroicons/solid"
import Translations from "./i18n/Translations"
import { Utils } from "../Utils"
import Add from "../assets/svg/Add.svelte"
</script>
<div class="flex flex-col p-4 h-screen overflow-hidden">
<h2 class="flex items-center">
<EyeIcon class="w-6 pr-2" />
<Tr t={Translations.t.privacy.title} />
</h2>
<div class="overflow-auto h-full border border-gray-500 p-4">
<PrivacyPolicy />
</div>
<a class="flex button" href={Utils.HomepageLink()}>
<Add class="h-6 w-6" />
<Tr t={Translations.t.general.backToIndex} />
</a>
</div>

3
src/privacy_index.ts Normal file
View file

@ -0,0 +1,3 @@
import SvelteUIElement from "./UI/Base/SvelteUIElement"
import PrivacyGui from "./UI/PrivacyGui.svelte"
new SvelteUIElement(PrivacyGui, {}).AttachTo("main")