Merge pull request #1153 from ubavic/cash-out-setup

fix: misaligned button

new-lamassu-admin/src/pages/Cashout/WizardStep.js

@@ -75,7 +75,7 @@ const WizardStep = ({
           }}
           enableReinitialize
           validationSchema={schema}>
-          <Form>
+          <Form className={classes.column}>
             <div className={classes.header}>
               {steps.map(
                 ({ type, display, component }, idx) =>
@@ -122,31 +122,31 @@ const WizardStep = ({
       )}
 
       {isLastStep && (
-        <div className={classes.disclaimer}>
+        <div className={classes.column}>
-          <Info2 className={classes.title}>Cash Cassette Bill Count</Info2>
-          <P>
-            <WarningIcon className={classes.disclaimerIcon} />
-            When enabling cash-out, your bill count will be automatically set to
-            zero. Make sure you physically put cash inside the cash cassettes to
-            allow the machine to dispense it to your users. If you already did,
-            make sure you set the correct cash cassette bill count for this
-            machine on your Cash Boxes & Cassettes tab under Maintenance.
-          </P>
-
-          <Info2 className={classes.title}>Default Commissions</Info2>
-          <P>
-            <WarningIcon className={classes.disclaimerIcon} />
-            When enabling cash-out, default commissions will be set. To change
-            commissions for this machine, please go to the Commissions tab under
-            Settings where you can set exceptions for each of the available
-            cryptocurrencies.
-          </P>
           <div>
-            {error && <ErrorMessage>Failed to save</ErrorMessage>}
+            <Info2 className={classes.title}>Cash Cassette Bill Count</Info2>
-            <Button className={classes.submit} onClick={() => onContinue()}>
+            <P>
-              {label}
+              <WarningIcon className={classes.disclaimerIcon} />
-            </Button>
+              When enabling cash-out, your bill count will be automatically set
+              to zero. Make sure you physically put cash inside the cash
+              cassettes to allow the machine to dispense it to your users. If
+              you already did, make sure you set the correct cash cassette bill
+              count for this machine on your Cash Boxes & Cassettes tab under
+              Maintenance.
+            </P>
+            <Info2 className={classes.title}>Default Commissions</Info2>
+            <P>
+              <WarningIcon className={classes.disclaimerIcon} />
+              When enabling cash-out, default commissions will be set. To change
+              commissions for this machine, please go to the Commissions tab
+              under Settings where you can set exceptions for each of the
+              available cryptocurrencies.
+            </P>
           </div>
+          {error && <ErrorMessage>Failed to save</ErrorMessage>}
+          <Button className={classes.submit} onClick={() => onContinue()}>
+            {label}
+          </Button>
         </div>
       )}
     </>

new-lamassu-admin/src/pages/Cashout/WizardStep.styles.js

@@ -30,22 +30,21 @@ export default {
   suffix: {
     paddingLeft: spacer * 2
   },
-  button: {
-    marginLeft: 'auto'
-  },
   submit: {
-    float: 'right'
+    alignSelf: 'flex-end'
   },
   picker: {
     width: LABEL_WIDTH
   },
   header: {
-    display: 'flex',
+    display: 'flex'
-    marginBottom: 95
   },
-  thirdStepHeader: {
+  column: {
     display: 'flex',
-    paddingBottom: 188
+    flexGrow: 2,
+    flexDirection: 'column',
+    paddingBottom: 32,
+    justifyContent: 'space-between'
   },
   step: {
     flex: 1
@@ -55,21 +54,8 @@ export default {
     top: -20,
     right: 14
   },
-  content: {
-    display: 'flex',
-    flexDirection: 'column',
-    justifyContent: 'space-between',
-    flex: 1,
-    paddingBottom: 32
-  },
-  disclaimer: {
-    display: 'flex',
-    flex: 1,
-    flexDirection: 'column',
-    justifyContent: 'space-between'
-  },
   disclaimerIcon: {
     float: 'left',
-    margin: [[-4, 16, 48, 0]]
+    margin: [[2, 16, 48, 0]]
   }
 }