Remove concept of 'padded' in Button because it's the normal case

src/components/AccountPage/EmptyStateAccount.js

@@ -50,7 +50,7 @@ class EmptyStateAccount extends PureComponent<Props, *> {
               {'app is installed to receive funds.'}
             </Trans>
           </Description>
-          <Button mt={5} padded primary onClick={() => openModal(MODAL_RECEIVE, { account })}>
+          <Button mt={5} primary onClick={() => openModal(MODAL_RECEIVE, { account })}>
             <Box horizontal flow={1} alignItems="center">
               <IconReceive size={12} />
               <Box>{t('app:account.emptyState.buttons.receiveFunds')}</Box>

src/components/DashboardPage/EmptyState.js

@@ -50,15 +50,10 @@ class EmptyState extends PureComponent<Props, *> {
             {t('app:emptyState.dashboard.desc')}
           </Description>
           <Box mt={5} horizontal style={{ width: 300 }} flow={3} justify="center">
-            <Button padded primary style={{ minWidth: 120 }} onClick={this.handleInstallApp}>
+            <Button primary style={{ minWidth: 120 }} onClick={this.handleInstallApp}>
               {t('app:emptyState.dashboard.buttons.installApp')}
             </Button>
-            <Button
+            <Button outline style={{ minWidth: 120 }} onClick={() => openModal(MODAL_ADD_ACCOUNTS)}>
-              padded
-              outline
-              style={{ minWidth: 120 }}
-              onClick={() => openModal(MODAL_ADD_ACCOUNTS)}
-            >
               {t('app:emptyState.dashboard.buttons.addAccount')}
             </Button>
           </Box>

src/components/ExportLogsBtn.js

@@ -71,7 +71,7 @@ class ExportLogsBtn extends Component<{
     return hookToShortcut ? (
       <KeyHandler keyValue="e" onKeyHandle={this.onKeyHandle} />
     ) : (
-      <Button primary event="ExportLogs" onClick={this.handleExportLogs}>
+      <Button small primary event="ExportLogs" onClick={this.handleExportLogs}>
         {t('app:settings.exportLogs.btn')}
       </Button>
     )

src/components/ManagerPage/AppsList.js

@@ -226,7 +226,7 @@ class AppsList extends PureComponent<Props, State> {
                   </Box>
                 </ModalContent>
                 <ModalFooter horizontal justifyContent="flex-end" style={{ width: '100%' }}>
-                  <Button primary padded onClick={this.handleCloseModal}>
+                  <Button primary onClick={this.handleCloseModal}>
                     {t('app:common.close')}
                   </Button>
                 </ModalFooter>
@@ -254,7 +254,7 @@ class AppsList extends PureComponent<Props, State> {
                   </Box>
                 </ModalContent>
                 <ModalFooter horizontal justifyContent="flex-end" style={{ width: '100%' }}>
-                  <Button primary padded onClick={this.handleCloseModal}>
+                  <Button primary onClick={this.handleCloseModal}>
                     {t('app:common.close')}
                   </Button>
                 </ModalFooter>

src/components/Onboarding/OnboardingFooter.js

@@ -23,10 +23,10 @@ const OnboardingFooter = ({
   ...props
 }: Props) => (
   <OnboardingFooterWrapper {...props}>
-    <Button padded outlineGrey onClick={() => prevStep()}>
+    <Button outlineGrey onClick={() => prevStep()}>
       {t('app:common.back')}
     </Button>
-    <Button padded disabled={isContinueDisabled} primary onClick={() => nextStep()} ml="auto">
+    <Button disabled={isContinueDisabled} primary onClick={() => nextStep()} ml="auto">
       {t('app:common.continue')}
     </Button>
   </OnboardingFooterWrapper>

src/components/Onboarding/steps/Finish.js

@@ -102,7 +102,7 @@ export default class Finish extends Component<StepProps, *> {
             <Description>{t('onboarding:finish.desc')}</Description>
           </Box>
           <Box p={5}>
-            <Button primary padded onClick={() => finish()}>
+            <Button primary onClick={() => finish()}>
               {t('onboarding:finish.openAppButton')}
             </Button>
           </Box>

src/components/Onboarding/steps/GenuineCheck/GenuineCheckErrorPage.js

@@ -53,10 +53,10 @@ export function GenuineCheckErrorPage({
         )}
       </Box>
       <OnboardingFooterWrapper>
-        <Button padded outlineGrey onClick={() => redoGenuineCheck()}>
+        <Button outlineGrey onClick={() => redoGenuineCheck()}>
           {t('app:common.back')}
         </Button>
-        <Button padded danger onClick={() => contactSupport()} ml="auto">
+        <Button danger onClick={() => contactSupport()} ml="auto">
           {t('onboarding:genuineCheck.buttons.contactSupport')}
         </Button>
       </OnboardingFooterWrapper>

src/components/Onboarding/steps/GenuineCheck/GenuineCheckUnavailable.js

@@ -26,12 +26,11 @@ export function GenuineCheckUnavailableFooter({
 }) {
   return (
     <OnboardingFooterWrapper>
-      <Button padded outlineGrey onClick={() => prevStep()}>
+      <Button outlineGrey onClick={() => prevStep()}>
         {t('app:common.back')}
       </Button>
       <Box horizontal ml="auto">
         <Button
-          padded
           disabled={false}
           event="Onboarding Skip Genuine Check"
           onClick={() => nextStep()}
@@ -39,7 +38,7 @@ export function GenuineCheckUnavailableFooter({
         >
           {t('app:common.skipThisStep')}
         </Button>
-        <Button padded onClick={nextStep} disabled primary>
+        <Button onClick={nextStep} disabled primary>
           {t('app:common.continue')}
         </Button>
       </Box>

src/components/Onboarding/steps/NoDevice.js

@@ -65,7 +65,7 @@ class NoDevice extends PureComponent<StepProps, *> {
           </Box>
         </GrowScroll>
         <OnboardingFooterWrapper>
-          <Button padded outlineGrey onClick={() => prevStep()} mr="auto">
+          <Button outlineGrey onClick={() => prevStep()} mr="auto">
             {t('app:common.back')}
           </Button>
         </OnboardingFooterWrapper>

src/components/Onboarding/steps/SetPassword.js

@@ -131,12 +131,11 @@ class SetPassword extends PureComponent<StepProps, State> {
         </StepContainerInner>
 
         <OnboardingFooterWrapper>
-          <Button padded outlineGrey onClick={() => prevStep()}>
+          <Button outlineGrey onClick={() => prevStep()}>
             {t('app:common.back')}
           </Button>
           <Box horizontal ml="auto">
             <Button
-              padded
               event="Onboarding Skip Password"
               onClick={() => nextStep()}
               disabled={false}
@@ -145,7 +144,6 @@ class SetPassword extends PureComponent<StepProps, State> {
               {t('app:common.skipThisStep')}
             </Button>
             <Button
-              padded
               onClick={this.handleSave}
               disabled={!this.isValid() || !newPassword.length || !confirmPassword.length}
               primary

src/components/Onboarding/steps/Start.js

@@ -23,7 +23,7 @@ export default (props: StepProps) => {
         <Box my={5}>
           <Title>{t('onboarding:start.title')}</Title>
         </Box>
-        <Button padded primary onClick={() => jumpStep('init')}>
+        <Button primary onClick={() => jumpStep('init')}>
           {t('onboarding:start.startBtn')}
         </Button>
       </Box>

src/components/SettingsPage/CleanButton.js

@@ -45,7 +45,7 @@ class CleanButton extends PureComponent<Props, State> {
     const { opened } = this.state
     return (
       <Fragment>
-        <Button primary onClick={this.open} event="ClearCacheIntent">
+        <Button small primary onClick={this.open} event="ClearCacheIntent">
           {t('app:settings.profile.softReset')}
         </Button>
 

src/components/SettingsPage/DisablePasswordButton.js

@@ -96,7 +96,7 @@ class DisablePasswordButton extends PureComponent<Props, State> {
 
         <Box horizontal flow={2} align="center">
           {isPasswordEnabled && (
-            <Button onClick={this.handleOpenPasswordModal}>
+            <Button small onClick={this.handleOpenPasswordModal}>
               {t('app:settings.profile.changePassword')}
             </Button>
           )}

src/components/SettingsPage/DisablePasswordModal.js

@@ -98,12 +98,12 @@ class DisablePasswordModal extends PureComponent<Props, State> {
                 </Box>
               </ModalContent>
               <ModalFooter horizontal align="center" justify="flex-end" flow={2}>
-                <Button type="button" padded onClick={onClose}>
+                <Button small type="Button small" onClick={onClose}>
                   {t('app:common.cancel')}
                 </Button>
                 <Button
+                  small
                   primary
-                  padded
                   onClick={this.disablePassword}
                   disabled={!currentPassword && !incorrectPassword}
                 >

src/components/SettingsPage/PasswordModal.js

@@ -111,11 +111,11 @@ class PasswordModal extends PureComponent<Props, State> {
               />
             </ModalContent>
             <ModalFooter horizontal align="center" justify="flex-end" flow={2}>
-              <Button type="button" padded onClick={onClose}>
+              <Button small type="Button small" onClick={onClose}>
                 {t('app:common.cancel')}
               </Button>
               <Button
-                padded
+                small
                 primary
                 onClick={this.handleSave}
                 disabled={!this.isValid() || !newPassword.length || !confirmPassword.length}

src/components/SettingsPage/ReleaseNotesButton.js

@@ -26,6 +26,7 @@ class ReleaseNotesButton extends PureComponent<Props> {
     const version = __APP_VERSION__
     return (
       <Button
+        small
         primary
         onClick={() => {
           openModal(MODAL_RELEASES_NOTES, version)

src/components/SettingsPage/ResetButton.js

@@ -44,7 +44,7 @@ class ResetButton extends PureComponent<Props, State> {
     const { opened, pending } = this.state
     return (
       <Fragment>
-        <Button danger onClick={this.open} event="HardResetIntent">
+        <Button small danger onClick={this.open} event="HardResetIntent">
           {t('app:settings.profile.hardReset')}
         </Button>
 

src/components/SettingsPage/sections/Tools.js

@@ -37,7 +37,7 @@ class TabProfile extends PureComponent<*, *> {
     return (
       <Card flow={3}>
         <Box horizontal>
-          <Button onClick={this.onQRCodeMobileExport} primary>
+          <Button small onClick={this.onQRCodeMobileExport} primary>
             QRCode Mobile Export
           </Button>
 

src/components/base/Button/index.js

@@ -140,9 +140,9 @@ function getStyles(props, state) {
 
 const Base = styled.button.attrs({
   ff: 'Museo Sans|Regular',
-  fontSize: p => p.fontSize || 3,
+  fontSize: p => p.fontSize || (!p.small ? 4 : 3),
-  px: p => (p.padded ? 4 : 2),
+  px: p => (!p.small ? 4 : 3),
-  py: p => (p.padded ? 2 : 0),
+  py: p => (!p.small ? 2 : 0),
   color: 'grey',
   bg: 'transparent',
 })`
@@ -154,7 +154,7 @@ const Base = styled.button.attrs({
   border: none;
   border-radius: ${p => p.theme.radii[1]}px;
   cursor: ${p => (p.disabled ? 'default' : 'pointer')};
-  height: ${p => (p.small ? 30 : p.padded ? 40 : 36)}px;
+  height: ${p => (p.small ? 34 : 40)}px;
   pointer-events: ${p => (p.disabled ? 'none' : '')};
   outline: none;
 
@@ -179,7 +179,6 @@ type Props = {
   disabled?: boolean,
   onClick?: Function,
   small?: boolean,
-  padded?: boolean,
   isLoading?: boolean,
   event?: string,
   eventProperties?: Object,
@@ -195,7 +194,6 @@ class Button extends PureComponent<
     onClick: noop,
     primary: false,
     small: false,
-    padded: false,
     danger: false,
   }
 

src/components/modals/AccountSettingRenderBody.js

@@ -275,10 +275,10 @@ class HelperComp extends PureComponent<Props, State> {
             </Spoiler>
           </ModalContent>
           <ModalFooter horizontal>
-            <Button padded danger type="button" onClick={this.handleOpenRemoveAccountModal}>
+            <Button danger type="button" onClick={this.handleOpenRemoveAccountModal}>
               {t('app:common.delete')}
             </Button>
-            <Button padded ml="auto" type="submit" primary>
+            <Button ml="auto" type="submit" primary>
               {t('app:common.apply')}
             </Button>
           </ModalFooter>

src/components/modals/OperationDetails.js

@@ -229,7 +229,7 @@ const OperationDetails = connect(mapStateToProps)((props: Props) => {
 
       {url && (
         <ModalFooter horizontal justify="flex-end" flow={2}>
-          <Button primary padded onClick={() => shell.openExternal(url)}>
+          <Button primary onClick={() => shell.openExternal(url)}>
             {t('app:operationDetails.viewOperation')}
           </Button>
         </ModalFooter>

src/components/modals/UpdateFirmware/Disclaimer.js

@@ -67,7 +67,7 @@ class DisclaimerModal extends PureComponent<Props, State> {
                 <GradientBox />
               </ModalContent>
               <ModalFooter horizontal justifyContent="flex-end" style={{ width: '100%' }}>
-                <Button primary padded onClick={goToNextStep}>
+                <Button primary onClick={goToNextStep}>
                   {t('app:manager.firmware.continue')}
                 </Button>
               </ModalFooter>