From 1df728da1445239e2afd9359763958bae8432aee Mon Sep 17 00:00:00 2001
From: lukaw3d <lukajeran@oasislabs.com>
Date: Wed, 15 May 2024 02:45:05 +0200
Subject: [PATCH 1/3] Remove invalid css

---
 src/app/pages/ParaTimesPage/ParaTimeFormFooter/index.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/pages/ParaTimesPage/ParaTimeFormFooter/index.tsx b/src/app/pages/ParaTimesPage/ParaTimeFormFooter/index.tsx
index 135e2be873..775d3387ad 100644
--- a/src/app/pages/ParaTimesPage/ParaTimeFormFooter/index.tsx
+++ b/src/app/pages/ParaTimesPage/ParaTimeFormFooter/index.tsx
@@ -44,7 +44,7 @@ export const ParaTimeFormFooter = ({
             label={secondaryLabel || t('paraTimes.footer.back', 'Back')}
             onClick={secondaryAction}
             plain
-            style={{ textAlign: 'center', fontSize: '14px', textDecoration: 'underline', color: 'brand' }}
+            style={{ textAlign: 'center', fontSize: '14px', textDecoration: 'underline' }}
           />
         )}
       </Box>

From d3ab90c991ec85ceaae8003288ad03bb78a8b529 Mon Sep 17 00:00:00 2001
From: lukaw3d <lukajeran@oasislabs.com>
Date: Fri, 26 Apr 2024 01:28:50 +0200
Subject: [PATCH 2/3] Fix transaction preview layout in extension

Unstake transaction message is too long to fix in one line.
---
 src/app/components/TransactionTypeFormatter/index.tsx | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/src/app/components/TransactionTypeFormatter/index.tsx b/src/app/components/TransactionTypeFormatter/index.tsx
index b51534ccee..86b1bf41dc 100644
--- a/src/app/components/TransactionTypeFormatter/index.tsx
+++ b/src/app/components/TransactionTypeFormatter/index.tsx
@@ -1,7 +1,6 @@
 import { NewTransactionType } from 'app/state/transaction/types'
 import React, { memo } from 'react'
 import { useTranslation } from 'react-i18next'
-import { Box } from 'grommet/es6/components/Box'
 import { Text } from 'grommet/es6/components/Text'
 
 interface Props {
@@ -20,13 +19,13 @@ export const TransactionTypeFormatter = memo((props: Props) => {
 
   const typeMessage = typeMap[type]
   return (
-    <Box direction="row" align="center" gap="xsmall">
+    <span>
       <Text color="grayMedium" size="small" style={{ textTransform: 'capitalize', fontWeight: 600 }}>
         {type}
       </Text>
       <Text color="grayMedium" size="xsmall" style={{ letterSpacing: 0 }}>
-        ({typeMessage})
+        &nbsp;({typeMessage})
       </Text>
-    </Box>
+    </span>
   )
 })

From 31a780b13df5c6f2c843219710864b28c33a60e4 Mon Sep 17 00:00:00 2001
From: lukaw3d <lukajeran@oasislabs.com>
Date: Wed, 24 Apr 2024 17:54:02 +0200
Subject: [PATCH 3/3] Reduce loading text size

---
 .changelog/1937.trivial.md                                  | 1 +
 src/app/components/Persist/PersistLoadingGate.tsx           | 2 +-
 src/app/components/TransactionModal/index.tsx               | 6 +++---
 src/app/pages/AccountPage/index.tsx                         | 4 ++--
 .../Features/ImportAccountsSelectionModal/index.tsx         | 2 +-
 5 files changed, 8 insertions(+), 7 deletions(-)
 create mode 100644 .changelog/1937.trivial.md

diff --git a/.changelog/1937.trivial.md b/.changelog/1937.trivial.md
new file mode 100644
index 0000000000..7225b792a3
--- /dev/null
+++ b/.changelog/1937.trivial.md
@@ -0,0 +1 @@
+Reduce loading text size
diff --git a/src/app/components/Persist/PersistLoadingGate.tsx b/src/app/components/Persist/PersistLoadingGate.tsx
index 8613f77592..2f88896322 100644
--- a/src/app/components/Persist/PersistLoadingGate.tsx
+++ b/src/app/components/Persist/PersistLoadingGate.tsx
@@ -24,7 +24,7 @@ export function PersistLoadingGate(props: Props) {
         <Layer modal background="background-front" responsive={false}>
           <Box pad="medium" gap="medium" direction="row" align="center">
             <Spinner size="medium" />
-            <Text size="large">{t('persist.loading', 'Loading')}</Text>
+            <Text size="medium">{t('persist.loading', 'Loading')}</Text>
           </Box>
         </Layer>
       )}
diff --git a/src/app/components/TransactionModal/index.tsx b/src/app/components/TransactionModal/index.tsx
index 814197d8b0..3c4ade54f6 100644
--- a/src/app/components/TransactionModal/index.tsx
+++ b/src/app/components/TransactionModal/index.tsx
@@ -107,19 +107,19 @@ export function TransactionModal() {
         {step === TransactionStep.Building && (
           <Box direction="row" align="center" gap="medium">
             <Spinner size="medium" />
-            <Text size="large">{t('transaction.step.building', 'Building transaction')}</Text>
+            <Text size="medium">{t('transaction.step.building', 'Building transaction')}</Text>
           </Box>
         )}
         {step === TransactionStep.Signing && (
           <Box direction="row" align="center" gap="medium">
             <Spinner size="medium" />
-            <Text size="large">{t('transaction.step.signing', 'Signing transaction')}</Text>
+            <Text size="medium">{t('transaction.step.signing', 'Signing transaction')}</Text>
           </Box>
         )}
         {step === TransactionStep.Submitting && (
           <Box direction="row" align="center" gap="medium">
             <Spinner size="medium" />
-            <Text size="large">{t('transaction.step.submitting', 'Submitting transaction')}</Text>
+            <Text size="medium">{t('transaction.step.submitting', 'Submitting transaction')}</Text>
           </Box>
         )}
       </Box>
diff --git a/src/app/pages/AccountPage/index.tsx b/src/app/pages/AccountPage/index.tsx
index cdec66ecf7..c44e60222b 100644
--- a/src/app/pages/AccountPage/index.tsx
+++ b/src/app/pages/AccountPage/index.tsx
@@ -108,9 +108,9 @@ export function AccountPage(props: AccountPageProps) {
       {active && <TransactionModal />}
       {(stake.loading || account.loading) && (
         <Layer modal background="background-front" responsive={false}>
-          <Box pad="medium" gap="medium" direction="row" align="center">
+          <Box pad="medium" gap="medium" direction="row" align="center" width="max-content">
             <Spinner size="medium" />
-            <Text size="large">{t('account.loading', 'Loading account')}</Text>
+            <Text size="medium">{t('account.loading', 'Loading account')}</Text>
           </Box>
         </Layer>
       )}
diff --git a/src/app/pages/OpenWalletPage/Features/ImportAccountsSelectionModal/index.tsx b/src/app/pages/OpenWalletPage/Features/ImportAccountsSelectionModal/index.tsx
index 7e9ebf9ec6..bfdb92d356 100644
--- a/src/app/pages/OpenWalletPage/Features/ImportAccountsSelectionModal/index.tsx
+++ b/src/app/pages/OpenWalletPage/Features/ImportAccountsSelectionModal/index.tsx
@@ -112,7 +112,7 @@ export function ImportAccountsSelectionModal(props: ImportAccountsSelectionModal
               <Box direction="row" gap="medium" alignContent="center" pad={{ top: 'small' }}>
                 <Spinner size="medium" />
                 <Box alignSelf="center">
-                  <Text size="xlarge">
+                  <Text size="medium">
                     <ImportAccountsStepFormatter step={importAccounts.step} />
                   </Text>
                 </Box>