From 82490145cd458c2bcc9e56cebee554f8cab0bc3e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jos=C3=A9=20Oliveira?= <josepfo.w@gmail.com>
Date: Tue, 16 Nov 2021 18:49:00 +0000
Subject: [PATCH] fix: fee discount selector alignment

---
 new-lamassu-admin/src/pages/Wallet/Wallet.js  | 53 +++++++++----------
 .../src/pages/Wallet/Wallet.styles.js         | 13 ++++-
 2 files changed, 37 insertions(+), 29 deletions(-)

diff --git a/new-lamassu-admin/src/pages/Wallet/Wallet.js b/new-lamassu-admin/src/pages/Wallet/Wallet.js
index 57a51644..b80ea805 100644
--- a/new-lamassu-admin/src/pages/Wallet/Wallet.js
+++ b/new-lamassu-admin/src/pages/Wallet/Wallet.js
@@ -137,32 +137,32 @@ const Wallet = ({ name: SCREEN_KEY }) => {
 
   return (
     <>
-      <TitleSection
-        title="Wallet Settings"
-        button={{
-          text: 'Advanced settings',
-          icon: SettingsIcon,
-          inverseIcon: ReverseSettingsIcon,
-          toggle: setAdvancedSettings
-        }}
-      />
+      <div className={classes.header}>
+        <TitleSection
+          title="Wallet Settings"
+          button={{
+            text: 'Advanced settings',
+            icon: SettingsIcon,
+            inverseIcon: ReverseSettingsIcon,
+            toggle: setAdvancedSettings
+          }}
+        />
+        <Box alignItems="center" justifyContent="end">
+          <Label1 className={classes.feeDiscountLabel}>Fee discount</Label1>
+          <Box
+            display="flex"
+            alignItems="center"
+            justifyContent="end"
+            mr="-4px">
+            <P className={classes.selection}>{selectedDiscount}</P>
+            <IconButton onClick={() => setEditingFeeDiscount(true)}>
+              <EditIcon />
+            </IconButton>
+          </Box>
+        </Box>
+      </div>
       {!advancedSettings && (
         <>
-          <Box alignItems="center" justifyContent="end">
-            <Label1 className={classes.cashboxReset}>Fee discount</Label1>
-            <Box
-              display="flex"
-              alignItems="center"
-              justifyContent="end"
-              mr="-4px">
-              <P className={classes.selection}>{selectedDiscount}</P>
-              <IconButton
-                onClick={() => setEditingFeeDiscount(true)}
-                className={classes.button}>
-                <EditIcon />
-              </IconButton>
-            </Box>
-          </Box>
           <EditableTable
             name="test"
             namespaces={R.map(R.path(['code']))(cryptoCurrencies)}
@@ -213,7 +213,7 @@ const Wallet = ({ name: SCREEN_KEY }) => {
           width={478}
           handleClose={() => setEditingFeeDiscount(null)}
           open={true}>
-          <P className={classes.descriptions}>
+          <P>
             Set a priority level for your outgoing BTC transactions, selecting a
             percentage off of the fee estimate your wallet uses.
           </P>
@@ -222,9 +222,8 @@ const Wallet = ({ name: SCREEN_KEY }) => {
             value={selectedDiscount}
             options={radioButtonOptions}
             onChange={handleRadioButtons}
-            className={classes.radioButtons}
           />
-          <DialogActions className={classes.actions}>
+          <DialogActions>
             <Button
               onClick={() =>
                 saveFeeDiscount({ BTC_feeMultiplier: selectedDiscount })
diff --git a/new-lamassu-admin/src/pages/Wallet/Wallet.styles.js b/new-lamassu-admin/src/pages/Wallet/Wallet.styles.js
index ca6dfc95..f9a6bb52 100644
--- a/new-lamassu-admin/src/pages/Wallet/Wallet.styles.js
+++ b/new-lamassu-admin/src/pages/Wallet/Wallet.styles.js
@@ -1,7 +1,16 @@
+import { offColor } from 'src/styling/variables'
+
 export default {
-  tableWidth: {
+  header: {
     display: 'flex',
     alignItems: 'center',
-    marginRight: 90
+    justifyContent: 'space-between'
+  },
+  feeDiscountLabel: {
+    color: offColor,
+    margin: [[13, 0, -5, 20]]
+  },
+  selection: {
+    marginRight: 12
   }
 }