Visitar URL original
Alert: Utilize $theme-alert-icon-size variable for setting the alert icon size by sawyerh · Pull Request #3942 · uswds/uswds · GitHub
Skip to content

Alert: Utilize $theme-alert-icon-size variable for setting the alert icon size - #3942

Merged
thisisdano merged 2 commits into
uswds:developfrom
navapbc:sawyerh/support-alert-icon-var
Feb 5, 2021
Merged

thisisdano merged 2 commits into
uswds:developfrom
navapbc:sawyerh/support-alert-icon-var

Conversation

@sawyerh

@sawyerh sawyerh commented Jan 12, 2021 •

Copy link
Copy Markdown
Contributor

Description

  • Update Alert component so that its background size is set by the $theme-alert-icon-size variable, rather than being hard-coded.

Additional information

This makes the behavior of the design system match with what is in the documentation:

image

The Alert background size was increased in 92c7be5 which causes issues for projects that have themed the design system and are utilizing their own icon files.

Before you hit Submit, make sure you’ve done whichever of these applies to you:

  • Follow the 18F Front End Coding Style Guide and Accessibility Guide.
  • Run npm test and make sure the tests for the files you have changed have passed.
  • Run your code through HTML_CodeSniffer and make sure it’s error free.
  • Title your pull request using this format: [Website] - [UI component]: Brief statement describing what this pull request solves.

@sawyerh sawyerh changed the title [Alert]: Utilize $theme-alert-icon-size variable for setting the alert icon size Alert: Utilize $theme-alert-icon-size variable for setting the alert icon size Jan 12, 2021
$theme-alert-bar-width: 1;
$theme-alert-font-family: "ui";
$theme-alert-icon-size: 4;
$theme-alert-icon-size: 5;

@sawyerh sawyerh Jan 12, 2021 •

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

Check me on this one. This variable is currently referenced in one spot, which I imagine would be affected by this change:

padding-left: units($theme-alert-icon-size) + units($theme-alert-padding-x);

@thisisdano thisisdano left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Thanks, this is a great change and a good bugfix!

@thisisdano
thisisdano merged commit e521d23 into uswds:develop Feb 5, 2021
This was referenced Feb 19, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants