TipModal: Move "Buy More" next to price selection.

Having the "Buy More LBC" at the bottom seems out of place, since the context of LBC/amount is in the middle of the modal.

static/app-strings.json

@@ -1268,6 +1268,8 @@
   "Uncheck your email below if you want to stop receiving messages.": "Uncheck your email below if you want to stop receiving messages.",
   "Remove from Blocked List": "Remove from Blocked List",
   "Are you sure you want to remove this from the list?": "Are you sure you want to remove this from the list?",
+  "Send A Tip": "Send A Tip",
+  "Send a chunk of change to this creator to let them know you appreciate their content.": "Send a chunk of change to this creator to let them know you appreciate their content.",
   "CableTube Escape Artists": "CableTube Escape Artists",
   "Unlink YouTube Channel": "Unlink YouTube Channel",
   "Sign In With YouTube": "Sign In With YouTube",

ui/component/walletSendTip/view.jsx

@@ -228,6 +228,15 @@ function WalletSendTip(props: Props) {
                     label={__('Custom')}
                     onClick={() => setUseCustomTip(true)}
                   />
+                  {DEFAULT_TIP_AMOUNTS.some(val => val > balance) && (
+                    <Button
+                      button="secondary"
+                      className="button-toggle-group-action"
+                      icon={ICONS.BUY}
+                      title={__('Buy More LBC')}
+                      navigate={`/$/${PAGES.BUY}`}
+                    />
+                  )}
                 </div>
 
                 {useCustomTip && (
@@ -281,11 +290,6 @@ function WalletSendTip(props: Props) {
                     />
                   )}
                 </div>
-                {DEFAULT_TIP_AMOUNTS.some(val => val > balance) && (
-                  <div className="section">
-                    <Button button="link" label={__('Buy More LBC')} navigate={`/$/${PAGES.BUY}`} />
-                  </div>
-                )}
               </>
             )
           }

ui/scss/component/_button.scss

@@ -176,3 +176,12 @@ svg + .button__label,
     border-bottom-left-radius: 0;
   }
 }
+
+.button-toggle-group-action {
+  position: absolute; // Centers the button along toggle buttons
+
+  @media (max-width: $breakpoint-small) {
+    position: relative;
+    top: var(--spacing-s);
+  }
+}