28 lines
559 B
Vue
28 lines
559 B
Vue
<script setup>
|
|
const props = defineProps({
|
|
level: {
|
|
type: Number,
|
|
default: 2
|
|
}
|
|
})
|
|
|
|
const tagName = computed(() => `h${Math.min(Math.max(props.level, 1), 6)}`)
|
|
</script>
|
|
|
|
<template>
|
|
<component
|
|
:is="tagName"
|
|
class="prose-heading mt-10 font-semibold leading-tight tracking-normal first:mt-0"
|
|
:class="{
|
|
'text-5xl': level === 1,
|
|
'text-4xl': level === 2,
|
|
'text-3xl': level === 3,
|
|
'text-2xl': level === 4,
|
|
'text-xl': level === 5,
|
|
'text-lg': level === 6
|
|
}"
|
|
>
|
|
<slot />
|
|
</component>
|
|
</template>
|