44 lines
1013 B
Stylus
44 lines
1013 B
Stylus
RV-FlexGrid__Container()
|
|
display grid
|
|
|
|
RV-FlexGrid__Container--autoWidth(item-height=300px, item-min-width=300px)
|
|
grid-template-columns repeat(auto-fill, minmax(item-min-width, 1fr))
|
|
grid-template-rows repeat(auto-fill, minmax(item-height, 1fr))
|
|
grid-auto-rows minmax(item-height, 1fr)
|
|
|
|
RV-FlexGrid__Container--fixedSize(item-height=300px, item-width=300px)
|
|
RV-FlexGrid__Container--autoWidth(item-height, item-width)
|
|
grid-template-columns repeat(auto-fill, item-width)
|
|
justify-content space-between
|
|
|
|
RV-FlexGrid__Container--masonry(item-width=300px)
|
|
display unquote(block)
|
|
column-count auto
|
|
column-width item-width
|
|
|
|
RV-Utils__Hook--throw('masonry_grid', @(gap){
|
|
*{
|
|
margin-bottom: gap;
|
|
}
|
|
}
|
|
)
|
|
|
|
|
|
RV-FlexGrid(prefix='&')
|
|
{prefix}__Container
|
|
RV-FlexGrid__Container()
|
|
|
|
&--autoWidth
|
|
RV-FlexGrid__Container--autoWidth()
|
|
|
|
&--fixedSize
|
|
RV-FlexGrid__Container--fixedSize()
|
|
|
|
&--masonry
|
|
RV-FlexGrid__Container--masonry()
|
|
|
|
{prefix}__Item
|
|
RV-Alignment()
|
|
|
|
.RV-FlexGrid
|
|
RV-FlexGrid() |