Interface SimpleGridOptions

interface SimpleGridOptions {
    columns?: ResponsiveValue<number>;
    minChildWidth?: ResponsiveValue<number | "intrinsic" | string & {} | "auto" | "initial" | "inherit" | "-moz-initial" | "revert" | "revert-layer" | "unset" | "-moz-max-content" | "-moz-min-content" | "-webkit-fit-content" | "fit-content" | "max-content" | "min-content" | "-moz-fit-content" | "-webkit-max-content" | "min-intrinsic" | "-webkit-fill-available" | "-webkit-min-content">;
    spacing?: ResponsiveValue<number | string & {} | "initial" | "inherit" | "-moz-initial" | "revert" | "revert-layer" | "unset">;
    spacingX?: ResponsiveValue<number | string & {} | "initial" | "inherit" | "-moz-initial" | "revert" | "revert-layer" | "unset">;
    spacingY?: ResponsiveValue<number | string & {} | "initial" | "inherit" | "-moz-initial" | "revert" | "revert-layer" | "unset">;
}

Properties

columns? minChildWidth? spacing? spacingX? spacingY?

Properties

Optional columns

columns?: ResponsiveValue<number>

The number of columns

Optional minChildWidth

minChildWidth?: ResponsiveValue<number | "intrinsic" | string & {} | "auto" | "initial" | "inherit" | "-moz-initial" | "revert" | "revert-layer" | "unset" | "-moz-max-content" | "-moz-min-content" | "-webkit-fit-content" | "fit-content" | "max-content" | "min-content" | "-moz-fit-content" | "-webkit-max-content" | "min-intrinsic" | "-webkit-fill-available" | "-webkit-min-content">

The width at which child atoms will break into columns. Pass a number for pixel values or a string for any other valid CSS length.

Optional spacing

spacing?: ResponsiveValue<number | string & {} | "initial" | "inherit" | "-moz-initial" | "revert" | "revert-layer" | "unset">

The gap between the grid items

Optional spacingX

spacingX?: ResponsiveValue<number | string & {} | "initial" | "inherit" | "-moz-initial" | "revert" | "revert-layer" | "unset">

The column gap between the grid items

Optional spacingY

spacingY?: ResponsiveValue<number | string & {} | "initial" | "inherit" | "-moz-initial" | "revert" | "revert-layer" | "unset">

The row gap between the grid items

Settings

Member Visibility

Theme

On This Page

Generated using TypeDoc