How to use terra-theme-provider - 1 common examples

To help you get started, we’ve selected a few terra-theme-provider examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github cerner / terra-framework / packages / terra-theme-provider / src / terra-dev-site / doc / example / DefaultThemeProvider.jsx View on Github external
render() {
    let themeSwitcher;

    function supportsCSSVars() {
      return window.CSS && window.CSS.supports && window.CSS.supports('(--fake-var: 0)');
    }

    if (supportsCSSVars()) {
      themeSwitcher = (
        <div>
          <label> Theme: </label>
          <select value="{this.state.theme}" id="theme">
            <option value="">Default</option>
            <option value="{ThemeProvider.Opts.Themes.MOCK}">Mock Theme</option>
          </select>
        </div>
      );
    } else {
      themeSwitcher = (
        <div>
      );
    }

    return (
      <div>
        <div>{themeSwitcher}</div>
        
          <div>
            Themable component
          </div></div></div>

terra-theme-provider

The theme provider component provides a theme to Terra UI components rendered within it via CSS custom properties a.k.a CSS variables.

Apache-2.0
Latest version published 7 months ago

Package Health Score

54 / 100
Full package analysis

Popular terra-theme-provider functions