Interface ThemeProperties

Something which contains all properties of a theme. Use this interface for creating new themes.

interface ThemeProperties {
    accentFill?: FillStyle;
    backgroundFill?: FillStyle;
    backgroundGlowFill?: FillStyle;
    blinkRate?: number;
    bodyTextAlign?: number;
    bodyTextFill?: FillStyle;
    bodyTextFont?: string;
    bodyTextHeight?: null | number;
    bodyTextSpacing?: null | number;
    canvasFill?: FillStyle;
    checkboxInnerPadding?: number;
    checkboxLength?: number;
    containerAlignment?: Alignment2D;
    containerPadding?: Padding;
    cursorIndicatorSize?: number;
    cursorThickness?: number;
    inputBackgroundFill?: FillStyle;
    inputSelectBackgroundFill?: FillStyle;
    inputTextAlign?: number;
    inputTextFill?: FillStyle;
    inputTextFillDisabled?: FillStyle;
    inputTextFillInvalid?: FillStyle;
    inputTextFont?: string;
    inputTextHeight?: null | number;
    inputTextInnerPadding?: Padding;
    inputTextMinWidth?: number;
    inputTextSpacing?: null | number;
    mediaFallbackFill?: FillStyle;
    multiContainerAlignment?: FlexAlignment2D;
    multiContainerSpacing?: number;
    primaryFill?: FillStyle;
    radioButtonInnerPadding?: number;
    radioButtonLength?: number;
    roundedCornersRadii?: CornerRadii;
    scrollbarCornersRadii?: CornerRadii;
    scrollBarMinPercent?: number;
    scrollBarMinPixels?: number;
    scrollbarPadding?: Padding;
    scrollBarThickness?: number;
    sliderMinLength?: number;
    sliderThickness?: number;
    tooltipFill?: FillStyle;
    tooltipPadding?: Padding;
    tooltipRadii?: CornerRadii;
}

Hierarchy (view full)

Implemented by

Properties

accentFill?: FillStyle

The accent fill style. Usually a saturated colour more saturated than ThemeProperties#primaryFill used for highlighting boxes which use PrimaryFill.

backgroundFill?: FillStyle

The background fill style. Used for widgets with a background (as in, a background above the canvas background).

backgroundGlowFill?: FillStyle

The background glow fill style. Used for highlighting boxes which use ThemeProperties#backgroundFill.

blinkRate?: number

The blink rate of text cursors in text input widgets like TextInput. Value in "blinks" per second.

bodyTextAlign?: number

The default text alignment mode of body text (most regular text).

bodyTextFill?: FillStyle

The fill style used for body text (most regular text).

bodyTextFont?: string

The font style used for body text (most regular text).

bodyTextHeight?: null | number

The height of each line of text in body text (most regular text). If null, it will be automatically detected.

bodyTextSpacing?: null | number

The spacing between each line of text in body text (most regular text). If null, it will be automatically detected.

canvasFill?: FillStyle

The canvas background fill style.

checkboxInnerPadding?: number

The Padding used for Checkbox between the accent box shown when ticked and the background box.

checkboxLength?: number

The length in pixels used for Checkbox.

containerAlignment?: Alignment2D

The alignment in Container for when there is extra space.

containerPadding?: Padding

The Padding used in Container.

cursorIndicatorSize?: number

The side length of a text cursor's indicator in pixels. For now there is only a tab mode indicator.

cursorThickness?: number

The thickness of a text cursor in pixels.

inputBackgroundFill?: FillStyle

The background fill style used for input widgets like TextInput.

inputSelectBackgroundFill?: FillStyle

The background fill style used for input widgets like TextInput when text is selected.

inputTextAlign?: number

The default text alignment mode of text input widgets like TextInput.

inputTextFill?: FillStyle

The fill style used for text in input widgets like TextInput.

inputTextFillDisabled?: FillStyle

The fill style used for text in input widgets like TextInput when disabled.

inputTextFillInvalid?: FillStyle

The fill style used for text in input widgets like TextInput when invalid.

inputTextFont?: string

The font style used for text in input widgets like TextInput.

inputTextHeight?: null | number

The height of each line of text in input widgets like TextInput. If null, it will be automatically detected.

inputTextInnerPadding?: Padding

The Padding between text and border used for text input widgets like TextInput.

inputTextMinWidth?: number

The default minimum width of text input widgets like TextInput.

inputTextSpacing?: null | number

The spacing between each line of text in input widgets like TextInput. If null, it will be automatically detected.

mediaFallbackFill?: FillStyle

The fill style to use when media fails to load.

multiContainerAlignment?: FlexAlignment2D

The alignment in MultiContainer for when there is unused space.

multiContainerSpacing?: number

The spacing length between widgets in MultiContainer.

primaryFill?: FillStyle

The primary fill style. Usually a saturated colour used for filling boxes that need to stand out.

radioButtonInnerPadding?: number
radioButtonLength?: number
roundedCornersRadii?: CornerRadii

The radii to be used for rounding corners in RoundedCorners.

scrollbarCornersRadii?: CornerRadii

The radii to be used for rounding corners in ScrollableViewportWidget scrollbars.

scrollBarMinPercent?: number

The minimum length of the filled part of a ScrollableViewportWidget's scrollbar in percentage of total length.

scrollBarMinPixels?: number

The minimum length of the filled part of a ScrollableViewportWidget's scrollbar in pixels.

scrollbarPadding?: Padding

The Padding used in ScrollableViewportWidget scrollbars.

scrollBarThickness?: number

The thickness of a ScrollableViewportWidget's scrollbar in pixels.

sliderMinLength?: number

The minimum length of a Slider

sliderThickness?: number

The thickness of a Slider

tooltipFill?: FillStyle

The fill style to paint a TooltipContainer's background with.

tooltipPadding?: Padding
tooltipRadii?: CornerRadii

The radii to be used for rounding corners in TooltipContainer.