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

More styling

Browse source
This commit is contained in:
Pieter Vander Vennet 2024-06-17 04:27:08 +02:00
parent 6a67b9f2f2
commit 08ab5a58fb
38 changed files with 474 additions and 493 deletions
Download patch file Download diff file Expand all files Collapse all files

14
src/UI/BigComponents/Filterview.svelte
View file

@ -9,7 +9,6 @@
import FilterConfig from "../../Models/ThemeConfig/FilterConfig"
import If from "../Base/If.svelte"
import Dropdown from "../Base/Dropdown.svelte"
import { onDestroy } from "svelte"
import { ImmutableStore, Store, UIEventSource } from "../../Logic/UIEventSource"
import FilterviewWithFields from "./FilterviewWithFields.svelte"
import Tr from "../Base/Tr.svelte"
@ -40,20 +39,11 @@
return filteredLayer.appliedFilters.get(option.id)
}
let mainElem: HTMLElement
$: onDestroy(
highlightedLayer.addCallbackAndRun((highlightedLayer) => {
if (highlightedLayer === filteredLayer.layerDef.id) {
mainElem?.classList?.add("glowing-shadow")
} else {
mainElem?.classList?.remove("glowing-shadow")
}
})
)
</script>
{#if filteredLayer.layerDef.name}
<div bind:this={mainElem} class="mb-1.5">
<div class:focus={$highlightedLayer === filteredLayer.layerDef.id} class="mb-1.5">
<Checkbox selected={isDisplayed}>
<If condition={filteredLayer.isDisplayed}>
<ToSvelte

4
src/UI/BigComponents/OverlayToggle.svelte
View file

@ -27,9 +27,9 @@
$: onDestroy(
highlightedLayer.addCallbackAndRun((highlightedLayer) => {
if (highlightedLayer === layerproperties.id) {
mainElem?.classList?.add("glowing-shadow")
mainElem?.classList?.add("focus")
} else {
mainElem?.classList?.remove("glowing-shadow")
mainElem?.classList?.remove("focus")
}
})
)

4
src/UI/BigComponents/ThemeButton.svelte
View file

@ -85,9 +85,9 @@
</script>
{#if theme.id !== personal.id || $unlockedPersonal}
<a class={"button theme-button w-full text-ellipsis"} href={$href}>
<a class={"button theme-button w-full text-ellipsis"} style="justify-content: start" href={$href}>
<img src={theme.icon} class="m-1 mr-2 block h-11 w-11 sm:m-2 sm:mr-4" alt="" />
<span class="flex flex-col overflow-hidden text-ellipsis">
<span class="flex flex-col overflow-hidden text-ellipsis ">
<Tr t={title} />
{#if selected}