24 lines
835 B
Svelte
24 lines
835 B
Svelte
<script lang="ts">
|
|
import emptyStateWaypointDark from "$lib/assets/svgs/empty_states/empty_state_waypoint_dark.svg";
|
|
import emptyStateWaypointLight from "$lib/assets/svgs/empty_states/empty_state_waypoint_light.svg";
|
|
import { theme } from "$lib/stores/theme_store";
|
|
|
|
import { _ } from "svelte-i18n";
|
|
interface Props {
|
|
width?: number;
|
|
}
|
|
|
|
let { width = 192 }: Props = $props();
|
|
</script>
|
|
|
|
<div class="flex flex-col justify-center items-center gap-y-4">
|
|
<img
|
|
style="width: {width}px"
|
|
class="rounded-full aspect-square"
|
|
src={$theme === "light" ? emptyStateWaypointLight : emptyStateWaypointDark}
|
|
alt="Empty State showing a wanderer going into the distance"
|
|
/>
|
|
|
|
<h3 class="text-xl font-medium text-center text-gray-500">{$_("no-waypoints-yet")}...</h3>
|
|
</div>
|