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

adds list default thumbnail

Browse Source
This commit is contained in:
Christian Beutel
2024-12-16 21:15:52 +01:00
parent b0d136ccea
commit 43b6be8fb2
8 changed files with 46 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
web/src/lib/components/list/list_card.svelte
View File

@@ -38,24 +38,17 @@
class="flex items-start gap-6 p-4 hover:bg-menu-item-background-hover rounded-xl transition-colors cursor-pointer" class="flex items-start gap-6 p-4 hover:bg-menu-item-background-hover rounded-xl transition-colors cursor-pointer"
class:bg-menu-item-background-hover={active} class:bg-menu-item-background-hover={active}
> >
{#if list.avatar} <img
<img class="w-16 md:w-20 aspect-square rounded-full object-cover"
class="w-16 md:w-20 aspect-square rounded-full object-cover" src={list.avatar
src={getFileURL(list, list.avatar)} ? getFileURL(list, list.avatar)
alt="avatar" : "/imgs/default_list_thumbnail.webp"}
/> alt="avatar"
{:else} />
<div
class="flex w-16 md:w-20 aspect-square shrink-0 items-center justify-center"
>
<i class="fa fa-table-list text-5xl"></i>
</div>
{/if}
<div class="self-start min-w-0 basis-full transition-transform"> <div class="self-start min-w-0 basis-full transition-transform">
<div class="flex items-center gap-3"> <div class="flex items-center gap-3">
<h5 <h5 class="text-xl font-semibold overflow-hidden overflow-ellipsis">
class="text-xl font-semibold overflow-hidden overflow-ellipsis"
>
{list.name} {list.name}
</h5> </h5>
{#if list.public} {#if list.public}

18
web/src/lib/components/list/list_panel.svelte
View File

@@ -111,17 +111,13 @@
> >
</div> </div>
{/if} {/if}
{#if list.avatar} <img
<img class="w-full object-cover max-h-64"
class="w-full object-cover" src={list.avatar
src={getFileURL(list, list.avatar)} ? getFileURL(list, list.avatar)
alt="avatar" : "/imgs/default_list_thumbnail.webp"}
/> alt="avatar"
{:else} />
<div class="flex w-full shrink-0 items-center justify-center min-h-72">
<i class="fa fa-table-list text-5xl"></i>
</div>
{/if}
</div> </div>
<div class="p-4 md:p-6"> <div class="p-4 md:p-6">

23
web/src/lib/components/list/list_select_modal.svelte
View File

@@ -6,7 +6,7 @@
import { getFileURL } from "$lib/util/file_util"; import { getFileURL } from "$lib/util/file_util";
import { _ } from "svelte-i18n"; import { _ } from "svelte-i18n";
import Modal from "../base/modal.svelte"; import Modal from "../base/modal.svelte";
export let lists: List[]; export let lists: List[];
export let openModal: (() => void) | undefined = undefined; export let openModal: (() => void) | undefined = undefined;
@@ -41,19 +41,14 @@
on:click={() => handleSelect(list)} on:click={() => handleSelect(list)}
role="presentation" role="presentation"
> >
{#if list.avatar} <img
<img class="w-12 aspect-square rounded-full"
class="w-12 aspect-square rounded-full" src={list.avatar
src={getFileURL(list, list.avatar)} ? getFileURL(list, list.avatar)
alt="avatar" : "/imgs/default_list_thumbnail.webp"}
/> alt="avatar"
{:else} />
<div
class="flex w-12 aspect-square shrink-0 items-center justify-center"
>
<i class="fa fa-table-list text-5xl"></i>
</div>
{/if}
<h5 class="text-md font-semibold">{list.name}</h5> <h5 class="text-md font-semibold">{list.name}</h5>
<i <i

2
web/src/lib/components/profile/activity_card.svelte
View File

@@ -14,7 +14,7 @@
let fullDescription: boolean = false; let fullDescription: boolean = false;
</script> </script>
<div class="activity-card p-6 space-y-6 shadow-md rounded-xl"> <div class="activity-card p-6 space-y-6 rounded-xl border border-input-border">
<div class="flex gap-x-4 items-start"> <div class="flex gap-x-4 items-start">
<img <img
class="rounded-full w-10 aspect-square overflow-hidden" class="rounded-full w-10 aspect-square overflow-hidden"

6
web/src/routes/lists/edit/[id]/+page.svelte
View File

@@ -257,10 +257,8 @@
/> />
{:else} {:else}
<div <div
class="flex items-center justify-center w-32 aspect-square rounded-full object-cover border border-gray-200" class="w-32 aspect-square rounded-full bg-menu-item-background-focus border-gray-200"
> ></div>
<i class="fa fa-table-list text-5xl"></i>
</div>
{/if} {/if}
<button <button
class="btn-secondary" class="btn-secondary"

21
web/src/routes/profile/[id]/+page.svelte
View File

@@ -82,19 +82,14 @@
href="/lists?list={list.id}" href="/lists?list={list.id}"
class="relative w-64 h-48 rounded-xl overflow-hidden group shrink-0" class="relative w-64 h-48 rounded-xl overflow-hidden group shrink-0"
> >
{#if list.avatar} <img
<img class="w-full h-full object-cover transition-transform group-hover:scale-110"
class="w-full h-full object-cover transition-transform group-hover:scale-110" src={list.avatar
src={getFileURL(list, list.avatar)} ? getFileURL(list, list.avatar)
alt="avatar" : "/imgs/default_list_thumbnail.webp"}
/> alt="avatar"
{:else} />
<div
class="flex w-16 md:w-20 aspect-square shrink-0 items-center justify-center"
>
<i class="fa fa-table-list text-5xl"></i>
</div>
{/if}
<div <div
class="absolute bottom-0 w-full h-2/3 bg-gradient-to-b from-transparent to-black opacity-50" class="absolute bottom-0 w-full h-2/3 bg-gradient-to-b from-transparent to-black opacity-50"
></div> ></div>

24
web/src/routes/trail/edit/[id]/+page.svelte
View File

@@ -24,7 +24,7 @@
import { import {
lists_add_trail, lists_add_trail,
lists_index, lists_index,
lists_remove_trail lists_remove_trail,
} from "$lib/stores/list_store"; } from "$lib/stores/list_store";
import { summitLog } from "$lib/stores/summit_log_store"; import { summitLog } from "$lib/stores/summit_log_store";
import { show_toast } from "$lib/stores/toast_store"; import { show_toast } from "$lib/stores/toast_store";
@@ -51,10 +51,7 @@
formatElevation, formatElevation,
formatTimeHHMM, formatTimeHHMM,
} from "$lib/util/format_util"; } from "$lib/util/format_util";
import { import { fromFile, gpx2trail } from "$lib/util/gpx_util";
fromFile,
gpx2trail
} from "$lib/util/gpx_util";
import { import {
createAnchorMarker, createAnchorMarker,
@@ -851,15 +848,14 @@
<div <div
class="flex gap-2 items-center border border-input-border rounded-xl p-2" class="flex gap-2 items-center border border-input-border rounded-xl p-2"
> >
{#if list.avatar} <img
<img class="w-8 aspect-square rounded-full object-cover"
class="w-8 aspect-square rounded-full object-cover" src={list.avatar
src={getFileURL(list, list.avatar)} ? getFileURL(list, list.avatar)
alt="avatar" : "/imgs/default_list_thumbnail.webp"}
/> alt="avatar"
{:else} />
<i class="fa fa-table-list text-2xl"></i>
{/if}
<span class="text-sm">{list.name}</span> <span class="text-sm">{list.name}</span>
</div> </div>
{/if} {/if}

BIN
web/static/imgs/default_list_thumbnail.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 228 KiB