From f08d119bcad34d6b15aed8ec86b7e6ef233ca616 Mon Sep 17 00:00:00 2001
From: Elvanos <elvanos66@gmail.com>
Date: Thu, 21 Sep 2023 00:15:25 +0200
Subject: [PATCH] removed ripple effect, cleaned app a bit

---
 .vscode/settings.json                         |  3 +-
 quasar.config.js                              |  4 +-
 .../GlobalWindowButtons.vue                   |  3 --
 src/globals.d.ts                              |  2 -
 src/layouts/ComponentTestingLayout.vue        |  7 +--
 src/layouts/MainLayout.vue                    | 49 ++++---------------
 src/pages/IndexPage.vue                       | 15 ------
 7 files changed, 15 insertions(+), 68 deletions(-)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 20f927d..be6e431 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -15,5 +15,6 @@
   "typescript.tsdk": "node_modules/typescript/lib",
   "[javascript]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode"
-  }
+  },
+  "todo-tree.tree.scanMode": "workspace"
 }
diff --git a/quasar.config.js b/quasar.config.js
index 379215a..48e386b 100644
--- a/quasar.config.js
+++ b/quasar.config.js
@@ -99,7 +99,9 @@ module.exports = configure(function (/* ctx */) {
 
     // https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#framework
     framework: {
-      config: {},
+      config: {
+        ripple: false,
+      },
 
       // iconSet: 'material-icons', // Quasar icon set
       // lang: 'en-US', // Quasar language pack
diff --git a/src/components/GlobalWindowButtons/GlobalWindowButtons.vue b/src/components/GlobalWindowButtons/GlobalWindowButtons.vue
index e18014d..8bc046f 100644
--- a/src/components/GlobalWindowButtons/GlobalWindowButtons.vue
+++ b/src/components/GlobalWindowButtons/GlobalWindowButtons.vue
@@ -7,7 +7,6 @@
     <!-- Minimize button -->
     <q-btn
       flat
-      :ripple="false"
       dark
       size="xs"
       class="globalWindowButtons__minimize"
@@ -26,7 +25,6 @@
     <!-- MinMax button -->
     <q-btn
       flat
-      :ripple="false"
       dark
       size="xs"
       class="globalWindowButtons__resize"
@@ -45,7 +43,6 @@
     <!-- Close button -->
     <q-btn
       flat
-      :ripple="false"
       dark
       size="xs"
       class="globalWindowButtons__close"
diff --git a/src/globals.d.ts b/src/globals.d.ts
index c8940c0..674cb9c 100644
--- a/src/globals.d.ts
+++ b/src/globals.d.ts
@@ -2,8 +2,6 @@ import { I_extraEnvVariablesAPI } from 'app/interfaces/I_extraEnvVariablesAPI'
 import { I_faWindowControlAPI } from 'app/interfaces/I_faWindowControlAPI'
 import { I_faDevToolsControl } from 'app/interfaces/I_faDevToolsControl'
 
-export {}
-
 declare global{
     interface Window {
           faWindowControlAPI: I_faWindowControlAPI,
diff --git a/src/layouts/ComponentTestingLayout.vue b/src/layouts/ComponentTestingLayout.vue
index 1452a8a..78607b1 100644
--- a/src/layouts/ComponentTestingLayout.vue
+++ b/src/layouts/ComponentTestingLayout.vue
@@ -6,10 +6,5 @@
   </q-layout>
 </template>
 
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  name: 'ComponentTestingLayout'
-})
+<script lang="ts" setup>
 </script>
diff --git a/src/layouts/MainLayout.vue b/src/layouts/MainLayout.vue
index bb40de3..6c780ce 100644
--- a/src/layouts/MainLayout.vue
+++ b/src/layouts/MainLayout.vue
@@ -1,29 +1,16 @@
 <template>
-  <q-layout view="lHh Lpr lFf">
+  <q-layout view="hHh Lpr lFf">
     <GlobalWindowButtons />
-    <q-header elevated>
-      <q-toolbar>
-        <q-btn
-          flat
-          dense
-          round
-          icon="menu"
-          aria-label="Menu"
-          @click="toggleLeftDrawer"
-        />
-
-        <q-toolbar-title>
-          {{ $t('app.name') }}
-        </q-toolbar-title>
-
-        <div>Quasar v{{ $q.version }}</div>
-      </q-toolbar>
+    <q-header
+      elevated
+      class="bg-dark"
+    >
+      <AppControlMenus />
     </q-header>
 
     <q-drawer
-      v-model="leftDrawerOpen"
       show-if-above
-      bordered
+      dark
     >
       <q-list>
         <q-item-label
@@ -40,26 +27,8 @@
   </q-layout>
 </template>
 
-<script lang="ts">
-import { defineComponent, ref } from 'vue'
+<script lang="ts" setup>
 import GlobalWindowButtons from 'components/GlobalWindowButtons/GlobalWindowButtons.vue'
+import AppControlMenus from 'components/AppControlMenus/AppControlMenus.vue'
 
-export default defineComponent({
-  name: 'MainLayout',
-
-  components: {
-    GlobalWindowButtons
-  },
-
-  setup () {
-    const leftDrawerOpen = ref(false)
-
-    return {
-      leftDrawerOpen,
-      toggleLeftDrawer () {
-        leftDrawerOpen.value = !leftDrawerOpen.value
-      }
-    }
-  }
-})
 </script>
diff --git a/src/pages/IndexPage.vue b/src/pages/IndexPage.vue
index 6ed6f11..c361892 100644
--- a/src/pages/IndexPage.vue
+++ b/src/pages/IndexPage.vue
@@ -1,17 +1,6 @@
 <template>
   <q-page class="row">
     <FantasiaMascotImage width="400px" />
-    <div>
-      <q-btn
-        class="q-mt-xl"
-        color="primary"
-        outline
-        size="xl"
-        @click="toggle()"
-      >
-        Toggle
-      </q-btn>
-    </div>
 
     <div>
       <div
@@ -27,8 +16,4 @@
 <script lang="ts" setup>
 import FantasiaMascotImage from 'src/components/FantasiaMascotImage/FantasiaMascotImage.vue'
 
-const toggle = () => {
-  window.faDevToolsControlAPI.toggleDevTools()
-}
-
 </script>