properties
changelog

Grid Rows

Set grid item's size and location on rows.

Usage:

  • @grid row-start-*;
  • @grid row-end-*;
  • @grid row-size-*;
  • @grid row-span-*;

Reference

shilp.config.js
const shilpConfig = {
	source: "react",

	properties: {
		grid: {
			row: {
				start: {
					property: "grid-row-start: <v><i>;",
					themeKey: "range",
					values: {},
				},

				end: {
					property: "grid-row-end: <v><i>;",
					themeKey: "range",
					values: {
						13: 13,
					},
				},

				size: {
					property: "grid-auto-rows: <v><i>;",
					values: {
						auto: "auto",
						min: "min-content",
						max: "max-content",
						fraction: "minmax(0, 1fr)",
					},
				},

				span: {
					property: "grid-row: <v><i>;",
					themeKey: "span",
					values: {},
				},
			},
		},
	},
};

export default shilpConfig;
presetrows