Material Field widget

Variables to customize Material Field widget

$mt-field-margin-ratio

Ratio applied to the margin or space around a field

Type: number

Default value: $theme-margin-ratio

Computed value: 0.6

$mt-field-default-height

Default height for Material Field widget

Type: size

Default value: $theme-field-default-height

Computed value: 22.4px

$mt-field-background-color

Background color for Material Field widget

Type: color

Default value: $theme-field-background-color

Computed value: #ffffff

$mt-field-border-color

Border color for Material Field widget

Type: color

Default value: $theme-field-border-color

Computed value: #e0e0e0

$mt-field-border-width-top

Top border width for Material Field widget

Type: size

Default value: $1px

Computed value: 1px

$mt-field-border-width-right

Right border width for Material Field widget

Type: size

Default value: $1px

Computed value: 1px

$mt-field-border-width-bottom

Bottom border width for Material Field widget

Type: size

Default value: $1px

Computed value: 1px

$mt-field-border-width-left

Left border width for Material Field widget

Type: size

Default value: $1px

Computed value: 1px

$mt-field-focus-border-color

Border color for Material Field widget when focused

Type: color

Default value: $theme-primary-background-color

Computed value: #1976d2

$mt-field-focus-border-width-top

Top border width for Material Field widget when focused

Type: size

Default value: $1px

Computed value: 1px

$mt-field-focus-border-width-right

Right border width for Material Field widget when focused

Type: size

Default value: $1px

Computed value: 1px

$mt-field-focus-border-width-bottom

Bottom border width for Material Field widget when focused

Type: size

Default value: $1px

Computed value: 1px

$mt-field-focus-border-width-left

Left border width for Material Field widget when focused

Type: size

Default value: $1px

Computed value: 1px

$mt-field-readonly-background-color

Background color for Material Field widget when focused

Type: color

Default value: $theme-field-readonly-background-color

Computed value: #eeeeee

$mt-field-disabled-background-color

Background color for Material Field widget when disabled

Type: color

Default value: $theme-field-disabled-background-color

Computed value: #eeeeee

$mt-field-placeholder-color

Text color for placeholder in Material Field widget

Type: color

Default value: $theme-placeholder-color

Computed value: rgba(33, 33, 33, 0.54)

$mt-field-input-padding-top

Top padding for input in Material Field widget

Type: size

Default value: $theme-input-padding-top

Computed value: 1.2px

$mt-field-input-padding-right

Right padding for input in Material Field widget

Type: size

Default value: $theme-input-padding-right

Computed value: 3.6px

$mt-field-input-padding-bottom

Bottom padding for input in Material Field widget

Type: size

Default value: $theme-input-padding-bottom

Computed value: 1.2px

$mt-field-input-padding-left

Left padding for input in Material Field widget

Type: size

Default value: $theme-input-padding-left

Computed value: 3.6px

$mt-field-textarea-padding-top

Top padding for textarea in Material Field widget

Type: size

Default value: $theme-textarea-padding-top

Computed value: 2.4px

$mt-field-textarea-padding-right

Right padding for textarea in Material Field widget

Type: size

Default value: $theme-textarea-padding-right

Computed value: 3.6px

$mt-field-textarea-padding-bottom

Bottom padding for textarea in Material Field widget

Type: size

Default value: $theme-textarea-padding-bottom

Computed value: 0

$mt-field-textarea-padding-left

Left padding for textarea in Material Field widget

Type: size

Default value: $theme-textarea-padding-left

Computed value: 3.6px