fixes display issues

This commit is contained in:
Christian Beutel
2024-07-01 17:16:13 +02:00
parent 3ab0882b81
commit c8e7b76d00
10 changed files with 41 additions and 16 deletions

View File

@@ -103,7 +103,7 @@
<h4 class="font-semibold text-lg">${trail.name}</h4>
<div class="flex gap-x-4">
${trail.location ? `<h5><i class="fa fa-location-dot mr-2"></i>${trail.location}</h5>` : ""}
<h5><i class="fa fa-person-hiking mr-2"></i>${$_(trail.difficulty as string)}</h5>
<h5><i class="fa fa-gauge mr-2"></i>${$_(trail.difficulty as string)}</h5>
</div>
<div class="flex mt-2 gap-4 text-sm text-gray-500"><span class="shrink-0"><i
class="fa fa-left-right mr-2"></i>${formatDistance(

View File

@@ -268,7 +268,7 @@
<h4 class="font-semibold text-lg">${trail.name}</h4>
<div class="flex gap-x-4">
${trail.location ? `<h5><i class="fa fa-location-dot mr-2"></i>${trail.location}</h5>` : ""}
<h5><i class="fa fa-person-hiking mr-2"></i>${$_(trail.difficulty as string)}</h5>
<h5><i class="fa fa-gauge mr-2"></i>${$_(trail.difficulty as string)}</h5>
</div>
<div class="flex mt-2 gap-4 text-sm text-gray-500"><span class="shrink-0"><i
class="fa fa-left-right mr-2"></i>${formatDistance(
@@ -353,7 +353,7 @@
{/if}
</div>
{#if !showMap || (browser && window.innerWidth >= 768)}
{#if !showFilter && (!showMap || (browser && window.innerWidth >= 768))}
{#if $trails.length == 0}
<EmptyStateSearch></EmptyStateSearch>
{/if}

View File

@@ -16,16 +16,16 @@
<title>{$trail.name} | {$_("map")} | wanderer</title>
</svelte:head>
<main class="grid grid-cols-1 md:grid-cols-[458px_1fr] gap-x-1 gap-y-4">
<div id="trail-details">
<TrailInfoPanel trail={$trail} {markers}></TrailInfoPanel>
<TrailInfoPanel trail={$trail} {markers}></TrailInfoPanel>
<div id="trail-details" class=" sticky top-0">
<MapWithElevation trail={$trail} bind:markers></MapWithElevation>
</div>
<MapWithElevation trail={$trail} bind:markers></MapWithElevation>
</main>
<style>
@media only screen and (min-width: 768px) {
#trail-details {
height: calc(100vh - 124px);
max-height: calc(100vh - 124px);
}
}
</style>

View File

@@ -17,16 +17,16 @@
onMount(() => {
if (window.innerWidth < 768) {
filterExpanded = false;
}
}
});
async function handleFilterUpdate() {
async function handleFilterUpdate() {
const response = await trails_search_filter(filter, 1);
pagination.page = response.page;
pagination.totalPages = response.totalPages;
}
async function paginate(page: number) {
async function paginate(page: number) {
pagination.page = page;
const response = await trails_search_filter(filter, page);
}