From 86c1c44512c90a37e8469897faace2e61873a201 Mon Sep 17 00:00:00 2001 From: Pieter Vander Vennet Date: Sun, 16 Jun 2024 16:27:58 +0200 Subject: [PATCH] UX: Add link to github, improve home page (nlnet feedback) --- assets/svg/github.svg | 40 +++++++ assets/svg/github.svg.license | 2 + langs/en.json | 3 + src/UI/AllThemesGui.svelte | 195 ++++++++++++++++++++-------------- src/UI/ThemeViewGUI.svelte | 7 ++ src/assets/svg/Github.svelte | 4 + 6 files changed, 173 insertions(+), 78 deletions(-) create mode 100644 assets/svg/github.svg create mode 100644 assets/svg/github.svg.license create mode 100644 src/assets/svg/Github.svelte diff --git a/assets/svg/github.svg b/assets/svg/github.svg new file mode 100644 index 000000000..0f73d6d0a --- /dev/null +++ b/assets/svg/github.svg @@ -0,0 +1,40 @@ + + + + + + diff --git a/assets/svg/github.svg.license b/assets/svg/github.svg.license new file mode 100644 index 000000000..8299fe686 --- /dev/null +++ b/assets/svg/github.svg.license @@ -0,0 +1,2 @@ +SPDX-FileCopyrightText: Github +SPDX-License-Identifier: LicenseRef-LOGO \ No newline at end of file diff --git a/langs/en.json b/langs/en.json index dbb60ebc7..d2a06512c 100644 --- a/langs/en.json +++ b/langs/en.json @@ -185,6 +185,7 @@ "editId": "Open the OpenStreetMap online editor here", "editJosm": "Edit here with JOSM", "followOnMastodon": "Follow MapComplete on Mastodon", + "gotoSourceCode": "View the source code", "iconAttribution": { "title": "Used icons" }, @@ -592,8 +593,10 @@ }, "index": { "#": "These texts are shown above the theme buttons when no theme is loaded", + "about": "About MapComplete", "featuredThemeTitle": "Featured this week", "intro": "MapComplete is an OpenStreetMap-viewer and editor, which shows you information about features of a specific theme and allows to update it.", + "learnMore": "Learn more", "logIn": "Log in to see other themes you previously visited", "pickTheme": "Pick a theme below to get started.", "title": "Welcome to MapComplete" diff --git a/src/UI/AllThemesGui.svelte b/src/UI/AllThemesGui.svelte index b14c80e81..2d48c56a0 100644 --- a/src/UI/AllThemesGui.svelte +++ b/src/UI/AllThemesGui.svelte @@ -10,7 +10,6 @@ import MoreScreen from "./BigComponents/MoreScreen" import LoginToggle from "./Base/LoginToggle.svelte" import Pencil from "../assets/svg/Pencil.svelte" - import Login from "../assets/svg/Login.svelte" import Constants from "../Models/Constants" import { Store, UIEventSource } from "../Logic/UIEventSource" import { placeholder } from "../Utils/placeholder" @@ -20,6 +19,12 @@ import * as themeOverview from "../assets/generated/theme_overview.json" import UnofficialThemeList from "./BigComponents/UnofficialThemeList.svelte" import Eye from "../assets/svg/Eye.svelte" + import LoginButton from "./Base/LoginButton.svelte" + import ChevronDoubleRight from "@babeard/svelte-heroicons/mini/ChevronDoubleRight" + import Mastodon from "../assets/svg/Mastodon.svelte" + import Liberapay from "../assets/svg/Liberapay.svelte" + import Bug from "../assets/svg/Bug.svelte" + import Github from "../assets/svg/Github.svelte" const featureSwitches = new OsmConnectionFeatureSwitches() const osmConnection = new OsmConnection({ @@ -28,7 +33,7 @@ "oauth_token", undefined, "Used to complete the login" - ), + ) }) const state = new UserRelatedState(osmConnection) const t = Translations.t.index @@ -37,7 +42,7 @@ let userLanguages = osmConnection.userDetails.map((ud) => ud.languages) let themeSearchText: UIEventSource = new UIEventSource(undefined) - document.addEventListener("keydown", function (event) { + document.addEventListener("keydown", function(event) { if (event.ctrlKey && event.code === "KeyF") { document.getElementById("theme-search")?.focus() event.preventDefault() @@ -66,84 +71,116 @@
-
- +
+ -
-
- -
+
+
+ +
-
-

- -

- -
-
- -
MoreScreen.applySearch(themeSearchText.data)} - > - -
- - - - - - -

- -

+
+

+ +

+ + + + + + +

+
+
+ +
MoreScreen.applySearch(themeSearchText.data)} + > + +
+ + + + + + +

+ +

+

+ -

- - + /> +

+ + + + + + + + +

+ +

+ + + + + + + + + + + + + + + + + + + + + + - -
- -
@@ -151,19 +188,21 @@ - + - - -
- v{Constants.vNumber} + + + + +
+ v{Constants.vNumber} +
-
diff --git a/src/UI/ThemeViewGUI.svelte b/src/UI/ThemeViewGUI.svelte index 69f92f7ee..692a3c66f 100644 --- a/src/UI/ThemeViewGUI.svelte +++ b/src/UI/ThemeViewGUI.svelte @@ -75,6 +75,7 @@ import ExtraLinkButton from "./BigComponents/ExtraLinkButton.svelte" import CloseAnimation from "./Base/CloseAnimation.svelte" import { LastClickFeatureSource } from "../Logic/FeatureSource/Sources/LastClickFeatureSource" + import Github from "../assets/svg/Github.svelte" export let state: ThemeViewState let layout = state.layout @@ -567,6 +568,12 @@ + + + + + + diff --git a/src/assets/svg/Github.svelte b/src/assets/svg/Github.svelte new file mode 100644 index 000000000..0d9750727 --- /dev/null +++ b/src/assets/svg/Github.svelte @@ -0,0 +1,4 @@ + + \ No newline at end of file