@ozdao/prometheus-framework 0.2.48 → 0.2.50

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

@@ -0,0 +1,69 @@
+<template>
+  <section id="about" class="section">
+
+    <div class="cols-2-golden-ration bg-white radius-big flex-nowrap">
+      <!-- Left col -->
+      <div class="pd-big text-about flex-v-center flex col">
+        <h3 class="mn-b-medium">{{t('title')}}</h3>
+        <p class="mn-b-big">{{t('description')}}</p>
+      </div>
+      <!-- Right col -->
+      <div class="brand-photocol col">
+         <video class="video" autoplay playsinline muted loop preload > 
+          <source src="@/assets/videos/hotel.webm">
+        </video>
+      </div>
+    </div>
+  </section>
+</template>
+
+
+<script setup>
+  import { computed, onMounted, reactive, toRefs } from 'vue'
+  
+  import { useRoute,useRouter } from 'vue-router'
+  import { useI18n } from 'vue-i18n'
+ 
+  const route = useRoute()
+  const router = useRouter()
+    
+  const text = {
+    messages: {
+      en: {
+        title:  "CANNABIS FRIENDLY HOTEL IN PHUKET 🌿😌",
+        description:  "We invite you to enjoy the best views of Phuket whilst consuming our superior quality products which are conveniently located at our on-site dispensary.  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. Whether you’re a seasoned veteran or completely new to the scene, our team of friendly experts is available to assist you in selecting the perfect strain for the occasion.", 
+        calltoaction: "Like it?  Check out Airbnb and start your mary jane adventure ✈️",
+        button: "Read more"
+      },
+      ru: {
+        title:  "КАННАБИС ФРЕНДЛИ ОТЕЛЬ НА ПХУКЕТЕ 🌿😌",
+        description:  "Расположенный в центре Раваи, вы можете наслаждаться потрясающим 360-градусным видом на Пхукет, куря убийственную травку на крыше Fingan House. Приходите полюбоваться удивительными закатами в 18:00 или увидеть ночные огни Пхукета во всей красе после захода солнца. Купите немного каннабиса и наслаждайтесь видами — это действительно так просто! Не умеете крутить? Не беспокойтесь — у Фингана есть помощник, который может бесплатно скрутить для вас косяк.", 
+        calltoaction: "Нравится? Загляните на Airbnb и начните свое травяное приключение ✈️",
+        button: "Узнать больше"
+      }
+    }
+  }
+
+  const { t } = useI18n(text)
+</script>
+
+<style lang="scss">
+#about {
+
+  .brand-photocol {
+    object-fit: cover;
+    min-height: 24rem;
+    height: 100%;
+    
+    video {
+      position: absolute;
+      left: 0;
+      right: 0;
+      object-fit: cover;
+      width: 100%;
+      min-height: 100%;
+    }
+  }
+}
+
+</style>

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

@@ -0,0 +1,90 @@
+<template>
+	<section class="pd-big">
+		<header class="mn-b-big t-center">
+			<h2 class="mn-center text-fade-in"><span class="text-splitted">Example of the Signals</span></h2> 
+		</header>
+		<div class="cols-4 gap-medium">
+        <img  v-for="(signal,index)  in signals"   class="signal" :src="/images/examples/' + signal">
+		</div>
+	</section>
+</template>
+
+<script setup>
+/////////////////////////////
+// COMPONENT DEPENDENCIES
+/////////////////////////////
+// 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',
+  '02.png',
+  '03.png',
+  '04.png',
+]
+
+/////////////////////////////
+// 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>
+
+<style lang="scss">
+</style>

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

@@ -0,0 +1,80 @@
+<template>
+  <section  class="cols-2-golden-ration pd-thin gap-thin">
+      <div id="feature" class="cols-2">
+
+        <div class="col">
+          <h2 class="h1" v-html="t('title')"></h2>
+        </div>
+
+       
+      </div>
+
+      <ul class="cols-2 gap-thin">      
+        <li class="pd-medium bg-grey radius-big p-big t-semi">{{t('friendly')}}</li>
+        <li class="pd-medium bg-grey radius-big p-big t-semi">{{t('fast')}}</li>
+        <li class="pd-medium bg-grey radius-big p-big t-semi">{{t('reasonable')}}</li>
+        <li class="pd-medium bg-grey radius-big p-big t-semi">{{t('premium')}}</li>
+        <li class="pd-medium bg-grey radius-big p-big t-semi">{{t('refund')}}</li>
+      </ul>
+
+    </section>
+</template>
+
+
+<script setup>
+  import { useI18n } from 'vue-i18n'
+    
+  const text = {
+    messages: {
+      en: {
+        title: 'Best Quality.<br><b class="t-white">Reasonable Price.</b>',
+        friendly: 'Friendly Service',
+        fast: 'Fast Shipment',
+        reasonable: 'Reasonable Prices',
+        premium: 'Premium Medical Grade',
+        refund: 'Refund Policy'
+      },
+      ru: {
+        title: 'Лучшее качество.<br><b class="t-white">Разумная цена.</b>',
+        subtitle: 'Мы придаем большое значение высокому качеству товаров и удовлетворенности клиентов',
+        friendly: 'Дружелюбный Сервис',
+        fast: 'Быстрая Доставка',
+        reasonable: 'Разумные Цены',
+        premium: 'Лабораторное качество',
+        refund: 'Политика возврата'
+      }
+    }
+  }
+
+  const { t } = useI18n(text)
+</script>
+
+<style lang="scss">
+#feature {
+  background-size: cover;
+  background-position: center center;
+  border-radius: 2rem;
+  padding: 4rem;  
+
+  .col {
+    ul {
+      li {
+        line-height: 1.5;
+        margin-bottom: 1rem;
+        color: white;
+
+
+
+        &:before {
+          content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
+          color: black; /* Change the color */
+          font-weight: bold; /* If you want it to be bold */
+          display: inline-block; /* Needed to add space between the bullet and the text */
+          width: 1em; /* Also needed for space (tweak if needed) */
+          margin-left: -1em; /* Also needed for space (tweak if needed) */
+        }
+      }
+    }
+  }
+}
+</style>

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

@@ -0,0 +1,63 @@
+<template>
+  <section id="gift" class="section">
+
+    <div class="t-center section-1-col">
+      <p class="mn-b-small">
+        Looking for a beautiful and stylish gift?
+      </p>
+      <h3 class="mn-b-medium">
+        Gift Certificate is a simple way to donate money<br><b>and make suprise for someone</b>
+      </h3>
+      
+      <router-link to="/catalog/products/7070249d-c84a-4bb4-bfac-a58b65353209">
+        <button class="button">Buy now</button>
+      </router-link>
+    </div>
+
+  </section>
+</template>
+
+
+<script setup>
+  import { computed, onMounted, reactive, toRefs } from 'vue'
+  
+  import { useRoute,useRouter } from 'vue-router'
+  const route = useRoute()
+  const router = useRouter()
+</script>
+
+<style lang="scss">
+#gift {
+    b {
+      color: #00ff88;
+    }
+
+   .section-1-col {
+    display: block;
+    padding: 10rem 3rem;
+    color: black;
+    border-radius: 2rem;
+    background: #00ff88;
+    background-image: url("@/assets/images/backgrounds/cerificat.jpg");
+    background-repeat: no-repeat;
+    background-size: cover;
+    background-position: center bottom;
+    overflow: hidden;
+    .button {
+      margin: 0 auto;
+      background: white;
+      color: #00ff88;
+      // box-shadow: 0px 10px 24px rgba(0, 0, 0, 0.05);
+      // border: 1px solid #f7f7f7;
+      opacity: 1;
+
+      &:hover {
+         background: #00ff88;
+      color: white;
+      }
+    }
+
+  }
+}
+
+</style>

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

@@ -0,0 +1,74 @@
+<script setup>
+	import { useRouter } from 'vue-router'
+	
+	import { useI18n } from 'vue-i18n'
+
+	const router = useRouter()
+
+	const text = {
+    messages: {
+      en: {
+        HERO: {
+			    TITLE: "Phuket №1 Weed Shop with<br><b class='t-white'>Sameday Delivery</b>",
+			    DESCRIPTION: "Weeder Delivery stocks a wide range of quality CBD & high THC weed strains available for purchase whether you are a local, expat or tourist. We also receive new cannabis strains for our clients to enjoy daily!",
+			    ACTION: "Open Marketplace →",
+			    SUBACTION: "Get Recomendation"
+			  }
+      },
+      ru: {
+	      HERO: {
+			    TITLE: "Лучшая доставка травки<br><b class='t-white'> на Пхукете за 1 час</b>",
+			    DESCRIPTION: "Weeder Delivery предлагает широкий ассортимент качественных сортов с CBD и высоким содержанием THC, доступных для покупки независимо от того, являетесь ли вы местным, эмигрантом или туристом. Мы также ежедневно получаем новые сорта каннабиса для наших клиентов!",
+			    ACTION: "Открыть Маркетплейс →",
+			    SUBACTION: "Получить рекомендацию"
+			  }
+		  }
+  	}
+	}
+
+	const { t } = useI18n(text)
+</script>
+
+
+<template>
+	<div 
+	id="hero" 
+	class="t-center cols-1 flex-center flex section"
+	>
+
+		<div 
+		class="flex-column flex-center flex pd-big radius-medium col"
+		>
+			<h1 
+			class="mn-b-medium" 
+			v-html="t('HERO.TITLE')"
+			></h1>
+
+			<p 
+			class="w-m-60r mn-b-big t-transp p-big" 
+			v-html="t('HERO.DESCRIPTION')"
+			></p>
+
+			<div 
+			class="mobile-w-100 t-white gap-small cols-2"
+			>
+				<button  
+				@click="router.push('/catalog')" 
+				class="w-100 bg-dark t-white button">
+					{{t('HERO.ACTION')}}
+				</button>
+
+				<button 
+				@click="store.commit('toggleBackCall')"
+				class="w-100 bg-light t-dark br-light button">
+					{{t('HERO.SUBACTION')}}
+				</button>
+			</div>
+
+		</div>
+
+	</div>
+</template>
+
+<style lang="scss" scoped>
+</style>

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

@@ -0,0 +1,88 @@
+<template>
+  <section id="howtobuy" class="pd-thin pd-t-big">
+
+    <div class="mn-b-big t-center title">
+      <h2 class="mn-b-small">{{t('title')}}</h2>
+      <p class="t-transp">{{t('subtitle')}}</p>
+    </div>
+
+    <div class="cols-3">
+
+      <div class="cols-2 gap-medium radius-big bg-black t-white pd-medium">
+        <img class="radius-medium w-100 mn-b-medium" src="@/assets/images/howitworks/1.jpg"> 
+        <div>
+        <h3 class="mn-b-medium">{{t('steps.step1.headline')}}</h3>
+        <p class="t-transp">{{t('steps.step1.text')}}</p>
+        </div>
+      </div>
+
+      <div class="cols-2 gap-medium radius-big bg-black t-white pd-medium">
+        <img class="radius-medium  w-100 mn-b-medium" src="@/assets/images/howitworks/2.jpg"> 
+        <div>
+        <h3 class="mn-b-medium">{{t('steps.step2.headline')}}</h3>
+        <p class="t-transp">{{t('steps.step2.text')}}</p>
+        </div>
+      </div>
+
+      <div class="cols-2 gap-medium radius-big bg-black t-white pd-medium">
+        <img class="radius-medium w-100 mn-b-medium" src="@/assets/images/howitworks/3.jpg">
+        <div>
+        <h3 class="mn-b-medium">{{t('steps.step3.headline')}}</h3>
+        <p class="t-transp">{{t('steps.step3.text')}}</p>
+        </div>
+      </div>
+    </div>
+
+  </section>
+</template>
+
+
+<script setup>
+ import { useI18n }    from 'vue-i18n'
+    
+  const text = {
+    messages: {
+      en: {
+        title: 'How It Works 🚚',
+        subtitle: 'Get High THC Cannabis Delivered To Your Home Or Hotel',
+        steps: {
+          step1: {
+            headline: 'Build Your Box',
+            text: 'Select from a diverse choice of strains. Our selection of the highest quality cannabis allows you to enjoy the best possible experience.',
+          },
+          step2: {
+            headline: 'We Pack & Deliver',
+            text: 'Expertly selected, our products are grown organically, indoor to enhance the quality. Our clean and safe delivery process preserves that quality until your arrival at the hotel.',
+          },
+          step3: {
+            headline: 'Enjoy. Love. Repeat.',
+            text: 'When you arrive, everything will be all set. We strive for you to have the best experience at the best price.',
+          },
+        }
+      },
+      ru: {
+        title: 'Процесс Покупки 🚚',
+        subtitle: 'Получите высокачественный каннабис, доставленный до вашего дома или отеля',
+        steps: {
+          step1: {
+            headline: 'Выберите травку и оформите заказ',
+            text: 'Выберите из нашиъ разнообразных сортов. Наш выбор каннабиса высочайшего качества позволит вам получить наилучшие впечатления.',
+          },
+          step2: {
+            headline: 'Мы упакуем заказ и оформим доставку',
+            text: 'Наши продукты, отобранные экспертами, выращиваются органически в помещении для повышения качества. Наш чистый и безопасный процесс доставки сохраняет это качество до вашего прибытия в отель.',
+          },
+          step3: {
+            headline: 'Получите травку. Насладитесь. Повторите шаг 1.',
+            text: 'Когда вы получите товар, все будет готово. Мы стремимся к тому, чтобы вы получили лучший опыт по лучшей цене.',
+          },
+      }
+    }
+  }
+}
+
+const { t } = useI18n(text)
+</script>
+
+<style lang="scss">
+</style>

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

@@ -0,0 +1,131 @@
+<template>
+  <section class="cols-2 gap-thin">
+    <div class="pd-big bg-main radius-big">
+      <h2 class="mn-b-small">{{ t('buyTokenTitle') }}</h2>
+      <p class="mn-b-semi p-big t-transp">{{ t('description') }}</p>
+      <h3 class="mn-b-small">{{ t('purchaseDetailsTitle') }}</h3>
+      <ol class="mn-b-big">
+        <li class="mn-b-small radius-small bg-black-transp-5 pd-small">{{ t('step1') }}</li>
+        <li class="mn-b-small radius-small bg-black-transp-5 pd-small">{{ t('step2') }}</li>
+        <li class="mn-b-small radius-small bg-black-transp-5 pd-small">{{ t('step3') }}</li>
+        <li class="mn-b-small radius-small bg-black-transp-5 pd-small">{{ t('step4') }}</li>
+      </ol>
+     
+    
+        <h4 class="mn-b-small">{{ t('privateRoundTitle') }}</h4>
+
+        {{ t('privateRoundText1') }}
+        <a>hello@weeder.delivery</a>
+        {{ t('privateRoundText2') }}
+    </div>
+
+    <div class="flex-column pd-big flex-nowrap flex h-100 bg-grey radius-big o-hidden coming-soon">
+      <div class="
+        w-100 h-100
+        rainbow
+        flex-v-center flex-h-center
+        flex-column flex 
+        pd-big mn-b-medium
+        radius-big o-hidden"
+      >
+        <img class="mn-b-small" src="/logo/logo-disabled.png">
+        <p class="t-semi uppercase">{{ t('comingSoon') }}</p>
+      </div>
+      <p class="mn-b-small">
+        To add WDT, you need to install MetaMask. Please install it if you haven't already.
+      </p>
+      <ConnectMetamask class="w-100" />
+    </div>
+  </section>
+</template>
+
+<script setup>
+import { useI18n } from 'vue-i18n';
+import ConnectMetamask        from '@/components/elements/ConnectMetamask.vue'
+import ButtonAddWDT        from '@/components/elements/ButtonAddWDT.vue'
+import ButtonSwitchToPolygon        from '@/components/elements/ButtonSwitchToPolygon.vue'
+
+const text = {
+  messages: {
+    en: {
+      howToBuyTitle: 'How To Buy WDT?',
+      description:
+        'Weeder Token is a revolutionary cryptocurrency designed for the cannabis industry. With Weeder Token, you can easily buy, sell and trade cannabis products around the world.',
+      purchaseDetailsTitle: 'Purchasing details:',
+      step1: 'Create a cryptocurrency wallet that supports ERC20 tokens.',
+      step2: 'Buy Ethereum (ETH) or any other supported cryptocurrency.',
+      step3: 'Transfer your ETH or other cryptocurrency to your wallet.',
+      step4: 'Visit our token sale platform (coming soon) and follow the instructions to purchase WDT tokens.',
+      privateRoundTitle: 'Interested in a private round?',
+      privateRoundText1: 'If you want to participate in a private round, please email us at',
+      privateRoundText2: 'and we will get back to you with more information.',
+      buyTokenTitle: 'Buy Weeder Token',
+      comingSoon: 'Here will be UI for exchange WDT',
+    },
+    ru: {
+      howToBuyTitle: 'Как купить WDT?',
+      description:
+        'Weeder Token - это революционная криптовалюта, разработанная для индустрии каннабиса. С Weeder Token вы можете легко покупать, продавать и обменивать продукты каннабиса по всему миру.',
+      purchaseDetailsTitle: 'Процесс покупки:',
+      step1: '1. Создайте криптовалютный кошелек, поддерживающий токены ERC20.',
+      step2: '2. Купите Ethereum (ETH) или другую поддерживаемую криптовалюту.',
+      step3: '3. Переведите свои ETH или другую криптовалюту на свой кошелек.',
+      step4: '4. Посетите нашу платформу продажи токенов (скоро будет доступна) и следуйте инструкциям для покупки токенов WDT.',
+      privateRoundTitle: 'Хотите участвовать в приватном раунде?',
+      privateRoundText1: 'Если вы хотите участвовать в приватном раунде, пожалуйста, напишите нам на почту',
+      privateRoundText2: 'и мы свяжемся с вами с дополнительной информацией.',
+      buyTokenTitle: 'Купить Weeder Token',
+      comingSoon: 'Здесь будет интерфейс для обмена WDT',
+    },
+  }
+}
+
+const { t } = useI18n(text);
+</script>
+
+<style lang="scss" scoped>
+.weeder-token {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  padding: 20px;
+  max-width: 800px;
+  margin: auto;
+}
+
+.content {
+  flex: 1;
+  margin-right: 20px;
+}
+
+.purchase-form {
+  flex: 1;
+}
+
+.rainbow {
+  position: relative;
+  z-index: 0;
+  padding: 2rem;
+  
+  &::before {
+    content: '';
+    position: absolute;
+    z-index: -2;
+    left: -50%;
+    top: -50%;
+    width: 200%;
+    height: 200%;
+    background-color: #399953;
+    background-repeat: no-repeat;
+    background-size: 50% 50%, 50% 50%;
+    background-position: 0 0, 100% 0, 100% 100%, 0 100%;
+      background-image: 
+        linear-gradient(#00ff88, #fff), 
+        linear-gradient(#00ff88, #fff), 
+        linear-gradient(white, white), 
+         linear-gradient(white, #fff);
+    animation: rotate 4s linear infinite;
+  }
+}
+
+</style>