2020-02-14 12:51:45 +01:00
|
|
|
<script>
|
2020-11-18 20:18:18 +01:00
|
|
|
import { getContext } from "svelte"
|
|
|
|
|
2020-11-20 10:50:10 +01:00
|
|
|
const { styleable } = getContext("sdk")
|
2020-11-24 12:02:10 +01:00
|
|
|
const component = getContext("component")
|
2020-11-17 13:08:24 +01:00
|
|
|
|
2020-02-14 12:51:45 +01:00
|
|
|
export let type
|
2020-04-22 12:52:55 +02:00
|
|
|
export let text = ""
|
2020-02-14 12:51:45 +01:00
|
|
|
</script>
|
|
|
|
|
2020-02-25 16:21:23 +01:00
|
|
|
{#if type === 'h1'}
|
2021-02-23 11:02:21 +01:00
|
|
|
<h1 use:styleable={$component.styles}>{text}</h1>
|
2020-02-25 16:21:23 +01:00
|
|
|
{:else if type === 'h2'}
|
2021-02-23 11:02:21 +01:00
|
|
|
<h2 use:styleable={$component.styles}>{text}</h2>
|
2020-02-25 16:21:23 +01:00
|
|
|
{:else if type === 'h3'}
|
2021-02-23 11:02:21 +01:00
|
|
|
<h3 use:styleable={$component.styles}>{text}</h3>
|
2020-02-25 16:21:23 +01:00
|
|
|
{:else if type === 'h4'}
|
2021-02-23 11:02:21 +01:00
|
|
|
<h4 use:styleable={$component.styles}>{text}</h4>
|
2020-02-25 16:21:23 +01:00
|
|
|
{:else if type === 'h5'}
|
2021-02-23 11:02:21 +01:00
|
|
|
<h5 use:styleable={$component.styles}>{text}</h5>
|
2020-02-25 16:21:23 +01:00
|
|
|
{:else if type === 'h6'}
|
2021-02-23 11:02:21 +01:00
|
|
|
<h6 use:styleable={$component.styles}>{text}</h6>
|
2020-02-14 12:51:45 +01:00
|
|
|
{/if}
|
2021-02-23 11:02:21 +01:00
|
|
|
|
|
|
|
<style>
|
|
|
|
h1,
|
|
|
|
h2,
|
|
|
|
h3,
|
|
|
|
h4,
|
|
|
|
h5,
|
|
|
|
h6 {
|
|
|
|
white-space: pre-wrap;
|
|
|
|
}
|
|
|
|
</style>
|