diff options
Diffstat (limited to 'src/lib/components/glyph/glyph.svelte')
| -rw-r--r-- | src/lib/components/glyph/glyph.svelte | 41 |
1 files changed, 41 insertions, 0 deletions
diff --git a/src/lib/components/glyph/glyph.svelte b/src/lib/components/glyph/glyph.svelte new file mode 100644 index 0000000..0559b98 --- /dev/null +++ b/src/lib/components/glyph/glyph.svelte @@ -0,0 +1,41 @@ +<script lang="ts"> + import { _ } from 'svelte-i18n'; + import { getGlyphHash } from '$lib/utils/glyph_hash'; + + export let uuid: string; +</script> + +<div class="glyphicon" role="img" aria-label={$_('glyph.title')} title={$_('glyph.title')}> + {#each getGlyphHash(uuid) as fragment} + <span class={fragment.glyph} style="color: {fragment.color} "> + {fragment.glyph} + </span> + {/each} +</div> + +<style> + .glyphicon { + border: 1px solid black; + display: inline-block; + font-size: 1.4rem; + height: 48px; + margin-top: 5px; + width: 48px; + background-color: white; + padding: 2px; + } + + span { + display: block; + float: left; + width: 24px; + height: 24px; + text-align: center; + line-height: 24px; + } + + .☽ { + font-size: 2rem; + line-height: 19px; + } +</style> |