Refactor buttons on about:preferences#payments (part 2)

- Removed redundant classes from bookmarkButtons to fix the size difference between "Remove" and "Done" buttons, which was introduced with the commit 85e428a
- Introduced new classes "removeButton" and "doneButton" inside the class "bookmarkButtons" to make the width of the row same as the other rows
- Introduced a new class "copyButton" to keep the font-size of the recovery key copy buttons to 14px
- Indroduced a flexbox to copyKeyContainer to keep the buttons aligned

Auditors: @bradleyrichter

Test Plan:
1. Click the bookmark button on the URL bar
2. Make sure the height and width of "Remove" and "Done" buttons are equal
3. Make sure the color of the "Remove" text on the button is no longer white on hover
4. Make sure the width of the row of the buttons is equal to the other rows
5. Open about:preferences#payments, click Advanced Settings and Backup your wallet
6. Make sure keys and buttons are aligned
7. Make sure font-size of the labels "Copy" is 14px

app/renderer/components/addEditBookmarkHanger.js

@@ -188,10 +188,10 @@ class AddEditBookmarkHanger extends ImmutableComponent {
             <div className='bookmarkButtons'>
               {
                 this.props.originalDetail
-                ? <Button l10nId='remove' className='primaryButton whiteButton inlineButton' onClick={this.onRemoveBookmark} />
+                ? <Button l10nId='remove' className='removeButton whiteButton' onClick={this.onRemoveBookmark} />
                 : null
               }
-              <Button l10nId='done' disabled={!this.bookmarkNameValid} className='primaryButton' onClick={this.onSave} />
+              <Button l10nId='done' disabled={!this.bookmarkNameValid} className='doneButton primaryButton' onClick={this.onSave} />
             </div>
           </div>
         </div>

js/about/preferences.js

@@ -1045,7 +1045,7 @@ class PaymentsTab extends ImmutableComponent {
         <span data-l10n-id='ledgerBackupContent' />
         <div className='copyKeyContainer'>
           <div className='copyContainer'>
-            <Button l10nId='copy' className='whiteButton inlineButton' onClick={this.copyToClipboard.bind(this, paymentId)} />
+            <Button l10nId='copy' className='copyButton whiteButton wideButton' onClick={this.copyToClipboard.bind(this, paymentId)} />
           </div>
           <div className='keyContainer'>
             <h3 data-l10n-id='firstKey' />
@@ -1054,7 +1054,7 @@ class PaymentsTab extends ImmutableComponent {
         </div>
         <div className='copyKeyContainer'>
           <div className='copyContainer'>
-            <Button l10nId='copy' className='whiteButton inlineButton' onClick={this.copyToClipboard.bind(this, passphrase)} />
+            <Button l10nId='copy' className='copyButton whiteButton wideButton' onClick={this.copyToClipboard.bind(this, passphrase)} />
           </div>
           <div className='keyContainer'>
             <h3 data-l10n-id='secondKey' />

less/about/preferences.less

@@ -905,7 +905,7 @@ div.nextPaymentSubmission {
       line-height: 1.3em;
     }
     span {
-      display: inline-block;
+      display: inline;
     }
     a {
       text-decoration: none;
@@ -950,15 +950,21 @@ div.nextPaymentSubmission {
 
     .copyKeyContainer {
       display: flex;
+      align-items: flex-end;
+      justify-content: space-between;
       width: 75%;
       margin: 20px auto;
 
       .copyContainer {
-        margin-top: 35px;
+        .copyButton {
+          font-size: 14px;
+          margin: 0;
+        }
+
       }
 
       .keyContainer {
-        margin-left: 75px;
+        margin-left: 1em;
 
         h3 {
           margin-bottom: 15px;

less/button.less

@@ -130,7 +130,6 @@ span.menuButton {
     border: 2px solid white;
     box-shadow: @buttonShadow;
     cursor: pointer;
-    display: block;
     font-weight: normal;
     font-style: normal;
     color: @darkGray;

less/forms.less

@@ -567,7 +567,16 @@
   }
 
   .bookmarkButtons {
+    display: flex;
     margin: 20px 0 10px 0;
+
+    .removeButton {
+      flex-grow: 1;
+    }
+
+    .doneButton {
+      margin-right: 0;
+    }
   }
 
   .bookmarkFormInner {