From 3bb55c6b5d916fa7d9e7c5faa4428036dba5d353 Mon Sep 17 00:00:00 2001
From: eddie <66155195+just-toby@users.noreply.github.com>
Date: Wed, 27 Sep 2023 10:47:16 -0700
Subject: [PATCH] fix: hide price when no amount input (#7379)

* fix: hide price when no amount input

* fix: snapshots
---
 .../Landing/__snapshots__/index.test.tsx.snap | 998 ++++++++----------
 src/pages/Swap/index.tsx                      |   6 +-
 2 files changed, 444 insertions(+), 560 deletions(-)

diff --git a/src/pages/Landing/__snapshots__/index.test.tsx.snap b/src/pages/Landing/__snapshots__/index.test.tsx.snap
index 0b38ad7a8d..b885567047 100644
--- a/src/pages/Landing/__snapshots__/index.test.tsx.snap
+++ b/src/pages/Landing/__snapshots__/index.test.tsx.snap
@@ -30,7 +30,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   border-radius: 4px;
 }
 
-.c50 {
+.c47 {
   box-sizing: border-box;
   margin: 0;
   min-width: 0;
@@ -71,24 +71,6 @@ exports[`disable nft on landing page does not render nft information and card 1`
   justify-content: flex-start;
 }
 
-.c49 {
-  width: 100%;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  padding: 0;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-box-pack: start;
-  -webkit-justify-content: flex-start;
-  -ms-flex-pack: start;
-  justify-content: flex-start;
-  gap: 8px;
-}
-
 .c9 {
   -webkit-box-pack: justify;
   -webkit-justify-content: space-between;
@@ -110,7 +92,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   color: #7D7D7D;
 }
 
-.c102 {
+.c99 {
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -121,15 +103,15 @@ exports[`disable nft on landing page does not render nft information and card 1`
   font-weight: 500;
 }
 
-.c102:hover {
+.c99:hover {
   opacity: 0.6;
 }
 
-.c102:active {
+.c99:active {
   opacity: 0.4;
 }
 
-.c100 {
+.c97 {
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -140,36 +122,36 @@ exports[`disable nft on landing page does not render nft information and card 1`
   font-weight: 500;
 }
 
-.c100:hover {
+.c97:hover {
   opacity: 0.6;
 }
 
-.c100:active {
+.c97:active {
   opacity: 0.4;
 }
 
-.c93 {
+.c90 {
   height: 32px;
   width: 32px;
   fill: #98A1C0;
   opacity: 1;
 }
 
-.c94 {
+.c91 {
   height: 32px;
   width: 32px;
   fill: #98A1C0;
   opacity: 1;
 }
 
-.c95 {
+.c92 {
   height: 32px;
   width: 32px;
   fill: #98A1C0;
   opacity: 1;
 }
 
-.c87 {
+.c84 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -182,7 +164,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   max-width: 1440px;
 }
 
-.c88 {
+.c85 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -192,24 +174,24 @@ exports[`disable nft on landing page does not render nft information and card 1`
   flex-direction: column;
 }
 
-.c89 {
+.c86 {
   display: none;
 }
 
-.c104 {
+.c101 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
 }
 
-.c90 {
+.c87 {
   width: 72px;
   height: 72px;
   display: none;
 }
 
-.c91 {
+.c88 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -222,20 +204,20 @@ exports[`disable nft on landing page does not render nft information and card 1`
   margin: 20px 0 0 0;
 }
 
-.c92 {
+.c89 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
 }
 
-.c97 {
+.c94 {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 12px;
 }
 
-.c98 {
+.c95 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -248,32 +230,32 @@ exports[`disable nft on landing page does not render nft information and card 1`
   margin: 20px 0 0 0;
 }
 
-.c99 {
+.c96 {
   font-size: 16px;
   line-height: 20px;
   font-weight: 535;
 }
 
-.c103 {
+.c100 {
   font-size: 16px;
   line-height: 20px;
   color: #7D7D7D;
 }
 
-.c101 {
+.c98 {
   font-size: 16px;
   line-height: 20px;
   color: #7D7D7D;
 }
 
-.c96 {
+.c93 {
   font-size: 16px;
   line-height: 20px;
   margin: 1rem 0 0 0;
   color: #CECECE;
 }
 
-.c70 {
+.c67 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -301,11 +283,11 @@ exports[`disable nft on landing page does not render nft information and card 1`
   transition: 250ms ease border;
 }
 
-.c70:hover {
+.c67:hover {
   border: 1px solid #CECECE;
 }
 
-.c76 {
+.c73 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -333,11 +315,11 @@ exports[`disable nft on landing page does not render nft information and card 1`
   transition: 250ms ease border;
 }
 
-.c76:hover {
+.c73:hover {
   border: 1px solid #CECECE;
 }
 
-.c71 {
+.c68 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -352,13 +334,13 @@ exports[`disable nft on landing page does not render nft information and card 1`
   justify-content: space-between;
 }
 
-.c72 {
+.c69 {
   font-size: 20px;
   line-height: 28px;
   font-weight: 535;
 }
 
-.c73 {
+.c70 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -373,7 +355,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   max-width: 480px;
 }
 
-.c77 {
+.c74 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -388,7 +370,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   max-width: 480px;
 }
 
-.c74 {
+.c71 {
   color: #FC72FF;
   font-weight: 535;
   margin: 24px 0 0;
@@ -397,18 +379,18 @@ exports[`disable nft on landing page does not render nft information and card 1`
   transition: 250ms ease opacity;
 }
 
-.c74:hover {
+.c71:hover {
   opacity: 0.6;
 }
 
-.c78 {
+.c75 {
   min-width: 20px;
   min-height: 20px;
   max-height: 48px;
   max-width: 48px;
 }
 
-.c53 {
+.c50 {
   background-color: transparent;
   bottom: 0;
   border-radius: inherit;
@@ -479,7 +461,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   text-decoration: none;
 }
 
-.c84 {
+.c81 {
   padding: 16px;
   width: 200px;
   line-height: 24px;
@@ -518,58 +500,58 @@ exports[`disable nft on landing page does not render nft information and card 1`
   transform: perspective(1px) translateZ(0);
 }
 
-.c84:disabled {
+.c81:disabled {
   opacity: 50%;
   cursor: auto;
   pointer-events: none;
 }
 
-.c84 > * {
+.c81 > * {
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
 }
 
-.c84 > a {
+.c81 > a {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.c51 {
+.c48 {
   background-color: #FFEFFF;
   color: #FC72FF;
   font-size: 20px;
   font-weight: 535;
 }
 
-.c51:focus {
+.c48:focus {
   box-shadow: 0 0 0 1pt #FFEFFF;
   background-color: #FFEFFF;
 }
 
-.c51:hover {
+.c48:hover {
   background-color: #FFEFFF;
 }
 
-.c51:active {
+.c48:active {
   box-shadow: 0 0 0 1pt #FFEFFF;
   background-color: #FFEFFF;
 }
 
-.c51:hover .c52 {
+.c48:hover .c49 {
   background-color: #98A1C014;
 }
 
-.c51:active .c52 {
+.c48:active .c49 {
   background-color: #B8C0DC3d;
 }
 
-.c51:disabled {
+.c48:disabled {
   opacity: 0.4;
 }
 
-.c51:disabled:hover {
+.c48:disabled:hover {
   cursor: auto;
   background-color: transparent;
   box-shadow: none;
@@ -593,7 +575,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   background-color: #e0e0e0;
 }
 
-.c85 {
+.c82 {
   background-color: transparent;
   color: #FC72FF;
   display: -webkit-box;
@@ -610,22 +592,22 @@ exports[`disable nft on landing page does not render nft information and card 1`
   align-items: center;
 }
 
-.c85:focus {
+.c82:focus {
   -webkit-text-decoration: underline;
   text-decoration: underline;
 }
 
-.c85:hover {
+.c82:hover {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.c85:active {
+.c82:active {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.c85:disabled {
+.c82:disabled {
   opacity: 50%;
   cursor: auto;
 }
@@ -659,7 +641,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   cursor: auto;
 }
 
-.c79 {
+.c76 {
   height: 340px;
   width: 100%;
   border-radius: 32px;
@@ -685,7 +667,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   background: url(Mesh.png),linear-gradient(93.06deg,#FF00C7 2.66%,#FF9FFB 98.99%);
 }
 
-.c80 {
+.c77 {
   color: white;
   display: -webkit-box;
   display: -webkit-flex;
@@ -699,20 +681,20 @@ exports[`disable nft on landing page does not render nft information and card 1`
   flex-direction: column;
 }
 
-.c81 {
+.c78 {
   font-weight: 535;
   font-size: 28px;
   line-height: 36px;
 }
 
-.c82 {
+.c79 {
   margin: 10px 10px 0 0;
   font-weight: 535;
   font-size: 16px;
   line-height: 20px;
 }
 
-.c83 {
+.c80 {
   width: 100%;
   display: -webkit-box;
   display: -webkit-flex;
@@ -726,16 +708,16 @@ exports[`disable nft on landing page does not render nft information and card 1`
   transition: 250ms ease opacity;
 }
 
-.c83:hover {
+.c80:hover {
   opacity: 0.6;
 }
 
-.c86 {
+.c83 {
   color: white;
   border: 1px solid white;
 }
 
-.c45 {
+.c43 {
   display: grid;
   grid-auto-rows: auto;
   grid-row-gap: 4px;
@@ -749,21 +731,6 @@ exports[`disable nft on landing page does not render nft information and card 1`
   transition: opacity 250ms ease-in-out;
 }
 
-.c41 {
-  border-radius: 12px;
-  border-radius: 12px;
-  height: 24px;
-  width: 50%;
-  width: 50%;
-  -webkit-animation: fAQEyV 1.5s infinite;
-  animation: fAQEyV 1.5s infinite;
-  -webkit-animation-fill-mode: both;
-  animation-fill-mode: both;
-  background: linear-gradient( to left, #22222212 25%, rgba(53,53,53,0.07) 50%, #22222212 75% );
-  will-change: background-position;
-  background-size: 400%;
-}
-
 .c14 {
   display: inline-block;
   height: inherit;
@@ -846,12 +813,6 @@ exports[`disable nft on landing page does not render nft information and card 1`
   color: #CECECE;
 }
 
-.c42 {
-  border-radius: 4px;
-  width: 4rem;
-  height: 1rem;
-}
-
 .c24 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -932,7 +893,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   background-color: #B8C0DC3d;
 }
 
-.c47 {
+.c45 {
   -webkit-align-items: center;
   -webkit-box-align: center;
   -ms-flex-align: center;
@@ -965,12 +926,12 @@ exports[`disable nft on landing page does not render nft information and card 1`
   animation: none;
 }
 
-.c47:hover,
-.c47:active {
+.c45:hover,
+.c45:active {
   background-color: #FC72FF;
 }
 
-.c47:before {
+.c45:before {
   background-size: 100%;
   border-radius: inherit;
   position: absolute;
@@ -981,11 +942,11 @@ exports[`disable nft on landing page does not render nft information and card 1`
   content: '';
 }
 
-.c47:hover:before {
+.c45:hover:before {
   background-color: #98A1C014;
 }
 
-.c47:active:before {
+.c45:active:before {
   background-color: #B8C0DC3d;
 }
 
@@ -1065,13 +1026,13 @@ exports[`disable nft on landing page does not render nft information and card 1`
   stroke-width: 2px;
 }
 
-.c48 {
+.c46 {
   margin: 0 0.25rem 0 0.35rem;
   height: 35%;
   margin-left: 8px;
 }
 
-.c48 path {
+.c46 path {
   stroke: #FFFFFF;
   stroke-width: 2px;
 }
@@ -1139,7 +1100,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   padding-top: 12px;
 }
 
-.c43 {
+.c41 {
   border-radius: 12px;
   height: 40px;
   width: 40px;
@@ -1154,7 +1115,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   z-index: 2;
 }
 
-.c43:hover {
+.c41:hover {
   cursor: pointer;
   opacity: 0.8;
 }
@@ -1216,7 +1177,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   gap: 16px;
 }
 
-.c44 {
+.c42 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -1267,7 +1228,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   border-color: #B8C0DC3d;
 }
 
-.c46 {
+.c44 {
   border-bottom: 1px solid #FFFFFF;
 }
 
@@ -1294,7 +1255,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   overflow-x: hidden;
 }
 
-.c54 {
+.c51 {
   position: absolute;
   display: -webkit-box;
   display: -webkit-flex;
@@ -1318,7 +1279,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   height: calc(100vh - 48px);
 }
 
-.c55 {
+.c52 {
   position: absolute;
   display: -webkit-box;
   display: -webkit-flex;
@@ -1339,7 +1300,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   height: calc(100vh - 48px);
 }
 
-.c56 {
+.c53 {
   position: absolute;
   top: 68px;
   bottom: 0;
@@ -1352,7 +1313,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   height: 100%;
 }
 
-.c57 {
+.c54 {
   position: absolute;
   display: -webkit-box;
   display: -webkit-flex;
@@ -1380,11 +1341,11 @@ exports[`disable nft on landing page does not render nft information and card 1`
   pointer-events: none;
 }
 
-.c57 * {
+.c54 * {
   pointer-events: auto;
 }
 
-.c58 {
+.c55 {
   color: transparent;
   font-size: 36px;
   line-height: 44px;
@@ -1396,7 +1357,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   -webkit-background-clip: text;
 }
 
-.c60 {
+.c57 {
   color: #7D7D7D;
   font-size: 16px;
   line-height: 24px;
@@ -1406,7 +1367,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   margin: 0 0 32px;
 }
 
-.c59 {
+.c56 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -1417,12 +1378,12 @@ exports[`disable nft on landing page does not render nft information and card 1`
   justify-content: center;
 }
 
-.c62 {
+.c59 {
   padding: 16px 0px;
   border-radius: 24px;
 }
 
-.c63 {
+.c60 {
   background: linear-gradient(93.06deg,#ff00c7 2.66%,#ff9ffb 98.99%);
   border: none;
   color: #FFFFFF;
@@ -1430,24 +1391,24 @@ exports[`disable nft on landing page does not render nft information and card 1`
   transition: all 250ms ease;
 }
 
-.c63:hover {
+.c60:hover {
   box-shadow: 0px 0px 16px 0px #ff00c7;
 }
 
-.c64 {
+.c61 {
   margin: 0px;
   font-size: 16px;
   font-weight: 535;
   white-space: nowrap;
 }
 
-.c61 {
+.c58 {
   max-width: 300px;
   width: 100%;
   pointer-events: auto;
 }
 
-.c65 {
+.c62 {
   -webkit-align-items: center;
   -webkit-box-align: center;
   -ms-flex-align: center;
@@ -1467,16 +1428,16 @@ exports[`disable nft on landing page does not render nft information and card 1`
   transition: 250ms ease opacity;
 }
 
-.c65:hover {
+.c62:hover {
   opacity: 0.6;
 }
 
-.c66 {
+.c63 {
   margin-left: 14px;
   size: 20px;
 }
 
-.c68 {
+.c65 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -1493,7 +1454,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   background: linear-gradient(179.82deg,rgba(255,255,255,0) 0.16%,#eaeaea 99.85%);
 }
 
-.c69 {
+.c66 {
   display: grid;
   gap: 12px;
   width: 100%;
@@ -1506,7 +1467,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   grid-template-columns: 1fr;
 }
 
-.c75 {
+.c72 {
   display: grid;
   gap: 12px;
   width: 100%;
@@ -1560,7 +1521,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
   width: 100%;
 }
 
-.c67 {
+.c64 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -1576,12 +1537,12 @@ exports[`disable nft on landing page does not render nft information and card 1`
   text-align: center;
 }
 
-.c67:hover {
+.c64:hover {
   color: #CECECE;
 }
 
 @media screen and (min-width:1024px) {
-  .c87 {
+  .c84 {
     -webkit-flex-direction: row;
     -ms-flex-direction: row;
     flex-direction: row;
@@ -1593,7 +1554,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
 }
 
 @media screen and (min-width:1024px) {
-  .c89 {
+  .c86 {
     display: -webkit-box;
     display: -webkit-flex;
     display: -ms-flexbox;
@@ -1602,63 +1563,63 @@ exports[`disable nft on landing page does not render nft information and card 1`
 }
 
 @media screen and (min-width:1024px) {
-  .c104 {
+  .c101 {
     display: none;
   }
 }
 
 @media screen and (min-width:1024px) {
-  .c90 {
+  .c87 {
     display: block;
   }
 }
 
 @media screen and (min-width:1280px) {
-  .c97 {
+  .c94 {
     grid-template-columns: 1fr 1fr 1fr 1fr;
     gap: 24px;
   }
 }
 
 @media screen and (min-width:1280px) {
-  .c98 {
+  .c95 {
     margin: 0;
   }
 }
 
 @media screen and (min-width:640px) {
-  .c70 {
+  .c67 {
     height: 360px;
   }
 }
 
 @media screen and (min-width:1280px) {
-  .c70 {
+  .c67 {
     padding: 32px;
   }
 }
 
 @media screen and (min-width:640px) {
-  .c76 {
+  .c73 {
     height: 260px;
   }
 }
 
 @media screen and (min-width:1280px) {
-  .c76 {
+  .c73 {
     padding: 32px;
   }
 }
 
 @media screen and (min-width:1024px) {
-  .c72 {
+  .c69 {
     font-size: 28px;
     line-height: 36px;
   }
 }
 
 @media screen and (min-width:1280px) {
-  .c73 {
+  .c70 {
     font-size: 20px;
     line-height: 28px;
     max-width: 480px;
@@ -1666,7 +1627,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
 }
 
 @media screen and (min-width:1280px) {
-  .c77 {
+  .c74 {
     font-size: 20px;
     line-height: 28px;
     max-width: 480px;
@@ -1674,7 +1635,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
 }
 
 @media screen and (min-width:1024px) {
-  .c79 {
+  .c76 {
     height: 140px;
     -webkit-flex-direction: row;
     -ms-flex-direction: row;
@@ -1683,21 +1644,21 @@ exports[`disable nft on landing page does not render nft information and card 1`
 }
 
 @media screen and (min-width:1280px) {
-  .c81 {
+  .c78 {
     font-size: 28px;
     line-height: 36px;
   }
 }
 
 @media screen and (min-width:1280px) {
-  .c82 {
+  .c79 {
     font-size: 20px;
     line-height: 28px;
   }
 }
 
 @media screen and (min-width:1024px) {
-  .c83 {
+  .c80 {
     width: auto;
   }
 }
@@ -1715,79 +1676,79 @@ exports[`disable nft on landing page does not render nft information and card 1`
 }
 
 @media screen and (min-width:768px) {
-  .c54 {
+  .c51 {
     height: 100vh;
   }
 }
 
 @media screen and (min-width:768px) {
-  .c55 {
+  .c52 {
     height: 100vh;
   }
 }
 
 @media screen and (min-width:640px) {
-  .c58 {
+  .c55 {
     font-size: 48px;
     line-height: 56px;
   }
 }
 
 @media screen and (min-width:768px) {
-  .c58 {
+  .c55 {
     font-size: 64px;
     line-height: 72px;
   }
 }
 
 @media screen and (min-width:768px) {
-  .c60 {
+  .c57 {
     font-size: 20px;
     line-height: 28px;
   }
 }
 
 @media screen and (min-width:640px) {
-  .c64 {
+  .c61 {
     font-size: 20px;
   }
 }
 
 @media screen and (min-width:640px) {
-  .c65 {
+  .c62 {
     visibility: visible;
   }
 }
 
 @media screen and (min-width:768px) {
-  .c68 {
+  .c65 {
     padding: 0 96px 5rem;
   }
 }
 
 @media screen and (min-width:640px) {
-  .c69 {
+  .c66 {
     grid-template-columns: 1fr;
     gap: 32px;
   }
 }
 
 @media screen and (min-width:1024px) {
-  .c69 {
+  .c66 {
     grid-template-columns: 1fr;
     gap: 32px;
   }
 }
 
 @media screen and (min-width:640px) {
-  .c75 {
+  .c72 {
     grid-template-columns: 1fr;
     gap: 32px;
   }
 }
 
 @media screen and (min-width:1024px) {
-  .c75 {
+  .c72 {
     grid-template-columns: 1fr 1fr 1fr;
     gap: 32px;
   }
@@ -1963,11 +1924,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
                         >
                           <div
                             class="c40"
-                          >
-                            <div
-                              class="c41 c42"
-                            />
-                          </div>
+                          />
                           <span />
                         </div>
                       </div>
@@ -1975,10 +1932,10 @@ exports[`disable nft on landing page does not render nft information and card 1`
                   </div>
                 </div>
                 <div
-                  class="c43"
+                  class="c41"
                 >
                   <div
-                    class="c44"
+                    class="c42"
                     color="#222222"
                     data-testid="swap-currency-button"
                   >
@@ -2007,11 +1964,11 @@ exports[`disable nft on landing page does not render nft information and card 1`
                 </div>
               </div>
               <div
-                class="c45"
+                class="c43"
               >
                 <div>
                   <div
-                    class="c23 c46"
+                    class="c23 c44"
                   >
                     <div
                       class="c24"
@@ -2052,7 +2009,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
                               class="c14"
                             >
                               <button
-                                class="c15 c16 c30 c47 open-currency-select-button"
+                                class="c15 c16 c30 c45 open-currency-select-button"
                               >
                                 <span
                                   class="c32"
@@ -2067,7 +2024,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
                                     </span>
                                   </div>
                                   <svg
-                                    class="c48"
+                                    class="c46"
                                   >
                                     dropdown.svg
                                   </svg>
@@ -2084,23 +2041,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
                           >
                             <div
                               class="c40"
-                            >
-                              <div
-                                class="c7 c49"
-                              >
-                                <div
-                                  class="c26 css-142zc9n"
-                                >
-                                  <div
-                                    class="c14"
-                                  >
-                                    <div>
-                                      -
-                                    </div>
-                                  </div>
-                                </div>
-                              </div>
-                            </div>
+                            />
                             <span />
                           </div>
                         </div>
@@ -2110,11 +2051,11 @@ exports[`disable nft on landing page does not render nft information and card 1`
                 </div>
                 <div>
                   <button
-                    class="c50 c16 c51"
+                    class="c47 c16 c48"
                     font-weight="535"
                   >
                     <div
-                      class="c52 c53"
+                      class="c49 c50"
                     />
                     Connect wallet
                   </button>
@@ -2126,52 +2067,52 @@ exports[`disable nft on landing page does not render nft information and card 1`
       </a>
     </div>
     <div
-      class="c54"
+      class="c51"
     />
     <div
-      class="c55"
+      class="c52"
     >
       <div
-        class="c56"
+        class="c53"
       />
     </div>
     <div
-      class="c57"
+      class="c54"
     >
       <h1
-        class="c58"
+        class="c55"
       >
         Trade crypto with confidence
       </h1>
       <div
-        class="c59"
+        class="c56"
       >
         <div
-          class="c60"
+          class="c57"
         >
           Buy, sell, and explore tokens
         </div>
       </div>
       <span
-        class="c61"
+        class="c58"
       >
         <a
-          class="c2 c16 c62 c63"
+          class="c2 c16 c59 c60"
           href="/swap"
         >
           <p
-            class="c64"
+            class="c61"
           >
             Get started
           </p>
         </a>
       </span>
       <div
-        class="c65"
+        class="c62"
       >
         Learn more
         <svg
-          class="c66"
+          class="c63"
           fill="none"
           height="24"
           stroke="currentColor"
@@ -2199,7 +2140,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
         </svg>
       </div>
       <a
-        class="c67"
+        class="c64"
         href="https://wallet.uniswap.org/?utm_source=home_page&utm_medium=webapp&utm_campaign=wallet_microsite&utm_id=1"
       >
         <svg
@@ -2216,32 +2157,32 @@ exports[`disable nft on landing page does not render nft information and card 1`
       </a>
     </div>
     <div
-      class="c68"
+      class="c65"
     >
       <div
-        class="c69"
+        class="c66"
         cols="1"
       >
         <a
-          class="c70"
+          class="c67"
           href="/swap"
         >
           <div
-            class="c71"
+            class="c68"
           >
             <div
-              class="c72"
+              class="c69"
             >
               Swap tokens
             </div>
           </div>
           <div
-            class="c73"
+            class="c70"
             type="Primary"
           >
             Buy, sell, and explore tokens on Ethereum, Polygon, Optimism, and more.
             <div
-              class="c73 c74"
+              class="c70 c71"
               type="Primary"
             >
               Trade Tokens
@@ -2250,20 +2191,20 @@ exports[`disable nft on landing page does not render nft information and card 1`
         </a>
       </div>
       <div
-        class="c75"
+        class="c72"
         cols="3"
       >
         <a
-          class="c76"
+          class="c73"
           href="https://support.uniswap.org/hc/en-us/articles/11306574799117-How-to-use-Moon-Pay-on-the-Uniswap-web-app-"
           rel="noopenener noreferrer"
           target="_blank"
         >
           <div
-            class="c71"
+            class="c68"
           >
             <div
-              class="c72"
+              class="c69"
             >
               Buy crypto
             </div>
@@ -2290,12 +2231,12 @@ exports[`disable nft on landing page does not render nft information and card 1`
             </svg>
           </div>
           <div
-            class="c77"
+            class="c74"
             type="Secondary"
           >
             Buy crypto with your credit card or bank account at the best rates.
             <div
-              class="c77 c74"
+              class="c74 c71"
               type="Secondary"
             >
               Buy now
@@ -2303,30 +2244,30 @@ exports[`disable nft on landing page does not render nft information and card 1`
           </div>
         </a>
         <a
-          class="c76"
+          class="c73"
           href="/pools"
         >
           <div
-            class="c71"
+            class="c68"
           >
             <div
-              class="c72"
+              class="c69"
             >
               Earn
             </div>
             <img
               alt="Analytics"
-              class="c78"
+              class="c75"
               src="aboutArrowLight.png"
             />
           </div>
           <div
-            class="c77"
+            class="c74"
             type="Secondary"
           >
             Provide liquidity to pools on Uniswap and earn fees on swaps.
             <div
-              class="c77 c74"
+              class="c74 c71"
               type="Secondary"
             >
               Provide liquidity
@@ -2334,16 +2275,16 @@ exports[`disable nft on landing page does not render nft information and card 1`
           </div>
         </a>
         <a
-          class="c76"
+          class="c73"
           href="https://docs.uniswap.org"
           rel="noopenener noreferrer"
           target="_blank"
         >
           <div
-            class="c71"
+            class="c68"
           >
             <div
-              class="c72"
+              class="c69"
             >
               Build dApps
             </div>
@@ -2370,12 +2311,12 @@ exports[`disable nft on landing page does not render nft information and card 1`
             </svg>
           </div>
           <div
-            class="c77"
+            class="c74"
             type="Secondary"
           >
             Build apps and tools on the largest DeFi protocol on Ethereum.
             <div
-              class="c77 c74"
+              class="c74 c71"
               type="Secondary"
             >
               Developer docs
@@ -2384,27 +2325,27 @@ exports[`disable nft on landing page does not render nft information and card 1`
         </a>
       </div>
       <div
-        class="c79"
+        class="c76"
       >
         <div
-          class="c80"
+          class="c77"
         >
           <div
-            class="c81"
+            class="c78"
           >
             Powered by the Uniswap Protocol
           </div>
           <div
-            class="c82"
+            class="c79"
           >
             The leading decentralized crypto trading protocol, governed by a global community.
           </div>
         </div>
         <div
-          class="c83"
+          class="c80"
         >
           <a
-            class="c84 c85 c86"
+            class="c81 c82 c83"
             href="https://uniswap.org"
             rel="noopener noreferrer"
             target="_blank"
@@ -2415,53 +2356,53 @@ exports[`disable nft on landing page does not render nft information and card 1`
         </div>
       </div>
       <div
-        class="c87"
+        class="c84"
       >
         <div
-          class="c88 c89"
+          class="c85 c86"
         >
           <img
             alt="Uniswap Logo"
-            class="c90"
+            class="c87"
             src="unicornEmbossLight.png"
           />
           <div
-            class="c91"
+            class="c88"
           >
             <a
-              class="c92"
+              class="c89"
               href="https://discord.gg/FCfyBSbCU5"
               rel="noopener noreferrer"
               target="_blank"
             >
               <svg
-                class="c93"
+                class="c90"
                 size="32"
               >
                 discord.svg
               </svg>
             </a>
             <a
-              class="c92"
+              class="c89"
               href="https://twitter.com/uniswap"
               rel="noopener noreferrer"
               target="_blank"
             >
               <svg
-                class="c94"
+                class="c91"
                 size="32"
               >
                 twitter-safe.svg
               </svg>
             </a>
             <a
-              class="c92"
+              class="c89"
               href="https://github.com/Uniswap"
               rel="noopener noreferrer"
               target="_blank"
             >
               <svg
-                class="c95"
+                class="c92"
                 size="32"
               >
                 github.svg
@@ -2469,7 +2410,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
             </a>
           </div>
           <span
-            class="c96"
+            class="c93"
           >
             © 
             2023
@@ -2477,45 +2418,45 @@ exports[`disable nft on landing page does not render nft information and card 1`
           </span>
         </div>
         <div
-          class="c97"
+          class="c94"
         >
           <div
-            class="c98"
+            class="c95"
           >
             <span
-              class="c99"
+              class="c96"
             >
               App
             </span>
             <a
-              class="c100 c101"
+              class="c97 c98"
               href="/swap"
             >
               Swap
             </a>
             <a
-              class="c100 c101"
+              class="c97 c98"
               href="/tokens"
             >
               Tokens
             </a>
             <a
-              class="c100 c101"
+              class="c97 c98"
               href="/pools"
             >
               Pools
             </a>
           </div>
           <div
-            class="c98"
+            class="c95"
           >
             <span
-              class="c99"
+              class="c96"
             >
               Protocol
             </span>
             <a
-              class="c102 c103"
+              class="c99 c100"
               href="https://uniswap.org/community"
               rel="noopener noreferrer"
               target="_blank"
@@ -2523,7 +2464,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
               Community
             </a>
             <a
-              class="c102 c103"
+              class="c99 c100"
               href="https://uniswap.org/governance"
               rel="noopener noreferrer"
               target="_blank"
@@ -2531,7 +2472,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
               Governance
             </a>
             <a
-              class="c102 c103"
+              class="c99 c100"
               href="https://uniswap.org/developers"
               rel="noopener noreferrer"
               target="_blank"
@@ -2540,15 +2481,15 @@ exports[`disable nft on landing page does not render nft information and card 1`
             </a>
           </div>
           <div
-            class="c98"
+            class="c95"
           >
             <span
-              class="c99"
+              class="c96"
             >
               Company
             </span>
             <a
-              class="c102 c103"
+              class="c99 c100"
               href="https://boards.greenhouse.io/uniswaplabs"
               rel="noopener noreferrer"
               target="_blank"
@@ -2556,7 +2497,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
               Careers
             </a>
             <a
-              class="c102 c103"
+              class="c99 c100"
               href="https://uniswap.org/blog"
               rel="noopener noreferrer"
               target="_blank"
@@ -2565,15 +2506,15 @@ exports[`disable nft on landing page does not render nft information and card 1`
             </a>
           </div>
           <div
-            class="c98"
+            class="c95"
           >
             <span
-              class="c99"
+              class="c96"
             >
               Get Help
             </span>
             <a
-              class="c102 c103"
+              class="c99 c100"
               href="https://support.uniswap.org/hc/en-us/requests/new"
               rel="noopener noreferrer"
               target="_blank"
@@ -2581,7 +2522,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
               Contact Us
             </a>
             <a
-              class="c102 c103"
+              class="c99 c100"
               href="https://support.uniswap.org/hc/en-us"
               rel="noopener noreferrer"
               target="_blank"
@@ -2591,50 +2532,50 @@ exports[`disable nft on landing page does not render nft information and card 1`
           </div>
         </div>
         <div
-          class="c88 c104"
+          class="c85 c101"
         >
           <img
             alt="Uniswap Logo"
-            class="c90"
+            class="c87"
             src="unicornEmbossLight.png"
           />
           <div
-            class="c91"
+            class="c88"
           >
             <a
-              class="c92"
+              class="c89"
               href="https://discord.gg/FCfyBSbCU5"
               rel="noopener noreferrer"
               target="_blank"
             >
               <svg
-                class="c93"
+                class="c90"
                 size="32"
               >
                 discord.svg
               </svg>
             </a>
             <a
-              class="c92"
+              class="c89"
               href="https://twitter.com/uniswap"
               rel="noopener noreferrer"
               target="_blank"
             >
               <svg
-                class="c94"
+                class="c91"
                 size="32"
               >
                 twitter-safe.svg
               </svg>
             </a>
             <a
-              class="c92"
+              class="c89"
               href="https://github.com/Uniswap"
               rel="noopener noreferrer"
               target="_blank"
             >
               <svg
-                class="c95"
+                class="c92"
                 size="32"
               >
                 github.svg
@@ -2642,7 +2583,7 @@ exports[`disable nft on landing page does not render nft information and card 1`
             </a>
           </div>
           <span
-            class="c96"
+            class="c93"
           >
             © 
             2023
@@ -2685,7 +2626,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   border-radius: 4px;
 }
 
-.c50 {
+.c47 {
   box-sizing: border-box;
   margin: 0;
   min-width: 0;
@@ -2726,24 +2667,6 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   justify-content: flex-start;
 }
 
-.c49 {
-  width: 100%;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  padding: 0;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-box-pack: start;
-  -webkit-justify-content: flex-start;
-  -ms-flex-pack: start;
-  justify-content: flex-start;
-  gap: 8px;
-}
-
 .c9 {
   -webkit-box-pack: justify;
   -webkit-justify-content: space-between;
@@ -2765,7 +2688,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   color: #7D7D7D;
 }
 
-.c103 {
+.c100 {
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -2776,15 +2699,15 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   font-weight: 500;
 }
 
-.c103:hover {
+.c100:hover {
   opacity: 0.6;
 }
 
-.c103:active {
+.c100:active {
   opacity: 0.4;
 }
 
-.c101 {
+.c98 {
   -webkit-text-decoration: none;
   text-decoration: none;
   cursor: pointer;
@@ -2795,36 +2718,36 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   font-weight: 500;
 }
 
-.c101:hover {
+.c98:hover {
   opacity: 0.6;
 }
 
-.c101:active {
+.c98:active {
   opacity: 0.4;
 }
 
-.c94 {
+.c91 {
   height: 32px;
   width: 32px;
   fill: #98A1C0;
   opacity: 1;
 }
 
-.c95 {
+.c92 {
   height: 32px;
   width: 32px;
   fill: #98A1C0;
   opacity: 1;
 }
 
-.c96 {
+.c93 {
   height: 32px;
   width: 32px;
   fill: #98A1C0;
   opacity: 1;
 }
 
-.c88 {
+.c85 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -2837,7 +2760,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   max-width: 1440px;
 }
 
-.c89 {
+.c86 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -2847,24 +2770,24 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   flex-direction: column;
 }
 
-.c90 {
+.c87 {
   display: none;
 }
 
-.c105 {
+.c102 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
 }
 
-.c91 {
+.c88 {
   width: 72px;
   height: 72px;
   display: none;
 }
 
-.c92 {
+.c89 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -2877,20 +2800,20 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   margin: 20px 0 0 0;
 }
 
-.c93 {
+.c90 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
 }
 
-.c98 {
+.c95 {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 12px;
 }
 
-.c99 {
+.c96 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -2903,32 +2826,32 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   margin: 20px 0 0 0;
 }
 
-.c100 {
+.c97 {
   font-size: 16px;
   line-height: 20px;
   font-weight: 535;
 }
 
-.c104 {
+.c101 {
   font-size: 16px;
   line-height: 20px;
   color: #7D7D7D;
 }
 
-.c102 {
+.c99 {
   font-size: 16px;
   line-height: 20px;
   color: #7D7D7D;
 }
 
-.c97 {
+.c94 {
   font-size: 16px;
   line-height: 20px;
   margin: 1rem 0 0 0;
   color: #CECECE;
 }
 
-.c70 {
+.c67 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -2956,11 +2879,11 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   transition: 250ms ease border;
 }
 
-.c70:hover {
+.c67:hover {
   border: 1px solid #CECECE;
 }
 
-.c75 {
+.c72 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -2988,11 +2911,11 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   transition: 250ms ease border;
 }
 
-.c75:hover {
+.c72:hover {
   border: 1px solid #CECECE;
 }
 
-.c77 {
+.c74 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -3020,11 +2943,11 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   transition: 250ms ease border;
 }
 
-.c77:hover {
+.c74:hover {
   border: 1px solid #CECECE;
 }
 
-.c71 {
+.c68 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -3039,13 +2962,13 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   justify-content: space-between;
 }
 
-.c72 {
+.c69 {
   font-size: 20px;
   line-height: 28px;
   font-weight: 535;
 }
 
-.c73 {
+.c70 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -3060,7 +2983,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   max-width: 480px;
 }
 
-.c78 {
+.c75 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -3075,7 +2998,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   max-width: 480px;
 }
 
-.c74 {
+.c71 {
   color: #FC72FF;
   font-weight: 535;
   margin: 24px 0 0;
@@ -3084,18 +3007,18 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   transition: 250ms ease opacity;
 }
 
-.c74:hover {
+.c71:hover {
   opacity: 0.6;
 }
 
-.c79 {
+.c76 {
   min-width: 20px;
   min-height: 20px;
   max-height: 48px;
   max-width: 48px;
 }
 
-.c53 {
+.c50 {
   background-color: transparent;
   bottom: 0;
   border-radius: inherit;
@@ -3166,7 +3089,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   text-decoration: none;
 }
 
-.c85 {
+.c82 {
   padding: 16px;
   width: 200px;
   line-height: 24px;
@@ -3205,58 +3128,58 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   transform: perspective(1px) translateZ(0);
 }
 
-.c85:disabled {
+.c82:disabled {
   opacity: 50%;
   cursor: auto;
   pointer-events: none;
 }
 
-.c85 > * {
+.c82 > * {
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
 }
 
-.c85 > a {
+.c82 > a {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.c51 {
+.c48 {
   background-color: #FFEFFF;
   color: #FC72FF;
   font-size: 20px;
   font-weight: 535;
 }
 
-.c51:focus {
+.c48:focus {
   box-shadow: 0 0 0 1pt #FFEFFF;
   background-color: #FFEFFF;
 }
 
-.c51:hover {
+.c48:hover {
   background-color: #FFEFFF;
 }
 
-.c51:active {
+.c48:active {
   box-shadow: 0 0 0 1pt #FFEFFF;
   background-color: #FFEFFF;
 }
 
-.c51:hover .c52 {
+.c48:hover .c49 {
   background-color: #98A1C014;
 }
 
-.c51:active .c52 {
+.c48:active .c49 {
   background-color: #B8C0DC3d;
 }
 
-.c51:disabled {
+.c48:disabled {
   opacity: 0.4;
 }
 
-.c51:disabled:hover {
+.c48:disabled:hover {
   cursor: auto;
   background-color: transparent;
   box-shadow: none;
@@ -3280,7 +3203,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   background-color: #e0e0e0;
 }
 
-.c86 {
+.c83 {
   background-color: transparent;
   color: #FC72FF;
   display: -webkit-box;
@@ -3297,22 +3220,22 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   align-items: center;
 }
 
-.c86:focus {
+.c83:focus {
   -webkit-text-decoration: underline;
   text-decoration: underline;
 }
 
-.c86:hover {
+.c83:hover {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.c86:active {
+.c83:active {
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 
-.c86:disabled {
+.c83:disabled {
   opacity: 50%;
   cursor: auto;
 }
@@ -3346,7 +3269,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   cursor: auto;
 }
 
-.c80 {
+.c77 {
   height: 340px;
   width: 100%;
   border-radius: 32px;
@@ -3372,7 +3295,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   background: url(Mesh.png),linear-gradient(93.06deg,#FF00C7 2.66%,#FF9FFB 98.99%);
 }
 
-.c81 {
+.c78 {
   color: white;
   display: -webkit-box;
   display: -webkit-flex;
@@ -3386,20 +3309,20 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   flex-direction: column;
 }
 
-.c82 {
+.c79 {
   font-weight: 535;
   font-size: 28px;
   line-height: 36px;
 }
 
-.c83 {
+.c80 {
   margin: 10px 10px 0 0;
   font-weight: 535;
   font-size: 16px;
   line-height: 20px;
 }
 
-.c84 {
+.c81 {
   width: 100%;
   display: -webkit-box;
   display: -webkit-flex;
@@ -3413,16 +3336,16 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   transition: 250ms ease opacity;
 }
 
-.c84:hover {
+.c81:hover {
   opacity: 0.6;
 }
 
-.c87 {
+.c84 {
   color: white;
   border: 1px solid white;
 }
 
-.c45 {
+.c43 {
   display: grid;
   grid-auto-rows: auto;
   grid-row-gap: 4px;
@@ -3436,21 +3359,6 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   transition: opacity 250ms ease-in-out;
 }
 
-.c41 {
-  border-radius: 12px;
-  border-radius: 12px;
-  height: 24px;
-  width: 50%;
-  width: 50%;
-  -webkit-animation: fAQEyV 1.5s infinite;
-  animation: fAQEyV 1.5s infinite;
-  -webkit-animation-fill-mode: both;
-  animation-fill-mode: both;
-  background: linear-gradient( to left, #22222212 25%, rgba(53,53,53,0.07) 50%, #22222212 75% );
-  will-change: background-position;
-  background-size: 400%;
-}
-
 .c14 {
   display: inline-block;
   height: inherit;
@@ -3533,12 +3441,6 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   color: #CECECE;
 }
 
-.c42 {
-  border-radius: 4px;
-  width: 4rem;
-  height: 1rem;
-}
-
 .c24 {
   display: -webkit-box;
   display: -webkit-flex;
@@ -3619,7 +3521,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   background-color: #B8C0DC3d;
 }
 
-.c47 {
+.c45 {
   -webkit-align-items: center;
   -webkit-box-align: center;
   -ms-flex-align: center;
@@ -3652,12 +3554,12 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   animation: none;
 }
 
-.c47:hover,
-.c47:active {
+.c45:hover,
+.c45:active {
   background-color: #FC72FF;
 }
 
-.c47:before {
+.c45:before {
   background-size: 100%;
   border-radius: inherit;
   position: absolute;
@@ -3668,11 +3570,11 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   content: '';
 }
 
-.c47:hover:before {
+.c45:hover:before {
   background-color: #98A1C014;
 }
 
-.c47:active:before {
+.c45:active:before {
   background-color: #B8C0DC3d;
 }
 
@@ -3752,13 +3654,13 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   stroke-width: 2px;
 }
 
-.c48 {
+.c46 {
   margin: 0 0.25rem 0 0.35rem;
   height: 35%;
   margin-left: 8px;
 }
 
-.c48 path {
+.c46 path {
   stroke: #FFFFFF;
   stroke-width: 2px;
 }
@@ -3826,7 +3728,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   padding-top: 12px;
 }
 
-.c43 {
+.c41 {
   border-radius: 12px;
   height: 40px;
   width: 40px;
@@ -3841,7 +3743,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   z-index: 2;
 }
 
-.c43:hover {
+.c41:hover {
   cursor: pointer;
   opacity: 0.8;
 }
@@ -3903,7 +3805,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   gap: 16px;
 }
 
-.c44 {
+.c42 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -3954,7 +3856,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   border-color: #B8C0DC3d;
 }
 
-.c46 {
+.c44 {
   border-bottom: 1px solid #FFFFFF;
 }
 
@@ -3981,7 +3883,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   overflow-x: hidden;
 }
 
-.c54 {
+.c51 {
   position: absolute;
   display: -webkit-box;
   display: -webkit-flex;
@@ -4005,7 +3907,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   height: calc(100vh - 48px);
 }
 
-.c55 {
+.c52 {
   position: absolute;
   display: -webkit-box;
   display: -webkit-flex;
@@ -4026,7 +3928,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   height: calc(100vh - 48px);
 }
 
-.c56 {
+.c53 {
   position: absolute;
   top: 68px;
   bottom: 0;
@@ -4039,7 +3941,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   height: 100%;
 }
 
-.c57 {
+.c54 {
   position: absolute;
   display: -webkit-box;
   display: -webkit-flex;
@@ -4067,11 +3969,11 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   pointer-events: none;
 }
 
-.c57 * {
+.c54 * {
   pointer-events: auto;
 }
 
-.c58 {
+.c55 {
   color: transparent;
   font-size: 36px;
   line-height: 44px;
@@ -4083,7 +3985,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   -webkit-background-clip: text;
 }
 
-.c60 {
+.c57 {
   color: #7D7D7D;
   font-size: 16px;
   line-height: 24px;
@@ -4093,7 +3995,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   margin: 0 0 32px;
 }
 
-.c59 {
+.c56 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -4104,12 +4006,12 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   justify-content: center;
 }
 
-.c62 {
+.c59 {
   padding: 16px 0px;
   border-radius: 24px;
 }
 
-.c63 {
+.c60 {
   background: linear-gradient(93.06deg,#ff00c7 2.66%,#ff9ffb 98.99%);
   border: none;
   color: #FFFFFF;
@@ -4117,24 +4019,24 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   transition: all 250ms ease;
 }
 
-.c63:hover {
+.c60:hover {
   box-shadow: 0px 0px 16px 0px #ff00c7;
 }
 
-.c64 {
+.c61 {
   margin: 0px;
   font-size: 16px;
   font-weight: 535;
   white-space: nowrap;
 }
 
-.c61 {
+.c58 {
   max-width: 300px;
   width: 100%;
   pointer-events: auto;
 }
 
-.c65 {
+.c62 {
   -webkit-align-items: center;
   -webkit-box-align: center;
   -ms-flex-align: center;
@@ -4154,16 +4056,16 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   transition: 250ms ease opacity;
 }
 
-.c65:hover {
+.c62:hover {
   opacity: 0.6;
 }
 
-.c66 {
+.c63 {
   margin-left: 14px;
   size: 20px;
 }
 
-.c68 {
+.c65 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -4180,7 +4082,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   background: linear-gradient(179.82deg,rgba(255,255,255,0) 0.16%,#eaeaea 99.85%);
 }
 
-.c69 {
+.c66 {
   display: grid;
   gap: 12px;
   width: 100%;
@@ -4193,7 +4095,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   grid-template-columns: 1fr;
 }
 
-.c76 {
+.c73 {
   display: grid;
   gap: 12px;
   width: 100%;
@@ -4247,7 +4149,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   width: 100%;
 }
 
-.c67 {
+.c64 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -4263,12 +4165,12 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
   text-align: center;
 }
 
-.c67:hover {
+.c64:hover {
   color: #CECECE;
 }
 
 @media screen and (min-width:1024px) {
-  .c88 {
+  .c85 {
     -webkit-flex-direction: row;
     -ms-flex-direction: row;
     flex-direction: row;
@@ -4280,7 +4182,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
 }
 
 @media screen and (min-width:1024px) {
-  .c90 {
+  .c87 {
     display: -webkit-box;
     display: -webkit-flex;
     display: -ms-flexbox;
@@ -4289,75 +4191,75 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
 }
 
 @media screen and (min-width:1024px) {
-  .c105 {
+  .c102 {
     display: none;
   }
 }
 
 @media screen and (min-width:1024px) {
-  .c91 {
+  .c88 {
     display: block;
   }
 }
 
 @media screen and (min-width:1280px) {
-  .c98 {
+  .c95 {
     grid-template-columns: 1fr 1fr 1fr 1fr;
     gap: 24px;
   }
 }
 
 @media screen and (min-width:1280px) {
-  .c99 {
+  .c96 {
     margin: 0;
   }
 }
 
 @media screen and (min-width:640px) {
-  .c70 {
+  .c67 {
     height: 360px;
   }
 }
 
 @media screen and (min-width:1280px) {
-  .c70 {
+  .c67 {
     padding: 32px;
   }
 }
 
 @media screen and (min-width:640px) {
-  .c75 {
+  .c72 {
     height: 360px;
   }
 }
 
 @media screen and (min-width:1280px) {
-  .c75 {
+  .c72 {
     padding: 32px;
   }
 }
 
 @media screen and (min-width:640px) {
-  .c77 {
+  .c74 {
     height: 260px;
   }
 }
 
 @media screen and (min-width:1280px) {
-  .c77 {
+  .c74 {
     padding: 32px;
   }
 }
 
 @media screen and (min-width:1024px) {
-  .c72 {
+  .c69 {
     font-size: 28px;
     line-height: 36px;
   }
 }
 
 @media screen and (min-width:1280px) {
-  .c73 {
+  .c70 {
     font-size: 20px;
     line-height: 28px;
     max-width: 480px;
@@ -4365,7 +4267,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
 }
 
 @media screen and (min-width:1280px) {
-  .c78 {
+  .c75 {
     font-size: 20px;
     line-height: 28px;
     max-width: 480px;
@@ -4373,7 +4275,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
 }
 
 @media screen and (min-width:1024px) {
-  .c80 {
+  .c77 {
     height: 140px;
     -webkit-flex-direction: row;
     -ms-flex-direction: row;
@@ -4382,21 +4284,21 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
 }
 
 @media screen and (min-width:1280px) {
-  .c82 {
+  .c79 {
     font-size: 28px;
     line-height: 36px;
   }
 }
 
 @media screen and (min-width:1280px) {
-  .c83 {
+  .c80 {
     font-size: 20px;
     line-height: 28px;
   }
 }
 
 @media screen and (min-width:1024px) {
-  .c84 {
+  .c81 {
     width: auto;
   }
 }
@@ -4414,79 +4316,79 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
 }
 
 @media screen and (min-width:768px) {
-  .c54 {
+  .c51 {
     height: 100vh;
   }
 }
 
 @media screen and (min-width:768px) {
-  .c55 {
+  .c52 {
     height: 100vh;
   }
 }
 
 @media screen and (min-width:640px) {
-  .c58 {
+  .c55 {
     font-size: 48px;
     line-height: 56px;
   }
 }
 
 @media screen and (min-width:768px) {
-  .c58 {
+  .c55 {
     font-size: 64px;
     line-height: 72px;
   }
 }
 
 @media screen and (min-width:768px) {
-  .c60 {
+  .c57 {
     font-size: 20px;
     line-height: 28px;
   }
 }
 
 @media screen and (min-width:640px) {
-  .c64 {
+  .c61 {
     font-size: 20px;
   }
 }
 
 @media screen and (min-width:640px) {
-  .c65 {
+  .c62 {
     visibility: visible;
   }
 }
 
 @media screen and (min-width:768px) {
-  .c68 {
+  .c65 {
     padding: 0 96px 5rem;
   }
 }
 
 @media screen and (min-width:640px) {
-  .c69 {
+  .c66 {
     grid-template-columns: 1fr 1fr;
     gap: 32px;
   }
 }
 
 @media screen and (min-width:1024px) {
-  .c69 {
+  .c66 {
     grid-template-columns: 1fr 1fr;
     gap: 32px;
   }
 }
 
 @media screen and (min-width:640px) {
-  .c76 {
+  .c73 {
     grid-template-columns: 1fr;
     gap: 32px;
   }
 }
 
 @media screen and (min-width:1024px) {
-  .c76 {
+  .c73 {
     grid-template-columns: 1fr 1fr 1fr;
     gap: 32px;
   }
@@ -4662,11 +4564,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
                         >
                           <div
                             class="c40"
-                          >
-                            <div
-                              class="c41 c42"
-                            />
-                          </div>
+                          />
                           <span />
                         </div>
                       </div>
@@ -4674,10 +4572,10 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
                   </div>
                 </div>
                 <div
-                  class="c43"
+                  class="c41"
                 >
                   <div
-                    class="c44"
+                    class="c42"
                     color="#222222"
                     data-testid="swap-currency-button"
                   >
@@ -4706,11 +4604,11 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
                 </div>
               </div>
               <div
-                class="c45"
+                class="c43"
               >
                 <div>
                   <div
-                    class="c23 c46"
+                    class="c23 c44"
                   >
                     <div
                       class="c24"
@@ -4751,7 +4649,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
                               class="c14"
                             >
                               <button
-                                class="c15 c16 c30 c47 open-currency-select-button"
+                                class="c15 c16 c30 c45 open-currency-select-button"
                               >
                                 <span
                                   class="c32"
@@ -4766,7 +4664,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
                                     </span>
                                   </div>
                                   <svg
-                                    class="c48"
+                                    class="c46"
                                   >
                                     dropdown.svg
                                   </svg>
@@ -4783,23 +4681,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
                           >
                             <div
                               class="c40"
-                            >
-                              <div
-                                class="c7 c49"
-                              >
-                                <div
-                                  class="c26 css-142zc9n"
-                                >
-                                  <div
-                                    class="c14"
-                                  >
-                                    <div>
-                                      -
-                                    </div>
-                                  </div>
-                                </div>
-                              </div>
-                            </div>
+                            />
                             <span />
                           </div>
                         </div>
@@ -4809,11 +4691,11 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
                 </div>
                 <div>
                   <button
-                    class="c50 c16 c51"
+                    class="c47 c16 c48"
                     font-weight="535"
                   >
                     <div
-                      class="c52 c53"
+                      class="c49 c50"
                     />
                     Connect wallet
                   </button>
@@ -4825,52 +4707,52 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
       </a>
     </div>
     <div
-      class="c54"
+      class="c51"
     />
     <div
-      class="c55"
+      class="c52"
     >
       <div
-        class="c56"
+        class="c53"
       />
     </div>
     <div
-      class="c57"
+      class="c54"
     >
       <h1
-        class="c58"
+        class="c55"
       >
         Trade crypto and NFTs with confidence
       </h1>
       <div
-        class="c59"
+        class="c56"
       >
         <div
-          class="c60"
+          class="c57"
         >
           Buy, sell, and explore tokens and NFTs
         </div>
       </div>
       <span
-        class="c61"
+        class="c58"
       >
         <a
-          class="c2 c16 c62 c63"
+          class="c2 c16 c59 c60"
           href="/swap"
         >
           <p
-            class="c64"
+            class="c61"
           >
             Get started
           </p>
         </a>
       </span>
       <div
-        class="c65"
+        class="c62"
       >
         Learn more
         <svg
-          class="c66"
+          class="c63"
           fill="none"
           height="24"
           stroke="currentColor"
@@ -4898,7 +4780,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
         </svg>
       </div>
       <a
-        class="c67"
+        class="c64"
         href="https://wallet.uniswap.org/?utm_source=home_page&utm_medium=webapp&utm_campaign=wallet_microsite&utm_id=1"
       >
         <svg
@@ -4915,32 +4797,32 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
       </a>
     </div>
     <div
-      class="c68"
+      class="c65"
     >
       <div
-        class="c69"
+        class="c66"
         cols="2"
       >
         <a
-          class="c70"
+          class="c67"
           href="/swap"
         >
           <div
-            class="c71"
+            class="c68"
           >
             <div
-              class="c72"
+              class="c69"
             >
               Swap tokens
             </div>
           </div>
           <div
-            class="c73"
+            class="c70"
             type="Primary"
           >
             Buy, sell, and explore tokens on Ethereum, Polygon, Optimism, and more.
             <div
-              class="c73 c74"
+              class="c70 c71"
               type="Primary"
             >
               Trade Tokens
@@ -4948,25 +4830,25 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
           </div>
         </a>
         <a
-          class="c75"
+          class="c72"
           href="/nfts"
         >
           <div
-            class="c71"
+            class="c68"
           >
             <div
-              class="c72"
+              class="c69"
             >
               Trade NFTs
             </div>
           </div>
           <div
-            class="c73"
+            class="c70"
             type="Primary"
           >
             Buy and sell NFTs across marketplaces to find more listings at better prices.
             <div
-              class="c73 c74"
+              class="c70 c71"
               type="Primary"
             >
               Explore NFTs
@@ -4975,20 +4857,20 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
         </a>
       </div>
       <div
-        class="c76"
+        class="c73"
         cols="3"
       >
         <a
-          class="c77"
+          class="c74"
           href="https://support.uniswap.org/hc/en-us/articles/11306574799117-How-to-use-Moon-Pay-on-the-Uniswap-web-app-"
           rel="noopenener noreferrer"
           target="_blank"
         >
           <div
-            class="c71"
+            class="c68"
           >
             <div
-              class="c72"
+              class="c69"
             >
               Buy crypto
             </div>
@@ -5015,12 +4897,12 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
             </svg>
           </div>
           <div
-            class="c78"
+            class="c75"
             type="Secondary"
           >
             Buy crypto with your credit card or bank account at the best rates.
             <div
-              class="c78 c74"
+              class="c75 c71"
               type="Secondary"
             >
               Buy now
@@ -5028,30 +4910,30 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
           </div>
         </a>
         <a
-          class="c77"
+          class="c74"
           href="/pools"
         >
           <div
-            class="c71"
+            class="c68"
           >
             <div
-              class="c72"
+              class="c69"
             >
               Earn
             </div>
             <img
               alt="Analytics"
-              class="c79"
+              class="c76"
               src="aboutArrowLight.png"
             />
           </div>
           <div
-            class="c78"
+            class="c75"
             type="Secondary"
           >
             Provide liquidity to pools on Uniswap and earn fees on swaps.
             <div
-              class="c78 c74"
+              class="c75 c71"
               type="Secondary"
             >
               Provide liquidity
@@ -5059,16 +4941,16 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
           </div>
         </a>
         <a
-          class="c77"
+          class="c74"
           href="https://docs.uniswap.org"
           rel="noopenener noreferrer"
           target="_blank"
         >
           <div
-            class="c71"
+            class="c68"
           >
             <div
-              class="c72"
+              class="c69"
             >
               Build dApps
             </div>
@@ -5095,12 +4977,12 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
             </svg>
           </div>
           <div
-            class="c78"
+            class="c75"
             type="Secondary"
           >
             Build apps and tools on the largest DeFi protocol on Ethereum.
             <div
-              class="c78 c74"
+              class="c75 c71"
               type="Secondary"
             >
               Developer docs
@@ -5109,27 +4991,27 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
         </a>
       </div>
       <div
-        class="c80"
+        class="c77"
       >
         <div
-          class="c81"
+          class="c78"
         >
           <div
-            class="c82"
+            class="c79"
           >
             Powered by the Uniswap Protocol
           </div>
           <div
-            class="c83"
+            class="c80"
           >
             The leading decentralized crypto trading protocol, governed by a global community.
           </div>
         </div>
         <div
-          class="c84"
+          class="c81"
         >
           <a
-            class="c85 c86 c87"
+            class="c82 c83 c84"
             href="https://uniswap.org"
             rel="noopener noreferrer"
             target="_blank"
@@ -5140,53 +5022,53 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
         </div>
       </div>
       <div
-        class="c88"
+        class="c85"
       >
         <div
-          class="c89 c90"
+          class="c86 c87"
         >
           <img
             alt="Uniswap Logo"
-            class="c91"
+            class="c88"
             src="unicornEmbossLight.png"
           />
           <div
-            class="c92"
+            class="c89"
           >
             <a
-              class="c93"
+              class="c90"
               href="https://discord.gg/FCfyBSbCU5"
               rel="noopener noreferrer"
               target="_blank"
             >
               <svg
-                class="c94"
+                class="c91"
                 size="32"
               >
                 discord.svg
               </svg>
             </a>
             <a
-              class="c93"
+              class="c90"
               href="https://twitter.com/uniswap"
               rel="noopener noreferrer"
               target="_blank"
             >
               <svg
-                class="c95"
+                class="c92"
                 size="32"
               >
                 twitter-safe.svg
               </svg>
             </a>
             <a
-              class="c93"
+              class="c90"
               href="https://github.com/Uniswap"
               rel="noopener noreferrer"
               target="_blank"
             >
               <svg
-                class="c96"
+                class="c93"
                 size="32"
               >
                 github.svg
@@ -5194,7 +5076,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
             </a>
           </div>
           <span
-            class="c97"
+            class="c94"
           >
             © 
             2023
@@ -5202,51 +5084,51 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
           </span>
         </div>
         <div
-          class="c98"
+          class="c95"
         >
           <div
-            class="c99"
+            class="c96"
           >
             <span
-              class="c100"
+              class="c97"
             >
               App
             </span>
             <a
-              class="c101 c102"
+              class="c98 c99"
               href="/swap"
             >
               Swap
             </a>
             <a
-              class="c101 c102"
+              class="c98 c99"
               href="/tokens"
             >
               Tokens
             </a>
             <a
-              class="c101 c102"
+              class="c98 c99"
               href="/nfts"
             >
               NFTs
             </a>
             <a
-              class="c101 c102"
+              class="c98 c99"
               href="/pools"
             >
               Pools
             </a>
           </div>
           <div
-            class="c99"
+            class="c96"
           >
             <span
-              class="c100"
+              class="c97"
             >
               Protocol
             </span>
             <a
-              class="c103 c104"
+              class="c100 c101"
               href="https://uniswap.org/community"
               rel="noopener noreferrer"
               target="_blank"
@@ -5254,7 +5136,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
               Community
             </a>
             <a
-              class="c103 c104"
+              class="c100 c101"
               href="https://uniswap.org/governance"
               rel="noopener noreferrer"
               target="_blank"
@@ -5262,7 +5144,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
               Governance
             </a>
             <a
-              class="c103 c104"
+              class="c100 c101"
               href="https://uniswap.org/developers"
               rel="noopener noreferrer"
               target="_blank"
@@ -5271,15 +5153,15 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
             </a>
           </div>
           <div
-            class="c99"
+            class="c96"
           >
             <span
-              class="c100"
+              class="c97"
             >
               Company
             </span>
             <a
-              class="c103 c104"
+              class="c100 c101"
               href="https://boards.greenhouse.io/uniswaplabs"
               rel="noopener noreferrer"
               target="_blank"
@@ -5287,7 +5169,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
               Careers
             </a>
             <a
-              class="c103 c104"
+              class="c100 c101"
               href="https://uniswap.org/blog"
               rel="noopener noreferrer"
               target="_blank"
@@ -5296,15 +5178,15 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
             </a>
           </div>
           <div
-            class="c99"
+            class="c96"
           >
             <span
-              class="c100"
+              class="c97"
             >
               Get Help
             </span>
             <a
-              class="c103 c104"
+              class="c100 c101"
               href="https://support.uniswap.org/hc/en-us/requests/new"
               rel="noopener noreferrer"
               target="_blank"
@@ -5312,7 +5194,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
               Contact Us
             </a>
             <a
-              class="c103 c104"
+              class="c100 c101"
               href="https://support.uniswap.org/hc/en-us"
               rel="noopener noreferrer"
               target="_blank"
@@ -5322,50 +5204,50 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
           </div>
         </div>
         <div
-          class="c89 c105"
+          class="c86 c102"
         >
           <img
             alt="Uniswap Logo"
-            class="c91"
+            class="c88"
             src="unicornEmbossLight.png"
           />
           <div
-            class="c92"
+            class="c89"
           >
             <a
-              class="c93"
+              class="c90"
               href="https://discord.gg/FCfyBSbCU5"
               rel="noopener noreferrer"
               target="_blank"
             >
               <svg
-                class="c94"
+                class="c91"
                 size="32"
               >
                 discord.svg
               </svg>
             </a>
             <a
-              class="c93"
+              class="c90"
               href="https://twitter.com/uniswap"
               rel="noopener noreferrer"
               target="_blank"
             >
               <svg
-                class="c95"
+                class="c92"
                 size="32"
               >
                 twitter-safe.svg
               </svg>
             </a>
             <a
-              class="c93"
+              class="c90"
               href="https://github.com/Uniswap"
               rel="noopener noreferrer"
               target="_blank"
             >
               <svg
-                class="c96"
+                class="c93"
                 size="32"
               >
                 github.svg
@@ -5373,7 +5255,7 @@ exports[`disable nft on landing page renders nft information and card 1`] = `
             </a>
           </div>
           <span
-            class="c97"
+            class="c94"
           >
             © 
             2023
diff --git a/src/pages/Swap/index.tsx b/src/pages/Swap/index.tsx
index 0510f20354..260bdf35c1 100644
--- a/src/pages/Swap/index.tsx
+++ b/src/pages/Swap/index.tsx
@@ -323,6 +323,8 @@ export function Swap({
     [independentField, parsedAmount, showWrap, trade]
   )
 
+  const showFiatValueInput = Boolean(parsedAmounts[Field.INPUT])
+  const showFiatValueOutput = Boolean(parsedAmounts[Field.OUTPUT])
   const getSingleUnitAmount = (currency?: Currency) => {
     if (!currency) return
     return CurrencyAmount.fromRawAmount(currency, JSBI.BigInt(10 ** currency.decimals))
@@ -641,7 +643,7 @@ export function Swap({
               currency={currencies[Field.INPUT] ?? null}
               onUserInput={handleTypeInput}
               onMax={handleMaxInput}
-              fiatValue={fiatValueInput}
+              fiatValue={showFiatValueInput ? fiatValueInput : undefined}
               onCurrencySelect={handleInputSelect}
               otherCurrency={currencies[Field.OUTPUT]}
               showCommonBases
@@ -682,7 +684,7 @@ export function Swap({
                 label={<Trans>You receive</Trans>}
                 showMaxButton={false}
                 hideBalance={false}
-                fiatValue={fiatValueOutput}
+                fiatValue={showFiatValueOutput ? fiatValueOutput : undefined}
                 priceImpact={stablecoinPriceImpact}
                 currency={currencies[Field.OUTPUT] ?? null}
                 onCurrencySelect={handleOutputSelect}