This repository has been archived by the owner on Mar 4, 2020. It is now read-only.
fix(Theme): Use global REM-base, do not set html font-size in static styles #1190
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
miroslavstastny
requested review from
dvdzkwsk,
kuzhelov,
layershifter,
levithomason and
mnajdova
as code owners
Codecov Report
@@ Coverage Diff @@
## master #1190 +/- ##
==========================================
- Coverage 82.49% 82.48% -0.01%
==========================================
Files 742 742
Lines 8762 8758 -4
Branches 1170 1236 +66
==========================================
- Hits 7228 7224 -4
Misses 1519 1519
Partials 15 15
Continue to review full report at Codecov.
|
miroslavstastny
commented
Apr 8, 2019
kuzhelov
reviewed
Apr 9, 2019
kuzhelov
reviewed
Apr 9, 2019
kuzhelov
reviewed
Apr 9, 2019
| @@ -35,6 +31,9 @@ export const updateCachedRemSize = () => { | |||
| */ | |||
| export const pxToRem = (valueInPx: number, baseRemSize?: number): string => { | |||
| if (!baseRemSize && !_documentRemSize) { | |||
| // there is no way how to reset the cached value, once it's cached, it's cached | |||
There was a problem hiding this comment.
nit-nit: may suggest
- to remove
once it's cached, it's cached, as it provides no additional value in explanation :) - rephrase the rest in a more succinct way
as resetting cached value won't trigger recalculation of site variables, for which originally computed values will stay unchanged
kuzhelov
reviewed
Apr 9, 2019
There was a problem hiding this comment.
just one thing I would like to refine before merge: https://github.com/stardust-ui/react/pull/1190/files#r273730374
kuzhelov
approved these changes
Apr 10, 2019
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
BREAKING CHANGE
Teams theme no longer sets
font-sizeonhtml.Set correct
font-sizeonhtmlmanually BEFORE Stardust is imported.This is a hotfix which fixes #988.
What was broken
pxToRemuseshtmlfont-sizeas a base to correctly convert pixels to REMs. There are several problems with it:htmlfont-sizeis global on a page, two themes loaded at the same time cannot use different base font sizes for thepxToRem, But the previous semantics withhtmlFontSizebeing a theme'ssiteVariableandProviderresetting the cached base when a new theme was loaded looked like it is possible.pxToRemis called before the static styles are applied, statichtmlfont-sizewas cached before the themes font size was applied resulting in broken design (see pxToRem sometimes returning incorrect size #988).Fix
Teams theme no longer sets
htmlfont-sizein its static styles and expects it to be correctly set BEFORE Stardust is imported not so set false expectations.Limitations of the fix
It's no possible to scale Stardust components to:
These limitations are not new, they were present before the fix as well.
There is another PR #1186 which is an experiment on how to introduce more advanced fix without these limitations later.