diff options
| -rw-r--r-- | src/css/csstree.nim | 2 | ||||
| -rw-r--r-- | src/css/cssvalues.nim | 10 | ||||
| -rw-r--r-- | src/css/layout.nim | 14 |
3 files changed, 20 insertions, 6 deletions
diff --git a/src/css/csstree.nim b/src/css/csstree.nim index 79872920..6c2b78de 100644 --- a/src/css/csstree.nim +++ b/src/css/csstree.nim @@ -238,7 +238,7 @@ proc getParent(frame: var TreeFrame; computed: CSSValues; display: CSSDisplay): var seq[StyledNode] = let parentDisplay = frame.computed{"display"} case parentDisplay - of DisplayInnerFlex: + of DisplayInnerFlex, DisplayInnerGrid: if display in DisplayOuterInline: if frame.anonComputed == nil: frame.anonComputed = frame.inheritFor(DisplayBlock) diff --git a/src/css/cssvalues.nim b/src/css/cssvalues.nim index 468b3298..8762e864 100644 --- a/src/css/cssvalues.nim +++ b/src/css/cssvalues.nim @@ -193,6 +193,8 @@ type DisplayFlowRoot = "flow-root" DisplayFlex = "flex" DisplayInlineFlex = "inline-flex" + DisplayGrid = "grid" + DisplayInlineGrid = "inline-grid" # internal, for layout DisplayTableWrapper = "" @@ -556,10 +558,11 @@ const OverflowScrollLike* = {OverflowScroll, OverflowAuto, OverflowOverlay} const OverflowHiddenLike* = {OverflowHidden, OverflowClip} const FlexReverse* = {FlexDirectionRowReverse, FlexDirectionColumnReverse} const DisplayInlineBlockLike* = { - DisplayInlineTable, DisplayInlineBlock, DisplayInlineFlex + DisplayInlineTable, DisplayInlineBlock, DisplayInlineFlex, DisplayInlineGrid } const DisplayOuterInline* = DisplayInlineBlockLike + {DisplayInline} const DisplayInnerFlex* = {DisplayFlex, DisplayInlineFlex} +const DisplayInnerGrid* = {DisplayGrid, DisplayInlineGrid} const RowGroupBox* = { # Note: caption is not included here DisplayTableRowGroup, DisplayTableHeaderGroup, DisplayTableFooterGroup @@ -751,8 +754,7 @@ func inherited*(t: CSSPropertyType): bool = func blockify*(display: CSSDisplay): CSSDisplay = case display of DisplayBlock, DisplayTable, DisplayListItem, DisplayNone, DisplayFlowRoot, - DisplayFlex, DisplayTableWrapper: - #TODO grid + DisplayFlex, DisplayTableWrapper, DisplayGrid: return display of DisplayInline, DisplayInlineBlock, DisplayTableRow, DisplayTableRowGroup, DisplayTableColumn, @@ -763,6 +765,8 @@ func blockify*(display: CSSDisplay): CSSDisplay = return DisplayTable of DisplayInlineFlex: return DisplayFlex + of DisplayInlineGrid: + return DisplayGrid func bfcify*(overflow: CSSOverflow): CSSOverflow = if overflow == OverflowVisible: diff --git a/src/css/layout.nim b/src/css/layout.nim index ff31f2e7..b28aecc8 100644 --- a/src/css/layout.nim +++ b/src/css/layout.nim @@ -105,10 +105,13 @@ func isDefinite(sc: SizeConstraint): bool = # Note: this does not include display types that cannot appear as block # children. func establishesBFC(computed: CSSValues): bool = + const DisplayWithBFC = { + DisplayFlowRoot, DisplayTable, DisplayFlex, DisplayGrid + } return computed{"float"} != FloatNone or - computed{"display"} in {DisplayFlowRoot, DisplayTable, DisplayFlex} or + computed{"display"} in DisplayWithBFC or computed{"overflow-x"} notin {OverflowVisible, OverflowClip} - #TODO contain, grid, multicol, column-span + #TODO contain, multicol, column-span func canpx(l: CSSLength; sc: SizeConstraint): bool = return l.u != clAuto and (l.u != clPerc or sc.t == scStretch) @@ -370,6 +373,7 @@ type # Forward declarations proc layoutTable(bctx: BlockContext; box: BlockBox; sizes: ResolvedSizes) proc layoutFlex(bctx: var BlockContext; box: BlockBox; sizes: ResolvedSizes) +proc layoutGrid(bctx: var BlockContext; box: BlockBox; sizes: ResolvedSizes) proc layoutRootBlock(lctx: LayoutContext; box: BlockBox; offset: Offset; sizes: ResolvedSizes) proc layout(bctx: var BlockContext; box: BlockBox; sizes: ResolvedSizes; @@ -2624,6 +2628,8 @@ proc layout(bctx: var BlockContext; box: BlockBox; sizes: ResolvedSizes; bctx.layoutTable(box, sizes) of DisplayInnerFlex: bctx.layoutFlex(box, sizes) + of DisplayInnerGrid: + bctx.layoutGrid(box, sizes) else: assert false @@ -2871,6 +2877,10 @@ proc layoutFlex(bctx: var BlockContext; box: BlockBox; sizes: ResolvedSizes) = if box.computed{"position"} != PositionStatic: lctx.popPositioned(box, box.state.size) +proc layoutGrid(bctx: var BlockContext; box: BlockBox; sizes: ResolvedSizes) = + #TODO implement grid + bctx.layoutFlow(box, sizes, canClear = false) + # Inner layout for boxes that establish a new block formatting context. proc layoutRootBlock(lctx: LayoutContext; box: BlockBox; offset: Offset; sizes: ResolvedSizes) = |