feat: feedback issues

Kolektivo-Labs · Feb 1, 2024 · d35df97 · d35df97
1 parent eb13a4b
commit d35df97
Show file tree

Hide file tree

Showing 9 changed files with 48 additions and 24 deletions.
diff --git a/src/components/_global/BalBtn/BalBtn.vue b/src/components/_global/BalBtn/BalBtn.vue
@@ -22,8 +22,6 @@ import {
   hoverTo,
   loadingBackground,
   loadingDarkBackground,
-  loadingFrom,
-  loadingTo,
   text,
 } from 'button-options';
 
@@ -119,9 +117,9 @@ const bgGradientClasses = computed(() => {
     return `bg-complementary-b dark:complementary-b text-white `;
   }
   if (props.loading) {
-    return `bg-gradient-to-tr ${loadingFrom(fromColor)} ${loadingTo(toColor)}`;
+    return 'transition-colors button-gradient';
   }
-  if (props.color === 'gradient') return 'transition-colors button-gradient ';
+  if (props.color === 'gradient') return 'transition-colors button-gradient';
 
   return ` bg-gradient-to-tr ${gradientFrom(fromColor)} ${gradientTo(
     toColor

diff --git a/src/components/_global/BalModal/BalModal.vue b/src/components/_global/BalModal/BalModal.vue
@@ -81,7 +81,7 @@ defineExpose({ hide });
             shadow="lg"
             :noPad="noPad"
             :noContentPad="noContentPad"
-            class="bg-refi-gray modal-card"
+            class="dark:bg-refi-gray modal-card"
             noBorder
             overflowYScroll
           >

diff --git a/src/components/contextual/pages/dashboard/Cards/RefiProfileCard.vue b/src/components/contextual/pages/dashboard/Cards/RefiProfileCard.vue
@@ -31,7 +31,6 @@ const hasNFT = computed(
 
 const isAbleToUpgradeNFT = computed(() => NFTData?.value?.isAbleToUpgrade[0]);
 
-
 const isImageLoaded = ref<boolean>(false);
 const isOpenUpgradeNFTModal = ref(false);
 const isOpenMintNFTModal = ref(false);
@@ -95,7 +94,12 @@ function handleMintNFTClose() {
             </h3>
             <div class="flex justify-between items-center text-base">
               <p>Voting Power</p>
-              <p v-if="NFTData">{{ NFTData.attributes[1].value }} Votes</p>
+              <p v-if="NFTData">
+                {{ NFTData.attributes[1].value }}
+                {{
+                  parseInt(NFTData.attributes[1].value) === 1 ? 'vote' : 'votes'
+                }}
+              </p>
               <p v-else>- Votes</p>
             </div>
           </div>
@@ -163,7 +167,12 @@ function handleMintNFTClose() {
             </h3>
             <div class="flex justify-between items-center text-base">
               <p>Voting Power</p>
-              <p v-if="NFTData">{{ NFTData.attributes[1].value }} Votes</p>
+              <p v-if="NFTData">
+                {{ NFTData.attributes[1].value }}
+                {{
+                  parseInt(NFTData.attributes[1].value) === 1 ? 'vote' : 'votes'
+                }}
+              </p>
               <p v-else>- Votes</p>
             </div>
           </div>
@@ -234,7 +243,12 @@ function handleMintNFTClose() {
             <h3 v-else class="self-start text-lg">Mint NFT</h3>
             <div class="flex justify-between items-center text-base">
               <p>Voting Power</p>
-              <p v-if="NFTData">{{ NFTData.attributes[1].value }} Votes</p>
+              <p v-if="NFTData">
+                {{ NFTData.attributes[1].value }}
+                {{
+                  parseInt(NFTData.attributes[1].value) === 1 ? 'vote' : 'votes'
+                }}
+              </p>
               <p v-else>- Votes</p>
             </div>
           </div>

diff --git a/src/components/contextual/pages/dashboard/Modals/MintNFTModal.vue b/src/components/contextual/pages/dashboard/Modals/MintNFTModal.vue
@@ -27,10 +27,11 @@ function onImageLoad() {
   <BalModal
     :class="isImageLoaded ? 'visible' : 'invisible'"
     :show="isOpenModal"
+    customBgColor="bg-refi-gray"
     :fireworks="true"
     @close="handleCloseModal"
   >
-    <div class="flex flex-col gap-4 justify-center items-center">
+    <div class="flex flex-col gap-4 justify-center items-center text-white">
       <div class="flex flex-col gap-2 justify-center items-center w-full">
         <p>Here is your new NFT</p>
       </div>

diff --git a/src/components/contextual/pages/dashboard/Modals/UpgradeNFTModal.vue b/src/components/contextual/pages/dashboard/Modals/UpgradeNFTModal.vue
@@ -26,6 +26,7 @@ function onImageLoad() {
   <BalModal
     :class="isImageLoaded ? 'visible' : 'invisible'"
     :show="isOpenModal"
+    customBgColor="bg-refi-gray"
     :fireworks="true"
     @close="handleCloseModal"
   >

diff --git a/src/components/footer/Footer.vue b/src/components/footer/Footer.vue
@@ -84,7 +84,7 @@ const { openNpsModal } = useAppzi();
               {{ $t('docs') }}
             </BalLink>
             <BalLink
-              :href="EXTERNAL_LINKS.RegenerativeFI.Docs"
+              :href="EXTERNAL_LINKS.RegenerativeFI.Support"
               external
               noStyle
               class="group link link--external"

diff --git a/src/components/heros/HomePageHero.vue b/src/components/heros/HomePageHero.vue
@@ -21,7 +21,7 @@ defineProps<Props>();
         <div class="flex flex-col gap-4">
           <div class="flex flex-row gap-4 justify-center items-center">
             <div
-              class="py-2 px-3 w-full rounded-md border dark:border-gray-900 shadow-xl"
+              class="py-2 px-3 w-full rounded-md border dark:border-gray-900 card-shadow"
             >
               <h4
                 v-if="isPoolsVolumesLoading"
@@ -34,7 +34,7 @@ defineProps<Props>();
               </h4>
             </div>
             <div
-              class="py-2 px-3 w-full rounded-md border dark:border-gray-900 shadow-xl"
+              class="py-2 px-3 w-full rounded-md border dark:border-gray-900 card-shadow"
             >
               <h4
                 v-if="isPoolsVolumesLoading"
@@ -47,7 +47,7 @@ defineProps<Props>();
               </h4>
             </div>
           </div>
-          <p>
+          <p class="text-sm font-normal text-complementary">
             There are currently {{ tokensAmount }} tokens listed.
             <a class="underline underline-offset-2" href="#">View all tokens</a>
             or
@@ -59,15 +59,25 @@ defineProps<Props>();
       </BalCard>
       <BalCard growContent>
         <div class="flex flex-col justify-between items-start w-full h-full">
-          <h4>How pools function</h4>
-          <p>
+          <h4 class="text-base font-medium">How pools function</h4>
+          <p class="text-sm font-normal text-complementary">
             Liquidity Providers add It is a long established fact that a reader
             will be distracted by the readable content of a page when looking at
             its layout. The point of using Lorem Ipsum is that it has.
           </p>
-          <a class="underline underline-offset-2" href="#">Learn more</a>
+          <a
+            class="text-sm font-normal text-complementary underline underline-offset-2"
+            href="#"
+            >Learn more</a
+          >
         </div>
       </BalCard>
     </div>
   </div>
 </template>
+
+<style scoped>
+.card-shadow {
+  box-shadow: 1px 2px 6px 0 #00000024;
+}
+</style>
diff --git a/src/components/navs/AppNav/DesktopLinks/DesktopLinks.vue b/src/components/navs/AppNav/DesktopLinks/DesktopLinks.vue
@@ -30,8 +30,8 @@ function isActive(page: string): boolean {
       {{ $t('swap') }}
     </DesktopLinkItem>
     <DesktopLinkItem
-      :to="{ name: 'home', params: { networkSlug } }"
-      :active="isActive('home')"
+      :to="{ name: 'pools', params: { networkSlug } }"
+      :active="isActive('pools')"
       prefetch
       @click="trackGoal(Goals.ClickNavPools)"
     >

diff --git a/src/plugins/router/index.ts b/src/plugins/router/index.ts
@@ -7,7 +7,7 @@ const ClaimPage = () => import('@/pages/claim/index.vue');
 const LegacyClaimPage = () => import('@/pages/claim/legacy.vue');
 const CookiesPolicyPage = () => import('@/pages/cookies-policy.vue');
 const GetVeBalPage = () => import('@/pages/get-vebal.vue');
-const HomePage = () => import('@/pages/index.vue');
+const PoolsPage = () => import('@/pages/index.vue');
 const PoolPage = () =>
   import(/* webpackPrefetch: true */ '@/pages/pool/_id.vue');
 const CreatePoolPage = () => import('@/pages/pool/create.vue');
@@ -44,9 +44,9 @@ declare module 'vue-router' {
 
 const routes: RouteRecordRaw[] = [
   {
-    path: '/',
-    name: 'home',
-    component: HomePage,
+    path: '/pools',
+    name: 'pools',
+    component: PoolsPage,
   },
   {
     path: '/terms-of-use',
@@ -176,7 +176,7 @@ const routes: RouteRecordRaw[] = [
   {
     path: '/:networkSlug?',
     name: 'home',
-    component: HomePage,
+    component: SwapPage,
     beforeEnter: (to, from, next) => {
       /*
         - Correct urls: