Faux Italic and Faux Bold Issue in iPhone Safari
Typogram opened this issue · comments
skeletonlabs/skeleton#2188 (comment)
Current Behavior
There seems to be a typography issue with the heading font in the Seafoam Theme. The Playfair Display Italic is registered as a normal style, causing the font to undergo a 'faux italic' transformation by the browser's algorithm, which results in an undesired appearance.
Screenshots:
Faux italic (iPhone safari)
Correct rendering (Windows chrome)
Expected Behavior
The italic style of the Playfair Display font should be displayed as intended without any additional skewing or faux italic transformation applied.
Actual behavior:
The font is skewed further by the browser’s algorithm, creating a faux italic effect, which affects the typography aesthetics.
Steps To Reproduce
- Open iPhone Safari
- Navigate to the page with the Seafoam Theme applied
- Observe the heading font (Playfair Display Italic)
Link to Reproduction / Stackblitz
No response
More Information
Environment:
- Device: iPhone
- Browser: Safari
@niktek @Mahmoud-zino we'll need a fix on the CLI side for this issue. You can see the issue described above, and @Typogram PR fix for our doc site here:
https://github.com/skeletonlabs/skeleton/pull/2192/files
Just make sure to match the style adjustments and all should be well.
Happy to assign whomever wishes to take this.
@endigo9740 I am afraid I can't test it since it is Safari related bug. If nik doesn't have the time, I can create the PR with the suggested solution and let the testing for you...
@Mahmoud-zino per the PR linked, I pointed out that I don't believe the original issue to be solved in full yet. The original contributor will review. Maybe give this a couple days and check back. Once your changes are in place, perhaps Nik or I can help test for you though