From 71c8b31ffe9fae406a398d9d0dece99238ab8f57 Mon Sep 17 00:00:00 2001
From: Dexter <dexter@vega.xyz>
Date: Thu, 8 Sep 2022 14:59:35 +0100
Subject: [PATCH] fix: tranches styles look terrible

---
 apps/explorer/src/app/routes/validators/index.tsx      |  2 +-
 .../routes/redemption/home/redemption-information.tsx  |  6 +++---
 .../token/src/routes/redemption/home/vesting-table.tsx | 10 +++++-----
 apps/token/src/routes/redemption/tranche-item.tsx      |  4 ++--
 4 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/apps/explorer/src/app/routes/validators/index.tsx b/apps/explorer/src/app/routes/validators/index.tsx
index 9220dc767..baf2e0569 100644
--- a/apps/explorer/src/app/routes/validators/index.tsx
+++ b/apps/explorer/src/app/routes/validators/index.tsx
@@ -18,7 +18,7 @@ const NODES_QUERY = gql`
       avatarUrl
       pubkey
       tmPubkey
-      ethereumAddress
+      ethereumAdddress
       location
       stakedByOperator
       stakedByDelegates
diff --git a/apps/token/src/routes/redemption/home/redemption-information.tsx b/apps/token/src/routes/redemption/home/redemption-information.tsx
index e8729e994..3a73535ba 100644
--- a/apps/token/src/routes/redemption/home/redemption-information.tsx
+++ b/apps/token/src/routes/redemption/home/redemption-information.tsx
@@ -74,10 +74,10 @@ export const RedemptionInformation = () => {
 
   return (
     <section data-testid="redemption-page">
-      <div className="mb-12">
+      <div className="mb-2">
         <AddLockedTokenAddress />
       </div>
-      <p className="mb-24" data-testid="redemption-description">
+      <p className="mb-6" data-testid="redemption-description">
         {t(
           '{{address}} has {{balance}} VEGA tokens in {{tranches}} tranches of the vesting contract.',
           {
@@ -87,7 +87,7 @@ export const RedemptionInformation = () => {
           }
         )}
       </p>
-      <div className="mb-24">
+      <div className="mb-6">
         <VestingTable
           associated={lien}
           locked={totalLockedBalance}
diff --git a/apps/token/src/routes/redemption/home/vesting-table.tsx b/apps/token/src/routes/redemption/home/vesting-table.tsx
index 0b5a07187..881b93549 100644
--- a/apps/token/src/routes/redemption/home/vesting-table.tsx
+++ b/apps/token/src/routes/redemption/home/vesting-table.tsx
@@ -12,7 +12,7 @@ export interface VestingTableProps {
 }
 
 const VestingTableIndicatorSquare = ({ colour }: { colour: string }) => (
-  <span className={`bg-${colour} inline-block h-12 w-12 mr-4`} />
+  <span className={`bg-${colour} inline-block h-4 w-4 mr-4`} />
 );
 
 export const VestingTable = ({
@@ -65,17 +65,17 @@ export const VestingTable = ({
       </KeyValueTable>
       <div className="flex border-white border">
         <div
-          className="bg-vega-pink h-16"
+          className="bg-vega-pink h-4"
           style={{ flex: lockedPercentage.toNumber() }}
         />
         <div
-          className="bg-vega-green h-16"
+          className="bg-vega-green h-4"
           style={{ flex: vestedPercentage.toNumber() }}
         />
       </div>
-      <div className="flex h-4 mt-4">
+      <div className="flex h-1 mt-1">
         <div
-          className="bg-vega-yellow h-4"
+          className="bg-vega-yellow h-1"
           style={{ flex: stakedPercentage.toNumber() }}
         />
         <div
diff --git a/apps/token/src/routes/redemption/tranche-item.tsx b/apps/token/src/routes/redemption/tranche-item.tsx
index daf6b6ad7..dabf180ad 100644
--- a/apps/token/src/routes/redemption/tranche-item.tsx
+++ b/apps/token/src/routes/redemption/tranche-item.tsx
@@ -33,10 +33,10 @@ export const TrancheItem = ({
 }: TrancheItemProps) => {
   const { t } = useTranslation();
   const labelClasses =
-    'inline-block uppercase bg-white text-black py-4 px-8 font-mono';
+    'inline-block uppercase bg-white text-black py-1 px-2 font-mono';
 
   return (
-    <section data-testid="tranche-item" className="mb-40">
+    <section data-testid="tranche-item" className="mb-10">
       <div className="flex border-b">
         {link ? (
           <Link to={link}>