stufflog/svelte-ui/src/components/ActivityAmount.svelte

<script>
  import pluralize from "pluralize";

  import ActivityIcon from "./ActivityIcon.svelte";

  export let amount = 0
  export let subActivity = null
</script>

{#if subActivity != null}
  <span>{amount} {pluralize(subActivity.unitName, amount)}</span>
{:else}
  <span class="unknown">{amount} (unknown unit)</span>
{/if}

<style>
  span {
    display: inline-block;
  }
  span.unknown {
    color: #555;
  }
</style>