Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Enable Contribute page to respond to screen size changes #232

Merged
merged 5 commits into from Dec 3, 2020

Conversation

andrewiggins
Copy link
Contributor

This change enables overflow on the code examples in the contribute page so the content can respond to screen width changes. First step to enabling a responsive mobile experience for the OpenUI website. In a future PR I'll look at adding a very basic accessible mobile menu.

Also fixed JSON5 syntax highlighting.

I based this on some of the suggestions by @aardrian in #170

Before:
image
Note horizontal scrollbar on page, no syntax highlighting

After:
image
Note horizontal scrollbar on code example and not entire page, proper syntax highlighting

Related #170

* Ensure we have the latest prismjs and prism-react-renderer
* Shorten example description to make it easier to read and reduce screen sizes where overflow is required
* Fix JSON5 syntax highlighting
* Specify markdown sytnax highlighting for front matter samples. Markdown front matter highlighting will come to PrismJS in the next version (PrismJS/prism#2634)
* Trim whitespace and newlines from the end of code samples
Enables the Contribute page to shrink according to screen size
@yoavweiss
Copy link

@andrewiggins - can you join the wicg to appease the IPR bots?

@andrewiggins
Copy link
Contributor Author

Yup - I've created my W3C account and linked my GitHub account. I've submitted requests to join the WICG and OpenUI Community Groups and am just awaiting approval from my Advisory Committee Rep

@andrewiggins
Copy link
Contributor Author

Rep just approved and the ipr check is now passing 🎉

@yoavweiss
Copy link

@andrewiggins - welcome! :)

@una
Copy link
Collaborator

una commented Dec 2, 2020

Nice, thanks for this PR

Copy link
Member

@gregwhitworth gregwhitworth left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you so much for this PR - and a mobile menu PR would be epic!!!

@gregwhitworth gregwhitworth merged commit da86c2a into openui:master Dec 3, 2020
@andrewiggins andrewiggins deleted the mobile-improvements branch December 3, 2020 18:36
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants