Mirror openvidu.io's styling simplification (#68) - #18
Merged
Merged
Conversation
openvidu.io replaced the image width inline styles in the shared tutorial pages with classes; the same edit here keeps the pairs identical and adds the two classes to extra.css.
…hips The two sites now share one grid stylesheet byte for byte instead of two different hand-cut subsets.
Render-blocking stylesheet with display=block plus preloads of the faces the first viewport uses, instead of the preload-as-style trick with display=swap that painted the fallback font first. Tomorrow 100, used by nothing, leaves the URL.
Sections in cascade order (fonts, Material overrides, utilities, components, page areas, responsive), the brand colours as --ov-* tokens in colors.css with the layering note, and the product tag at openvidu.io's single 0.8em size. The rule-set diff against the previous files shows only those token and tag-size substitutions.
This file contains hidden or 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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
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.
Companion of openvidu.io's styling PR OpenVidu/openvidu.io#125 (issue #68 of the marketing board): the pieces of that work that this site shares.
display=blockplus preloads of the faces the first viewport uses, instead of the preload-as-style trick withdisplay=swapthat painted the fallback font first (the flicker openvidu.io fixed in0de2f644). Tomorrow 100, used by nothing, leaves the URL.unsemantic-grid.cssis the complete build, the same file openvidu.io ships, instead of a third hand-cut subset..w-25/.w-50, matching openvidu.io's edit to the same pages; the two classes are added toextra.css.mkdocs build --strict: 0 warnings.tools/sync-check.py --openvidu-io ../openvidu.ioagainst the openvidu.io branch: 43 pairs in sync. Screenshot gate on/, the Android/React/Node tutorials and/about-openvidu/at three widths in both schemes: 30 of 30 captures identical tomain.Review round 1.
extra.cssandcolors.cssare laid out the way openvidu.io's now are: the same sections in cascade order, the brand colours as--ov-*tokens, and the product tag at openvidu.io's single 0.8em size. The rule-set diff against the previous files shows only those substitutions; the screenshot gate on the five pages is identical tomainexcept the about page, whose two tags are 20% smaller by design.CI note: the
validatejob fails until openvidu.io#125 is merged, by design:sync-check.pycompares against a fresh checkout of openvidu.io'smain, which still carries thestyle="width: 25%"attributes this PR replaces with.w-25/.w-50. Against the openvidu.io branch the check reports 43 pairs in sync.Merge after the openvidu.io PR (re-run
validatethen); publish with the Publish Web workflow onmain.🤖 Generated with Claude Code