FlexGrid

flex-grid.js

Options

No component-specific options documented yet.

Inherited from Animator

Accepted by every component. Defined once in animator.js.

option	description
WebkitBackdropFilter	Sets CSS WebkitBackdropFilter.
WebkitOverflowScrolling	Sets CSS WebkitOverflowScrolling.
WebkitTapHighlightColor	Sets CSS WebkitTapHighlightColor.
WebkitUserSelect	Sets CSS WebkitUserSelect.
alignSelf	Sets CSS alignSelf.
area	Sets CSS gridArea.
areas	Sets CSS gridTemplateAreas.
backdropFilter	Sets CSS backdropFilter.
background	Sets CSS background.
borderObj	Border as {width, color, type?, radius?}. Width carries its unit, e.g. "1px".
bottom	Sets CSS bottom.
boxShadow	Sets CSS boxShadow.
boxSizing	Sets CSS boxSizing.
center	Centres this element's CHILDREN. true for both axes, "x" horizontal, "y" vertical. Axis-aware: in a flex column "y" is justify-content, in a row it is align-items; a grid uses justify-items/align-items. To centre the element itself inside its parent, use mar: "center".
color	Sets CSS color.
cols	Sets CSS gridTemplateColumns.
columnGap	Sets CSS columnGap.
cursor	Sets CSS cursor.
display	Sets CSS display.
exact	Sets CSS fontSize.
flex	Sets CSS flex.
flexBasis	Sets CSS flexBasis.
flexGrow	Sets CSS flexGrow.
flexShrink	Sets CSS flexShrink.
flexWrap	Sets CSS flexWrap.
font	Sets CSS fontFamily.
gap	Sets CSS gap.
gridTemplateColumns	Sets CSS gridTemplateColumns.
gridTemplateRows	Sets CSS gridTemplateRows.
height	Sets CSS height.
hide	Hide the element without removing it from the tree.
hover	Styles applied on hover, e.g. {color, background, animation: "0.2s ease"}.
inset	Sets CSS inset.
keySet	Escape hatch — {key, value} written straight to element.style, or an array of them.
left	Sets CSS left.
letterSpacing	Sets CSS letterSpacing.
lineHeight	Sets CSS lineHeight.
mar	Margin. The same array-of-side-objects form as pad: mar: [{a: 40}], keys a t r b l, combinable. Additionally mar: "center" sets left and right to auto, as does {a: "auto"} or {center: true}.
maxHeight	Sets CSS maxHeight.
maxWidth	Sets CSS maxWidth.
minHeight	Sets CSS minHeight.
minWidth	Sets CSS minWidth.
noTheme	Opt this element out of Theme.setDefaults light/dark colouring.
opacity	Sets CSS opacity.
overflow	Sets CSS overflow.
overflowWrap	Sets CSS overflowWrap.
overflowX	Sets CSS overflowX.
overflowY	Sets CSS overflowY.
pad	Padding. An array of side objects: pad: [{a: 40}]. Keys are a all, t top, r right, b bottom, l left. Keys combine, so {tb: 12} sets top and bottom. A bare number is treated as px; any string is passed through, so {a: "2rem"} works.
pointerEvents	Sets CSS pointerEvents.
position	Sets CSS position.
radius	Sets CSS borderRadius.
raster	Attach a WebGL raster pipeline. Array of op nodes; see the Raster section.
resmar	Responsive margin — per-breakpoint overrides of mar, in the same form.
respad	Responsive padding — per-breakpoint overrides of pad, in the same form.
resprop	Per-breakpoint style overrides — [{breakpoint, ...css}]. exact is font size.
right	Sets CSS right.
rowGap	Sets CSS rowGap.
rows	Sets CSS gridTemplateRows.
size	Fluid type scale step (S1…S6) — font size that scales with the viewport.
textAlign	Sets CSS textAlign.
textTransform	Sets CSS textTransform.
theme	Explicit light/dark overrides — {light: {...}, dark: {...}}.
top	Sets CSS top.
transform	A CSS transform string applied verbatim, or an object handled by reactOnTransform(). Composed with scale when both are given.
transition	Sets CSS transition.
userSelect	Sets CSS userSelect.
vars	Custom CSS properties on this element — {"--nod-split": 0.2}. Custom properties inherit, so writing them on a root drives its whole subtree with one declaration; that is how the morph axes reach every generated element without a stylesheet.
whiteSpace	Sets CSS whiteSpace.
width	Sets CSS width.
wordBreak	Sets CSS wordBreak.
wordWrap	Sets CSS wordWrap.
zIndex	Sets CSS zIndex.

Generated from nodality 1.1.13.