Theme layout variables

Defines theme layout variables

$theme-field-height-ratio

Ratio applied to the space around text in a field (top and bottom).

Type: number

Default value: $0.7

Computed value: 0.7

Alias (for compatibility): $gbc-field-height-ratio

$theme-field-default-height

Type: size

Default value: $theme-field-height-ratio* 32px

Computed value: 22.4px

Alias (for compatibility): $field-default-height

$theme-font-size-ratio

The font size adjustment ratio in relation to Droid Sans font family sizes. For example, if the browser's available font for the <body> element is Times (12px), size of letters are adjusted by multiplying theme-font-size-ratio by font size. In our example, they display at 10.8 pixels high, (0.9 × 12).

Type: number

Default value: $0.8

Computed value: 0.8

Alias (for compatibility): $gbc-font-size-ratio

$theme-host-action-default-height

Type: size

Default value: $theme-margin-ratio* 56px

Computed value: 33.6px

Alias (for compatibility): $mt-toolbar-height

$theme-button-default-width

Type: size

Default value: $theme-font-size-ratio* 100px

Computed value: 80px

Alias (for compatibility): $button-default-width

$theme-margin-ratio

Ratio applied to the margin or space on the left of a field. When you type text in a field you have some space before text that is defined by this variable.

Type: number

Default value: $0.6

Computed value: 0.6

Alias (for compatibility): $gbc-margin-ratio

$theme-input-padding-top

Type: size

Default value: $theme-margin-ratio*2px

Computed value: 1.2px

$theme-input-padding-right

Type: size

Default value: $theme-margin-ratio*6px

Computed value: 3.6px

$theme-input-padding-bottom

Type: size

Default value: $theme-margin-ratio*2px

Computed value: 1.2px

$theme-input-padding-left

Type: size

Default value: $theme-margin-ratio*6px

Computed value: 3.6px

$theme-textarea-padding-top

Type: size

Default value: $theme-margin-ratio*4px

Computed value: 2.4px

$theme-textarea-padding-right

Type: size

Default value: $theme-input-padding-right

Computed value: 3.6px

$theme-textarea-padding-bottom

Type: size

Default value: $0

Computed value: 0

$theme-textarea-padding-left

Type: size

Default value: $theme-input-padding-left

Computed value: 3.6px

$theme-table-margin

Type: size

Default value: $theme-margin-ratio*10px

Computed value: 6px

Alias (for compatibility): $gbc-table-margin

$theme-combobox-margin

Type: size

Default value: $5px

Computed value: 5px

Alias (for compatibility): $gbc-combobox-margin

$theme-combobox-padding

Type: size

Default value: $2px

Computed value: 2px

Alias (for compatibility): $gbc-combobox-padding

$theme-radiobutton-size

Size of the radio button in pixels.

Type: size

Default value: $14px

Computed value: 14px

Alias (for compatibility): $gbc-radiobutton-size

$theme-checkbox-size

Size of the checkbox in pixels

Type: size

Default value: $14px

Computed value: 14px

Alias (for compatibility): $gbc-checkbox-size

$theme-sidebar-always-visible-min-width

DEPRECATED

Deprecated: Browser window width size (in pixels) for the left sidebar to appear. Use this setting to hide the left sidebar.

Type: size

Default value: $1400px

Computed value: 1400px

Alias (for compatibility): $gbc-sidebar-always-visible-min-width

$theme-sidebar-default-width

Default size of sidebar in pixels.

Type: size

Default value: $56px

Computed value: 56px

Alias (for compatibility): $gbc-sidebar-default-width

$theme-sidebar-max-width

Type: size

Default value: $156px

Computed value: 156px

Alias (for compatibility): $gbc-sidebar-max-width

$theme-sidebar-background-color

Sidebar background color.

Type: color

Default value: $palette-secondary-700

Computed value: #616161

$theme-sidebar-color

Sidebar color.

Type: color

Default value: $theme-primary-color

Computed value: white

$theme-toggle-chromebar-min-width

DEPRECATED

Warning, this is a deprecated feature! Browser window width size (in pixels) for the chromebar to appear. Use this setting to hide the chromebar.

Type: size

Default value: $720px

Computed value: 720px

Alias (for compatibility): $theme-toggle-right-sidebar-min-width,gbc-toggle-right-sidebar-min-width

$theme-group-separation-size

Type: string

Default value: $theme-margin-ratio* 12

Computed value: 7.2

Alias (for compatibility): $group-separation-size

$theme-splitter-size

Type: size

Default value: $theme-group-separation-size* 1px

Computed value: 7.2px

Alias (for compatibility): $splitter-size

$theme-traditional-mode-letter-spacing

Type: size

Default value: $1px

Computed value: 1px

Alias (for compatibility): $traditional-mode-letter-spacing

$theme-max-icon-size

Type: size

Default value: $32px

Computed value: 32px

Alias (for compatibility): $gbc-max-icon-size

$theme-small-icon-size

Type: size

Default value: $20px * $theme-font-size-ratio

Computed value: 16px

$theme-grid-inner-gutter

Type: number

Default value: $3

Computed value: 3

Alias (for compatibility): $layout-grid-inner-gutter

$theme-grid-inner-gutter-x

if defined override the 'theme-grid-inner-gutter' value

Type: number

$theme-grid-inner-gutter-y

if defined override the 'theme-grid-inner-gutter' value

Type: number