-
Notifications
You must be signed in to change notification settings - Fork 0
/
grid-template.js
69 lines (56 loc) · 1.43 KB
/
grid-template.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
import Declaration from "../declaration.js";
import {
getGridGap,
inheritGridGap,
parseTemplate,
warnGridGap,
warnMissedAreas,
} from "./grid-utils.js";
class GridTemplate extends Declaration {
/**
* Translate grid-template to separate -ms- prefixed properties
*/
insert(decl, prefix, prefixes, result) {
if (prefix !== "-ms-") return super.insert(decl, prefix, prefixes);
if (decl.parent.some((i) => i.prop === "-ms-grid-rows")) {
return undefined;
}
let gap = getGridGap(decl);
/**
* we must insert inherited gap values in some cases:
* if we are inside media query && if we have no grid-gap value
*/
let inheritedGap = inheritGridGap(decl, gap);
let { rows, columns, areas } = parseTemplate({
decl,
gap: inheritedGap || gap,
});
let hasAreas = Object.keys(areas).length > 0;
let hasRows = Boolean(rows);
let hasColumns = Boolean(columns);
warnGridGap({
gap,
hasColumns,
decl,
result,
});
warnMissedAreas(areas, decl, result);
if ((hasRows && hasColumns) || hasAreas) {
decl.cloneBefore({
prop: "-ms-grid-rows",
value: rows,
raws: {},
});
}
if (hasColumns) {
decl.cloneBefore({
prop: "-ms-grid-columns",
value: columns,
raws: {},
});
}
return decl;
}
}
GridTemplate.names = ["grid-template"];
export default GridTemplate;