update

src/layouts/MainLayout.vue

@@ -20,7 +20,11 @@
           ref="headerContainer"
           class="flex justify-between no-wrap items-center"
           >
-          <base-logo ref="logo" class="text-h6" />
+          <base-logo
+            ref="logo"
+            class="text-h5"
+            :text-color="isHeroScroll ? 'white' : 'primary'"
+          />
           <div
             ref="menuContainer"
             class="row items-center q-ml-md no-wrap"
@@ -115,8 +119,16 @@
           id="hero_banner"
         />
         <problem-section id="problems"/>
-        <how-works-section id="how_works" />
-        <price-section id="price" />
+        <how-works-section
+          id="how_works"
+          @update:tabs-no-caps="val => tab1 = val"
+          :useTabsNoCaps
+        />
+        <price-section
+          id="price"
+          @update:tabs-no-caps="val => tab2 = val"
+          :useTabsNoCaps
+        />
         <faq-section id="FAQ" />
         <footer-section id="contacts" />
       </q-page>
@@ -125,7 +137,7 @@
 </template>
 
 <script setup>
- import { ref, onMounted, nextTick } from 'vue'
+ import { ref, onMounted, nextTick, watch } from 'vue'
   import { useRoute } from 'vue-router'
   import { scroll } from 'quasar'
   import { useI18n } from 'vue-i18n'
@@ -259,6 +271,12 @@
       }, 450)
     }
   })
+
+  const useTabsNoCaps = ref(false)
+  const tab1 = ref(false)
+  const tab2 = ref(false)
+
+  watch([tab1, tab2], () => useTabsNoCaps.value = tab1.value || tab2.value)
 </script>
 
 <style scoped>