<template> | |
<div :class="['h' + level]" style="justify-content: center;"> | |
<text :class="['txt-h' + level]">{{value}}</text> | |
</div> | |
</template> | |
<script> | |
module.exports = { | |
props: { | |
level: { default: 1 }, | |
value: { default: '' } | |
} | |
} | |
</script> | |
<style scoped> | |
.h1 { | |
height: 110px; | |
padding-top: 20px; | |
padding-bottom: 20px; | |
} | |
.h2 { | |
height: 110px; | |
padding-top: 20px; | |
padding-bottom: 20px; | |
} | |
.h3 { | |
height: 110px; | |
padding-top: 20px; | |
padding-bottom: 20px; | |
} | |
.txt-h1 { | |
font-size: 70px; | |
} | |
.txt-h2 { | |
font-size: 52px; | |
} | |
.txt-h3 { | |
font-size: 42px; | |
} | |
</style> |