Open Cow258 opened 10 months ago
@mlwilkerson I think we are missing the line-height. Do you recall any reason why we left this out when working on Kits?
@robmadole no, I don't recall any such reason. If it's missing, then I think it was just a mistake.
On closer examination, this issue is more specific, and more subtle. It's specific to SCSS and Less because of how line-height
is handled differently in those assets.
The css/custom-icons.css
does appear to have line-height: 1
in the .fak
rule. As the screenshots above show in the original report, it's the custom-icons.scss
asset that lacks line-height: 1
in its fak
rule.
In other words, the reported problem is with the SCSS assets, not the CSS assets.
However, it might not be the case that there should be a line-height: 1
in the fak
rule of custom-icons.scss
.
Compare to the corresponding rules in official familyStyle assets, like the fas
rule in solid.scss
. It also lacks line-height: 1
.
For the official familyStyles, however, there's a line-height: 1
being assigned in _core.scss
(as shown in the screenshot above). And there's also something happening with line-height: 1
in _mixins.scss
via the extension of the fa-icon
mixin. But there's no entry for .fak, .fa-kit
in _mixins.scss
.
There's a similar (though not identical) pattern for the Less case. What's similar is that line-height: 1
comes from the fa-icon
mixin via _mixins.less
. What's different is that in _core.less
, there's no line-height: 1
being assigned to the official familyStyles either. So they all get their line-height: 1
default from the rules in _mixins.less
, and since there's no rule in _mixins.less
for .fak,.fa-kit
, it lacks the default line-height: 1
in the Less case as well.
Bug description
The class
.fak
,.fa-kit
are missing theline-height: 1;
, that cause the font icon vertical height slightly off.Reproducible test case
Just download it from Pro Plan Kit
Screenshots
Font Awesome version
v6.5.1
Serving
Kit, Self-hosted
Implementation
CSS
Browser and Operating System
Any browser and OS
Web bug report checklist