Visitar URL original
Add CSS to fix alert icons by Jeremy1026 · Pull Request #457 · GSA-TTS/identity-dev-docs · GitHub
Skip to content

Add CSS to fix alert icons - #457

Closed
Jeremy1026 wants to merge 2 commits into
mainfrom
jcurcio/lg-12476-fix-icons
Closed

Jeremy1026 wants to merge 2 commits into
mainfrom
jcurcio/lg-12476-fix-icons

Conversation

@Jeremy1026

Copy link
Copy Markdown
Contributor

This Pull Request fixes the icons in the warning boxes. Currently the CSS on the before pseudo element has the styles

height: 1rem;
width: 1rem;
content: "";
height: 2px;
background-image: url(../img/usa-icons/warning.svg);
background-position: 50%;
background-repeat: no-repeat;
background-size: 1rem 1rem;
display: block;
position: absolute;
top: .5625rem;
left: 1rem;

With height: 2px taking precedent over the height: 1rem. I'm re-adding the height: 1rem with higher precedent to "win."

I know we don't like to add CSS directly, but I can not find where the height: 2px is being added to the element's style.

Before:

image

After:

image

@Jeremy1026
Jeremy1026 requested a review from a team as a code owner February 22, 2024 20:56
@aduth

aduth commented Feb 22, 2024

Copy link
Copy Markdown
Contributor

This bug is fixed in newer versions of the design system, can we update instead?

Specifically:

https://github.com/18F/identity-dev-docs/blob/bc0b6e051893308452a0bfafbec596474604c084/package.json#L22

Upgrading to at least @18f/identity-design-system@8.0.0 should fix this.

@Jeremy1026

Copy link
Copy Markdown
Contributor Author

Cancelling this PR because updating the design system and build-sass worked!

@Jeremy1026 Jeremy1026 closed this Feb 22, 2024
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