diff --git a/app/extensions/brave/locales/en-US/styles.properties b/app/extensions/brave/locales/en-US/styles.properties
index 6c8f4c416c0..2351b6fdd56 100644
--- a/app/extensions/brave/locales/en-US/styles.properties
+++ b/app/extensions/brave/locales/en-US/styles.properties
@@ -21,3 +21,4 @@ actionButton=Action Button
subtleButton=Subtle Button
extensionItem=Extension Item
notificationItem=Notification Item
+panelItem=Panel Item
diff --git a/app/renderer/components/common/browserButton.js b/app/renderer/components/common/browserButton.js
index 802323ee7ed..b9cb000247c 100644
--- a/app/renderer/components/common/browserButton.js
+++ b/app/renderer/components/common/browserButton.js
@@ -21,11 +21,11 @@ class BrowserButton extends ImmutableComponent {
this.props.groupedItem && styles.browserButton_groupedItem,
this.props.notificationItem && styles.browserButton_notificationItem,
this.props.iconOnly && styles.browserButton_iconOnly,
+ this.props.panelItem && styles.browserButton_panelItem,
// TODO: These are other button styles app-wise
// that needs to be refactored and included in this file
// .............................................
// this.props.navItem && styles.browserButton_navItem,
- // this.props.panelItem && styles.browserButton_panelItem,
// note: this should be the last item so it can override other styles
this.props.disabled && styles.browserButton_disabled
@@ -170,6 +170,7 @@ const styles = StyleSheet.create({
border: '1px solid white',
color: globalStyles.button.secondary.color,
cursor: 'pointer',
+ fontWeight: 500,
':hover': {
border: `1px solid ${globalStyles.button.secondary.borderHoverColor}`,
@@ -235,6 +236,10 @@ const styles = StyleSheet.create({
background: globalStyles.button.action.backgroundColor
},
+ browserButton_panelItem: {
+ minWidth: '180px'
+ },
+
browserButton_iconOnly: {
display: 'flex',
justifyContent: 'center',
diff --git a/app/renderer/components/preferences/payment/bitcoinDashboard.js b/app/renderer/components/preferences/payment/bitcoinDashboard.js
index 04df981ea28..8c084034eb7 100644
--- a/app/renderer/components/preferences/payment/bitcoinDashboard.js
+++ b/app/renderer/components/preferences/payment/bitcoinDashboard.js
@@ -6,7 +6,7 @@ const React = require('react')
const {StyleSheet, css} = require('aphrodite/no-important')
// components
-const Button = require('../../common/button')
+const BrowserButton = require('../../common/browserButton')
const cx = require('../../../../../js/lib/classSet')
const ModalOverlay = require('../../common/modalOverlay')
const ImmutableComponent = require('../../immutableComponent')
@@ -96,11 +96,9 @@ class BitcoinDashboard extends ImmutableComponent {
const buttonAttrs = {
l10nId: 'add',
testId: 'bitcoinPurchaseButton',
- className: cx({
- primaryButton: true,
- [css(styles.panelButton)]: true,
- disabled: disabled
- })
+ primaryColor: true,
+ panelItem: true,
+ disabled: disabled
}
const hrefAttrs = {
href: this.props.ledgerData.get('buyURL'),
@@ -118,11 +116,11 @@ class BitcoinDashboard extends ImmutableComponent {
if (!disabled) {
buttonAttrs.onClick = this.props.showOverlay.bind(this)
}
- return
+ return