Make heading respect white space and reduce default margin
This commit is contained in:
parent
beb98eea1b
commit
bc5e88bceb
|
@ -4,21 +4,32 @@
|
|||
const { styleable } = getContext("sdk")
|
||||
const component = getContext("component")
|
||||
|
||||
export let className = ""
|
||||
export let type
|
||||
export let text = ""
|
||||
</script>
|
||||
|
||||
{#if type === 'h1'}
|
||||
<h1 class={className} use:styleable={$component.styles}>{text}</h1>
|
||||
<h1 use:styleable={$component.styles}>{text}</h1>
|
||||
{:else if type === 'h2'}
|
||||
<h2 class={className} use:styleable={$component.styles}>{text}</h2>
|
||||
<h2 use:styleable={$component.styles}>{text}</h2>
|
||||
{:else if type === 'h3'}
|
||||
<h3 class={className} use:styleable={$component.styles}>{text}</h3>
|
||||
<h3 use:styleable={$component.styles}>{text}</h3>
|
||||
{:else if type === 'h4'}
|
||||
<h4 class={className} use:styleable={$component.styles}>{text}</h4>
|
||||
<h4 use:styleable={$component.styles}>{text}</h4>
|
||||
{:else if type === 'h5'}
|
||||
<h5 class={className} use:styleable={$component.styles}>{text}</h5>
|
||||
<h5 use:styleable={$component.styles}>{text}</h5>
|
||||
{:else if type === 'h6'}
|
||||
<h6 class={className} use:styleable={$component.styles}>{text}</h6>
|
||||
<h6 use:styleable={$component.styles}>{text}</h6>
|
||||
{/if}
|
||||
|
||||
<style>
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
margin: 0.5em 0;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
</style>
|
||||
|
|
Loading…
Reference in New Issue