GBC 1.00.43 new features and upgrade notes

A summary of new features and changes in functionality introduced with Genero Browser Client (GBC) 1.00.43. Note the changes you may need to make when moving to this version of the GBC.

Important:

This version of GBC is desupported, use a more recent version of the product.

Important:

This page covers only those new features introduced with the Genero Browser Client version specified in the page title. Check prior new features pages if you migrate from an earlier version.

For a detailed list of GBC 1.00.43 changes, please refer to the list of fixes on our issue tracker.

New theme engine

This new theme engine is changing how theme variables are named and how they interact. We advice to use the new naming for the theme variables as described below but your current customization should work without making these changes.

Concepts

New concepts were introduced with this new theme framework. See Theme reference.

Generated palettes
Colors palettes (like mt-blue-*) are now generated from a base color (they were previously hardcoded). As it follows an algorithm, colors tint may have slightly changed.
Color variables naming consistency
In previous versions of GBC, some inconsistency exists in variables naming (e.g. gbc-secondary-text-color was used with gbc-primary-[medium-]color and gbc-primary-text-color with gbc-secondary-background-color).

Starting from 1.00.41, we renamed some variables to have more consistency, so that:

  • 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 aims featured elements like buttons, topbar, highlighted table lines
  • *-secondary-*-color aims standard elements like containers, labels
  • *-field-*-color aims field elements

What is changing

Previous customizations should not be affected by this new framework, as every old theme variable has been kept as an alias.

For more information about theme variables, see Theme variables reference.

Note:

Old variables are still valid, but they are deprecated and will be subject to disappear. If you have customizations, don't hesitate to change variables names to fit the new ones.

Table 1. Renamed variables
Old variable Renamed to Comment
primary-* palette-primary-* generated as a color palette from base color palette-primary
text-light-* palette-text-primary-* generated as a color palette from base color palette-text-primary
text-dark-* palette-text-secondary-* generated as a color palette from base color palette-text-secondary
gbc-secondary-text-color theme-primary-color
gbc-primary-color theme-primary-background-color
gbc-primary-medium-color theme-primary-emphasis-background-color
gbc-primary-light-color theme-primary-faded-background-color
gbc-primary-text-color theme-secondary-color
gbc-primary-background-color theme-secondary-background-color
gbc-secondary-background-color theme-secondary-alternative-background-color
gbc-field-background-color theme-field-background-color
gbc-field-disabled-background-color theme-field-disabled-background-color
gbc-field-readonly-background-color theme-field-readonly-background-color
gbc-disabled-color theme-disabled-color
gbc-separator-color theme-separator-color
gbc-header-color theme-header-color
gbc-message-color theme-message-background-color
gbc-error-color theme-error-background-color
traditional-mode-letter-spacing theme-traditional-mode-letter-spacing
table-min-width theme-table-min-width
table-min-pageSize theme-table-min-page-size
gbc-checkbox-size theme-checkbox-size
gbc-radiobutton-size theme-radiobutton-size
field-default-height theme-field-default-height
gbc-field-height-ratio theme-field-height-ratio
gbc-font-size-ratio theme-font-size-ratio
gbc-margin-ratio theme-margin-ratio
gbc-max-icon-size theme-max-icon-size
gbc-table-margin theme-table-margin
gbc-combobox-margin theme-combobox-margin
gbc-grid-inner-gutter theme-grid-inner-gutter
button-default-width theme-button-default-width
group-separation-size theme-group-separation-size
splitter-size theme-splitter-size
gbc-sidebar-always-visible-min-width theme-sidebar-always-visible-min-width
gbc-sidebar-default-width theme-sidebar-default-width
gbc-sidebar-max-width theme-sidebar-max-width
gbc-toggle-right-sidebar-min-width theme-toggle-chromebar-min-width
gbc-disable-ending-popup theme-disable-ending-popup
gbc-disable-context-menu theme-disable-context-menu
gbc-scrollers-speed theme-scrollers-speed
gbc-scrollers-clickonly theme-scrollers-clickonly
gbc-message-display-time theme-message-display-time
gbc-message-position theme-message-display-position
gbc-error-display-time theme-error-display-time
gbc-error-position theme-error-display-position
gbc-animation-duration theme-animation-duration
Table 2. Value changed variables
Variable Comment
mt-[color], mt-[color]-* generated via color palette algorithm, colors tint may have slightly changed
gbc-genero-[color] mt-[color] based values, generated via color palette algorithm, same tint changes
gbc-genero-appWorkSpace using theme-secondary-background-color rather than gbc-primary-background-color
gbc-genero-background using theme-secondary-background-color rather than gbc-secondary-background-color
gbc-genero-buttonFace using theme-primary-background-color rather than gbc-primary-color
gbc-genero-buttonText using theme-primary-color rather than gbc-secondary-text-color
gbc-genero-grayText using theme-disabled-color rather than gbc-disabled-color
gbc-genero-highLight using theme-primary-emphasis-background-color rather than gbc-primary-medium-color
gbc-genero-highLightText using theme-primary-color rather than gbc-secondary-text-color
gbc-genero-infoBackground using theme-secondary-background-color rather than gbc-primary-background-color
gbc-genero-infoText using theme-secondary-color rather than gbc-primary-text-color
gbc-genero-systemAlternateBackground using theme-primary-faded-background-color rather than gbc-primary-light-color
gbc-genero-window using theme-secondary-background-color rather than gbc-primary-background-color
gbc-genero-windowText using theme-secondary-color rather than gbc-primary-text-color
Table 3. New variables
Variable Comment
palette-primary base color for palette palette-primary-*
palette-secondary base color for palette palette-secondary-*
palette-secondary-* color palette based on palette-secondary
palette-disabled base color for palette palette-disabled-*
palette-disabled-* color palette based on palette-disabled
palette-text-primary base color for palette palette-text-primary-*
palette-text-secondary base color for palette palette-text-secondary-*
theme-secondary-faded-color color for less important text
theme-placeholder-color color for placeholder text
theme-overlay-background-color color for overlays (semi-transparent by default)
theme-message-color color for message text
theme-input-padding-top padding top for inputs
theme-input-padding-right padding right for inputs
theme-input-padding-bottom padding bottom for inputs
theme-input-padding-left padding left for inputs
theme-textarea-padding-top padding top for textareas
theme-textarea-padding-right padding right for textareas
theme-textarea-padding-bottom padding bottom for textareas
theme-textarea-padding-left padding left for textareas
theme-font-family theme's font-family
theme-font-family-monospace theme's font-family for monospace fonts
mdi-cust-icons additional font icon characters to include (see your local node_modules/@mdi/font/preview.html)
Table 4. Deleted variables
Variable Comment
z-index-under-Normal unused variable
z-index-Window unused variable
___gbc-sidebar-default-width old commented value
gbc-primary-strong-color unused variable
gbc-secondary-color using theme-secondary-color
Table 5. Unchanged variables
Variable
z-index-Normal
z-index-above-Normal
z-index-TopMenu
z-index-Toolbar
z-index-Dialog
z-index-Modal
z-index-BarsContainer
z-index-DropDown
z-index-above-DropDown
z-index-Message
z-index-LogPrompt
host-menu-order-upload-icon
host-menu-order-runtime-status
host-menu-order-about
host-menu-order-debug
host-menu-order-run-gwc
host-menu-order-run-gdc
host-menu-order-log-proxy
host-menu-order-log-vm
host-menu-order-settings
host-menu-order-bookmark
host-menu-order-close
aui-mutation-watch
droid-font-path
mdi-css-prefix
mdi-font-path