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

UX: filterview: move 'enable all' and 'disable all' into header by request of user

Browse source
This commit is contained in:
Pieter Vander Vennet 2024-07-21 10:33:44 +02:00
parent 2739bc4460
commit 09f531d308
2 changed files with 34 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

36
public/css/index-tailwind-output.css
View file

@ -993,6 +993,10 @@ video {
margin-right: 4rem;
}
.mb-4 {
margin-bottom: 1rem;
}
.mt-4 {
margin-top: 1rem;
}
@ -1025,10 +1029,6 @@ video {
margin-right: 0.25rem;
}
.mb-4 {
margin-bottom: 1rem;
}
.ml-1 {
margin-left: 0.25rem;
}
@ -1041,6 +1041,10 @@ video {
margin-bottom: 0.5rem;
}
.mr-10 {
margin-right: 2.5rem;
}
.mb-1\.5 {
margin-bottom: 0.375rem;
}
@ -1217,14 +1221,14 @@ video {
height: 6rem;
}
.h-full {
height: 100%;
}
.h-screen {
height: 100vh;
}
.h-full {
height: 100%;
}
.h-fit {
height: -webkit-fit-content;
height: -moz-fit-content;
@ -2019,6 +2023,10 @@ video {
row-gap: 0.5rem;
}
.gap-x-2 {
column-gap: 0.5rem;
}
.gap-x-1 {
column-gap: 0.25rem;
}
@ -2031,10 +2039,6 @@ video {
column-gap: 0px;
}
.gap-x-2 {
column-gap: 0.5rem;
}
.gap-y-8 {
row-gap: 2rem;
}
@ -3461,18 +3465,14 @@ video {
padding-right: 1rem;
}
.pl-5 {
padding-left: 1.25rem;
.pl-3 {
padding-left: 0.75rem;
}
.pr-3 {
padding-right: 0.75rem;
}
.pl-3 {
padding-left: 0.75rem;
}
.pl-1 {
padding-left: 0.25rem;
}

27
src/UI/BigComponents/FilterPanel.svelte
View file

@ -48,9 +48,22 @@
</script>
<TitledPanel>
<div class="flex" slot="title">
<Filter class="h-6 w-6 pr-2" />
<Tr t={Translations.t.general.menu.filter} />
<div class="flex items-center justify-between w-full mr-10" slot="title">
<div class="flex">
<Filter class="h-6 w-6 pr-2" />
<Tr t={Translations.t.general.menu.filter} />
</div>
<div class="flex self-end text-sm gap-x-2">
<button class="small as-link" class:disabled={allEnabled} on:click={() => enableAll(true)}>
<Tr t={Translations.t.general.filterPanel.enableAll} />
</button>
<button class="small as-link" class:disabled={allDisabled} on:click={() => enableAll(false)}>
<Tr t={Translations.t.general.filterPanel.disableAll} />
</button>
</div>
</div>
{#each layout.layers as layer}
@ -60,14 +73,6 @@
highlightedLayer={state.guistate.highlightedLayerInFilters}
/>
{/each}
<div class="mt-1 flex self-end">
<button class="small" class:disabled={allEnabled} on:click={() => enableAll(true)}>
<Tr t={Translations.t.general.filterPanel.enableAll} />
</button>
<button class="small" class:disabled={allDisabled} on:click={() => enableAll(false)}>
<Tr t={Translations.t.general.filterPanel.disableAll} />
</button>
</div>
{#each layout.tileLayerSources as tilesource}
<OverlayToggle