57 lines
1.4 KiB
Vue
57 lines
1.4 KiB
Vue
<template>
|
|
<slide-template
|
|
title="how_it_works__title"
|
|
class="overflow-hidden w100"
|
|
>
|
|
<custom-tabs
|
|
v-bind="$attrs"
|
|
:tabItems
|
|
:useTabsNoCaps
|
|
>
|
|
<template #default="{ item }">
|
|
<div class="relative-position w60 q-pt-md">
|
|
<div style="height: 60vh; position: relative;">
|
|
<iframe
|
|
:key="item.name"
|
|
:src="item.url"
|
|
allow="autoplay; fullscreen; picture-in-picture; encrypted-media; gyroscope; accelerometer; clipboard-write; screen-wake-lock; fullscreen;"
|
|
frameborder="0"
|
|
style="position: absolute; width: 100%; height: 100%; top: 0; left: 0;"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</custom-tabs>
|
|
</slide-template>
|
|
</template>
|
|
|
|
<script setup>
|
|
import SlideTemplate from 'components/SlideTemplate.vue'
|
|
import CustomTabs from 'components/CustomTabs.vue'
|
|
|
|
defineProps({
|
|
useTabsNoCaps: Boolean
|
|
})
|
|
|
|
const tabItems = [
|
|
{
|
|
name: 'intro',
|
|
label: 'how_it_works__intro',
|
|
url: 'https://kinescope.io/embed/5yesvjfi6XAYRuxzbsYGHZ'
|
|
},
|
|
{
|
|
name: 'admin',
|
|
label: 'how_it_works__admin',
|
|
url: 'https://kinescope.io/embed/5yesvjfi6XAYRuxzbsYGHZ'
|
|
},
|
|
{
|
|
name: 'user',
|
|
label: 'how_it_works__user',
|
|
url: 'https://kinescope.io/embed/5yesvjfi6XAYRuxzbsYGHZ'
|
|
}
|
|
]
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
</style>
|