Start to use CSS logical properties for docs pages #954
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.
Bug/issue #, if applicable:
Summary
This transition to logical properties and values (as opposed to physical/dimensional ones) will allow for UI elements and associated spacing to better accommodate languages with a right-to-left writing direction.
Although DocC doesn't yet support right-to-left localized content, this change will better future-proof the renderer if it does, allowing it to do things like flip the orientation of the sidebar and strings of text for languages that read from right to left instead of left to right.
Notes:
Testing
Test that UI elements are rendered differently in a rtl language
A new
VUE_APP_DEFAULT_LOCALE=[locale]
environment variable has been provided for configuring what is considered to be the "default" locale of the app instead of being hardcoded to "en-US". Note that this wouldn't necessarily ever need to be configured once DocC supports localization and allowing users to select alternate locales to browse documentation.An empty strings file for the "ar" locale has been provided purely for testing purposes—it does not yet contain any actual translated strings.
VUE_APP_DEV_SERVER_PROXY
with some documentation content andVUE_APP_DEFAULT_LOCALE=ar
npm run serve
Test that no spacing or visual regressions are introduced
VUE_APP_DEFAULT_LOCALE
Checklist
Make sure you check off the following items. If they cannot be completed, provide a reason.
npm test
, and it succeeded