Theme reference

This section contains information about the GBC infrastructure and its components that underpin the customization project you undertake.

Theme parts

A theme part can contain:

  • theme.config.json file (optional) which contains the theme part's conditions.
  • theme.scss.json file (optional), which is used to set theme variables.
  • sass/ folder (optional), which can contain scss definitions such as themeVariables.scss and theme.scss.
  • resources/ folder (optional), which can contain resource files for the theme parts.

Theme parts are combined to produce runtime themes by defining them in either:

  • The optional custom.json file, for example:
    // sample: custom.json
    {
     "compile": {
       "mode": "cdev"
     },
     //here we have the theme definitions// it is an array of definitions"themes": [{
         // name of the theme// this one should be unique, only contain [a-z0-9_-] characters as// it will be the name of the folder in the runtime themes/ folder"name": "default",
         // title that will be displayed in the theme selector"title": "Default",
         // optional// ordered list of theme parts to combine in this theme"uses": ["platform/desktop"],
         // optional// conditions to add to the theme parts' ones"conditions": […]
       },
       {
         "name": "highcontrast",
         "title": "High contrast",
         "uses": ["platform/desktop", "colors/highcontrast"]
       },
       {
         "name": "default_mobile",
         "title": "Default",
         "uses": ["platform/mobile"]
       },
       {
         "name": "highcontrast_mobile",
         "title": "High contrast",
         "uses": ["platform/mobile", "colors/highcontrast"]
       }
     ]
    }
  • The configuration file given by the gbc build option --configuration= as a themes entry.

Compilation overrides

Themes variables and resources are compiled in a deterministic way, so the order of theme parts in theme definitions is important.

  • Theme variables For a given theme, theme variables defined in the GBC codebase are superseded by customization overrides, then superseded by each theme part in order.

  • Resources GBC own resources and customization resources are considered global resources at runtime. Customization resources supersede GBC codebase ones. Each theme part can add or override resources, considered then as theme resources.

  • Theme conditions Each theme part or theme definition can declare conditions. At build time, these conditions are combined, as the produced theme must fit all conditions possible in the execution context.