Skip to content

Avoid transforming the size of the icon #3645

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

Merged
merged 1 commit into from
Jun 26, 2025
Merged

Avoid transforming the size of the icon #3645

merged 1 commit into from
Jun 26, 2025

Conversation

jcoyne
Copy link
Member

@jcoyne jcoyne commented Jun 18, 2025

This is something a downstream user can do if they want it bigger, but we don't want to force someone to override blacklight. They may also choose to use bi-x-lg instead.

This is something a downstream user can do if they want it bigger, but we don't want to force someone to override blacklight.  They may also choose to use bi-x-lg instead.
Copy link
Contributor

@seanaery seanaery left a comment

Choose a reason for hiding this comment

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

I don't really mind these 1em rules here, but am OK with removing them. They do provide the benefit of scaling the X icon proportionately if someone has customized the --bs-btn-font-size or --bs-body-font-size variable. On the other hand, removing these rules doesn't seem to have a visible effect in the browsers I've tested (i.e., they end up rendered as 16x16 regardless of the extra css), and as you indicated, if someone wants to style the icons downstream, it's better to have fewer layers of styles to have to override. I wasn't aware of utility classes or suffixes like -lg that'd work to size blacklight icons (other than like w-100 or h-100?)... so if that's possible it could be useful to document, maybe as part of 9.0 release notes/upgrade docs.

@seanaery
Copy link
Contributor

OK, I see -- this change relates to #3644 ... the fs-4 class that was previously there actually was impacting the size of the X, though indirectly. It was i.e., setting the font-size to 24px (1.5rem !important). Then setting height: 1em & width: 1em was making the X svg image appear to be 24x24 pixels. Without fs-4 also in place, the 1em declarations here don't really change anything; the X is 16x16. I can see how customization was difficult through those multiple style layers, esp. with an !important in there too.

I'll go ahead and merge this MR.

@seanaery seanaery merged commit a8794ab into main Jun 26, 2025
11 checks passed
@seanaery seanaery deleted the no-size-icon branch June 26, 2025 18:30
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.

None yet

2 participants