]> git.r.bdr.sh - rbdr/forum/blob - src/components/glyph/glyph.svelte
e4b9166c773ca3f98c9e454218f489b0b826ba26
[rbdr/forum] / src / components / glyph / glyph.svelte
1 <script>
2 import { _ } from 'svelte-i18n';
3 import { getGlyphHash } from '../../utils/glyph_hash';
4
5 export let uuid;
6 </script>
7
8 <div class="glyphicon" aria-hidden="true" title="{$_('glyph.title')}">
9 {#each getGlyphHash(uuid) as fragment}
10 <span class="{fragment.glyph}" style="color: {fragment.color} ">
11 {fragment.glyph}
12 </span>
13 {/each}
14 </div>
15
16 <style>
17 .glyphicon {
18 border: 1px solid black;
19 display: inline-block;
20 font-size: 1.4rem;
21 height: 48px;
22 margin-top: 5px;
23 width: 48px;
24 }
25
26 span {
27 display: block;
28 float: left;
29 width: 24px;
30 height: 24px;
31 text-align: center;
32 line-height: 24px;
33 }
34
35 .☽ {
36 font-size: 2rem;
37 line-height: 19px;
38 }
39 </style>