stufflog2/svelte-ui/src/components/EmptyList.svelte

<script lang="ts">
  import type { IconName } from "../external/icons";
  import Icon from "./Icon.svelte";

  export let icon: IconName = "moon";
  export let text: string = "All good!";
</script>

<div class="empty-list">
  <div class="icon">
    <Icon name={icon} />
  </div>
  <div class="text">
    {text}
  </div>
</div>

<style>
  div.empty-list {
    font-size: 2em;
    text-align: center;
    color: #555;
    padding: 2em 0;
  }

  div.icon {
    font-size: 3em;
  }
</style>