update

dfdsf

src/components/HowWorksSection.vue

@@ -1,55 +1,54 @@
 <template>
 <slide-template
   title="how_it_works__title"
-  subtitle="how_it_works__subtitle"
   >
-    <q-tabs
-      v-model="tab"
-      dense
-      class="text-grey"
-      active-color="primary"
-      indicator-color="primary"
-      align="justify"
-      narrow-indicator
-      >
-      <q-tab
-        v-for="tab in tabs"
-        :key="tab.name"
-        :name="tab.name"
-        :label="$t(tab.label)"
-      />
-    </q-tabs>
+  <q-tabs
+    v-model="tab"
+    dense
+    class="text-grey"
+    active-color="primary"
+    indicator-color="primary"
+    align="justify"
+    narrow-indicator
+    >
+    <q-tab
+      v-for="tab in tabs"
+      :key="tab.name"
+      :name="tab.name"
+      :label="$t(tab.label)"
+    />
+  </q-tabs>
 
-    <q-tab-panels
-      v-model="tab"
-      animated
-      class="w60 bg-transparent"
+  <q-tab-panels
+    v-model="tab"
+    animated
+    class="w60 bg-transparent"
+    >
+    <q-tab-panel
+      v-for="tab in tabs"
+      :key="tab.name"
+      :name="tab.name"
       >
-      <q-tab-panel
-        v-for="tab in tabs"
-        :key="tab.name"
-        :name="tab.name"
+      <div
+        class="relative-position w100">
+      <div
+        class="abolute-position w100"
+        style="height: 60vh;"
         >
-        <div
-          class="relative-position w100">
-        <div
-          class="abolute-position w100"
-          style="height: 60vh;"
+        <iframe 
+          src="https://kinescope.io/embed/5yesvjfi6XAYRuxzbsYGHZ" 
+          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;"
           >
-          <iframe 
-            src="https://kinescope.io/embed/5yesvjfi6XAYRuxzbsYGHZ" 
-            allow="autoplay; fullscreen; picture-in-picture; encrypted-media; gyroscope; accelerometer; clipboard-write; screen-wake-lock;" frameborder="0" allowfullscreen style="position: absolute; width: 100%; height: 100%; top: 0; left: 0;"
-            >
-          </iframe>
-        </div>
-        </div>
-          
-        <!-- <q-skeleton
-          style="height: calc(100vw * 0.5 / 16 * 9)"
-          square
-        /> -->
-      </q-tab-panel>
-    </q-tab-panels>
+        </iframe>
+      </div>
+      </div>
+        
+      <!-- <q-skeleton
+        style="height: calc(100vw * 0.5 / 16 * 9)"
+        square
+      /> -->
+    </q-tab-panel>
+  </q-tab-panels>
 </slide-template>
 
 </template>
@@ -58,8 +57,9 @@
   import { ref } from 'vue'
   import SlideTemplate from 'components/SlideTemplate.vue'
   const tabs = [
-    { name: 'admin', label: 'how_it_works__option1'},
-    { name: 'user', label: 'how_it_works__option2'}
+    { name: 'intro', label: 'how_it_works__intro'},
+    { name: 'admin', label: 'how_it_works__admin'},
+    { name: 'user', label: 'how_it_works__user'}
   ]
   const tab = ref(tabs[0].name)
 </script>