Shortlist example frameworks

[lyubomir-popov]

I'm going to jot down some notes here as I research the topic.

Bootstrap: Seems to have two approaches:

• Theme builder which sets defaults on build time. Less output, but themes can't coexist https://bootstrap.build/app
• Creating a theme overlay that overrides the default theme. More output, but themes can coexist. https://getbootstrap.com/docs/4.0/getting-started/theming/

[lyubomir-popov]

Material design theming seems to start with a default theme, then override, so the two themes can coexist.

SemanticUI has an interesting approach - a config file where each component is assigned a default theme.

[lyubomir-popov]

In terms of requirements:

• Different themes need to coexist on the same page, so the approach we choose shouldn't be relying on build-time settings
• In its simplest form, we should be able to switch a pattern to a dark theme by applying a class to it
• A slightly better version, but with possibly more complexity, would be to be able to apply the theme simultaneously to multiple items, like a parent with .is-dark class
• If the current (white theme) is a default that gets overriden with a different theme, would that cause issues when you have nesting? E.g. white card inside dark p-strip
• Do we foresee a case where the page starts out as dark, then we want a section inside that that needs to be white? Again a nesting question, because one way overrides (dark replacing white) would be straightforward, whereas two way overriding (dark replacing white, or white replacing dark) could be more difficult.