-
Notifications
You must be signed in to change notification settings - Fork 73
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
chore(button): primary & secondary styles #402
Conversation
Codecov Report
@@ Coverage Diff @@
## develop #402 +/- ##
===========================================
+ Coverage 50.54% 50.62% +0.08%
===========================================
Files 147 148 +1
Lines 1189 1195 +6
Branches 153 153
===========================================
+ Hits 601 605 +4
- Misses 494 496 +2
Partials 94 94
Continue to review full report at Codecov.
|
</Button> | ||
<Button className={classNames(styles.action, styles.cancel)} onClick={onCancel}> | ||
</PrimaryButton> | ||
<Button |
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.
maybe rename SecondaryButton? It's not very clear which style is applied from the name
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.
There are places where we only display a single button and it's not secondary to anything, which is why I left it as just Button
. It's only a secondary button when there's not a primary button visible, otherwise it's just the default button style.
Looks like |
dee8b79
to
1f97f5a
Compare
Updated to remove that last |
Hmm still seems to fail 🤔 |
}; | ||
|
||
export default React.forwardRef((props, ref) => { |
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.
Oops, I must have included this in the wrong commit. I'll get it fixed.
1f97f5a
to
4ef569a
Compare
Seem to be a conflict after merging the stylelint thing 😅 |
4ef569a
to
ecb4f1b
Compare
Rebased, should be good soon! |
I know
On Aug 5, 2018 8:59 AM, Matt Huggins <notifications@github.com> wrote:
Description
Adds a PrimaryButton component, which reflects the existing button styles. Updates the Button component to represent secondary actions.
Motivation and Context
Designs have primary and secondary buttons, this brings the styles inline with design.
How Has This Been Tested?
Smoke testing.
Screenshots (if appropriate)
[screen shot 2018-08-05 at 8 56 33 am]<https://user-images.githubusercontent.com/169093/43686572-c70ee6b0-988d-11e8-8d7c-3dda609f0eac.png>
Types of changes
* Chore (tests, refactors, and fixes)
* New feature (adds functionality)
* Breaking change (fix or feature that would cause existing functionality to not work as expected)
Checklist
* I have read the CONTRIBUTING<./CONTRIBUTING.md> guidelines and confirm that my code follows the code style of this project.
* Tests for the changes have been added (for bug fixes/features)
Documentation
* Docs need to be added/updated (for bug fixes/features)
Closing issues
N/A
…________________________________
You can view, comment on, or merge this pull request online at:
#402
Commit Summary
* chore(button): smooth background to match designs
* chore(button): differentiate primary and secondary
File Changes
* M src/renderer/account/components/TransactionsPanel/Receive/Receive.js<https://github.com/nos/client/pull/402/files#diff-0> (4)
* M src/renderer/account/components/TransactionsPanel/Send/Send.js<https://github.com/nos/client/pull/402/files#diff-1> (6)
* M src/renderer/login/components/LoginFormLedger/LoginFormLedger.js<https://github.com/nos/client/pull/402/files#diff-2> (4)
* M src/renderer/login/components/LoginFormPassphrase/LoginFormPassphrase.js<https://github.com/nos/client/pull/402/files#diff-3> (6)
* M src/renderer/login/components/LoginFormWIF/LoginFormWIF.js<https://github.com/nos/client/pull/402/files#diff-4> (4)
* M src/renderer/login/components/LoginFormWalletFile/LoginFormWalletFile.js<https://github.com/nos/client/pull/402/files#diff-5> (3)
* M src/renderer/register/components/AccountDetails/SaveAccount/SaveAccount.js<https://github.com/nos/client/pull/402/files#diff-6> (10)
* M src/renderer/register/components/RegisterForm/RegisterForm.js<https://github.com/nos/client/pull/402/files#diff-7> (6)
* M src/renderer/settings/components/NetworkSettings/NetworkSettings.js<https://github.com/nos/client/pull/402/files#diff-8> (5)
* M src/renderer/shared/components/Alert/Alert.js<https://github.com/nos/client/pull/402/files#diff-9> (10)
* M src/renderer/shared/components/Confirm/Confirm.js<https://github.com/nos/client/pull/402/files#diff-10> (14)
* M src/renderer/shared/components/Confirm/Confirm.scss<https://github.com/nos/client/pull/402/files#diff-11> (20)
* M src/renderer/shared/components/Forms/Button/Button.scss<https://github.com/nos/client/pull/402/files#diff-12> (13)
* A src/renderer/shared/components/Forms/PrimaryButton/PrimaryButton.js<https://github.com/nos/client/pull/402/files#diff-13> (38)
* A src/renderer/shared/components/Forms/PrimaryButton/PrimaryButton.scss<https://github.com/nos/client/pull/402/files#diff-14> (12)
* A src/renderer/shared/components/Forms/PrimaryButton/index.js<https://github.com/nos/client/pull/402/files#diff-15> (1)
Patch Links:
* https://github.com/nos/client/pull/402.patch
* https://github.com/nos/client/pull/402.diff
—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub<#402>, or mute the thread<https://github.com/notifications/unsubscribe-auth/Ali09o7URpxdaQ_8A4C9uo3OTC10HXXbks5uNvo3gaJpZM4VvY4o>.
|
Description
React.forwardRef
to forward refs to the raw DOM element, which prevents us from having to manually implement component functions likefocus
andblur
.Motivation and Context
Designs have primary and secondary buttons, this brings the styles inline with design.
How Has This Been Tested?
Smoke testing.
Screenshots (if appropriate)
Types of changes
Checklist
Documentation
Closing issues
N/A