From 1091f7d549584e77ea1510238a766d2ead2c2562 Mon Sep 17 00:00:00 2001
From: samaradel <samar@incubaid.com>
Date: Sun, 5 Sep 2021 12:50:33 +0200
Subject: [PATCH] Fix external links

---
 src/components/custom/VideoPanel.vue          |  29 ++-
 .../custom/sections/CallToAction.vue          | 197 +++++++++++++-----
 src/components/custom/sections/Features.vue   | 148 +++++++++++--
 .../sections/cta-sections/StateMap.vue        |  86 ++++++--
 4 files changed, 378 insertions(+), 82 deletions(-)

diff --git a/src/components/custom/VideoPanel.vue b/src/components/custom/VideoPanel.vue
index 3bd13e828..72bb233da 100644
--- a/src/components/custom/VideoPanel.vue
+++ b/src/components/custom/VideoPanel.vue
@@ -21,7 +21,8 @@
         </h2>
         <div class="mt-2 text-gray-700" v-html="card.content"></div>
         <div class="mx-auto mt-4 mb-6" v-if="card.btn">
-          <g-link
+          <a
+            v-if="card.link.includes('http')"
             class="
               inline-block
               bg-blue-900
@@ -33,13 +34,33 @@
               py-2
               mr-5
               mb-4
-              rounded
               shadow
               rounded-full
             "
-            :to="card.link"
+            :href="card.link"
+            target="_blank"
             >{{ card.btn }}
-          </g-link>
+          </a>
+
+          <a
+            v-else
+            class="
+              inline-block
+              bg-blue-900
+              text-sm
+              learn-button
+              hover:bg-blue-800
+              text-gray-100
+              px-12
+              py-2
+              mr-5
+              mb-4
+              shadow
+              rounded-full
+            "
+            :href="card.link"
+            >{{ card.btn }}
+          </a>
         </div>
       </div>
     </div>
diff --git a/src/components/custom/sections/CallToAction.vue b/src/components/custom/sections/CallToAction.vue
index 7c40e2400..8fe42c6a7 100644
--- a/src/components/custom/sections/CallToAction.vue
+++ b/src/components/custom/sections/CallToAction.vue
@@ -135,7 +135,6 @@
             py-2
             mr-5
             mb-4
-            rounded
             shadow
             rounded-full
           "
@@ -154,16 +153,15 @@
           py-2
           mr-5
           mb-4
-          rounded
           shadow
           rounded-full
         "
         target="_blank"
-        v-if="cta.button"
+        v-if="cta.button && cta.link.includes('http')"
         :href="cta.link"
         >{{ cta.button }}</a
       >
-      <g-link
+      <a
         class="
           inline-block
           bg-blue-900
@@ -175,15 +173,14 @@
           py-2
           mr-5
           mb-4
-          rounded
           shadow
           rounded-full
         "
-        v-if="cta.button2"
-        :to="cta.link2"
-        >{{ cta.button2 }}</g-link
+        v-else
+        :href="cta.link"
+        >{{ cta.button }}</a
       >
-      <g-link
+      <a
         class="
           inline-block
           bg-blue-900
@@ -195,16 +192,15 @@
           py-2
           mr-5
           mb-4
-          rounded
           shadow
           rounded-full
         "
-        v-if="cta.button3"
-        :to="cta.link3"
-        >{{ cta.button3 }}</g-link
+        target="_blank"
+        v-if="cta.button2 && cta.link2.includes('http')"
+        :href="cta.link2"
+        >{{ cta.button2 }}</a
       >
-
-      <g-link
+      <a
         class="
           inline-block
           bg-blue-900
@@ -216,62 +212,161 @@
           py-2
           mr-5
           mb-4
-          rounded
           shadow
           rounded-full
         "
-        v-if="cta.button4"
-        :to="cta.link4"
-        >{{ cta.button4 }}</g-link
+        v-else
+        :href="cta.link2"
+        >{{ cta.button2 }}</a
+      >
+      <a
+        class="
+          inline-block
+          bg-blue-900
+          text-sm
+          learn-button
+          hover:bg-blue-800
+          text-gray-100
+          px-12
+          py-2
+          mr-5
+          mb-4
+          shadow
+          rounded-full
+        "
+        target="_blank"
+        v-if="cta.button3 && cta.link3.includes('http')"
+        :href="cta.link3"
+        >{{ cta.button3 }}</a
+      >
+      <a
+        class="
+          inline-block
+          bg-blue-900
+          text-sm
+          learn-button
+          hover:bg-blue-800
+          text-gray-100
+          px-12
+          py-2
+          mr-5
+          mb-4
+          shadow
+          rounded-full
+        "
+        v-else
+        :href="cta.link3"
+        >{{ cta.button3 }}</a
+      >
+      <a
+        class="
+          inline-block
+          bg-blue-900
+          text-sm
+          learn-button
+          hover:bg-blue-800
+          text-gray-100
+          px-12
+          py-2
+          mr-5
+          mb-4
+          shadow
+          rounded-full
+        "
+        target="_blank"
+        v-if="cta.button4 && cta.link4.includes('http')"
+        :href="cta.link4"
+        >{{ cta.button4 }}</a
+      >
+      <a
+        class="
+          inline-block
+          bg-blue-900
+          text-sm
+          learn-button
+          hover:bg-blue-800
+          text-gray-100
+          px-12
+          py-2
+          mr-5
+          mb-4
+          shadow
+          rounded-full
+        "
+        v-else
+        :href="cta.link4"
+        >{{ cta.button4 }}</a
       >
     </div>
 
     <!-- tft -->
-    <div class="w-full lg:max-w-4xl mx-auto lg:mt-20 lg:px-16 lg:py-10 tft_section" v-else-if="id == 'tft'">
+    <div
+      class="w-full lg:max-w-4xl mx-auto lg:mt-20 lg:px-16 lg:py-10 tft_section"
+      v-else-if="id == 'tft'"
+    >
       <h2
         v-if="cta.title"
-        class="lg:max-w-lg text-8xl mb-6 mt-20 leading-none font-heading mx-auto"
+        class="
+          lg:max-w-lg
+          text-8xl
+          mb-6
+          mt-20
+          leading-none
+          font-heading
+          mx-auto
+        "
       >
         {{ cta.title }}
       </h2>
-      <div v-html="cta.content" class="mt-6 mb-8 text-2xl leading-tight tracking-wide tft_subtitle text-gray-800"></div>
+      <div
+        v-html="cta.content"
+        class="
+          mt-6
+          mb-8
+          text-2xl
+          leading-tight
+          tracking-wide
+          tft_subtitle
+          text-gray-800
+        "
+      ></div>
       <div class="mt-8 tracking-wide leading-loose" v-if="cta.video_button">
         <a
           @click="toggleModal"
-           class="
-              inline-block
-              bg-gray-900
-              text-2xl
-              learn-button
-              hover:bg-gray-800
-              text-gray-100
-              px-16
-              py-1
-              mb-4
-              shadow
-              rounded-full
-              tft_subtitle
-              tracking-wide
-            "
+          class="
+            inline-block
+            bg-gray-900
+            text-2xl
+            learn-button
+            hover:bg-gray-800
+            text-gray-100
+            px-16
+            py-1
+            mb-4
+            shadow
+            rounded-full
+            tft_subtitle
+            tracking-wide
+          "
           >{{ cta.video_button }}</a
         >
       </div>
       <a
         class="
-              inline-block
-              bg-gray-900
-              text-2xl
-              learn-button
-              hover:bg-gray-800
-              text-gray-100
-              px-16
-              py-1
-              mb-4
-              shadow
-              rounded-full
-              tft_subtitle
-              tracking-wide
-            "
+          inline-block
+          bg-gray-900
+          text-2xl
+          learn-button
+          hover:bg-gray-800
+          text-gray-100
+          px-16
+          py-1
+          mb-4
+          shadow
+          rounded-full
+          tft_subtitle
+          tracking-wide
+        "
         target="_blank"
         v-if="cta.button"
         :href="cta.link"
diff --git a/src/components/custom/sections/Features.vue b/src/components/custom/sections/Features.vue
index 8cd476288..a2e8e8841 100644
--- a/src/components/custom/sections/Features.vue
+++ b/src/components/custom/sections/Features.vue
@@ -30,21 +30,128 @@
       </div>
     </div>
     <div class="mx-auto mt-20" v-if="main.btn">
-      <g-link
-        class="inline-block bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 mb-4 rounded shadow rounded-full"
-        :to="main.link"
+      <a
+        v-if="main.link.includes('http')"
+        class="
+          inline-block
+          bg-blue-900
+          text-sm
+          learn-button
+          hover:bg-blue-800
+          text-gray-100
+          px-12
+          py-2
+          mr-5
+          mb-4
+          shadow
+          rounded-full
+        "
+        :href="main.link"
+        target="_blank"
         >{{ main.btn }}
-      </g-link>
-      <g-link
-        class="inline-block bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 mb-4 rounded shadow rounded-full"
-        :to="main.link2"
-        >{{ main.btn2 }}</g-link
-      >
-      <g-link
-        class="inline-block bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 mb-4 rounded shadow rounded-full"
-        :to="main.link3"
-        >{{ main.btn3 }}</g-link
-      >
+      </a>
+
+      <a
+        v-else
+        class="
+          inline-block
+          bg-blue-900
+          text-sm
+          learn-button
+          hover:bg-blue-800
+          text-gray-100
+          px-12
+          py-2
+          mr-5
+          mb-4
+          shadow
+          rounded-full
+        "
+        :href="main.link"
+        >{{ main.btn }}
+      </a>
+
+      <a
+        v-if="main.link2.includes('http')"
+        class="
+          inline-block
+          bg-blue-900
+          text-sm
+          learn-button
+          hover:bg-blue-800
+          text-gray-100
+          px-12
+          py-2
+          mr-5
+          mb-4
+          shadow
+          rounded-full
+        "
+        :href="main.link2"
+        target="_blank"
+        >{{ main.btn2 }}
+      </a>
+
+      <a
+        v-else
+        class="
+          inline-block
+          bg-blue-900
+          text-sm
+          learn-button
+          hover:bg-blue-800
+          text-gray-100
+          px-12
+          py-2
+          mr-5
+          mb-4
+          shadow
+          rounded-full
+        "
+        :href="main.link2"
+        >{{ main.btn2 }}
+      </a>
+
+      <a
+        v-if="main.link3.includes('http')"
+        class="
+          inline-block
+          bg-blue-900
+          text-sm
+          learn-button
+          hover:bg-blue-800
+          text-gray-100
+          px-12
+          py-2
+          mr-5
+          mb-4
+          shadow
+          rounded-full
+        "
+        :href="main.link3"
+        target="_blank"
+        >{{ main.btn3 }}
+      </a>
+
+      <a
+        v-else
+        class="
+          inline-block
+          bg-blue-900
+          text-sm
+          learn-button
+          hover:bg-blue-800
+          text-gray-100
+          px-12
+          py-2
+          mr-5
+          mb-4
+          shadow
+          rounded-full
+        "
+        :href="main.link3"
+        >{{ main.btn3 }}
+      </a>
       <!-- <div v-html="main.content" class="text-sm text-gray-400 mt-5"></div> -->
     </div>
   </section>
@@ -82,7 +189,18 @@
     </div>
     <div class="text-center" v-if="main.btn">
       <g-link
-        class="bg-gray-900 learn-button hover:bg-gray-700 text-gray-100 px-5 py-3 mr-3 font-semibold rounded shadow"
+        class="
+          bg-gray-900
+          learn-button
+          hover:bg-gray-700
+          text-gray-100
+          px-5
+          py-3
+          mr-3
+          font-semibold
+          rounded
+          shadow
+        "
         :to="main.link"
         >{{ main.btn }}</g-link
       >
diff --git a/src/components/marketing/sections/cta-sections/StateMap.vue b/src/components/marketing/sections/cta-sections/StateMap.vue
index b82a8af11..32bf96e95 100644
--- a/src/components/marketing/sections/cta-sections/StateMap.vue
+++ b/src/components/marketing/sections/cta-sections/StateMap.vue
@@ -67,7 +67,8 @@
           :alt="section.title"
         />
         <div class="mx-auto mt-6">
-          <g-link
+          <a
+            v-if="section.link1.includes('http')"
             class="
               inline-block
               green
@@ -79,14 +80,15 @@
               py-2
               mr-5
               mb-4
-              rounded
               shadow
               rounded-full
             "
-            :to="section.link1"
+            :href="section.link1"
+            target="_blank"
             >{{ section.btn1 }}
-          </g-link>
-          <g-link
+          </a>
+          <a
+            v-else
             class="
               inline-block
               green
@@ -98,14 +100,15 @@
               py-2
               mr-5
               mb-4
-              rounded
               shadow
               rounded-full
             "
-            :to="section.link2"
-            >{{ section.btn2 }}</g-link
+            :href="section.link1"
+            >{{ section.btn1 }}</a
           >
-          <g-link
+
+          <a
+            v-if="section.link2.includes('http')"
             class="
               inline-block
               green
@@ -117,12 +120,71 @@
               py-2
               mr-5
               mb-4
-              rounded
               shadow
               rounded-full
             "
-            :to="section.link3"
-            >{{ section.btn3 }}</g-link
+            :href="section.link2"
+            target="_blank"
+            >{{ section.btn2 }}
+          </a>
+          <a
+            v-else
+            class="
+              inline-block
+              green
+              text-sm
+              learn-button
+              hover:bg-blue-800
+              text-gray-100
+              px-12
+              py-2
+              mr-5
+              mb-4
+              shadow
+              rounded-full
+            "
+            :href="section.link2"
+            >{{ section.btn2 }}</a
+          >
+
+          <a
+            v-if="section.link3.includes('http')"
+            class="
+              inline-block
+              green
+              text-sm
+              learn-button
+              hover:bg-blue-800
+              text-gray-100
+              px-12
+              py-2
+              mr-5
+              mb-4
+              shadow
+              rounded-full
+            "
+            :href="section.link3"
+            target="_blank"
+            >{{ section.btn3 }}
+          </a>
+          <a
+            v-else
+            class="
+              inline-block
+              green
+              text-sm
+              learn-button
+              hover:bg-blue-800
+              text-gray-100
+              px-12
+              py-2
+              mr-5
+              mb-4
+              shadow
+              rounded-full
+            "
+            :href="section.link3"
+            >{{ section.btn3 }}</a
           >
           <!-- <div v-html="main.content" class="text-sm text-gray-400 mt-5"></div> -->
         </div>