@thi.ng/meta-css
Version:
Data-driven CSS framework codegen, transpiler & bundler
75 lines (74 loc) • 1.5 kB
JSON
{
"tables": {
"sizes-abs0": [0, 1, 2, 4, 8, 16],
"sizes-abs": [1, 2, 4, 8, 16],
"sizes-rel": [
10, 16, 17, 20, 25, 30, 33, 34, 40, 50, 60, 66, 67, 70, 75, 80, 83,
84, 90, 100
]
},
"vars": {
"w": ["width"],
"h": ["height"]
},
"specs": [
{
"name": "<vid><k>",
"doc": { "group": "<var>", "desc": "<v>" },
"props": "<var>",
"values": "sizes-abs0",
"unit": "rem",
"vars": ["w", "h"]
},
{
"name": "<vid>-<v>",
"doc": { "group": "<var>", "desc": "%" },
"props": "<var>",
"values": "sizes-rel",
"unit": "%",
"vars": ["w", "h"]
},
{
"name": "min<vid><k>",
"doc": { "group": "min. <var>", "desc": "<v>" },
"key": "i+1",
"props": "min-<var>",
"values": "sizes-abs",
"unit": "rem",
"vars": ["w", "h"]
},
{
"name": "min<vid>-<v>",
"doc": { "group": "min. <var>", "desc": "%" },
"props": "min-<var>",
"values": "sizes-rel",
"unit": "%",
"vars": ["w", "h"]
},
{
"name": "max<vid><k>",
"doc": { "group": "max. <var>", "desc": "<v>" },
"key": "i+1",
"props": "max-<var>",
"values": "sizes-abs",
"unit": "rem",
"vars": ["w", "h"]
},
{
"name": "max<vid>-<v>",
"doc": { "group": "max. <var>", "desc": "%" },
"props": "max-<var>",
"values": "sizes-rel",
"unit": "%",
"vars": ["w", "h"]
},
{
"name": "v<vid>-<v>",
"doc": { "group": "<var>" },
"props": "<var>",
"values": [25, 50, 75, 100],
"unit": "v<vid>",
"vars": ["w", "h"]
}
]
}