diff --git a/UI/BigComponents/ActionButtons.ts b/UI/BigComponents/ActionButtons.ts index 0b3a6eeb7..cb492a80b 100644 --- a/UI/BigComponents/ActionButtons.ts +++ b/UI/BigComponents/ActionButtons.ts @@ -1,6 +1,6 @@ import Combine from "../Base/Combine" import LayoutConfig from "../../Models/ThemeConfig/LayoutConfig" -import { Store, UIEventSource } from "../../Logic/UIEventSource" +import { Store } from "../../Logic/UIEventSource" import { BBox } from "../../Logic/BBox" import Loc from "../../Models/Loc" import { OsmConnection } from "../../Logic/Osm/OsmConnection" @@ -11,6 +11,28 @@ import { Utils } from "../../Utils" import { MapillaryLink } from "./MapillaryLink" import TranslatorsPanel from "./TranslatorsPanel" import { OpenIdEditor, OpenJosm } from "./CopyrightPanel" +import Toggle from "../Input/Toggle" + +export class BackToThemeOverview extends Toggle { + constructor( + state: { + readonly featureSwitchMoreQuests: Store + }, + options: { + imgSize: string + } + ) { + const t = Translations.t.general + const button = new SubtleButton(Svg.add_ui(), t.backToIndex, options).onClick(() => { + const path = window.location.href.split("/") + path.pop() + path.push("index.html") + window.location.href = path.join("/") + }) + + super(button, undefined, state.featureSwitchMoreQuests) + } +} export class ActionButtons extends Combine { constructor(state: { @@ -19,12 +41,15 @@ export class ActionButtons extends Combine { readonly locationControl: Store readonly osmConnection: OsmConnection readonly isTranslator: Store + readonly featureSwitchMoreQuests: Store }) { const imgSize = "h-6 w-6" const iconStyle = "height: 1.5rem; width: 1.5rem" const t = Translations.t.general.attribution super([ + new BackToThemeOverview(state, { imgSize }), + new SubtleButton(Svg.liberapay_ui(), t.donate, { url: "https://liberapay.com/pietervdvn/", newTab: true, diff --git a/UI/BigComponents/FilterView.ts b/UI/BigComponents/FilterView.ts index eb0abc278..aa4f138f7 100644 --- a/UI/BigComponents/FilterView.ts +++ b/UI/BigComponents/FilterView.ts @@ -22,16 +22,18 @@ import { DropDown } from "../Input/DropDown" import { FixedUiElement } from "../Base/FixedUiElement" import BaseLayer from "../../Models/BaseLayer" import Loc from "../../Models/Loc" +import { BackToThemeOverview } from "./ActionButtons" export default class FilterView extends VariableUiElement { constructor( filteredLayer: Store, tileLayers: { config: TilesourceConfig; isDisplayed: UIEventSource }[], state: { - availableBackgroundLayers?: Store - featureSwitchBackgroundSelection?: UIEventSource - featureSwitchIsDebugging?: UIEventSource - locationControl?: UIEventSource + readonly availableBackgroundLayers?: Store + readonly featureSwitchBackgroundSelection?: UIEventSource + readonly featureSwitchIsDebugging?: UIEventSource + readonly locationControl?: UIEventSource + readonly featureSwitchMoreQuests: Store } ) { const backgroundSelector = new Toggle( @@ -53,8 +55,12 @@ export default class FilterView extends VariableUiElement { elements = elements.concat( tileLayers.map((tl) => FilterView.createOverlayToggle(state, tl)) ) - // ... and add the dropdown to select a different background - return elements.concat(backgroundSelector) + + elements.push( + backgroundSelector, + new BackToThemeOverview(state, { imgSize: "h-6 w-6" }).SetClass("block mt-12") + ) + return elements }) ) } diff --git a/UI/BigComponents/ThemeIntroductionPanel.ts b/UI/BigComponents/ThemeIntroductionPanel.ts index b6817917a..319a3cc42 100644 --- a/UI/BigComponents/ThemeIntroductionPanel.ts +++ b/UI/BigComponents/ThemeIntroductionPanel.ts @@ -83,20 +83,6 @@ export default class ThemeIntroductionPanel extends Combine { layout.descriptionTail?.Clone().SetClass("block mt-4"), languagePicker?.SetClass("block mt-4 pb-8 border-b-2 border-dotted border-gray-400"), - - Toggle.If(state.featureSwitchMoreQuests, () => - new Combine([ - t.welcomeExplanation.browseOtherThemesIntro, - new SubtleButton( - Svg.add_ui().SetClass("h-6"), - t.welcomeExplanation.browseMoreMaps - ) - .onClick(() => - currentTab.setData(FullWelcomePaneWithTabs.MoreThemesTabIndex) - ) - .SetClass("h-12"), - ]).SetClass("flex flex-col mt-6") - ), new ActionButtons(state), ...layout.CustomCodeSnippets(), diff --git a/css/index-tailwind-output.css b/css/index-tailwind-output.css index 2364dd85d..bd41185db 100644 --- a/css/index-tailwind-output.css +++ b/css/index-tailwind-output.css @@ -844,6 +844,10 @@ video { margin-bottom: 0.5rem; } +.mt-12 { + margin-top: 3rem; +} + .ml-2 { margin-left: 0.5rem; } @@ -2501,22 +2505,6 @@ input { /* The checkbox that toggles a single layer */ } -.layer-filters { - /* If needed, the panel which contains the extra filters for a layer */ - margin-bottom: 1rem; - border-bottom: 2px solid var(--foreground-color); -} - -.filter-panel { - /* The panel for a single layer, containing both the toggle and the filters (if any) */ - border-bottom: 2px solid lightgrey; - margin-bottom: 0.5rem; -} - -.first-filter-panel { - /* Additional class on the first layer filter */ -} - .mapping-icon-small-height { /* A mapping icon type */ height: 1.5rem; diff --git a/index.css b/index.css index 2b5e5df62..234fcf37b 100644 --- a/index.css +++ b/index.css @@ -637,21 +637,7 @@ input { /* The checkbox that toggles a single layer */ } -.layer-filters { - /* If needed, the panel which contains the extra filters for a layer */ - margin-bottom: 1rem; - border-bottom: 2px solid var(--foreground-color); -} -.filter-panel { - /* The panel for a single layer, containing both the toggle and the filters (if any) */ - border-bottom: 2px solid lightgrey; - margin-bottom: 0.5rem; -} - -.first-filter-panel { - /* Additional class on the first layer filter */ -} .mapping-icon-small-height { /* A mapping icon type */ diff --git a/langs/da.json b/langs/da.json index fd9d96885..37bb0ed6a 100644 --- a/langs/da.json +++ b/langs/da.json @@ -252,8 +252,6 @@ "welcomeBack": "Du er logget ind, velkommen tilbage!", "welcomeExplanation": { "addNew": "Klik på kortet for at tilføje et nyt POI.", - "browseMoreMaps": "Se flere kort", - "browseOtherThemesIntro": "Forskellige tematiske kort findes på MapComplete", "general": "På dette kort kan du se, redigere og tilføje interessepunkter. Zoom rundt for at se POI'et, tryk på et for at se eller redigere oplysningerne. Alle data er hentet fra og gemt i OpenStreetMap, som frit kan genbruges." }, "wikipedia": { diff --git a/langs/de.json b/langs/de.json index 9a2d5e6c7..34bee40c6 100644 --- a/langs/de.json +++ b/langs/de.json @@ -330,8 +330,6 @@ "welcomeBack": "Willkommen zurück!", "welcomeExplanation": { "addNew": "Tippen oden klicken Sie auf die Karte, um einen neuen Ort hinzuzufügen.", - "browseMoreMaps": "Weitere Karten entdecken", - "browseOtherThemesIntro": "Auf MapComplete gibt es verschiedene thematische Karten", "general": "Auf dieser Karte können Sie Interessante Orte sehen, bearbeiten und hinzufügen. Verschieben Sie den Kartenausschnitt, um die Orte zu entdecken, tippen Sie auf einen, um weitere Informationen zu sehen oder zu bearbeiten. Alle Daten stammen von OpenStreetMap und sind dort gespeichert, so dass sie frei weiterverwendet werden können." }, "wikipedia": { diff --git a/langs/en.json b/langs/en.json index ed329fe08..e0c75a721 100644 --- a/langs/en.json +++ b/langs/en.json @@ -141,6 +141,7 @@ "translatedBy": "MapComplete has been translated by {contributors} and {hiddenCount} more contributors" }, "back": "Back", + "backToIndex": "Go back to the overview with all thematic maps", "backToMapcomplete": "Back to the theme overview", "backgroundMap": "Background map", "cancel": "Cancel", @@ -334,8 +335,6 @@ "welcomeBack": "Welcome back!", "welcomeExplanation": { "addNew": "Tap the map to add a new POI.", - "browseMoreMaps": "Discover more maps", - "browseOtherThemesIntro": "Various thematic maps exist on MapComplete", "general": "On this map, you can see, edit and add points of interest. Zoom around to see the POI, tap one to see or edit the information. All data is sourced from and saved to OpenStreetMap, which can be freely reused." }, "wikipedia": { diff --git a/langs/fr.json b/langs/fr.json index 1ee7e7073..3b4d55cf6 100644 --- a/langs/fr.json +++ b/langs/fr.json @@ -277,8 +277,6 @@ "welcomeBack": "Vous êtes connecté. Bienvenue !", "welcomeExplanation": { "addNew": "Cliquez sur la carte pour ajouter un nouveau POI.", - "browseMoreMaps": "Découvrez d’autres cartes", - "browseOtherThemesIntro": "De nombreuses cartes thématiques existent sur MapComplete", "general": "Cette carte permet de visualiser et ajouter des points d’intérêt. Zoomez sur un POI et cliquez dessus pour en voir les détails ou les modifier. Les données proviennent et sont transmises avec OpenStreetMap, qui peut être librement réutilisé." }, "wikipedia": { diff --git a/langs/it.json b/langs/it.json index f8d626539..218e9e22f 100644 --- a/langs/it.json +++ b/langs/it.json @@ -253,8 +253,6 @@ "welcomeBack": "Hai effettuato l’accesso. Bentornato/a!", "welcomeExplanation": { "addNew": "Tocca la mappa per aggiungere un nuovo punto di interesse.", - "browseMoreMaps": "Scopri ulteriori mappe", - "browseOtherThemesIntro": "In MapComplete esistono diverse mappe tematiche", "general": "Su questa mappa puoi vedere, modificare ed aggiungere punti di interesse. Esplora per trovare il punto di interesse, toccane uno per vedere o modificarne le informazioni. Tutti i dati sono raccolti e salvati su OpenStreetMap, e potranno essere riutilizzati liberamente." }, "wikipedia": { diff --git a/langs/nl.json b/langs/nl.json index d4f254025..0979e1f08 100644 --- a/langs/nl.json +++ b/langs/nl.json @@ -330,8 +330,6 @@ "welcomeBack": "Je bent aangemeld. Welkom terug!", "welcomeExplanation": { "addNew": "Klik op de kaart om een nieuw punt toe te voegen.", - "browseMoreMaps": "Ontdek meer kaarten", - "browseOtherThemesIntro": "Er zijn diverse thematische kaarten op MapComplete", "general": "Op deze kaart kan je interessepunten bekijken, bewerken en toevoegen. Zoom in om de interessepunten te zien, duid eentje aan om alle informatie te zien en te bewerken. Alle informatie komt van OpenStreetMap die gratis hergebruikt mag worden." }, "wikipedia": { diff --git a/langs/pt.json b/langs/pt.json index e8ecce751..b1126d683 100644 --- a/langs/pt.json +++ b/langs/pt.json @@ -253,8 +253,6 @@ "welcomeBack": "Iniciou a sessão, bem-vindo de volta!", "welcomeExplanation": { "addNew": "Toque no mapa para adicionar um novo POI.", - "browseMoreMaps": "Descobrir mais mapas", - "browseOtherThemesIntro": "Existem vários mapas temáticos no MapComplete", "general": "Neste mapa, pode ver, editar e adicionar pontos de interesse. Aproxime a visualização para ver o POI, toque num para ver ou editar a informação. Todos os dados são obtidos e guardados no OpenStreetMap, que pode ser livremente reutilizado." }, "wikipedia": { diff --git a/langs/zh_Hant.json b/langs/zh_Hant.json index 5e5b4bf43..7e5ad6cc7 100644 --- a/langs/zh_Hant.json +++ b/langs/zh_Hant.json @@ -259,8 +259,6 @@ "welcomeBack": "你已經登入了,歡迎回來!", "welcomeExplanation": { "addNew": "點一下地圖來新增新興趣點。", - "browseMoreMaps": "探索更多地圖", - "browseOtherThemesIntro": "MapComplete 上有相當多樣的主題地圖", "general": "在這份地圖,你可以檢視、編輯與新增興趣點。在附近放大來檢視興趣點,點一個來檢視或是編輯資訊。所有資料來源以及儲存到開放街圖,能夠自由被再利用。" }, "wikipedia": {