]> git.r.bdr.sh - rbdr/forum/blob - src/components/glyph/glyph.svelte
32e8ee65cf3e5c8e01bfc1f24793485caeba6847
[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 background-color: white;
25 padding: 2px;
26 }
27
28 span {
29 display: block;
30 float: left;
31 width: 24px;
32 height: 24px;
33 text-align: center;
34 line-height: 24px;
35 }
36
37 .☽ {
38 font-size: 2rem;
39 line-height: 19px;
40 }
41 </style>