-
Notifications
You must be signed in to change notification settings - Fork 971
Update disabledContent.js to the modified BEM style #10337
Update disabledContent.js to the modified BEM style #10337
Conversation
Closes #10336 Auditors: @cezaraugusto Test Plan: 1. Open about:preferences#payments 2. Disable Payments 3. Make sure the left and right rows are displayed properly 4. Enable Payments 5. Make sure the left margin of the gray block does not change
backgroundColor: globalStyles.color.lightGray, | ||
borderRadius: globalStyles.radius.borderRadiusUIbox, | ||
boxSizing: 'border-box', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This one, removing the width below, does the trick.
fontSize: '18px', | ||
margin: '70px 0 -15px 12px' |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
minus value is not so intuitive so it was replaced
}, | ||
|
||
paymentsSidebar: { | ||
opacity: 0.8, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
this one was removed, applying it to disabledContent__sidebar__header
and disabledContent__sidebar__text
, to display the logos without opacity.
paddingBottom: '0.5em' | ||
disabledContent__sidebar: { | ||
minWidth: '200px', | ||
marginLeft: '35px' |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
magic number
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
++
Closes #10336
Auditors: @cezaraugusto
Test Plan:
Updated screenshot for reference
Old screenshots
![screenshot 2017-08-09 0 48 01](https://user-images.githubusercontent.com/3362943/29081040-6c99efd0-7c9c-11e7-972c-f528d339fe83.png)
![width](https://user-images.githubusercontent.com/3362943/29082018-42550cf2-7c9f-11e7-8478-3e91fc87cea9.gif)
This PR only intends to convert the stuff into the BEM style, so if those look familiar, then it should be fine :-)
Submitter Checklist:
git rebase -i
to squash commits (if needed).Test Plan:
Reviewer Checklist:
Tests