From ee55c695e65eb56aa62c806793cedc1b3d0ff8d2 Mon Sep 17 00:00:00 2001
From: Jaco Greeff <jacogr@gmail.com>
Date: Sun, 28 Jun 2020 07:13:44 +0200
Subject: [PATCH] Tip closing counter adjustment (#3069)

---
 packages/page-treasury/src/Overview/Tip.tsx | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/packages/page-treasury/src/Overview/Tip.tsx b/packages/page-treasury/src/Overview/Tip.tsx
index 8ee91f29e7..06c97223e0 100644
--- a/packages/page-treasury/src/Overview/Tip.tsx
+++ b/packages/page-treasury/src/Overview/Tip.tsx
@@ -5,6 +5,7 @@
 import { AccountId, Balance, BlockNumber, OpenTip } from '@polkadot/types/interfaces';
 
 import React, { useEffect, useState } from 'react';
+import styled from 'styled-components';
 import { AddressSmall, AddressMini, Expander, Icon, TxButton } from '@polkadot/react-components';
 import { useAccounts, useApi, useCall } from '@polkadot/react-hooks';
 import { BlockToTime, FormatBalance } from '@polkadot/react-query';
@@ -97,10 +98,10 @@ function Tip ({ bestNumber, className = '', hash, isMember, members }: Props): R
           ? bestNumber && (
             closesAt.gt(bestNumber)
               ? (
-                <>
+                <div className='closingTimer'>
                   <BlockToTime blocks={closesAt.sub(bestNumber)} />
                   #{formatNumber(closesAt)}
-                </>
+                </div>
               )
               : (
                 <TipClose
@@ -143,4 +144,8 @@ function Tip ({ bestNumber, className = '', hash, isMember, members }: Props): R
   );
 }
 
-export default React.memo(Tip);
+export default React.memo(styled(Tip)`
+  .closingTimer {
+    padding: 0 0.5rem;
+  }
+`);