diff --git a/app/extensions/brave/locales/en-US/styles.properties b/app/extensions/brave/locales/en-US/styles.properties index d2e0b4bccb9..80f1b158fe3 100644 --- a/app/extensions/brave/locales/en-US/styles.properties +++ b/app/extensions/brave/locales/en-US/styles.properties @@ -1,4 +1,7 @@ actionButton=Action Button +adsAllow=Allow Ads and Tracking +adsBlock=Block Ads +adsShowBrave=Show Brave Ads browserButton=Browser Button buttons=Buttons extensionItem=Extension Item @@ -20,4 +23,4 @@ styleGuide=Style Guide subtleButton=Subtle Button switches=Switches titles=Titles -typography=Typography \ No newline at end of file +typography=Typography diff --git a/app/renderer/components/autofill/autofillAddressPanel.js b/app/renderer/components/autofill/autofillAddressPanel.js index ec2b4c04fdf..bac1b2c69fc 100644 --- a/app/renderer/components/autofill/autofillAddressPanel.js +++ b/app/renderer/components/autofill/autofillAddressPanel.js @@ -14,7 +14,7 @@ const { CommonFormLarge, CommonFormSection, CommonFormTitle, - CommonFormFullWidthDropdown, + CommonFormDropdown, CommonFormButtonWrapper, commonFormStyles } = require('../common/commonForm') @@ -241,13 +241,14 @@ class AutofillAddressPanel extends React.Component { />
const { '{Dropdown}' } = require('../../app/renderer/components/common/dropdown'){'\n'}
+ {'\n'}
<Dropdown>{'\n'}
<option>Select Box</option>{'\n'}
<option>Second Choice</option>{'\n'}
@@ -208,6 +207,7 @@ class AboutStyle extends ImmutableComponent {
const { '{FormDropdown}' } = require('../../app/renderer/components/common/dropdown'){'\n'}
+ {'\n'}
<FormDropdown>{'\n'}
<option>Select Box</option>{'\n'}
<option>Second Choice</option>{'\n'}
@@ -216,6 +216,42 @@ class AboutStyle extends ImmutableComponent {
+
+ Dropdown used on Brave Payments; has 180px width (same as Panel Item button below)
+
+
+
+
+
+
+ const { '{FormDropdown}' } = require('../../app/renderer/components/common/dropdown'){'\n'}
+ {'\n'}
+ <FormDropdown data-isPanel>{'\n'}
+ <option>5 USD</option>{'\n'}
+ <option>10 USD</option>{'\n'}
+ <option>15 USD</option>{'\n'}
+ </FormDropdown>
+
+
+
+
+ Dropdown used on Bravery Panel; has 100% width and 13px font size
+
+
+
+
+
+
+ const { '{FormDropdown}' } = require('../../app/renderer/components/common/dropdown'){'\n'}
+ {'\n'}
+ <FormDropdown data-isFullWidth data-isBraveryPanel>{'\n'}
+ <option data-l10n-id='showBraveAds' data-test-id='showBraveAds' value='showBraveAds' />{'\n'}
+ <option data-l10n-id='blockAds' data-test-id='blockAdsOption' value='blockAds' />{'\n'}
+ <option data-l10n-id='allowAdsAndTracking' data-test-id='showAdsOption' value='allowAdsAndTracking' />{'\n'}
+ </FormDropdown>
+
+
+
Dropdown used mostly in Preferences; has a fixed width
@@ -225,6 +261,7 @@ class AboutStyle extends ImmutableComponent {
const { '{SettingDropdown}' } = require('../../app/renderer/components/common/dropdown'){'\n'}
+ {'\n'}
<SettingDropdown>{'\n'}
<option>Select Box</option>{'\n'}
<option>Second Choice</option>{'\n'}
@@ -234,36 +271,20 @@ class AboutStyle extends ImmutableComponent {
- Dropdown used on Brave Payments; has 180px width (same as Panel Item button below)
-
-
-
-
-
-
- const { '{PanelDropdown}' } = require('../../app/renderer/components/common/dropdown'){'\n'}
- <PanelDropdown>{'\n'}
- <option>5 USD</option>{'\n'}
- <option>10 USD</option>{'\n'}
- <option>15 USD</option>{'\n'}
- </PanelDropdown>
-
-
-
-
- Dropdown used mostly on Bravery Panel; has 100% width and 13px font size
-
+ Dropdown used on CommonForm
+
-
+
- const { '{BraveryPanelDropdown}' } = require('../../app/renderer/components/common/dropdown'){'\n'}
- <BraveryPanelDropdown>{'\n'}
+ const { '{CommonFormDropdown}' } = require('../../app/renderer/components/common/commonForm'){'\n'}
+ {'\n'}
+ <CommonFormDropdown>{'\n'}
<option>Select Box</option>{'\n'}
<option>Second Choice</option>{'\n'}
<option>Third Choice</option>{'\n'}
- </BraveryPanelDropdown>
+ </CommonFormDropdown>