@ozdao/prometheus-framework 0.2.92 → 0.2.93

package/src/modules/landing/components/pages/Farming.vue

@@ -0,0 +1,226 @@
+<template>
+	<div class="pd-thin">
+    <SectionHeroVideo class="mn-b-thin h-min-100"/>
+    <SectionFocus class="mn-b-big"/>
+
+      <SectionFeaturesImages 
+        class="mn-b-big"
+        :textData="{
+          messages: {
+            en: {
+              title: 'What We Can Offer??',
+              subtitle: 'WDT – the foundation of the Weeder community. It serves as a currency, a DAO instrument, and for many other purposes:',
+              features: [
+                {
+                  image: '/images/howitworks/step1.png',
+                  title: 'Guidelines and Regulations',
+                  text: 'WDT can be used as a digital currency within the Weeder ecosystem, allowing users to purchase products such as cannabis, advertising spaces, and other premium features on the platform.',
+                },
+                {
+                  image: '/images/howitworks/step2.png',
+                  title: 'Building Services',
+                  text: 'As a DAO (Decentralized Autonomous Organization) instrument, WDT enables community governance and decision-making, allowing token holders to propose, discuss, and vote on various initiatives and developments within the Weeder ecosystem.',
+                },
+                {
+                  image: '/images/howitworks/step3.png',
+                  title: 'Digital and Marketing',
+                  text: 'Holding WDT tokens can provide potential investment returns as the Weeder ecosystem grows and gains value. Additionally, WDT serves for dividend distribution – those who stake their tokens earn income from the platform.'
+                },
+              ]
+            },
+            ru: {
+              title: 'Что такое Weeder Token?',
+              subtitle: 'WDT – основа сообщества Weeder. Он выступает в качестве валюты, инструмента DAO и многих других целей:',
+              features: [
+                {
+                  image: '/images/howitworks/step1.png',
+                  title: 'Валюта',
+                  text: 'WDT можно использовать как цифровую валюту в экосистеме Weeder, позволяя пользователям покупать товары, такие как марихуана, рекламные места и другие премиальные возможности на платформе.',
+                },
+                {
+                  image: '/images/howitworks/step2.png',
+                  title: 'Инструмент',
+                  text: 'В качестве инструмента DAO (Децентрализованной Автономной Организации), WDT позволяет управлять сообществом и принимать решения, давая держателям токенов возможность предлагать, обсуждать и голосовать за различные инициативы и развитие в рамках экосистемы Weeder.',
+                },
+                {
+                  image: '/images/howitworks/step3.png',
+                  title: 'Инвестиции',
+                  text: 'Хранение токенов WDT может обеспечить потенциальный инвестиционный доход по мере роста и увеличения стоимости экосистемы Weeder. Кроме того, WDT служит для распределения дивидендов – те, кто стейкают свои токены, получают доход с платформы.',
+                },
+              ]
+            }
+          }
+        }"
+      />
+    
+    <section class="section">
+      <div class="mn-b-big t-center title">
+        <h2 class="mn-b-small">From Seed To Cash</h2>
+        <p class="w-m-60r mn-b-big mn-auto t-transp p-big">
+          We master all steps of the process and ready to share our experience
+        </p>
+      </div>
+
+    </section>
+
+    <SectionFeature
+      image="/images/farming/1.jpeg"
+      title="Guidelines and Regulations"
+      description="WDT can be used as a digital currency within the Weeder ecosystem, allowing users to purchase products such as cannabis, advertising spaces, and other premium features on the platform."
+      class="mn-b-thin"
+    />
+    <SectionFeature
+      image="/images/farming/3.jpeg"
+      title="Guidelines and Regulations"
+      description="WDT can be used as a digital currency within the Weeder ecosystem, allowing users to purchase products such as cannabis, advertising spaces, and other premium features on the platform."
+      class="mn-b-thin"
+    />
+    <SectionFeature
+      image="/images/farming/4.jpeg"
+      title="Guidelines and Regulations"
+      description="WDT can be used as a digital currency within the Weeder ecosystem, allowing users to purchase products such as cannabis, advertising spaces, and other premium features on the platform."
+      class="mn-b-big"
+    />
+
+    
+    <Examples/>
+
+    <SectionFeatures
+      :textData="{
+        messages: {
+          en: {
+            title: 'How Its Works?',
+            subtitle: 'Earn Weeder Tokens while you get lit on our dank buds. Use them to buy more weed or cash out and spend it on snacks.',
+            features: [{
+              icon: '1',
+              title: 'Join Our Stoned Community',
+              description: 'Find the dankest strains on the market and start your journey to the clouds!',
+            },{
+              icon: '2',
+              title: 'Shop While You are High',
+              description: 'Order our premium bud and accessories with just a few clicks and get them delivered right to your door!',
+            },{
+              icon: '3',
+              title: 'Get Your Share',
+              description: 'As a loyal customer, you earn exclusive Weeder tokens as cashback. Get high and get paid!',
+            }]
+          },
+          ru: {
+            title: 'Как Это Работает?',
+            subtitle: 'Зарабатывайте токены Weeder, когда вы курите наши лучшие сорта травы. Используйте их, чтобы купить еще травы или выведите и купите себе вкусняшки.',
+            features: [{
+              icon: '1',
+              title: 'Присоединяйтесь к нашему сообществу',
+              description: 'Найдите лучшие сорта травы на рынке и начните свой путь к облакам!',
+            },{
+              icon: '2',
+              title: 'Закупатейсь с удобством',
+              description: 'Закажите нашу премиум-траву и аксессуары всего несколькими кликами и получите их доставку прямо к двери!',
+            },{
+              icon: '3',
+              title: 'Получите свою долю от прибыли',
+              description: 'Как лояльный клиент, вы зарабатываете эксклюзивные токены Weeder на свой кошелек в качестве кэшбэка. Курите и зарабатывайте!',
+            }]
+          }
+        }
+      }"
+    />
+		<SectionGuide 
+      :textData="{
+        messages: {
+          en: {
+            title: 'If you still wonder?',
+            FAQ: [{
+              title: 'How does Weeder Token support the Weeder ecosystem?',
+              description: 'Weeder Token (WDT) is a fundamental component of the Weeder ecosystem, ensuring its operation, integration, and development. WDT tokens are used to pay for goods and services, participate in platform governance, and attract investments.'
+            },{
+              title: ' What security measures are in place to protect WDT tokens?',
+              description: 'WDT tokens are protected by modern cryptographic algorithms and blockchain technologies (Polygon Network), ensuring transaction security and asset storage. Users should also use reliable wallets and follow security recommendations for maximum protection of their tokens.'
+            },{
+              title: 'Can I use WDT tokens to pay on other platforms?',
+              description: 'Currently, WDT tokens are primarily used within the Weeder ecosystem. However, their use may be expanded to third-party platforms and services that Weeder collaborates or plans to collaborate with in the future.'
+            },{
+              title: 'What is the role of WDT in governing the Weeder platform?',
+              description: 'Weeder Token allows token holders to actively participate in platform governance. With its help, users can vote on various proposals, initiatives, and developments, influencing the future development of the Weeder ecosystem.'
+            },{
+              title: 'What are the benefits of using WDT for platform users?',
+              description: 'Using Weeder Token provides users with a range of benefits, such as the ability to purchase goods and services on the platform, participate in platform governance, invest in the Weeder ecosystem, and earn income from staking.'
+            },{
+              title: 'What is the perspective for WDT growth and development in the future?',
+              description: 'The growth and development of Weeder Token in the future depend on the success and expansion of the Weeder ecosystem. An increase in user numbers, collaboration with partners, and the implementation of new features and services can significantly increase the value and utility of Weeder Token.'
+            }]
+          },
+          ru: {
+            title: 'У вас еще есть вопросы?',
+            FAQ: [{
+              title: 'Как Weeder Token поддерживает экосистему Weeder?',
+              description: 'Weeder Token (WDT) является основным компонентом экосистемы Weeder, обеспечивая ее функционирование, интеграцию и развитие. Токены WDT используются для оплаты товаров и услуг, участия в управлении платформы и привлечения инвестиций.'
+            },{
+              title: 'Какие меры безопасности применяются для защиты токенов WDT?',
+              description: 'Токены WDT защищены современными криптографическими алгоритмами и технологиями блокчейна, обеспечивающими безопасность транзакций и хранения средств. Пользователи также должны использовать надежные кошельки и следовать рекомендациям по безопасности для максимальной защиты своих токенов.'
+            },{
+              title: 'Могу ли я использовать токены WDT для оплаты на других платформах?',
+              description: 'В настоящее время токены WDT преимущественно используются в рамках экосистемы Weeder. Однако в будущем их использование может быть расширено на сторонние платформы и сервисы, с которыми Weeder сотрудничает или планирует сотрудничать.'
+            },{
+              title: 'Какова роль WDT в управлении платформой Weeder?',
+              description: 'Weeder Token позволяет держателям токенов активно участвовать в управлении платформой. С его помощью пользователи могут голосовать по различным предложениям, инициативам и разработкам, влияя на будущее развитие экосистемы Weeder.'
+            },{
+              title: 'В чем преимущества использования WDT для пользователей платформы?',
+              description: 'Использование Weeder Token предоставляет пользователям ряд преимуществ, таких как возможность покупать товары и услуги на платформе, участвовать в управлении платформой, инвестировать в экосистему Weeder и получать доход от стейкинга.'
+            },{
+              title: 'Какова перспектива развития и роста WDT в будущем?',
+              description: 'Рост и развитие Weeder Token в будущем зависят от успешности и расширения экосистемы Weeder. Увеличение количества пользователей, сотрудничество с партнерами и внедрение новых возможностей и услуг могут существенно повысить спрос к токенам.'
+            }]
+          }
+        }
+      }"
+    />
+  </div>
+</template>
+
+<script setup>
+	import { computed } from 'vue'
+
+  import SectionHeroVideo from '@pf/src/modules/landing/components/sections/SectionHeroVideo.vue'
+  import SectionFocus from '@pf/src/modules/landing/components/sections/SectionFocus.vue'
+
+  import SectionHeroToken from '@pf/src/modules/landing/components/sections/SectionHeroToken.vue'
+
+  import SectionFeature from '@pf/src/modules/landing/components/sections/SectionFeature.vue'
+  import SectionFeatures from '@pf/src/modules/landing/components/sections/SectionFeatures.vue'
+  import SectionFeaturesImages from '@pf/src/modules/landing/components/sections/SectionFeaturesImages.vue'
+
+
+  import SectionGuide from '@pf/src/modules/landing/components/sections/SectionGuide.vue'
+  import SectionRoadmap from '@pf/src/modules/landing/components/sections/SectionRoadmap.vue'
+
+  import HowToBuyWDR           from '@pf/src/modules/landing/components/sections/HowToBuyWDR.vue'
+  import Examples from '@pf/src/modules/landing/components/sections/Examples.vue'
+
+
+	import { useI18n }    from 'vue-i18n'
+
+  const description = {
+    messages: {
+      en: {
+        meta: {
+          title: "Governance – Fin.Kan House is Cannabis friendly hotel in Phuket",
+          description: "At Fingan House, we encourage the exploration of Phuket’s finest cannabis products and are proud to provide a fully stocked bar of our signature product offerings to those looking to enjoy their experience to the fullest.",
+
+        },
+      },
+      ru: {
+        meta: {
+          title: "Управление – Fin.Kan House это каннабис-френдли отель на Пхукете",
+          description: "Приходите полюбоваться удивительными закатами в 18:00 или увидеть ночные огни Пхукета во всей красе после захода солнца. Купите немного каннабиса и наслаждайтесь видами — это действительно так просто!",
+        }
+      }
+    }
+  }
+
+  const { t } = useI18n(description)
+</script>
+
+<style lang="scss">
+
+</style>

package/src/modules/landing/components/pages/Governance.vue

@@ -1,7 +1,7 @@
 <template>
 	<div class="pd-thin">
     <SectionHeroToken class="mn-b-extra h-min-100"/>
-    <WhatIsWDRSection class="mn-b-thin"/>
+    <SectionFeaturesImages class="mn-b-thin"/>
     <SectionFeatures
       :textData="{
         messages: {
@@ -99,7 +99,6 @@
       }"
     />
     <!-- Partials (need to remove) -->
-    <Footer/>
   </div>
 </template>
 
@@ -110,11 +109,10 @@
   import SectionFeatures from '@pf/src/modules/landing/components/sections/SectionFeatures.vue'
   import SectionGuide from '@pf/src/modules/landing/components/sections/SectionGuide.vue'
   import SectionRoadmap from '@pf/src/modules/landing/components/sections/SectionRoadmap.vue'
-
-  import WhatIsWDRSection           from '@pf/src/modules/landing/components/sections/WhatIsWDRSection.vue'
+  import SectionFeaturesImages           from '@pf/src/modules/landing/components/sections/SectionFeaturesImages.vue'
+  
   import HowToBuyWDR           from '@pf/src/modules/landing/components/sections/HowToBuyWDR.vue'
 
-  import Footer from '@pf/src/components/Footer/Footer.vue'
 
 	import { useI18n }    from 'vue-i18n'
 

package/src/modules/landing/components/pages/Home.vue

@@ -16,7 +16,6 @@
 		<!-- <FeatureSection /> -->
 		<!-- <HowItWorksSection  /> -->
 		<!-- <HeroSection /> -->
-		<Footer/>
   </div>
 </template>
 
@@ -41,8 +40,6 @@
 	// import HowItWorksSection  			from '@pf/src/modules/landing/components/sections/HowItWorksSection.vue'
 	import MapSection 			from '@pf/src/modules/landing/components/sections/MapSection.vue'
 
- 	import Footer from '@pf/src/components/Footer/Footer.vue'
-
 
 </script>
 

package/src/modules/landing/components/pages/Hotel.vue

@@ -4,7 +4,6 @@
 		<AboutSection />
 		<SectionGuide />
     <!-- Partials (need to remove) -->
-    <Footer/>
   </div>
 </template>
 
@@ -14,8 +13,7 @@
 	import AboutSection 			from '@pf/src/modules/landing/components/sections/AboutSection.vue'
 	import SectionGuide     from '@pf/src/modules/landing/components/sections/SectionGuide.vue'
 	import MapSection 			from '@pf/src/modules/landing/components/sections/MapSection.vue'
-  import Footer from '@pf/src/components/Footer/Footer.vue'
-
+  
 	import { useI18n }    from 'vue-i18n'
 
 

package/src/modules/landing/components/pages/Page.vue

@@ -44,8 +44,6 @@
 
       </section>  
     </div>
-    <!-- Partials (need to remove) -->
-    <Footer/>
 
   </div>
 </template>
@@ -58,7 +56,6 @@
   import { useI18n }    from 'vue-i18n'
   
   import * as marked from 'marked';
-  import Footer from '@pf/src/components/Footer/Footer.vue'
   
 
   // const renderer = {

package/src/modules/landing/components/sections/Examples.vue

@@ -1,10 +1,10 @@
 <template>
-	<section class="pd-big">
+	<section class="">
 		<header class="mn-b-big t-center">
-			<h2 class="mn-center text-fade-in"><span class="text-splitted">Example of the Signals</span></h2> 
+			<h2 class="mn-center text-fade-in"><span class="text-splitted">Example of the Strains</span></h2> 
 		</header>
-		<div class="cols-4 gap-medium">
-        <img  v-for="(signal,index)  in signals"   class="signal" :src="/images/examples/' + signal">
+		<div class="cols-4 w-100 o-scroll pos-relative gap-medium">
+      <img  v-for="(signal,index)  in signals"   class="radius-big h-max-30r signal" :src="'/images/examples/' + signal">
 		</div>
 	</section>
 </template>
@@ -15,13 +15,9 @@
 /////////////////////////////
 // VUE DEPENDENCIES
 import { onMounted } from 'vue';
-// GSAP DEPENDENCIES
-import { gsap } from "gsap/dist/gsap";
-import { ScrollTrigger } from "gsap/dist/ScrollTrigger";
 /////////////////////////////
 // CREATED
 /////////////////////////////
-gsap.registerPlugin(ScrollTrigger);
 
 let signals = [
   '01.png',
@@ -34,54 +30,6 @@ let signals = [
 // MOUNTED
 /////////////////////////////
 onMounted(() => {
-	gsap.set('.signal', {
-    // maxHeight: 0,
-    force3D:false,
-    opacity: 0,
-    // y: 50,
-  });
-
-  gsap.set('.signal-child ', {
-    opacity: 0,
-    force3D:false,
-    y: 50,
-  }); 
-
- ScrollTrigger.batch('.signal', {
-  onEnter: batch => {
-    batch.forEach((card, index) => {
-      gsap.to(card, {
-        opacity: 1,
-        // maxHeight: 1000, 
-        duration: 1.5,
-        ease: "power2.inOut",
-        y: 0, 
-        stagger: 0.1, 
-        delay: index * 0.3
-      })
-
-      gsap.to(card.children, {
-        opacity: 1, 
-        duration: 1.5,
-        ease: "power2.inOut",
-        y: 0, 
-        stagger: 0.1, 
-        delay: index * 0.3
-      })
-    })
-  },
-  // onLeaveBack: batch => {
-  //   batch.forEach((card, index) => gsap.to(card.children, {
-  //     opacity: 0, 
-  //     duration: 1.5,
-  //     ease: "power2.inOut",
-  //     y: 50, 
-  //     stagger: 0.1, 
-  //     delay: index * 0.3
-  //   }))
-  // },
-  start: "top 70%",
-  });
 })
 
 </script>

package/src/modules/landing/components/sections/SectionFeature.vue

@@ -0,0 +1,41 @@
+<template>
+	<div class="o-hidden bg-grey pos-relative radius-big cols-2">
+		<div style="min-height: 20rem;" :class="{'order-2':order}" class="pos-relative w-100 h-100 bg-grey">
+			<img class="w-100 h-100 object-fit-cover pos-absolute" :src="image">
+		</div>   
+   <div class="pd-big flex-column flex w-100 h-100 gap-zero">
+    	<h2 class="mn-b-medium">
+				{{title}}
+	    </h2>
+	    
+	    <p class="p-big t-transp">
+	    	{{description}}
+	    </p>
+    </div>
+  </div>
+</template>
+
+
+<script setup>
+	import { useI18n } from 'vue-i18n'
+
+	const props = defineProps(['image','title','description','order'])
+
+	const { t } = useI18n({ 
+		messages: {
+		  en:{
+		    "nye2024":{
+		      "title":"Delisious pizza from stone oven",
+		      "description":"Join the hottest Christmas party event at NMS.IO and make your time with family and friends extra special. Enjoy festive on the celebrations with unique surprises and fun activities in NMS.IO!",
+		      "checkinblog":"CHECK IN BLOG"
+		    }
+		  }
+		}
+	})
+</script>
+
+<style lang="scss">
+	.order-2 {
+		order: 2
+	}
+</style>

package/src/modules/landing/components/sections/SectionFeaturesImages.vue

@@ -0,0 +1,122 @@
+<template>
+  <section id="howtobuy" class="section">
+
+    <div class="mn-b-big t-center title">
+      <h2 class="mn-b-small">{{t('title')}}</h2>
+      <p class="w-m-60r mn-b-big mn-auto t-transp p-big">
+        {{t('subtitle')}}
+      </p>
+    </div>
+
+    <div class="cols-3 gap-thin">
+
+      <div 
+        v-for="feature in tm('features')" 
+        :key="feature.title" 
+        class="w-100 pd-medium bg-grey radius-big"
+      >
+        <img 
+          class="radius-medium bg-grey h-max-20r object-fit-cover w-100 mn-b-medium" 
+          :src="feature.image"
+        > 
+        <h3 class="mn-b-medium">{{feature.title}}</h3>
+        <p class="t-transp">{{feature.text}}</p>
+      </div>
+
+    </div>
+
+  </section>
+</template>
+
+
+<script setup>
+import { useI18n }    from 'vue-i18n'
+  
+const props = defineProps({
+    title: String,
+    textData: {
+      type: Object,
+      default: () => ({
+        messages: {
+          en: {
+            title: 'What is Weeder Token?',
+            subtitle: 'WDT – the foundation of the Weeder community. It serves as a currency, a DAO instrument, and for many other purposes:',
+            features: [
+              {
+                image: '/images/howitworks/step1.png',
+                title: 'Currency',
+                text: 'WDT can be used as a digital currency within the Weeder ecosystem, allowing users to purchase products such as cannabis, advertising spaces, and other premium features on the platform.',
+              },
+              {
+                image: '/images/howitworks/step2.png',
+                title: 'Instument',
+                text: 'As a DAO (Decentralized Autonomous Organization) instrument, WDT enables community governance and decision-making, allowing token holders to propose, discuss, and vote on various initiatives and developments within the Weeder ecosystem.',
+              },
+              {
+                image: '/images/howitworks/step3.png',
+                title: 'Invesment',
+                text: 'Holding WDT tokens can provide potential investment returns as the Weeder ecosystem grows and gains value. Additionally, WDT serves for dividend distribution – those who stake their tokens earn income from the platform.'
+              },
+            ]
+          },
+          ru: {
+            title: 'Что такое Weeder Token?',
+            subtitle: 'WDT – основа сообщества Weeder. Он выступает в качестве валюты, инструмента DAO и многих других целей:',
+            features: [
+              {
+                image: '/images/howitworks/step1.png',
+                title: 'Валюта',
+                text: 'WDT можно использовать как цифровую валюту в экосистеме Weeder, позволяя пользователям покупать товары, такие как марихуана, рекламные места и другие премиальные возможности на платформе.',
+              },
+              {
+                image: '/images/howitworks/step2.png',
+                title: 'Инструмент',
+                text: 'В качестве инструмента DAO (Децентрализованной Автономной Организации), WDT позволяет управлять сообществом и принимать решения, давая держателям токенов возможность предлагать, обсуждать и голосовать за различные инициативы и развитие в рамках экосистемы Weeder.',
+              },
+              {
+                image: '/images/howitworks/step3.png',
+                title: 'Инвестиции',
+                text: 'Хранение токенов WDT может обеспечить потенциальный инвестиционный доход по мере роста и увеличения стоимости экосистемы Weeder. Кроме того, WDT служит для распределения дивидендов – те, кто стейкают свои токены, получают доход с платформы.',
+              },
+            ]
+          }
+        }
+      })
+    }
+  })
+  const { t, tm } = useI18n(props.textData)
+</script>
+
+<style lang="scss">
+
+#grid2 {
+  transition: 500ms;
+  display: grid;
+  grid-template-columns: 1fr 1fr 1fr;
+  gap: 3px;
+  background: crimson;
+}
+
+:where(.left, .center, .right) {
+  background: navajowhite;
+  transition: 300ms;
+}
+
+:where(.left, .center, .right):hover {
+  background: crimson;
+}
+
+#grid2:has(.left:hover) {
+  grid-template-columns: 2fr 0.5fr 0.5fr;
+  padding: 3rem;
+}
+
+#grid2:has(.center:hover) {
+  grid-template-columns: 0.5fr 2fr 0.5fr;
+  padding: 3rem;
+}
+#grid2:has(.right:hover) {
+  grid-template-columns: 0.5fr 0.5fr 2fr;
+  padding: 3rem;
+}
+</style>

package/src/modules/landing/components/sections/SectionFocus.vue

@@ -0,0 +1,59 @@
+<template>
+	<section id="our-focus" class="bg-light radius-big pd-big cols-2 flex">
+		
+		<div class="col">
+			
+			<p class="text-fade-in mn-b-medium t-main h4">
+				<span class="text-splitted">Culture of cannabis</span>
+			</p>
+
+			<h2 class="text-fade-in mn-b-medium">
+				<span class="text-splitted">Welcome to Weeder Farms, your trusted partner in cannabis cultivation. </span>
+			</h2> 
+
+			<p class="element-intro display-block p-big">We are a team of professional growers, engineers, programmers, and geneticists. We are dedicated to the growth and development of the cannabis industry, offering our extensive experience and knowledge to help cultivators like you succeed.</p>
+		</div>
+
+		<div class="cols-2 gap-thin col">
+			<div :ref="setItemRef" class="industry card">
+				<h3 class="h1 t-main card-child">10+</h3>
+				<p class="h4 card-child">Farms</p>
+			</div>
+			<div :ref="setItemRef" class="industry card">
+				<h3 class="h1 t-main card-child">40</h3>
+				<p class="h4 card-child">Strains</p>
+			</div>
+			<div :ref="setItemRef" class="industry card">
+				<h3 class="h1 t-main card-child">10KG</h3>
+				<p class="h4 card-child">Monthly</p>
+			</div>
+			<div :ref="setItemRef" class="industry card">
+				<h3 class="h1 t-main card-child">5+</h3>
+				<p class="h4 card-child">Dispansaries</p>
+			</div>
+			<div :ref="setItemRef" class="industry card">
+				<h3 class="h1 t-main card-child">136</h3>
+				<p class="h4 card-child">Tokens</p>
+			</div>
+		</div>
+	</section>
+</template>
+
+
+<script setup>
+import { reactive, computed, toRefs, ref, onMounted,onUpdated,inject } from 'vue';
+
+onMounted(() => {
+
+})
+ 
+</script>
+
+<style scoped lang="scss">
+#our-focus {
+ .industry {
+ 		display: flex;
+    justify-content: flex-end;
+ }
+}
+</style>