budibase/packages/standard-components/src/Heading.svelte

35 lines
736 B
Svelte
Raw Normal View History

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