27 lines
702 B
TypeScript
27 lines
702 B
TypeScript
|
import { defineComponent } from 'vue'
|
||
|
|
import type { Block } from '../layout.types'
|
||
|
|
|
||
|
|
export default defineComponent({
|
||
|
|
props: {
|
||
|
|
block: {
|
||
|
|
type: Object as () => Block,
|
||
|
|
required: true
|
||
|
|
}
|
||
|
|
},
|
||
|
|
setup(props) {
|
||
|
|
return () => (
|
||
|
|
<div
|
||
|
|
class="w-full h-full flex justify-center items-center font-bold bg-cover bg-center bg-no-repeat"
|
||
|
|
style={{
|
||
|
|
backgroundColor: props.block.background || 'white',
|
||
|
|
color: props.block.color || 'black',
|
||
|
|
backgroundImage: props.block.icon ? `url('${props.block.icon}')` : '',
|
||
|
|
fontSize: 'calc(var(--block-size) / 4.4)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
<div>{props.block.text}</div>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
})
|