git.r.bdr.sh - rbdr/forum/blob - src/lib/components/forum_list/forum_list.svelte

   1 <script lang="ts">
   2         import type { Forum } from '$lib/data/types';
   3
   4         export let forums: Forum[];
   5
   6         import { _ } from 'svelte-i18n';
   7         $: sortedForums = forums.slice().sort((a, b) => a.position - b.position);
   8 </script>
   9
  10 <ul class="p-0 pl-2">
  11         {#each sortedForums as forum}
  12                 <li class="block text-left mb-5">
  13                         <a class="no-underline text-blue-600 visited:text-purple-500" href="/f/{forum.id}">
  14                                 <span aria-hidden="true" class="block text-2xl {forum.glyph}">{forum.glyph}</span>
  15                                 <span class="navigation-label">{$_(forum.label)}</span>
  16                         </a>
  17                 </li>
  18         {/each}
  19 </ul>
  20
  21 <style>
  22         .☽ {
  23                 font-size: 2rem;
  24         }
  25 </style>