I would think the first thing to do -- at least if this were to be used for websites -- would be to rip out the mind-numbingly dumbass train wreck laundry list of how NOT to work with HTML or CSS -- much less JavaScript -- that is React given how badly it pisses on the user experience from an accessibility standpoint.

THEN stop declaring everything in pixels and use an accessible metric like EM. .. since your Typography section is utter incompetent garbage both in choice of font-size, and how you're using presentational classes to undo 22 years of progress. By the time you make all those dumbass classes to say what you want things to look like and piss them all over the markup, you might as well go back to using those FONT tags you so clearly seem to miss.

Just like the mind-numbing derpitude of using style="" in your template earlier to set flex and justification. Way to plan for graceful degradation and keeping that markup size under control... NOT.

Poster child for everything wrong with react and why when I EVERY time I get another contract to consult on accessibility, I have to rip trash like this out by the nerts. THIS is why people end up with 100k of markup doing 16k's job, 500k of CSS doing 32k's job, and two megabytes of scripttardery doing the job of 48k or less... IF ANY.

But tell me again how much "easier" this lunacy makes web development.