menu
announcement

Spectrum is now read-only. Learn more about the decision in our official announcement.

Primer

For discussing Primer, Octicons, our style guide, and design systems at GitHub πŸ€–πŸŽ¨

Channels
Team

Open office hours - 08/03/08

August 3, 2018 at 4:59pm

Open office hours - 08/03/08

August 3, 2018 at 4:59pm
Ask us about design systems, working at GitHub, React, and our explorations this week with emotion.js and styled-system 😎. (we'll be online 1-2pm PT)

August 3, 2018 at 6:09pm
I just found out about this, great idea! Would love to hear more details about your path to where you are now with DS
I read your article and loved it, I am currently exploring an architecture and tooling workflow to power a Design System with Lerna + emotion, but would love to hear about your path to having adoption of the system across engineering teams
Hi! We're using Lerna on the primer (css) repo. At the moment we're building a react component library that uses primer css for components, but we couldn't easily achieve the API we wanted for sharing "system" props such as color, typography etc. across all our components. We decided to try out emotion.js and add a theme (that contains json objects of colors etc.) along with styled-system that give us style functions we can use on our components. This is somewhat similar to utilities or atomic classes such as <Box p={3} color='blue.5'/>. The other benefit is that you could swap out the theme values in and keep the component markup the same - this will probably be useful to marketing sites etc. We haven't been using Lerna in the react component library as it doesn't seem necessary yet.

August 5, 2018 at 7:36pm
Great info Diana, I just started learning React, using this course https://learnreact.design/react-101, My goal is to learn enough to start using as a prototyping tool
Are office hours always on Mondays at the same time? It would be great to pick your brain :D