Skip to content
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

refactor(hx-alert): implement custom variables #787

Merged
merged 1 commit into from
Dec 11, 2020

Conversation

badejayayesubabu
Copy link
Collaborator

@badejayayesubabu badejayayesubabu commented Nov 24, 2020

Description

Converted Custom variables

What are the relevant story cards/tickets? Any additional PRs or other references?

Jira: SURF-2095

Before you request a review for this PR:

  • For UI changes, did you manually test in recent versions of modern browsers (Chrome, Firefox, and Safari)?
  • For UI changes, did you manually test in IE11 and legacy Edge?
  • Did you add component tests for any new code?
  • Did you run the component unit tests via yarn test to ensure all tests passed?
  • Did you include a screenshot of the component tests?
  • If you changed/added functionality, did you update the demo page and documentation?
  • If needed, did you add or modify the demo test page to test the changed/added functionality?
  • Did you assign reviewers?
  • In Jira, have you linked to this PR on the ticket(s)?

@netlify
Copy link

netlify bot commented Nov 24, 2020

Deploy preview for helix-ui ready!

Built with commit 35d6b2a

https://deploy-preview-787--helix-ui.netlify.app

display: block;
font-weight: 300;
line-height: 1.25rem;

&[type="info"] {
background-color: $blue-100;
color: $gray-1000;
background-color: var(--hxBlue, $blue-100);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

All CSS variables should be scoped to hxAlert:

background-color: var(--hxAlert-info-bgcolor, $blue-100);

background-color: $blue-100;
color: $gray-1000;
background-color: var(--hxBlue, $blue-100);
color: var(--hxColor, $gray-1000);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

All CSS variables should be scoped to hxAlert:

color: var(--hxAlert-info-color, $gray-1000);

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Changes have been done,Please review

}

&[type="error"] {
background-color: $red-900;
color: $gray-0;
background-color: var(--hxRed, $red-900);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please see above examples to update changes here and below.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Changes have been done,Please review

Copy link
Contributor

@lalithkarikelli lalithkarikelli left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

DEV LGTM

Copy link
Member

@100stacks 100stacks left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Dev LGTM

@100stacks 100stacks changed the title refactor(hx-alert): converted custom variables refactor(hx-alert): implement custom variables Dec 11, 2020
@100stacks 100stacks marked this pull request as ready for review December 11, 2020 17:09
@100stacks 100stacks merged commit 28f00a1 into HelixDesignSystem:master Dec 11, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants