Add codegen tools to generate theming ts files

[PatoBeltran]

Adds a small parser for the theme files and validates that all themes have the same set of sections and properties. Then, write some typescript files that are intended to be used with white labeling.

The codegen tool will read all files under src/themes/ with the pattern _color.${themeName}.css and validate them too all have the exact same sections and properties, it will return errors if:

• A theme has an extra section
• A theme has an extra property inside a section
• A theme references a global css custom property (the ones sitting in src/_colors that doesn't exist.

It will then write the TS files for the following cases:

• Types for each section
• Types for what a custom type should include
• A type for all the themes defined
• A utils file with:
  • A method clearing all properties from a given dom element
  • A method to generate a stylesheet given a CustomTheme
• An object with all the key-value pairs for the defined themes.

Apart from this, the PR also:

• Change all non-scss files to use css.
• Remove one unused color from themes
• Fix link colors in normalize

[vincenzocaruso]

can you explain the usage of ts and .d.ts files? what's the usage scenario that you have in mind?

[PatoBeltran]

@vincenzocaruso sure, you can look at the renderer PR for a bit more context, but here is the explanation:

For white-labeling, I want a way to generate a theme file dynamically, so that based on some user input, we can calculate all the css custom properties we use related to colors and have a completely custom theme. To be able to do this correctly, we need to have some sort of types that define what a custom theme (we could also just use any, but since we have this data it's better to type it). Since today, white labeling logic takes a base theme (from the ones we have in our css) and generates custom stuff from it, in order to correctly generate the custom theme based on an existing theme we need to have the data about the existing themes in ts (again, we could hard-code the objects, but that would mean have that data in two places).

This tool is intended to provide automation in the creation of the types and defaults required for that white labeling logic to exist with the correct types and default values, as well as give us an extra validation level to ensure that all our theme files share the exact same sections and properties (i.e. they have the same definition).

[vincenzocaruso]

Do you need to update the Readme as well for the theming part?