Bento Grid

Mosaic CSS grid layout. BentoItem controls column and row spans. Great for dashboards, feature showcases, landing pages.

layout bento-grid

Usage

// import "mljr-web/ui/layout"
layout.BentoGrid(layout.BentoGridProps{Cols: 3},
    layout.BentoItem(layout.BentoItemProps{ColSpan: 2, RowSpan: 1}, content1),
    layout.BentoItem(layout.BentoItemProps{ColSpan: 1, RowSpan: 2}, content2),
    layout.BentoItem(layout.BentoItemProps{ColSpan: 1, RowSpan: 1}, content3),
    layout.BentoItem(layout.BentoItemProps{ColSpan: 1, RowSpan: 1}, content4),
)