steven/gpx.studio
1
0
Fork 0
mirror of https://github.com/gpxstudio/gpx.studio.git synced 2025-12-03 02:12:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

update shadcn components

Browse Source
This commit is contained in:
vcoppe
2025-10-18 18:51:11 +02:00
parent c59cd66141
commit e68da7354e
30 changed files with 405 additions and 310 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
website/src/lib/components/map/layer-control/CustomLayers.svelte
View File

@@ -312,10 +312,20 @@
<div class="flex flex-row items-center gap-2" data-id={id}>
<Move size="12" />
<span class="grow">{$customLayers[id].name}</span>
<Button variant="outline" onclick={() => (selectedLayerId = id)} class="p-1 h-7">
<Button
variant="outline"
size="icon-sm"
onclick={() => (selectedLayerId = id)}
class="p-1 h-7"
>
<Pencil size="16" />
</Button>
<Button variant="outline" onclick={() => deleteLayer(id)} class="p-1 h-7">
<Button
variant="outline"
size="icon-sm"
onclick={() => deleteLayer(id)}
class="p-1 h-7"
>
<Trash2 size="16" />
</Button>
</div>
@@ -338,17 +348,26 @@
<div class="flex flex-row items-center gap-2" data-id={id}>
<Move size="12" />
<span class="grow">{$customLayers[id].name}</span>
<Button variant="outline" onclick={() => (selectedLayerId = id)} class="p-1 h-7">
<Button
variant="outline"
size="icon-sm"
onclick={() => (selectedLayerId = id)}
class="p-1 h-7"
>
<Pencil size="16" />
</Button>
<Button variant="outline" onclick={() => deleteLayer(id)} class="p-1 h-7">
<Button
variant="outline"
size="icon-sm"
onclick={() => deleteLayer(id)}
class="p-1 h-7"
>
<Trash2 size="16" />
</Button>
</div>
{/each}
</div>
<Card.Root>
<Card.Root class="py-0 gap-0 shadow-none">
<Card.Header class="p-3">
<Card.Title class="text-base">
{#if selectedLayerId}

8
website/src/lib/components/map/layer-control/LayerControl.svelte
View File

@@ -179,9 +179,9 @@
? 'grid-rows-[1fr] grid-cols-[1fr]'
: ''} {cancelEvents ? 'pointer-events-none' : ''}"
>
<ScrollArea>
<ScrollArea class="overflow-hidden">
<div class="h-fit">
<div class="p-2">
<div class="p-2 ml-1">
<LayerTree
layerTree={$selectedBasemapTree}
name="basemaps"
@@ -193,7 +193,7 @@
/>
</div>
<Separator class="w-full" />
<div class="p-2">
<div class="p-2 ml-1">
{#if $currentOverlays}
<LayerTree
layerTree={$selectedOverlayTree}
@@ -204,7 +204,7 @@
{/if}
</div>
<Separator class="w-full" />
<div class="p-2">
<div class="p-2 ml-1">
{#if $currentOverpassQueries}
<LayerTree
layerTree={$selectedOverpassTree}

8
website/src/lib/components/map/layer-control/LayerControlSettings.svelte
View File

@@ -90,7 +90,7 @@
<Accordion.Item value="layer-selection" class="flex flex-col">
<Accordion.Trigger>{i18n._('layers.selection')}</Accordion.Trigger>
<Accordion.Content class="grow flex flex-col border rounded">
<div class="py-2 pl-1 pr-2">
<div class="py-2 pl-3 pr-2">
<LayerTree
layerTree={basemapTree}
name="basemapSettings"
@@ -99,7 +99,7 @@
/>
</div>
<Separator />
<div class="py-2 pl-1 pr-2">
<div class="py-2 pl-3 pr-2">
<LayerTree
layerTree={overlayTree}
name="overlaySettings"
@@ -108,7 +108,7 @@
/>
</div>
<Separator />
<div class="py-2 pl-1 pr-2">
<div class="py-2 pl-3 pr-2">
<LayerTree
layerTree={overpassTree}
name="overpassSettings"
@@ -130,7 +130,7 @@
type="single"
onValueChange={setOpacityFromSelection}
>
<Select.Trigger class="h-8 mr-1">
<Select.Trigger class="h-8 mr-1 w-full">
{#if selectedOverlay}
{#if isSelected($selectedOverlayTree, selectedOverlay)}
{i18n._(`layers.label.${selectedOverlay}`)}

25
website/src/lib/components/map/street-view-control/StreetViewControl.svelte
View File

@@ -10,6 +10,7 @@
import { settings } from '$lib/logic/settings';
import { i18n } from '$lib/i18n.svelte';
import { onMount } from 'svelte';
import ButtonWithTooltip from '$lib/components/ButtonWithTooltip.svelte';
const { streetViewSource } = settings;
@@ -47,15 +48,21 @@
</script>
<CustomControl class="w-[29px] h-[29px] shrink-0">
<Tooltip class="w-full h-full" side="left" label={i18n._('menu.toggle_street_view')}>
<Toggle
bind:pressed={$streetViewEnabled}
class="w-full h-full rounded p-0"
aria-label={i18n._('menu.toggle_street_view')}
>
<PersonStanding size="22" />
</Toggle>
</Tooltip>
<ButtonWithTooltip
variant="ghost"
class="w-full h-full"
side="left"
label={i18n._('menu.toggle_street_view')}
onclick={() => {
$streetViewEnabled = !$streetViewEnabled;
}}
>
<PersonStanding
size="22"
class="size-5.5"
color={$streetViewEnabled ? '#33b5e5' : 'currentColor'}
/>
</ButtonWithTooltip>
</CustomControl>
<div