GBC
Reference
URL reference API reference Grunt reference
Configure your compilation Fix configuration issues
Theme reference
Theme conditions theme.config.json file theme.scss.json file Theme variables reference
Project reference
Project directory Customization project Widgets Widget JavaScript file Widget template file Widget scss file Widgets with Modelhelper Deliverables
Upgrading
Application bootstrap Compatibility Use of cookies Customization migration Deploy runtime on GAS Deploy runtime with Portal Local storage Upgrade to 3.20 Upgrade to 3.10
Theme reference

Concepts

Here are some basic concepts to keep in mind to better understand theme variables.

Generated palettes

Colors palettes (like mt-blue-*) are generated from a base color. This is based on Material Design guidelines.

Color variables naming consistency

  • palette-* are for color palette variables (with generated variants)
  • theme-* are for theme-wide variables
  • gbc-*Widget-* are for specific widget/widget family variables
  • *-primary-*-color are aimed at featured elements like buttons, topbar, highlighted table lines
  • *-secondary-*-color are aimed at standard elements like containers, labels
  • *-field-*-color are aimed at field elements

List of theme variables you can use/change in your theme.scss.json file

The Theme variables reference page provide a complete list of the theme variables