margo-ui 1.3.4 → 1.3.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/src/css/grid.css +18 -0
package/package.json
CHANGED
package/src/css/grid.css
CHANGED
|
@@ -63,6 +63,24 @@
|
|
|
63
63
|
row-gap: var(--margo-grid-gutter-y);
|
|
64
64
|
}
|
|
65
65
|
|
|
66
|
+
/*
|
|
67
|
+
* Row subgrid: the item spans N rows of its parent grid and shares those tracks
|
|
68
|
+
* with its siblings, so sibling boxes with different content lengths keep their
|
|
69
|
+
* internal sections — dividers, footers, actions — on the exact same lines.
|
|
70
|
+
* Must be applied to every sibling that has to align, all with the same N, and
|
|
71
|
+
* each must expose exactly N children (wrap what belongs together).
|
|
72
|
+
*
|
|
73
|
+
* The rows inherit the parent row-gap; override it on the item (same value on
|
|
74
|
+
* every sibling) when the internal spacing differs from the layout gutter.
|
|
75
|
+
*
|
|
76
|
+
* Use on: cards in a row whose separators must line up.
|
|
77
|
+
*/
|
|
78
|
+
@utility margo-grid-sub-rows-* {
|
|
79
|
+
display: grid;
|
|
80
|
+
grid-template-rows: subgrid;
|
|
81
|
+
grid-row-end: span --value(integer);
|
|
82
|
+
}
|
|
83
|
+
|
|
66
84
|
/*
|
|
67
85
|
* Standalone 12-column grid: same line names and gutters, but no max-width and
|
|
68
86
|
* no side padding — it fills whatever box it is placed in.
|