2023-12-09 15:47:03 +01:00
|
|
|
<template>
|
2024-04-15 19:39:03 +02:00
|
|
|
<notion-renderer
|
|
|
|
|
v-if="!loading"
|
|
|
|
|
:block-map="blockMap"
|
|
|
|
|
/>
|
|
|
|
|
<div
|
|
|
|
|
v-else
|
|
|
|
|
class="p-6 flex items-center justify-center"
|
|
|
|
|
>
|
|
|
|
|
<loader class="w-6 h-6" />
|
2024-01-02 17:06:55 +01:00
|
|
|
</div>
|
2023-12-09 15:47:03 +01:00
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
2024-04-15 19:39:03 +02:00
|
|
|
import { NotionRenderer } from "vue-notion"
|
2023-12-09 15:47:03 +01:00
|
|
|
|
|
|
|
|
export default {
|
2024-04-15 19:39:03 +02:00
|
|
|
name: "NotionPage",
|
|
|
|
|
components: { NotionRenderer },
|
2023-12-09 15:47:03 +01:00
|
|
|
props: {
|
2024-01-02 17:06:55 +01:00
|
|
|
blockMap: {
|
2024-04-15 19:39:03 +02:00
|
|
|
type: Object,
|
2024-01-02 17:06:55 +01:00
|
|
|
},
|
|
|
|
|
loading: {
|
|
|
|
|
type: Boolean,
|
2024-04-15 19:39:03 +02:00
|
|
|
required: true,
|
|
|
|
|
},
|
2023-12-09 15:47:03 +01:00
|
|
|
},
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style lang="scss">
|
2023-12-09 16:33:56 +01:00
|
|
|
@import "vue-notion/src/styles.css";
|
2023-12-09 15:47:03 +01:00
|
|
|
|
|
|
|
|
.notion-blue {
|
|
|
|
|
@apply text-nt-blue;
|
|
|
|
|
}
|
|
|
|
|
</style>
|