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

   1 <script lang="ts">
   2         import { _ } from 'svelte-i18n';
   3         import { getGlyphHash } from '$lib/utils/glyph_hash';
   4
   5         export let uuid: string;
   6 </script>
   7
   8 <div
   9         class="inline-block w-12 h-12 mt-1 bg-white border border-black border-solid p-0.5 box-content glyphicon"
  10         role="img"
  11         aria-label={$_('glyph.title')}
  12         title={$_('glyph.title')}
  13 >
  14         {#each getGlyphHash(uuid) as fragment}
  15                 <span
  16                         class="block text-2xl float-left w-6 h-6 text-center leading-6 {fragment.glyph}"
  17                         style="color: {fragment.color} "
  18                 >
  19                         {fragment.glyph}
  20                 </span>
  21         {/each}
  22 </div>
  23
  24 <style>
  25         .glyphicon {
  26                 border: 1px solid black;
  27         }
  28
  29         .☽ {
  30                 font-size: 2rem;
  31                 line-height: 19px;
  32         }
  33 </style>