From 574d800a1268a499b5cdad7947c8e6ba22f6bf59 Mon Sep 17 00:00:00 2001
From: nivedin <nivedinp@gmail.com>
Date: Mon, 4 Dec 2023 23:19:15 +0530
Subject: [PATCH] chore: update properties info banner

---
 .../src/components/collections/Properties.vue | 41 +++++++------------
 1 file changed, 14 insertions(+), 27 deletions(-)

diff --git a/packages/hoppscotch-common/src/components/collections/Properties.vue b/packages/hoppscotch-common/src/components/collections/Properties.vue
index 7384f2074..eebe9910d 100644
--- a/packages/hoppscotch-common/src/components/collections/Properties.vue
+++ b/packages/hoppscotch-common/src/components/collections/Properties.vue
@@ -18,20 +18,13 @@
             :is-collection-property="true"
             @change-tab="changeOptionTab"
           />
-          <AppBanner
-            :banner="{
-              type: 'info',
-              alternateText: 'This is an alternate text',
-            }"
-            class="sticky bottom-0 z-10"
-          >
-            <span>
-              {{ t("helpers.collection_properties_header") }}
-              <a href="hopp.sh" target="_blank" class="underline">{{
-                t("action.learn_more")
-              }}</a>
-            </span>
-          </AppBanner>
+          <div class="bg-info py-2 px-4 flex items-center">
+            <icon-lucide-info class="svg-icons mr-2" />
+            {{ t("helpers.collection_properties_header") }}
+            <a href="hopp.sh" target="_blank" class="underline">{{
+              t("action.learn_more")
+            }}</a>
+          </div>
         </HoppSmartTab>
         <HoppSmartTab
           :id="'authorization'"
@@ -43,19 +36,13 @@
             :is-root-collection="editingProperties?.isRootCollection"
             :inherited-properties="editingProperties?.inheritedProperties"
           />
-          <AppBanner
-            :banner="{
-              type: 'info',
-              alternateText: 'This is an alternate text',
-            }"
-          >
-            <span>
-              {{ t("helpers.collection_properties_authorization") }}
-              <a href="hopp.sh" target="_blank" class="underline">{{
-                t("action.learn_more")
-              }}</a>
-            </span>
-          </AppBanner>
+          <div class="bg-info py-2 px-4 flex items-center">
+            <icon-lucide-info class="svg-icons mr-2" />
+            {{ t("helpers.collection_properties_authorization") }}
+            <a href="hopp.sh" target="_blank" class="underline">{{
+              t("action.learn_more")
+            }}</a>
+          </div>
         </HoppSmartTab>
       </HoppSmartTabs>
     </template>