adds difficulty display

This commit is contained in:
Christian Beutel
2024-03-14 20:04:43 +01:00
parent 54613ee7db
commit e6728ca097
8 changed files with 59 additions and 27 deletions

View File

@@ -6,6 +6,7 @@
formatElevation,
formatTimeHHMM,
} from "$lib/util/format_util";
import { _ } from "svelte-i18n";
export let trail: Trail;
@@ -26,7 +27,14 @@
<div class="p-4">
<div>
<h4 class="font-semibold text-lg">{trail.name}</h4>
<h5><i class="fa fa-location-dot mr-3"></i>{trail.location}</h5>
{#if trail.location}
<h5><i class="fa fa-location-dot mr-3"></i>{trail.location}</h5>
{/if}
<h5>
<i class="fa fa-person-hiking mr-3"></i>{$_(
trail.difficulty ?? "?",
)}
</h5>
</div>
<div class="flex mt-2 gap-4 text-sm text-gray-500 whitespace-nowrap">
<span

View File

@@ -6,6 +6,7 @@
formatElevation,
formatTimeHHMM,
} from "$lib/util/format_util";
import { _ } from "svelte-i18n";
export let trail: Trail;
@@ -22,7 +23,17 @@
</div>
<div class="min-w-0 basis-full">
<h4 class="font-semibold text-lg">{trail.name}</h4>
<h5><i class="fa fa-location-dot mr-3"></i>{trail.location}</h5>
<div class="flex flex-wrap gap-x-8">
{#if trail.location}
<h5><i class="fa fa-location-dot mr-3"></i>{trail.location}</h5>
{/if}
<h5>
<i class="fa fa-person-hiking mr-3"></i>{$_(
trail.difficulty ?? "?",
)}
</h5>
</div>
<div class="flex mt-2 gap-4 text-sm text-gray-500">
<span
><i class="fa fa-left-right mr-2"></i>{formatDistance(