Merge branch 'feat/saas-mantra' into 'dev'

Feat/saas mantra See merge request locker/web!51
lockerpm · Sep 25, 2023 · f440418 · f440418
2 parents 25e3705 + 6cef3f8
commit f440418
Show file tree

Hide file tree

Showing 4 changed files with 91 additions and 3 deletions.
diff --git a/src/renderer/layouts/landing.vue b/src/renderer/layouts/landing.vue
@@ -256,7 +256,7 @@ export default {
 .landing-btn2 {
   @apply hover:no-underline hover:bg-green transition duration-200 ease-in-out text-green hover:text-white font-semibold text-center;
   display: inline-block;
-  padding: 10px 24px;
+  padding: 9px 23px;
   font-size: 16px;
   border-radius: 5px;
   border: 1px solid #268334;

diff --git a/src/renderer/layouts/register.vue b/src/renderer/layouts/register.vue
@@ -208,7 +208,7 @@ export default {
 .landing-btn2 {
   @apply hover:no-underline hover:bg-green transition duration-200 ease-in-out text-green hover:text-white font-semibold text-center;
   display: inline-block;
-  padding: 10px 24px;
+  padding: 9px 23px;
   font-size: 16px;
   border-radius: 5px;
   border: 1px solid #268334;

diff --git a/src/renderer/pages/business/index.vue b/src/renderer/pages/business/index.vue
@@ -28,7 +28,6 @@
               <div>
                 <a
                   class="landing-btn2 w-full sm:w-auto sm:ml-4"
-                  style="padding: 16px 32px"
                   :href="`${enterpriseUrl}/purchase`"
                 >
                   {{ $t('business.welcome.purchase_now') }}

diff --git a/src/renderer/pages/lifetime/saas-mantra.vue b/src/renderer/pages/lifetime/saas-mantra.vue
@@ -0,0 +1,89 @@
+<template>
+  <section class="full-width bg-[#EEF4ED] pb-16 md:pt-16 pt-8 overflow-hidden">
+    <div class="flex flex-row items-start max-w-6xl mx-auto px-6 md:pt-8">
+      <!-- Left -->
+      <div class="w-full md:w-7/12">
+        <!-- Intro -->
+        <div>
+          <h1 class="font-medium text-[48px] leading-[58px] text-primary">
+            Redeem your <br>
+            SaaS Mantra Code for <br>
+          </h1>
+
+          <div class="relative">
+            <div
+              class="bg-primary absolute z-0 w-[100vw] h-full right-0 rounded-full hidden md:block"
+            />
+            <p
+              class="text-primary md:text-white font-medium md:font-bold text-[48px] leading-[58px] z-10 relative"
+            >
+              Locker's Lifetime Package
+            </p>
+          </div>
+
+          <p class="font-semibold text-[20px] mb-4 mt-4">
+            {{
+              $t('lifetime.redeem_page.intro.desc', { service: 'SaaS Mantra' })
+            }}
+          </p>
+          <ol class="list-decimal ml-4 mb-4">
+            <li
+              v-for="(item, index) in $t(
+                'lifetime.redeem_page.intro.instructions'
+              )"
+              :key="index"
+            >
+              {{ item.replaceAll('{service}', 'SaaS Mantra') }}
+            </li>
+          </ol>
+        </div>
+        <!-- Intro end -->
+
+        <!-- Form -->
+        <RedeemForm :countries="countries" service="SaaS Mantra" />
+        <!-- Form end -->
+      </div>
+      <!-- Left end -->
+
+      <!-- Right -->
+      <div class="w-5/12 hidden md:flex relative">
+        <img
+          class="w-[40vw] max-w-[40vw] absolute ml-[5vw] -top-16"
+          src="~/assets/images/landing/lifetime/intro.png"
+        >
+      </div>
+      <!-- Right end -->
+    </div>
+  </section>
+</template>
+
+<script>
+import RedeemForm from '~/components/pages/lifetime/RedeemForm.vue'
+export default {
+  components: { RedeemForm },
+
+  layout: 'lifetime-store',
+
+  asyncData ({ $axios }) {
+    return $axios
+      .$get('/resources/countries')
+      .then(res => {
+        if (typeof res === 'object' && res.length) {
+          return {
+            countries: res
+          }
+        }
+        return {
+          countries: []
+        }
+      })
+      .catch(() => {
+        return {
+          countries: []
+        }
+      })
+  }
+}
+</script>
+
+<style scoped></style>