strapi integration

pages/index/+Page.vue

@@ -2,6 +2,10 @@
     <main class="splash">
         <svg-wordmark />
 
+        <div class="content">
+            <strapi-blocks v-if="content" :content="content" />
+        </div>
+
         <a :href="downloadUrl" download>
             <btn :disabled="loading">
                 {{ loading ? 'Checking for updates…' : `Download for ${os}` }}
@@ -11,14 +15,17 @@
 </template>
 
 <script setup>
+import { StrapiBlocks } from 'vue-strapi-blocks-renderer'
 import { ref, computed, onMounted } from 'vue'
 import SvgWordmark from '@/components/svg/Wordmark.vue'
 import useDetectOS from '@/composables/useDetectOS'
 import Btn from '@/components/Btn.vue'
+import { useData } from 'vike-vue/useData'
 
 const BASE_URL = 'https://s3.takerofnotes.com'
 
 const { os } = useDetectOS()
+const { data } = useData()
 
 const version = ref(null)
 const downloadPath = ref(null)
@@ -28,6 +35,7 @@ const downloadUrl = computed(() => {
     if (!downloadPath.value || os.value === 'Unknown') return null
     return `${BASE_URL}/dist/${os.value.toLowerCase()}/${version.value}/${downloadPath.value}`
 })
+const content = computed(() => data?.content)
 
 onMounted(async () => {
     try {
@@ -66,5 +74,13 @@ main.splash {
         height: auto;
         display: block;
     }
+
+    .content {
+        margin: var(--layout-margin);
+
+        p {
+            max-width: desktop-vw(500px);
+        }
+    }
 }
 </style>