multiple cosmetic changes

Former-commit-id: 6f52d7c81c645ec43c4344bde07539db0f008dac
This commit is contained in:
Christian Beutel
2024-03-15 15:25:51 +01:00
parent f33a4d13f7
commit 662a9c006d
11 changed files with 59 additions and 41 deletions

View File

@@ -125,17 +125,26 @@
<div class="basis-full"></div>
<hr class="border-input-border" />
<div class="flex gap-4 items-center m-4">
<img
class="rounded-full w-8 aspect-square"
src={getFileURL($currentUser, $currentUser.avatar) ||
`https://api.dicebear.com/7.x/initials/svg?seed=${$currentUser.username}&backgroundType=gradientLinear`}
alt="avatar"
/>
<div>
<a href="/profile">
<img
class="rounded-full w-10 aspect-square"
src={getFileURL($currentUser, $currentUser.avatar) ||
`https://api.dicebear.com/7.x/initials/svg?seed=${$currentUser.username}&backgroundType=gradientLinear`}
alt="avatar"
/>
</a>
<a href="/profile">
<p class="text-sm">{$currentUser.username}</p>
<p class="text-sm text-gray-500">{$currentUser.email}</p>
</div>
<button class="btn-icon"
<p class="text-sm text-gray-500">
{$currentUser.email}
</p>
</a>
<button
on:click={() => {
logout();
window.location.href = "/";
}}
class="btn-icon"
><i class="fa-solid fa-arrow-right-from-bracket"
></i></button
>
@@ -156,7 +165,7 @@
<LogoTextLight></LogoTextLight>
{/if}
</a>
<menu id="nav-bar-links" class="hidden md:flex gap-8 relative py-1 px-2">
<menu id="nav-bar-links" class="hidden lg:flex gap-8 relative py-1 px-2">
<div
class="absolute h-full w-16 bg-menu-item-background-hover rounded-xl top-0 z-0"
style="width: {$indicatorWidth}px; left: {$indicatorPosition}px; scale: {$indicatorScale}"
@@ -178,16 +187,14 @@
{/if}
</menu>
{#if $currentUser}
<div class="hidden md:flex gap-6 items-center">
<div class="hidden lg:flex gap-6 items-center">
<button
class="btn-icon fa-regular fa-{$theme === 'light'
? 'sun'
: 'moon'}"
on:click={() => toggleTheme()}
></button>
<a
class="btn-primary btn-large"
href="/trail/edit/new"
<a class="btn-primary btn-large" href="/trail/edit/new"
><i class="fa fa-plus mr-2"></i>{$_("new-trail")}</a
>
<Dropdown
@@ -220,7 +227,7 @@
</div>
{/if}
<button
class="btn-icon fa fa-bars md:hidden"
class="btn-icon fa fa-bars lg:hidden"
on:click={() => (drawerOpen = !drawerOpen)}
></button>
</nav>

View File

@@ -25,6 +25,7 @@
await import("$lib/vendor/leaflet-elevation/src/index.js");
map = L.map("map").setView([trail.lat ?? 0, trail.lon ?? 0], 14);
map.attributionControl.setPrefix(false)
L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
attribution: "© OpenStreetMap contributors",

View File

@@ -27,14 +27,18 @@
<div class="p-4">
<div>
<h4 class="font-semibold text-lg">{trail.name}</h4>
{#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 class="flex gap-x-4">
{#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>
<div class="flex mt-2 gap-4 text-sm text-gray-500 whitespace-nowrap">
<span

View File

@@ -52,6 +52,7 @@
await import("leaflet.awesome-markers");
map = L.map("map").setView([0, 0], 2);
map.attributionControl.setPrefix(false)
L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
attribution: "© OpenStreetMap contributors",
@@ -150,12 +151,12 @@
<div class="flex flex-wrap gap-x-8 gap-y-2 mt-4 mr-8">
{#if trail.location}
<h3 class="text-lg">
<i class="fa fa-location-dot mr-3"></i>
<i class="fa fa-location-dot mr-2"></i>
{trail.location}
</h3>
{/if}
<h3 class="text-lg">
<i class="fa fa-person-hiking mr-3"></i>
<i class="fa fa-person-hiking mr-2"></i>
{$_(trail.difficulty ?? "?")}
</h3>
</div>

View File

@@ -59,14 +59,14 @@
<div class="min-w-0">
<div class="flex items-end flex-wrap md:flex-nowrap gap-x-6 gap-y-2 mx-4">
<div class="basis-full order-1 md:order-none mt-6 md:mt-0">
<div class="basis-full order-1 md:order-none">
<Pagination
page={pagination.page}
totalPages={pagination.totalPages}
on:pagination
></Pagination>
</div>
<div class="lg:shrink-0">
<div class="shrink-0">
<p class="text-sm text-gray-500 pb-2">{$_("sort")}</p>
<div class="flex items-center gap-2">
<Select
@@ -83,7 +83,7 @@
>
</div>
</div>
<div class="lg:shrink-0">
<div class="shrink-0">
<p class="text-sm text-gray-500 pb-2">{$_("display-as")}</p>
<Select