ilja_space/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Use '_svg' instead of '_ui' from the bundled svg classes

Browse source
This commit is contained in:
Pieter Vander Vennet 2023-05-08 01:55:21 +02:00
parent 484906f08e
commit fa861bed5c
26 changed files with 116 additions and 95 deletions
Download patch file Download diff file Expand all files Collapse all files

12
UI/Base/TabbedGroup.svelte
View file

@ -19,7 +19,7 @@
<div class="tabbedgroup w-full h-full">
<TabGroup class="h-full w-full flex flex-col" defaultIndex={1}
on:change={(e) =>{if(e.detail >= 0){tab.setData( e.detail); }} }>
<div class="flex bg-gray-300 items-center justify-between sticky top-0">
<div class="tablist flex bg-gray-300 items-center justify-between sticky top-0">
<TabList class="flex flex-wrap">
{#if $$slots.title1}
<Tab class={({selected}) => "tab "+(selected ? "tab-selected" : "tab-unselected")}>
@ -90,7 +90,7 @@
max-height: 100vh;
height: 100%;
}
:global(.tab) {
margin: 0.25rem;
padding: 0.25rem;
@ -111,8 +111,12 @@
}
:global(.tab-selected) {
background-color: rgb(59 130 246);
color: rgb(255 255 255);
background-color: var(--catch-detail-color);
color: var(--catch-detail-color-contrast);
}
:global(.tab-selected svg) {
fill: var(--catch-detail-color-contrast);
}
:global(.tab-unselected) {

8
UI/BigComponents/AllDownloads.ts
View file

@ -1,13 +1,13 @@
import Combine from "../Base/Combine"
import Translations from "../i18n/Translations"
import { UIEventSource } from "../../Logic/UIEventSource"
import {UIEventSource} from "../../Logic/UIEventSource"
import Toggle from "../Input/Toggle"
import { SubtleButton } from "../Base/SubtleButton"
import {SubtleButton} from "../Base/SubtleButton"
import Svg from "../../Svg"
import ExportPDF from "../ExportPDF"
import FilteredLayer from "../../Models/FilteredLayer"
import LayoutConfig from "../../Models/ThemeConfig/LayoutConfig"
import { BBox } from "../../Logic/BBox"
import {BBox} from "../../Logic/BBox"
import Loc from "../../Models/Loc"
export default class AllDownloads extends SubtleButton {
@ -35,7 +35,7 @@ export default class AllDownloads extends SubtleButton {
const loading = Svg.loading_svg().SetClass("animate-rotate")
const dloadTrans = Translations.t.general.download
const icon = new Toggle(loading, Svg.floppy_ui(), isExporting)
const icon = new Toggle(loading, Svg.floppy_svg(), isExporting)
const text = new Toggle(
dloadTrans.exporting.Clone(),
new Combine([

4
UI/BigComponents/CopyrightPanel.ts
View file

@ -48,7 +48,7 @@ export class OpenIdEditor extends VariableUiElement {
const idLink = `https://www.openstreetmap.org/edit?editor=id${elementSelect}#map=${
mapProperties.zoom?.data ?? 0
}/${location?.lat ?? 0}/${location?.lon ?? 0}`
return new SubtleButton(Svg.pencil_ui().SetStyle(iconStyle), t.editId, {
return new SubtleButton(Svg.pencil_svg().SetStyle(iconStyle), t.editId, {
url: idLink,
newTab: true,
})
@ -81,7 +81,7 @@ export class OpenJosm extends Combine {
)
const toggle = new Toggle(
new SubtleButton(Svg.josm_logo_ui().SetStyle(iconStyle), t.editJosm).onClick(() => {
new SubtleButton(Svg.josm_logo_svg().SetStyle(iconStyle), t.editJosm).onClick(() => {
const bbox = bounds.data
if (bbox === undefined) {
return

50
UI/BigComponents/CustomGeneratorButton.svelte
View file

@ -1,38 +1,38 @@
<script lang="ts">
import UserDetails from "../../Logic/Osm/OsmConnection"
import { UIEventSource } from "../../Logic/UIEventSource"
import Constants from "../../Models/Constants"
import Svg from "../../Svg"
import SubtleButton from "../Base/SubtleButton.svelte"
import ToSvelte from "../Base/ToSvelte.svelte"
import Translations from "../i18n/Translations"
import UserDetails from "../../Logic/Osm/OsmConnection"
import {UIEventSource} from "../../Logic/UIEventSource"
import Constants from "../../Models/Constants"
import Svg from "../../Svg"
import SubtleButton from "../Base/SubtleButton.svelte"
import ToSvelte from "../Base/ToSvelte.svelte"
import Translations from "../i18n/Translations"
export let userDetails: UIEventSource<UserDetails>
const t = Translations.t.general.morescreen
export let userDetails: UIEventSource<UserDetails>
const t = Translations.t.general.morescreen
console.log($userDetails.csCount < 50)
console.log($userDetails.csCount < 50)
</script>
<div>
{#if $userDetails.csCount < Constants.userJourney.themeGeneratorReadOnlyUnlock}
<SubtleButton
options={{
{#if $userDetails.csCount < Constants.userJourney.themeGeneratorReadOnlyUnlock}
<SubtleButton
options={{
url: "https://github.com/pietervdvn/MapComplete/issues",
newTab: true,
}}
>
<span slot="message">{t.requestATheme.toString()}</span>
</SubtleButton>
{:else}
<SubtleButton
options={{
>
<span slot="message">{t.requestATheme.toString()}</span>
</SubtleButton>
{:else}
<SubtleButton
options={{
url: "https://pietervdvn.github.io/mc/legacy/070/customGenerator.html",
}}
>
<span slot="image" class="h-11 w-11 mx-4 bg-red">
<ToSvelte construct={Svg.pencil_ui()} />
>
<span slot="image">
<ToSvelte construct={Svg.pencil_svg().SetClass("h-11 w-11 mx-4 bg-red")}/>
</span>
<span slot="message">{t.createYourOwnTheme.toString()}</span>
</SubtleButton>
{/if}
<span slot="message">{t.createYourOwnTheme.toString()}</span>
</SubtleButton>
{/if}
</div>

8
UI/BigComponents/DownloadPanel.ts
View file

@ -28,7 +28,7 @@ export class DownloadPanel extends Toggle {
const metaisIncluded = includeMetaToggle.GetValue().map((selected) => selected.length > 0)
const buttonGeoJson = new SubtleButton(
Svg.floppy_ui(),
Svg.floppy_svg(),
new Combine([
t.downloadGeojson.SetClass("font-bold"),
t.downloadGeoJsonHelper,
@ -45,7 +45,7 @@ export class DownloadPanel extends Toggle {
})
const buttonCSV = new SubtleButton(
Svg.floppy_ui(),
Svg.floppy_svg(),
new Combine([t.downloadCSV.SetClass("font-bold"), t.downloadCSVHelper]).SetClass(
"flex flex-col"
)
@ -63,7 +63,7 @@ export class DownloadPanel extends Toggle {
})
const buttonSvg = new SubtleButton(
Svg.floppy_ui(),
Svg.floppy_svg(),
new Combine([t.downloadAsSvg.SetClass("font-bold"), t.downloadAsSvgHelper]).SetClass(
"flex flex-col"
)
@ -88,7 +88,7 @@ export class DownloadPanel extends Toggle {
})
const buttonPng = new SubtleButton(
Svg.floppy_ui(),
Svg.floppy_svg(),
new Combine([t.downloadAsPng.SetClass("font-bold"), t.downloadAsPngHelper])
).OnClickWithLoading(t.exporting, async () => {
const gpsLayer = state.layerState.filteredLayers.get(

2
UI/BigComponents/ExtraLinkButton.ts
View file

@ -61,7 +61,7 @@ export default class ExtraLinkButton extends UIElement {
return Utils.SubstituteKeys(c.href, subs)
}, [this.state.mapProperties.zoom])
let img: BaseUIElement = Svg.pop_out_ui()
let img: BaseUIElement = Svg.pop_out_svg()
if (c.icon !== undefined) {
img = new Img(c.icon).SetClass("h-6")
}

2
UI/BigComponents/Geosearch.svelte
View file

@ -91,6 +91,6 @@
</form>
<div class="w-6 h-6 self-end" on:click={performSearch}>
<ToSvelte construct={Svg.search_ui}></ToSvelte>
<ToSvelte construct={Svg.search_svg}></ToSvelte>
</div>
</div>

2
UI/BigComponents/MapillaryLink.ts
View file

@ -15,7 +15,7 @@ export class MapillaryLink extends VariableUiElement {
location?.lat ?? 0
}&lng=${location?.lon ?? 0}&z=${Math.max((location?.zoom ?? 2) - 1, 1)}`
return new SubtleButton(
Svg.mapillary_black_ui().SetStyle(iconStyle),
Svg.mapillary_black_svg().SetStyle(iconStyle),
new Combine([t.openMapillary.SetClass("font-bold"), t.mapillaryHelp]).SetClass(
"flex flex-col link-no-underline"
),

2
UI/BigComponents/NoThemeResultButton.svelte
View file

@ -33,7 +33,7 @@
<span>
<SubtleButton>
<span slot="image">
<ToSvelte construct={Svg.search_disable_ui()} />
<ToSvelte construct={Svg.search_disable_svg().SetClass("w-6 mr-2")} />
</span>
<span slot="message">{t.noSearch.toString()}</span>
</SubtleButton>

2
UI/BigComponents/ShareScreen.ts
View file

@ -13,7 +13,7 @@ import {SubtleButton} from "../Base/SubtleButton"
import LZString from "lz-string"
import {SpecialVisualizationState} from "../SpecialVisualization"
class ShareScreen extends Combine{
export class ShareScreen extends Combine{
constructor(state: SpecialVisualizationState) {
const layout = state?.layout
const tr = Translations.t.general.sharescreen

7
UI/BigComponents/ThemesList.svelte
View file

@ -1,14 +1,13 @@
<script lang="ts">
import NoThemeResultButton from "./NoThemeResultButton.svelte"
import { OsmConnection } from "../../Logic/Osm/OsmConnection"
import { UIEventSource } from "../../Logic/UIEventSource"
import {OsmConnection} from "../../Logic/Osm/OsmConnection"
import {UIEventSource} from "../../Logic/UIEventSource"
import type Loc from "../../Models/Loc"
import Locale from "../i18n/Locale"
import CustomGeneratorButton from "./CustomGeneratorButton.svelte"
import ProfessionalServicesButton from "./ProfessionalServicesButton.svelte"
import ThemeButton from "./ThemeButton.svelte"
import { LayoutInformation } from "../../Models/ThemeConfig/LayoutConfig"
import {LayoutInformation} from "../../Models/ThemeConfig/LayoutConfig"
import MoreScreen from "./MoreScreen"
export let search: UIEventSource<string>

2
UI/BigComponents/UploadTraceToOsmUI.ts
View file

@ -127,7 +127,7 @@ export default class UploadTraceToOsmUI extends LoginToggle {
uploadFinished
),
new Combine([
Svg.invalid_ui().SetClass("w-8 h-8 m-2"),
Svg.invalid_svg().SetClass("w-8 h-8 m-2"),
t.gpxServiceOffline.SetClass("p-2"),
]).SetClass("flex border alert items-center"),
state.osmConnection.gpxServiceIsOnline.map(

2
UI/Image/ImageUploadFlow.ts
View file

@ -68,7 +68,7 @@ export class ImageUploadFlow extends Toggle {
)
}
const label = new Combine([
Svg.camera_plus_ui().SetClass("block w-12 h-12 p-1 text-4xl "),
Svg.camera_plus_svg().SetClass("block w-12 h-12 p-1 text-4xl "),
labelContent,
])
.SetClass(

43
UI/Map/ShowDataLayer.ts
View file

@ -1,18 +1,18 @@
import { ImmutableStore, Store, UIEventSource } from "../../Logic/UIEventSource"
import type { Map as MlMap } from "maplibre-gl"
import { GeoJSONSource, Marker } from "maplibre-gl"
import { ShowDataLayerOptions } from "./ShowDataLayerOptions"
import { GeoOperations } from "../../Logic/GeoOperations"
import {ImmutableStore, Store, UIEventSource} from "../../Logic/UIEventSource"
import type {Map as MlMap} from "maplibre-gl"
import {GeoJSONSource, Marker} from "maplibre-gl"
import {ShowDataLayerOptions} from "./ShowDataLayerOptions"
import {GeoOperations} from "../../Logic/GeoOperations"
import LayerConfig from "../../Models/ThemeConfig/LayerConfig"
import PointRenderingConfig from "../../Models/ThemeConfig/PointRenderingConfig"
import { OsmTags } from "../../Models/OsmFeature"
import { FeatureSource, FeatureSourceForLayer } from "../../Logic/FeatureSource/FeatureSource"
import { BBox } from "../../Logic/BBox"
import { Feature, Point } from "geojson"
import {OsmTags} from "../../Models/OsmFeature"
import {FeatureSource, FeatureSourceForLayer} from "../../Logic/FeatureSource/FeatureSource"
import {BBox} from "../../Logic/BBox"
import {Feature, Point} from "geojson"
import LineRenderingConfig from "../../Models/ThemeConfig/LineRenderingConfig"
import { Utils } from "../../Utils"
import {Utils} from "../../Utils"
import * as range_layer from "../../assets/layers/range/range.json"
import { LayerConfigJson } from "../../Models/ThemeConfig/Json/LayerConfigJson"
import {LayerConfigJson} from "../../Models/ThemeConfig/Json/LayerConfigJson"
import PerLayerFeatureSourceSplitter from "../../Logic/FeatureSource/PerLayerFeatureSourceSplitter"
import FilteredLayer from "../../Models/FilteredLayer"
import SimpleFeatureSource from "../../Logic/FeatureSource/Sources/SimpleFeatureSource"
@ -144,8 +144,11 @@ class PointRenderingLayer {
} else {
store = new ImmutableStore(<OsmTags>feature.properties)
}
const { html, iconAnchor } = this._config.RenderIcon(store, true)
html.SetClass("marker cursor-pointer")
const {html, iconAnchor} = this._config.RenderIcon(store, true)
html.SetClass("marker")
if (this._onClick !== undefined) {
html.SetClass("cursor-pointer")
}
const el = html.ConstructElement()
if (this._onClick) {
@ -174,7 +177,7 @@ class PointRenderingLayer {
if (newloc[0] === oldLoc.lng && newloc[1] === oldLoc.lat) {
return
}
marker.setLngLat({ lon: newloc[0], lat: newloc[1] })
marker.setLngLat({lon: newloc[0], lat: newloc[1]})
})
}
return marker
@ -357,7 +360,7 @@ class LineRenderingLayer {
}
if (this._fetchStore === undefined) {
map.setFeatureState(
{ source: this._layername, id },
{source: this._layername, id},
this.calculatePropsFor(feature.properties)
)
} else {
@ -365,7 +368,7 @@ class LineRenderingLayer {
this._listenerInstalledOn.add(id)
tags.addCallbackAndRunD((properties) => {
map.setFeatureState(
{ source: this._layername, id },
{source: this._layername, id},
this.calculatePropsFor(properties)
)
})
@ -440,19 +443,19 @@ export default class ShowDataLayer {
const features = this._options.features.features.data
const bbox = BBox.bboxAroundAll(features.map(BBox.get))
map.fitBounds(bbox.toLngLat(), {
padding: { top: 10, bottom: 10, left: 10, right: 10 },
padding: {top: 10, bottom: 10, left: 10, right: 10},
})
}
}
private initDrawFeatures(map: MlMap) {
let { features, doShowLayer, fetchStore, selectedElement, selectedLayer } = this._options
let {features, doShowLayer, fetchStore, selectedElement, selectedLayer} = this._options
const onClick =
this._options.onClick ??
((feature: Feature) => {
(this._options.layer.title === undefined ? undefined : ((feature: Feature) => {
selectedElement?.setData(feature)
selectedLayer?.setData(this._options.layer)
})
}))
if (this._options.drawLines !== false) {
for (let i = 0; i < this._options.layer.lineRendering.length; i++) {
const lineRenderingConfig = this._options.layer.lineRendering[i]

3
UI/NewPoint/ConfirmLocationOfPoint.ts
View file

@ -12,6 +12,9 @@ import { WayId } from "../../Models/OsmFeature"
import { Translation } from "../i18n/Translation"
import { SpecialVisualizationState } from "../SpecialVisualization"
/**
* @deprecated
*/
export default class ConfirmLocationOfPoint extends Combine {
constructor(
state: SpecialVisualizationState,

2
UI/OpeningHours/OpeningHoursRange.ts
View file

@ -30,7 +30,7 @@ export default class OpeningHoursRange extends BaseUIElement {
Utils.TwoDigits(oh.endHour) + ":" + Utils.TwoDigits(oh.endMinutes)
)
const deleteRange = Svg.delete_icon_ui()
const deleteRange = Svg.delete_icon_svg()
.SetClass("rounded-full w-6 h-6 block bg-black pointer-events-auto ")
.onClick(() => {
this._onDelete()

6
UI/Popup/DeleteWizard.ts
View file

@ -134,7 +134,7 @@ export default class DeleteWizard extends Toggle {
new Toggle(
new Toggle(
deleteDialog,
new SubtleButton(Svg.envelope_ui(), t.readMessages),
new SubtleButton(Svg.envelope_svg(), t.readMessages),
state.osmConnection.userDetails.map(
(ud) =>
ud.csCount >
@ -192,12 +192,12 @@ export default class DeleteWizard extends Toggle {
): BaseUIElement {
const t = Translations.t.delete
const btn = new Combine([
Svg.delete_icon_ui().SetClass("w-6 h-6 mr-3 block"),
Svg.delete_icon_svg().SetClass("w-6 h-6 mr-3 block"),
t.delete,
]).SetClass("flex btn bg-red-500")
const btnNonActive = new Combine([
Svg.delete_icon_ui().SetClass("w-6 h-6 mr-3 block"),
Svg.delete_icon_svg().SetClass("w-6 h-6 mr-3 block"),
t.delete,
]).SetClass("flex btn btn-disabled bg-red-200")

2
UI/Popup/ExportAsGpxViz.ts
View file

@ -26,7 +26,7 @@ export class ExportAsGpxViz implements SpecialVisualization {
return undefined
}
return new SubtleButton(
Svg.download_ui(),
Svg.download_svg(),
new Combine([
t.downloadFeatureAsGpx.SetClass("font-bold text-lg"),
t.downloadGpxHelper.SetClass("subtle"),

4
UI/Popup/ImportButton.ts
View file

@ -161,7 +161,7 @@ ${Utils.special_visualizations_importRequirementDocs}
if (args.icon !== undefined && args.icon !== "") {
img = new Img(args.icon)
} else {
img = Svg.add_ui()
img = Svg.add_svg()
}
const inviteToImportButton = new SubtleButton(img, args.text)
@ -318,7 +318,7 @@ ${Utils.special_visualizations_importRequirementDocs}
}
})
const cancel = new SubtleButton(Svg.close_ui(), Translations.t.general.cancel).onClick(
const cancel = new SubtleButton(Svg.close_svg(), Translations.t.general.cancel).onClick(
onCancel
)
return new Combine([confirmationMap, confirmButton, cancel]).SetClass("flex flex-col")

2
UI/Popup/LoginButton.ts
View file

@ -17,7 +17,7 @@ class LoginButton extends SubtleButton {
},
icon?: BaseUIElement | string
) {
super(icon ?? Svg.login_ui(), text)
super(icon ?? Svg.login_svg(), text)
this.onClick(() => {
state.osmConnection?.AttemptLogin()
})

4
UI/Popup/MoveWizard.ts
View file

@ -95,14 +95,14 @@ export default class MoveWizard extends Toggle {
})
} else {
moveButton = new SubtleButton(
Svg.move_ui().SetStyle("width: 1.5rem; height: 1.5rem"),
Svg.move_svg().SetStyle("width: 1.5rem; height: 1.5rem"),
t.inviteToMove.generic
).onClick(() => {
currentStep.setData("reason")
})
}
const moveAgainButton = new SubtleButton(Svg.move_ui(), t.inviteToMoveAgain).onClick(() => {
const moveAgainButton = new SubtleButton(Svg.move_svg(), t.inviteToMoveAgain).onClick(() => {
currentStep.setData("reason")
})

2
UI/Popup/SaveButton.ts
View file

@ -9,7 +9,7 @@ import Svg from "../../Svg"
export class EditButton extends Toggle {
constructor(osmConnection: OsmConnection, onClick: () => void) {
super(
new Combine([Svg.pencil_ui()])
new Combine([Svg.pencil_svg()])
.SetClass("block relative h-10 w-10 p-2 float-right")
.SetStyle("border: 1px solid black; border-radius: 0.7em")
.onClick(onClick),

2
UI/Popup/SplitRoadWizard.ts
View file

@ -68,7 +68,7 @@ export default class SplitRoadWizard extends Combine {
// Toggle between splitmap
const splitButton = new SubtleButton(
Svg.scissors_ui().SetStyle("height: 1.5rem; width: auto"),
Svg.scissors_svg().SetStyle("height: 1.5rem; width: auto"),
new Toggle(
t.splitAgain.Clone().SetClass("text-lg font-bold"),
t.inviteToSplit.Clone().SetClass("text-lg font-bold"),

6
UI/SpecialVisualizations.ts
View file

@ -509,7 +509,7 @@ export default class SpecialVisualizations {
args: [],
docs: "Shows a button where the user can log out",
constr(state: SpecialVisualizationState): BaseUIElement {
return new SubtleButton(Svg.logout_ui(), Translations.t.general.logout, {
return new SubtleButton(Svg.logout_svg(), Translations.t.general.logout, {
imgSize: "w-6 h-6",
}).onClick(() => {
state.osmConnection.LogOut()
@ -862,7 +862,7 @@ export default class SpecialVisualizations {
const t = Translations.t.general.download
return new SubtleButton(
Svg.download_ui(),
Svg.download_svg(),
new Combine([
t.downloadFeatureAsGeojson.SetClass("font-bold text-lg"),
t.downloadGeoJsonHelper.SetClass("subtle"),
@ -986,7 +986,7 @@ export default class SpecialVisualizations {
})
const label = new Combine([
Svg.camera_plus_ui().SetClass("block w-12 h-12 p-1 text-4xl "),
Svg.camera_plus_svg().SetClass("block w-12 h-12 p-1 text-4xl "),
Translations.t.image.addPicture,
]).SetClass(
"p-2 border-4 border-black rounded-full font-bold h-full align-center w-full flex justify-center"

30
UI/ThemeViewGUI.svelte
View file

@ -35,9 +35,10 @@
import SvelteUIElement from "./Base/SvelteUIElement";
import OverlayToggle from "./BigComponents/OverlayToggle.svelte";
import LevelSelector from "./BigComponents/LevelSelector.svelte";
import Svg from "../Svg";
import ExtraLinkButton from "./BigComponents/ExtraLinkButton";
import SelectedElementTitle from "./BigComponents/SelectedElementTitle.svelte";
import Svg from "../Svg";
import {ShareScreen} from "./BigComponents/ShareScreen";
export let state: ThemeViewState;
let layout = state.layout;
@ -55,6 +56,10 @@
return undefined;
}
if (!(layer.tagRenderings?.length > 0) || layer.title === undefined) {
return undefined
}
const tags = state.featureProperties.getStore(selectedElement.properties.id);
return new SvelteUIElement(SelectedElementView, {state, layer, selectedElement, tags})
}, [selectedLayer]);
@ -109,7 +114,7 @@
<MapControlButton
on:click={() => {selectedLayer.setData(currentViewLayer); selectedElement.setData(state.currentView.features?.data?.[0])}}>
<ToSvelte
construct={() =>(currentViewLayer.defaultIcon() ?? Svg.checkbox_empty_svg()).SetClass("w-8 h-8 cursor-pointer")}/>
construct={() =>(currentViewLayer.defaultIcon()).SetClass("w-8 h-8 cursor-pointer")}/>
</MapControlButton>
{/if}
<ToSvelte construct={() => new ExtraLinkButton(state, layout.extraLink)}></ToSvelte>
@ -133,10 +138,10 @@
</div>
</If>
<MapControlButton on:click={() => mapproperties.zoom.update(z => z+1)}>
<img class="w-8 h-8" src="./assets/svg/plus.svg"/>
<ToSvelte construct={Svg.plus_svg().SetClass("w-8 h-8")}/>
</MapControlButton>
<MapControlButton on:click={() => mapproperties.zoom.update(z => z-1)}>
<img class="w-8 h-8" src="./assets/svg/min.svg"/>
<ToSvelte construct={Svg.min_svg().SetClass("w-8 h-8")}/>
</MapControlButton>
<If condition={featureSwitches.featureSwitchGeolocation}>
<MapControlButton>
@ -174,7 +179,10 @@
<XCircleIcon class="w-8 h-8 mr-2" on:click={() => state.guistate.themeIsOpened.setData(false)}/>
</div>
<Tr slot="title0" t={layout.title}/>
<div class="flex" slot="title0">
<img class="w-4 h-4 block" src={layout.icon}>
<Tr t={layout.title}/>
</div>
<div slot="content0">
@ -201,7 +209,7 @@
<div class="flex" slot="title1">
<If condition={state.featureSwitches.featureSwitchFilter}>
<img class="w-4 h-4" src="./assets/svg/filter.svg">
<ToSvelte construct={Svg.filter_svg().SetClass("w-4 h-4")}/>
<Tr t={Translations.t.general.menu.filter}/>
</If>
</div>
@ -226,7 +234,7 @@
</div>
<div class="flex" slot="title2">
<If condition={state.featureSwitches.featureSwitchEnableExport}>
<img class="w-4 h-4" src="./assets/svg/download.svg"/>
<ToSvelte construct={Svg.download_svg().SetClass("w-4 h-4")}/>
<Tr t={Translations.t.general.download.title}/>
</If>
</div>
@ -240,7 +248,11 @@
<ToSvelte construct={() => new CopyrightPanel(state)} slot="content3"></ToSvelte>
<div slot="title4">
<Tr t={Translations.t.general.sharescreen.title}/>
</div>
<ToSvelte construct={() => new ShareScreen(state)} slot="content4"/>
</TabbedGroup>
</FloatOver>
</If>
@ -315,7 +327,7 @@
</div>
<div class="flex" slot="title2">
<img class="w-6" src="./assets/svg/community.svg">
<ToSvelte construct={Svg.community_svg().SetClass("w-6 h-6")}/>
Get in touch with others
</div>
<CommunityIndexView location={state.mapProperties.location} slot="content2"></CommunityIndexView>

2
UI/Wikipedia/WikidataSearchBox.ts
View file

@ -207,7 +207,7 @@ Another example is to search for species and trees:
return new Combine([
new Title(Translations.t.general.wikipedia.searchWikidata, 3).SetClass("m-2"),
new Combine([
Svg.search_ui().SetStyle("width: 1.5rem"),
Svg.search_svg().SetStyle("width: 1.5rem"),
searchField.SetClass("m-2 w-full"),
]).SetClass("flex"),
previews,