fix: global improvements

mfactory-lab · Jul 3, 2024 · 2f8c524 · 2f8c524
1 parent 23cde1b
commit 2f8c524
Show file tree

Hide file tree

Showing 10 changed files with 50 additions and 61 deletions.
diff --git a/index.html b/index.html
@@ -1,27 +1,27 @@
 <!doctype html>
 <html lang="en">
-<head>
-  <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <link rel="preconnect" href="https://fonts.googleapis.com" />
-  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
-  <script>
-    ;(function () {
-      const prefersDark =
-        window.matchMedia &&
-        window.matchMedia('(prefers-color-scheme: dark)').matches
-      const setting = localStorage.getItem('vueuse-color-scheme') || 'auto'
-      if (setting === 'dark' || (prefersDark && setting !== 'light'))
-        document.documentElement.classList.toggle('dark', true)
-    })()
-  </script>
-</head>
-<body class="font-sans">
-<div id="app"></div>
-<script type="module" src="/src/main.ts"></script>
-<noscript>
-  This website requires JavaScript to function properly. Please enable
-  JavaScript to continue.
-</noscript>
-</body>
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=5, minimal-ui, shrink-to-fit=no">
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <script>
+      ;(function () {
+        const prefersDark =
+          window.matchMedia &&
+          window.matchMedia('(prefers-color-scheme: dark)').matches
+        const setting = localStorage.getItem('vueuse-color-scheme') || 'auto'
+        if (setting === 'dark' || (prefersDark && setting !== 'light'))
+          document.documentElement.classList.toggle('dark', true)
+      })()
+    </script>
+  </head>
+  <body class="font-sans">
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+    <noscript>
+      This website requires JavaScript to function properly. Please enable
+      JavaScript to continue.
+    </noscript>
+  </body>
 </html>
diff --git a/src/components/Components/Other/CustomIcon.vue b/src/components/Components/Other/CustomIcon.vue
@@ -4,14 +4,6 @@
       Custom Icon
     </div>
 
-    <i-app-landscape width="26px" height="36px" class="i-icon" />
+    <i-app-landscape />
   </div>
 </template>
-
-<style lang="scss" scoped>
-.component {
-  .i-icon {
-    fill: #239f90;
-  }
-}
-</style>
diff --git a/src/components/Home/HomeMain.vue b/src/components/Home/HomeMain.vue
@@ -10,9 +10,7 @@ const tab = useStorage('active-tab', Tabs.Components)
 </script>
 
 <template>
-  <q-tabs
-    v-model="tab"
-  >
+  <q-tabs v-model="tab">
     <q-tab :name="Tabs.Components" :icon="matGridView" :label="Tabs.Components" />
     <q-tab :name="Tabs.Routes" :icon="matRoute" :label="Tabs.Routes" />
   </q-tabs>

diff --git a/src/main.ts b/src/main.ts
@@ -9,7 +9,7 @@ import './assets/styles/main.scss'
 export const createApp = ViteSSG(
   App,
   {
-    strict: true,
+    // strict: true,
     base: import.meta.env.BASE_URL,
     routes: setupLayouts(routes),
   },

diff --git a/src/pages/[...all].vue b/src/pages/[...all].vue
@@ -1,3 +1,15 @@
+<script setup lang="ts">
+definePage({
+  meta: {
+    name: '404',
+    layout: 'empty',
+  },
+})
+useHead({
+  title: 'Page not found',
+})
+</script>
+
 <template>
   <div class="page-404">
     404
@@ -14,8 +26,3 @@
   color: #2a2e4694;
 }
 </style>
-
-<route lang="yaml">
-meta:
-  layout: empty
-</route>
diff --git a/src/pages/index.vue b/src/pages/index.vue
@@ -5,7 +5,7 @@
 <template>
   <div class="home-page container">
     <h2>Starter Webapp</h2>
-    <p>
+    <div class="q-my-lg">
       This application provides a ready-made foundation with Quasar component examples and configurations for your project. Quasar is a powerful tool for developing versatile web applications using Vue.js. In our starter application, you’ll find:
 
       <ul>
@@ -17,7 +17,7 @@
       </ul>
 
       This application will help you kickstart your development, bypassing initial setup and component integration steps. We hope it becomes a reliable foundation for your project!
-    </p>
+    </div>
 
     <home-main />
   </div>

diff --git a/src/pages/test.vue b/src/pages/test.vue
@@ -1,5 +1,11 @@
 <script setup lang="ts">
 const router = useRouter()
+
+definePage({
+  meta: {
+    layout: 'empty',
+  },
+})
 </script>
 
 <template>
@@ -15,8 +21,3 @@ const router = useRouter()
     </div>
   </div>
 </template>
-
-<route lang="yaml">
-meta:
-  layout: empty
-</route>
diff --git a/tsconfig.json b/tsconfig.json
@@ -17,6 +17,7 @@
       "vite/client",
       "vite-plugin-pwa/client",
       "vite-plugin-vue-layouts/client",
+      "unplugin-icons/types/vue",
       "unplugin-vue-router/client"
     ],
     "allowJs": true,

diff --git a/types/components.d.ts b/types/components.d.ts
@@ -9,21 +9,12 @@ declare module 'vue' {
   export interface GlobalComponents {
     AppFooter: typeof import('./../src/components/AppFooter.vue')['default']
     AppHeader: typeof import('./../src/components/AppHeader.vue')['default']
-    ComponentButton: typeof import('./../src/components/Components/Button/ComponentButton.vue')['default']
-    ComponentButtons: typeof import('./../src/components/Components/ComponentButtons.vue')['default']
-    ComponentCustomDialog: typeof import('./../src/components/Components/Dialog/ComponentCustomDialog.vue')['default']
-    ComponentDefaultDialog: typeof import('./../src/components/Components/Dialog/ComponentDefaultDialog.vue')['default']
-    ComponentDropdownButton: typeof import('./../src/components/Components/Button/ComponentDropdownButton.vue')['default']
-    ComponentGroupButton: typeof import('./../src/components/Components/Button/ComponentGroupButton.vue')['default']
     ComponentsButton: typeof import('./../src/components/Components/ComponentsButton.vue')['default']
     ComponentsDialog: typeof import('./../src/components/Components/ComponentsDialog.vue')['default']
-    ComponentsDropdownButton: typeof import('./../src/components/Components/ComponentsDropdownButton.vue')['default']
     ComponentsForm: typeof import('./../src/components/Components/ComponentsForm.vue')['default']
-    ComponentsGroupButton: typeof import('./../src/components/Components/ComponentsGroupButton.vue')['default']
     ComponentsNotification: typeof import('./../src/components/Components/ComponentsNotification.vue')['default']
     ComponentsOther: typeof import('./../src/components/Components/ComponentsOther.vue')['default']
     ComponentsTab: typeof import('./../src/components/Home/ComponentsTab.vue')['default']
-    ComponentToggleButton: typeof import('./../src/components/Components/Button/ComponentToggleButton.vue')['default']
     CustomDialog: typeof import('./../src/components/Components/Dialog/CustomDialog.vue')['default']
     CustomIcon: typeof import('./../src/components/Components/Other/CustomIcon.vue')['default']
     DefaultCheckbox: typeof import('./../src/components/Components/Form/DefaultCheckbox.vue')['default']
@@ -43,7 +34,6 @@ declare module 'vue' {
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
     RoutesTab: typeof import('./../src/components/Home/RoutesTab.vue')['default']
-    Select: typeof import('./../src/components/Components/Form/Select.vue')['default']
     SingleButton: typeof import('./../src/components/Components/Button/SingleButton.vue')['default']
     ToggleButton: typeof import('./../src/components/Components/Button/ToggleButton.vue')['default']
   }

diff --git a/types/env.d.ts b/types/env.d.ts
@@ -2,8 +2,8 @@
 
 type ImportMetaEnv = {
   readonly MODE: 'production' | 'development' | 'staging'
-
   readonly VERSION: string
 
-  readonly VITE_SENTRY_DSN: string
+  readonly VITE_SENTRY_DSN?: string
+  readonly VITE_APP_URL?: string
 }