brian/wanderer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

adds new empty states

Browse Source
This commit is contained in:
Christian Beutel
2025-01-04 17:05:35 +01:00
parent 474e21ae55
commit a704db6366
32 changed files with 306 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
web/src/lib/components/trail/trail_card.svelte
View File

@@ -1,5 +1,9 @@
<script lang="ts">
import emptyStateTrailDark from "$lib/assets/svgs/empty_states/empty_state_trail_dark.svg";
import emptyStateTrailLight from "$lib/assets/svgs/empty_states/empty_state_trail_light.svg";
import type { Trail } from "$lib/models/trail";
import { pb } from "$lib/pocketbase";
import { theme } from "$lib/stores/theme_store";
import { getFileURL } from "$lib/util/file_util";
import {
formatDistance,
@@ -8,14 +12,15 @@
} from "$lib/util/format_util";
import { _ } from "svelte-i18n";
import ShareInfo from "../share_info.svelte";
import { pb } from "$lib/pocketbase";
export let trail: Trail;
export let fullWidth: boolean = false;
$: thumbnail = trail.photos.length
? getFileURL(trail, trail.photos[trail.thumbnail ?? 0])
: "/imgs/default_thumbnail.webp";
: $theme === "light"
? emptyStateTrailLight
: emptyStateTrailDark;
$: trailIsShared = (trail.expand?.trail_share_via_trail?.length ?? 0) > 0;
</script>
@@ -31,7 +36,7 @@
<div
class="relative w-full min-h-40 max-h-48 overflow-hidden rounded-t-2xl"
>
<img id="header-img" src={thumbnail} alt="" />
<img width="100%" id="header-img" src={thumbnail} alt="" />
</div>
{#if (trail.public || trailIsShared) && pb.authStore.model}
<div

9
web/src/lib/components/trail/trail_info_panel.svelte
View File

@@ -33,6 +33,9 @@
import { pb } from "$lib/pocketbase";
import * as M from "maplibre-gl";
import MapWithElevationMaplibre from "./map_with_elevation_maplibre.svelte";
import emptyStateTrailDark from "$lib/assets/svgs/empty_states/empty_state_trail_dark.svg";
import emptyStateTrailLight from "$lib/assets/svgs/empty_states/empty_state_trail_light.svg";
import { theme } from "$lib/stores/theme_store";
export let trail: Trail;
export let mode: "overview" | "map" | "list" = "map";
@@ -50,9 +53,11 @@
const trailIsShared =
(trail.expand?.trail_share_via_trail?.length ?? 0) > 0;
let thumbnail = trail.photos.length
$: thumbnail = trail.photos.length
? getFileURL(trail, trail.photos[trail.thumbnail ?? 0])
: "/imgs/default_thumbnail.webp";
: $theme === "light"
? emptyStateTrailLight
: emptyStateTrailDark;
let openGallery: (idx?: number) => void;

11
web/src/lib/components/trail/trail_list_item.svelte
View File

@@ -1,5 +1,9 @@
<script lang="ts">
import emptyStateTrailDark from "$lib/assets/svgs/empty_states/empty_state_trail_dark.svg";
import emptyStateTrailLight from "$lib/assets/svgs/empty_states/empty_state_trail_light.svg";
import type { Trail } from "$lib/models/trail";
import { pb } from "$lib/pocketbase";
import { theme } from "$lib/stores/theme_store";
import { getFileURL } from "$lib/util/file_util";
import {
formatDistance,
@@ -8,15 +12,16 @@
} from "$lib/util/format_util";
import { _ } from "svelte-i18n";
import ShareInfo from "../share_info.svelte";
import { pb } from "$lib/pocketbase";
export let trail: Trail;
export let showDescription: boolean = true;
$: thumbnail = trail.photos.length
? getFileURL(trail, trail.photos[trail.thumbnail ?? 0])
: "/imgs/default_thumbnail.webp";
: $theme === "light"
? emptyStateTrailLight
: emptyStateTrailDark;
</script>
<li