Grid Item
<gstock-grid-item>
|
GstockGridItem
API
Properties
| Name | Description | Reflects | Type | Default |
|---|---|---|---|---|
span
|
Number of columns this item should span. Provides a fallback value for all breakpoints. |
|
number | undefined
|
-
|
offset
|
Number of columns to offset this item from the start. Moves the starting position of the item. |
|
number | undefined
|
-
|
updateComplete
|
A read-only promise that resolves when the component has finished updating. |
Learn more about attributes and properties .
Slots
| Name | Description |
|---|---|
default
|
The content of the grid item. |
Learn more about slots .
Custom Properties
| Name | Description | Default |
|---|---|---|
--gstock-grid-item-span
|
Default column span for all breakpoints. | |
--gstock-grid-item-span-xxs
|
Column span for xxs breakpoint (320px - 479px). | |
--gstock-grid-item-span-xs
|
Column span for xs breakpoint (480px - 767px). | |
--gstock-grid-item-span-s
|
Column span for s breakpoint (768px - 1023px). | |
--gstock-grid-item-span-m
|
Column span for m breakpoint (1024px - 1439px). | |
--gstock-grid-item-span-l
|
Column span for l breakpoint (1440px - 1919px). | |
--gstock-grid-item-span-xl
|
Column span for xl breakpoint (1920px+). | |
--gstock-grid-item-start
|
Default starting column position for all breakpoints. | |
--gstock-grid-item-start-xxs
|
Starting column position for xxs breakpoint. | |
--gstock-grid-item-start-xs
|
Starting column position for xs breakpoint. | |
--gstock-grid-item-start-s
|
Starting column position for s breakpoint. | |
--gstock-grid-item-start-m
|
Starting column position for m breakpoint. | |
--gstock-grid-item-start-l
|
Starting column position for l breakpoint. | |
--gstock-grid-item-start-xl
|
Starting column position for xl breakpoint. |
Learn more about custom properties .
CSS Parts
| Name | Description |
|---|---|
base
|
The grid item wrapper element. |
Learn more about CSS parts .