convert Heading to new API
This commit is contained in:
parent
3480045f11
commit
8ecdbc9bf4
|
@ -1,11 +1,13 @@
|
|||
<script>
|
||||
import "@spectrum-css/typography/dist/index-vars.css"
|
||||
|
||||
export let size = "M";
|
||||
export let serif = false;
|
||||
export let size = "M"
|
||||
export let serif = false
|
||||
</script>
|
||||
|
||||
<p class="spectrum-Body class:spectrum-Body--size{size}"
|
||||
<p
|
||||
class="spectrum-Body class:spectrum-Body--size{size}"
|
||||
class:spectrum-Body--serif={serif}
|
||||
>
|
||||
<slot />
|
||||
</p>
|
|
@ -2,27 +2,9 @@
|
|||
import "@spectrum-css/typography/dist/index-vars.css"
|
||||
|
||||
// Sizes
|
||||
export let xxxl = false
|
||||
export let xxl = false
|
||||
export let xl = false
|
||||
export let l = false
|
||||
export let m = false
|
||||
export let s = false
|
||||
export let xs = false
|
||||
export let xxs = false
|
||||
|
||||
$: useDefault = ![xxxl, xxl, xl, l, m, s, xs, xxs].includes(true)
|
||||
export let size = "M"
|
||||
</script>
|
||||
|
||||
<h1
|
||||
class="spectrum-Heading"
|
||||
class:spectrum-Heading--sizeXXXL={xxxl}
|
||||
class:spectrum-Heading--sizeXXL={xxl}
|
||||
class:spectrum-Heading--sizeXL={xl}
|
||||
class:spectrum-Heading--sizeL={l}
|
||||
class:spectrum-Heading--sizeM={m || useDefault}
|
||||
class:spectrum-Heading--sizeS={s}
|
||||
class:spectrum-Heading--sizeXS={xs}
|
||||
class:spectrum-Heading--sizeXXS={xxs}>
|
||||
<h1 class="spectrum-Heading spectrum-Heading--size{size}">
|
||||
<slot />
|
||||
</h1>
|
||||
|
|
Loading…
Reference in New Issue