New method - UI theme with CSS variables & CSS-in-JS (JSS) for React - Full app #12

For situations where a react UI framework (e.g. Material UI), is not an option.
We'll a UI workflow for react using CSS-in-JS (JSS) and the power of CSS3 variables to create flexible UI components.
I was Inspired by Josh Wcomeau blog article:

Chapters

00:00 Introduction
04:10 Setting up the theme with global CSS variables
08:22 Styling our first component (Button)
14:17 Adding variant option to our components
17:31 Responsive CSS variables

- App source code:

- Starter code for this video
* checkout branch p11-generate-thumbs

- Final Code for this video:
* checkout branch p12-styling-ui-theme

About

This channel features high-quality learning materials related to web developments, mainly ReactJs and NodeJs. Practice by developing detailed applications.

Subscribe to get notified when we add new videos:

#react #frontend #firebase #firestore #reactjs #JSS #stylesheet #CSS

[Grishopping]

Greetings I write to you from Venezuela, my English is very bad I use the translator to understand you explain very well thanks ... despite the difficulty of the language I understand you very well

I have a doubt, I would appreciate it if you would help me;

at minute 03; 20 you declare the css variable as --color-new and at minute 3:26 you send it to be called with new ???? I don't understand where or how the change is made ... because you DO NOT use --color-new .... I hope you understand my question

What would be the video that you comment so that the user can change the variables of the topic or something like that did you comment on the video?

ESPAÑOL:

Saludos te escribo desde Venezuela, mi ingles es muy malo utilizo el traductor para explicas muy bien gracias... a pesar de la dificultad del idioma te entiendo muy bien

tengo es una duda, te agradeceria me ayudaras;

en el minuto 03;20 declaras la variable css como --color-new y en el minuto 3:26 la mandas a llamar con new ???? no entiendo donde o como se hace el cambio... porque NO utilizas --color-new.... espero entiendas mi duda

cual seria el video que comentas para que el usuario pueda cambiar las variables del tema o algo asi comentaste en el video?