Adjust margins

LiskHQ · Feb 9, 2018 · 3f6d7e4 · 3f6d7e4
1 parent 5751bd9
commit 3f6d7e4
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 5 deletions.
diff --git a/src/components/sendTo/index.js b/src/components/sendTo/index.js
@@ -38,12 +38,26 @@ class SendTo extends React.Component {
       ${grid['col-xs-12']}
       ${grid['col-sm-6']}
       ${grid['col-md-12']}
-      ${grid['col-lg-12']} ${grid.row}`}>
+      ${grid['col-lg-12']}
+      ${grid['middle-sm']}
+      ${grid.row}
+      `}>
         <AccountVisual
           address={this.props.address}
-          className={`${grid['col-xs-6']} ${grid['col-sm-6']} ${grid['col-md-12']} ${grid['col-lg-12']}`}
+          className={`
+          ${grid['col-xs-4']}
+          ${grid['col-sm-4']}
+          ${grid['col-md-12']}
+          ${grid['col-lg-12']}
+          ${grid['middle-sm']}
+          `}
           size={this.state.isMobile ? 90 : 144} />
-        <div className={`${styles.account} ${grid['col-xs-6']} ${grid['col-sm-6']} ${grid['col-md-12']} ${grid['col-lg-12']}`}>
+        <div className={`${styles.account}
+        ${grid['col-xs-8']}
+        ${grid['col-sm-8']}
+        ${grid['col-md-12']}
+        ${grid['col-lg-12']}
+        `}>
           <h2>
             <span>
               <LiskAmount val={this.props.balance}/>
@@ -57,6 +71,7 @@ class SendTo extends React.Component {
       ${grid['col-sm-6']}
       ${grid['col-md-12']}
       ${grid['col-lg-12']}
+      ${grid['middle-sm']}
       ${styles.sendButton}
       `}>
         <Link

diff --git a/src/components/sendTo/sendTo.css b/src/components/sendTo/sendTo.css
@@ -7,7 +7,7 @@
   --header-balance-unit-font-size-XS: 18px;
   --header-subtitle-font-size-XL: 18px;
   --header-subtitle-font-size-L: 16px;
-  --header-subtitle-font-size-XS: 16px;
+  --header-subtitle-font-size-XS: 14px;
   --main-header-font-size-XL: 32px;
   --main-header-font-size-L: 28px;
   --main-header-font-size-XS: 24px;
@@ -103,14 +103,16 @@
       }
     }
 
-    .sendButton {
+    & .sendButton {
       margin: auto 0px;
     }
   }
 }
 
 @media (--small-viewport) {
   .wrapper {
+    padding: 3.3vh 24px; /* stylelint-disable-line */
+
     & h2 {
       font-size: var(--main-header-font-size-XS);
 
@@ -122,5 +124,9 @@
     & .address {
       font-size: var(--header-subtitle-font-size-XS);
     }
+
+    & .sendButton {
+      margin-top: 3.2vh; /* stylelint-disable-line */
+    }
   }
 }