feat: add fulscreen mode, dark mode

spa/src/App.vue

@@ -1,6 +1,8 @@
 <template>
+  <FullscreenViewport v-if="platform === 'ios' && platform === 'android'"/>
+
   <div
-      class="hero min-h-screen"
+      class="hero min-h-screen relative"
       style="background-image: url(https://img.daisyui.com/images/stock/photo-1507358522600-9f71e620c44e.webp);"
   >
     <div class="hero-overlay"></div>
@@ -8,7 +10,7 @@
       <div class="max-w-md">
         <h1 class="mb-5 text-5xl font-bold">Товарняк</h1>
         <p class="mb-5">
-          Магазин, который гордо продаёт то, что другие прячут.
+          Мы гордо продаём то, что другие боятся.
         </p>
         <button class="btn btn-primary" @click="scrollToProducts">
           Показать товар лицом
@@ -24,6 +26,10 @@
             <path stroke-linecap="round" stroke-linejoin="round" d="M19 9l-7 7-7-7" />
           </svg>
         </div>
+
+        <div class="absolute text-gray-400 left-3 bottom-3">
+          {{ platform }}
+        </div>
       </div>
     </div>
   </div>
@@ -36,13 +42,28 @@
 <script setup>
 import ProductList from "./components/ProductList.vue";
 import {onMounted, ref} from "vue";
+import { useWebAppViewport } from 'vue-tg';
+import { useMiniApp, FullscreenViewport } from 'vue-tg';
+
+const tg = useMiniApp();
+const platform = ref();
+platform.value = tg.platform;
+
+// const backButton = useBackButton();
+// backButton.show();
 
 const goodsRef = ref();
 function scrollToProducts() {
   goodsRef.value?.scrollIntoView({ behavior: 'smooth' });
 }
 
+
+const { disableVerticalSwipes } = useWebAppViewport();
+disableVerticalSwipes();
+
+
 onMounted(() => {
-  window.Telegram?.WebApp?.expand();
-})
+
+});
+
 </script>