@carbon/grid 10.0.0-rc.0 → 10.2.0
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/CHANGELOG.md +415 -0
- package/LICENSE +2 -2
- package/README.md +30 -26
- package/package.json +12 -5
- package/scss/12.scss +4 -0
- package/scss/_inlined/12.scss +41 -0
- package/scss/_inlined/_mixins.scss +335 -0
- package/scss/_inlined/_prefix.scss +12 -0
- package/scss/_mixins.scss +56 -41
- package/scss/_prefix.scss +4 -0
- package/scss/grid.scss +1 -1
- package/scss/index.scss +10 -0
- package/scss/vendor/@carbon/import-once/import-once.scss +27 -0
- package/scss/vendor/@carbon/import-once/index.scss +8 -0
- package/scss/vendor/@carbon/layout/_breakpoint.scss +237 -0
- package/scss/vendor/@carbon/layout/_convert.scss +30 -0
- package/scss/vendor/@carbon/layout/_key-height.scss +97 -0
- package/scss/vendor/@carbon/layout/_mini-unit.scss +23 -0
- package/scss/vendor/@carbon/layout/_spacing.scss +328 -0
- package/scss/vendor/@carbon/layout/_utilities.scss +41 -0
- package/scss/vendor/@carbon/layout/index.scss +8 -0
- package/scss/vendor/@carbon/layout/layout.scss +12 -0
- package/css/grid.css +0 -1053
- package/css/grid.min.css +0 -1
|
@@ -0,0 +1,328 @@
|
|
|
1
|
+
//
|
|
2
|
+
// Copyright IBM Corp. 2018, 2018
|
|
3
|
+
//
|
|
4
|
+
// This source code is licensed under the Apache-2.0 license found in the
|
|
5
|
+
// LICENSE file in the root directory of this source tree.
|
|
6
|
+
//
|
|
7
|
+
|
|
8
|
+
@import 'mini-unit';
|
|
9
|
+
|
|
10
|
+
/// 0.125rem (2px) spacing with default mini unit
|
|
11
|
+
/// @type Number
|
|
12
|
+
/// @access public
|
|
13
|
+
/// @group @carbon/layout
|
|
14
|
+
$carbon--spacing-01: carbon--mini-units(0.25) !default;
|
|
15
|
+
|
|
16
|
+
/// 0.25rem (4px) spacing with default mini unit
|
|
17
|
+
/// @type Number
|
|
18
|
+
/// @access public
|
|
19
|
+
/// @group @carbon/layout
|
|
20
|
+
$carbon--spacing-02: carbon--mini-units(0.5) !default;
|
|
21
|
+
|
|
22
|
+
/// 0.5rem (8px) spacing with default mini unit
|
|
23
|
+
/// @type Number
|
|
24
|
+
/// @access public
|
|
25
|
+
/// @group @carbon/layout
|
|
26
|
+
$carbon--spacing-03: carbon--mini-units(1) !default;
|
|
27
|
+
|
|
28
|
+
/// 0.75rem (12px) spacing with default mini unit
|
|
29
|
+
/// @type Number
|
|
30
|
+
/// @access public
|
|
31
|
+
/// @group @carbon/layout
|
|
32
|
+
$carbon--spacing-04: carbon--mini-units(1.5) !default;
|
|
33
|
+
|
|
34
|
+
/// 1rem (16px) spacing with default mini unit
|
|
35
|
+
/// @type Number
|
|
36
|
+
/// @access public
|
|
37
|
+
/// @group @carbon/layout
|
|
38
|
+
$carbon--spacing-05: carbon--mini-units(2) !default;
|
|
39
|
+
|
|
40
|
+
/// 1.5rem (24px) spacing with default mini unit
|
|
41
|
+
/// @type Number
|
|
42
|
+
/// @access public
|
|
43
|
+
/// @group @carbon/layout
|
|
44
|
+
$carbon--spacing-06: carbon--mini-units(3) !default;
|
|
45
|
+
|
|
46
|
+
/// 2rem (32px) spacing with default mini unit
|
|
47
|
+
/// @type Number
|
|
48
|
+
/// @access public
|
|
49
|
+
/// @group @carbon/layout
|
|
50
|
+
$carbon--spacing-07: carbon--mini-units(4) !default;
|
|
51
|
+
|
|
52
|
+
/// 2.5rem (40px) spacing with default mini unit
|
|
53
|
+
/// @type Number
|
|
54
|
+
/// @access public
|
|
55
|
+
/// @group @carbon/layout
|
|
56
|
+
$carbon--spacing-08: carbon--mini-units(5) !default;
|
|
57
|
+
|
|
58
|
+
/// 3rem (48px) spacing with default mini unit
|
|
59
|
+
/// @type Number
|
|
60
|
+
/// @access public
|
|
61
|
+
/// @group @carbon/layout
|
|
62
|
+
$carbon--spacing-09: carbon--mini-units(6) !default;
|
|
63
|
+
|
|
64
|
+
/// 4rem (64px) spacing with default mini unit
|
|
65
|
+
/// @type Number
|
|
66
|
+
/// @access public
|
|
67
|
+
/// @group @carbon/layout
|
|
68
|
+
$carbon--spacing-10: carbon--mini-units(8) !default;
|
|
69
|
+
|
|
70
|
+
/// 5rem (80px) spacing with default mini unit
|
|
71
|
+
/// @type Number
|
|
72
|
+
/// @access public
|
|
73
|
+
/// @group @carbon/layout
|
|
74
|
+
$carbon--spacing-11: carbon--mini-units(10) !default;
|
|
75
|
+
|
|
76
|
+
/// 6rem (96px) spacing with default mini unit
|
|
77
|
+
/// @type Number
|
|
78
|
+
/// @access public
|
|
79
|
+
/// @group @carbon/layout
|
|
80
|
+
$carbon--spacing-12: carbon--mini-units(12) !default;
|
|
81
|
+
|
|
82
|
+
/// All spacing increments in a map
|
|
83
|
+
/// @type Map
|
|
84
|
+
/// @access public
|
|
85
|
+
/// @group @carbon/layout
|
|
86
|
+
$carbon--spacing: (
|
|
87
|
+
$carbon--spacing-01,
|
|
88
|
+
$carbon--spacing-02,
|
|
89
|
+
$carbon--spacing-03,
|
|
90
|
+
$carbon--spacing-04,
|
|
91
|
+
$carbon--spacing-05,
|
|
92
|
+
$carbon--spacing-06,
|
|
93
|
+
$carbon--spacing-07,
|
|
94
|
+
$carbon--spacing-08,
|
|
95
|
+
$carbon--spacing-09,
|
|
96
|
+
$carbon--spacing-10,
|
|
97
|
+
$carbon--spacing-11,
|
|
98
|
+
$carbon--spacing-12
|
|
99
|
+
) !default;
|
|
100
|
+
|
|
101
|
+
/// @type Number
|
|
102
|
+
/// @access public
|
|
103
|
+
/// @group @carbon/layout
|
|
104
|
+
/// @alias carbon--spacing-01
|
|
105
|
+
$spacing-01: $carbon--spacing-01 !default;
|
|
106
|
+
|
|
107
|
+
/// @type Number
|
|
108
|
+
/// @access public
|
|
109
|
+
/// @group @carbon/layout
|
|
110
|
+
/// @alias carbon--spacing-02
|
|
111
|
+
$spacing-02: $carbon--spacing-02 !default;
|
|
112
|
+
|
|
113
|
+
/// @type Number
|
|
114
|
+
/// @access public
|
|
115
|
+
/// @group @carbon/layout
|
|
116
|
+
/// @alias carbon--spacing-03
|
|
117
|
+
$spacing-03: $carbon--spacing-03 !default;
|
|
118
|
+
|
|
119
|
+
/// @type Number
|
|
120
|
+
/// @access public
|
|
121
|
+
/// @group @carbon/layout
|
|
122
|
+
/// @alias carbon--spacing-04
|
|
123
|
+
$spacing-04: $carbon--spacing-04 !default;
|
|
124
|
+
|
|
125
|
+
/// @type Number
|
|
126
|
+
/// @access public
|
|
127
|
+
/// @group @carbon/layout
|
|
128
|
+
/// @alias carbon--spacing-05
|
|
129
|
+
$spacing-05: $carbon--spacing-05 !default;
|
|
130
|
+
|
|
131
|
+
/// @type Number
|
|
132
|
+
/// @access public
|
|
133
|
+
/// @group @carbon/layout
|
|
134
|
+
/// @alias carbon--spacing-06
|
|
135
|
+
$spacing-06: $carbon--spacing-06 !default;
|
|
136
|
+
|
|
137
|
+
/// @type Number
|
|
138
|
+
/// @access public
|
|
139
|
+
/// @group @carbon/layout
|
|
140
|
+
/// @alias carbon--spacing-07
|
|
141
|
+
$spacing-07: $carbon--spacing-07 !default;
|
|
142
|
+
|
|
143
|
+
/// @type Number
|
|
144
|
+
/// @access public
|
|
145
|
+
/// @group @carbon/layout
|
|
146
|
+
/// @alias carbon--spacing-08
|
|
147
|
+
$spacing-08: $carbon--spacing-08 !default;
|
|
148
|
+
|
|
149
|
+
/// @type Number
|
|
150
|
+
/// @access public
|
|
151
|
+
/// @group @carbon/layout
|
|
152
|
+
/// @alias carbon--spacing-09
|
|
153
|
+
$spacing-09: $carbon--spacing-09 !default;
|
|
154
|
+
|
|
155
|
+
/// @type Number
|
|
156
|
+
/// @access public
|
|
157
|
+
/// @group @carbon/layout
|
|
158
|
+
/// @alias carbon--spacing-10
|
|
159
|
+
$spacing-10: $carbon--spacing-10 !default;
|
|
160
|
+
|
|
161
|
+
/// @type Number
|
|
162
|
+
/// @access public
|
|
163
|
+
/// @group @carbon/layout
|
|
164
|
+
/// @alias carbon--spacing-11
|
|
165
|
+
$spacing-11: $carbon--spacing-11 !default;
|
|
166
|
+
|
|
167
|
+
/// @type Number
|
|
168
|
+
/// @access public
|
|
169
|
+
/// @group @carbon/layout
|
|
170
|
+
/// @alias carbon--spacing-12
|
|
171
|
+
$spacing-12: $carbon--spacing-12 !default;
|
|
172
|
+
|
|
173
|
+
/// 1rem (16px) layout with default mini unit
|
|
174
|
+
/// @type Number
|
|
175
|
+
/// @access public
|
|
176
|
+
/// @group @carbon/layout
|
|
177
|
+
$carbon--layout-01: carbon--mini-units(2) !default;
|
|
178
|
+
|
|
179
|
+
/// 1.5rem (24px) layout with default mini unit
|
|
180
|
+
/// @type Number
|
|
181
|
+
/// @access public
|
|
182
|
+
/// @group @carbon/layout
|
|
183
|
+
$carbon--layout-02: carbon--mini-units(3) !default;
|
|
184
|
+
|
|
185
|
+
/// 2rem (32px) layout with default mini unit
|
|
186
|
+
/// @type Number
|
|
187
|
+
/// @access public
|
|
188
|
+
/// @group @carbon/layout
|
|
189
|
+
$carbon--layout-03: carbon--mini-units(4) !default;
|
|
190
|
+
|
|
191
|
+
/// 3rem (48px) layout with default mini unit
|
|
192
|
+
/// @type Number
|
|
193
|
+
/// @access public
|
|
194
|
+
/// @group @carbon/layout
|
|
195
|
+
$carbon--layout-04: carbon--mini-units(6) !default;
|
|
196
|
+
|
|
197
|
+
/// 4rem (64px) layout with default mini unit
|
|
198
|
+
/// @type Number
|
|
199
|
+
/// @access public
|
|
200
|
+
/// @group @carbon/layout
|
|
201
|
+
$carbon--layout-05: carbon--mini-units(8) !default;
|
|
202
|
+
|
|
203
|
+
/// 4rem (96px) layout with default mini unit
|
|
204
|
+
/// @type Number
|
|
205
|
+
/// @access public
|
|
206
|
+
/// @group @carbon/layout
|
|
207
|
+
$carbon--layout-06: carbon--mini-units(12) !default;
|
|
208
|
+
|
|
209
|
+
/// 10rem (160px) layout with default mini unit
|
|
210
|
+
/// @type Number
|
|
211
|
+
/// @access public
|
|
212
|
+
/// @group @carbon/layout
|
|
213
|
+
$carbon--layout-07: carbon--mini-units(20) !default;
|
|
214
|
+
|
|
215
|
+
/// All layout increments in a map
|
|
216
|
+
/// @type Map
|
|
217
|
+
/// @access public
|
|
218
|
+
/// @group @carbon/layout
|
|
219
|
+
$carbon--layout: (
|
|
220
|
+
$carbon--layout-01,
|
|
221
|
+
$carbon--layout-02,
|
|
222
|
+
$carbon--layout-03,
|
|
223
|
+
$carbon--layout-04,
|
|
224
|
+
$carbon--layout-05,
|
|
225
|
+
$carbon--layout-06,
|
|
226
|
+
$carbon--layout-07
|
|
227
|
+
) !default;
|
|
228
|
+
|
|
229
|
+
/// @type Number
|
|
230
|
+
/// @access public
|
|
231
|
+
/// @group @carbon/layout
|
|
232
|
+
/// @alias carbon--layout-01
|
|
233
|
+
$layout-01: $carbon--layout-01 !default;
|
|
234
|
+
|
|
235
|
+
/// @type Number
|
|
236
|
+
/// @access public
|
|
237
|
+
/// @group @carbon/layout
|
|
238
|
+
/// @alias carbon--layout-02
|
|
239
|
+
$layout-02: $carbon--layout-02 !default;
|
|
240
|
+
|
|
241
|
+
/// @type Number
|
|
242
|
+
/// @access public
|
|
243
|
+
/// @group @carbon/layout
|
|
244
|
+
/// @alias carbon--layout-03
|
|
245
|
+
$layout-03: $carbon--layout-03 !default;
|
|
246
|
+
|
|
247
|
+
/// @type Number
|
|
248
|
+
/// @access public
|
|
249
|
+
/// @group @carbon/layout
|
|
250
|
+
/// @alias carbon--layout-04
|
|
251
|
+
$layout-04: $carbon--layout-04 !default;
|
|
252
|
+
|
|
253
|
+
/// @type Number
|
|
254
|
+
/// @access public
|
|
255
|
+
/// @group @carbon/layout
|
|
256
|
+
/// @alias carbon--layout-05
|
|
257
|
+
$layout-05: $carbon--layout-05 !default;
|
|
258
|
+
|
|
259
|
+
/// @type Number
|
|
260
|
+
/// @access public
|
|
261
|
+
/// @group @carbon/layout
|
|
262
|
+
/// @alias carbon--layout-06
|
|
263
|
+
$layout-06: $carbon--layout-06 !default;
|
|
264
|
+
|
|
265
|
+
/// @type Number
|
|
266
|
+
/// @access public
|
|
267
|
+
/// @group @carbon/layout
|
|
268
|
+
/// @alias carbon--layout-07
|
|
269
|
+
$layout-07: $carbon--layout-07 !default;
|
|
270
|
+
|
|
271
|
+
/// 0vw fluid spacing
|
|
272
|
+
/// @type Number
|
|
273
|
+
/// @access public
|
|
274
|
+
/// @group @carbon/layout
|
|
275
|
+
$carbon--fluid-spacing-01: 0;
|
|
276
|
+
|
|
277
|
+
/// 2vw fluid spacing
|
|
278
|
+
/// @type Number
|
|
279
|
+
/// @access public
|
|
280
|
+
/// @group @carbon/layout
|
|
281
|
+
$carbon--fluid-spacing-02: 2vw;
|
|
282
|
+
|
|
283
|
+
/// 5vw fluid spacing
|
|
284
|
+
/// @type Number
|
|
285
|
+
/// @access public
|
|
286
|
+
/// @group @carbon/layout
|
|
287
|
+
$carbon--fluid-spacing-03: 5vw;
|
|
288
|
+
|
|
289
|
+
/// 10vw fluid spacing
|
|
290
|
+
/// @type Number
|
|
291
|
+
/// @access public
|
|
292
|
+
/// @group @carbon/layout
|
|
293
|
+
$carbon--fluid-spacing-04: 10vw;
|
|
294
|
+
|
|
295
|
+
/// All fluid spacing increments in a map
|
|
296
|
+
/// @type Map
|
|
297
|
+
/// @access public
|
|
298
|
+
/// @group @carbon/layout
|
|
299
|
+
$carbon--fluid-spacing: (
|
|
300
|
+
$carbon--fluid-spacing-01,
|
|
301
|
+
$carbon--fluid-spacing-02,
|
|
302
|
+
$carbon--fluid-spacing-03,
|
|
303
|
+
$carbon--fluid-spacing-04
|
|
304
|
+
) !default;
|
|
305
|
+
|
|
306
|
+
/// @type Number
|
|
307
|
+
/// @access public
|
|
308
|
+
/// @group @carbon/layout
|
|
309
|
+
/// @alias carbon--fluid-spacing-01
|
|
310
|
+
$fluid-spacing-01: $carbon--fluid-spacing-01 !default;
|
|
311
|
+
|
|
312
|
+
/// @type Number
|
|
313
|
+
/// @access public
|
|
314
|
+
/// @group @carbon/layout
|
|
315
|
+
/// @alias carbon--fluid-spacing-02
|
|
316
|
+
$fluid-spacing-02: $carbon--fluid-spacing-02 !default;
|
|
317
|
+
|
|
318
|
+
/// @type Number
|
|
319
|
+
/// @access public
|
|
320
|
+
/// @group @carbon/layout
|
|
321
|
+
/// @alias carbon--fluid-spacing-03
|
|
322
|
+
$fluid-spacing-03: $carbon--fluid-spacing-03 !default;
|
|
323
|
+
|
|
324
|
+
/// @type Number
|
|
325
|
+
/// @access public
|
|
326
|
+
/// @group @carbon/layout
|
|
327
|
+
/// @alias carbon--fluid-spacing-04
|
|
328
|
+
$fluid-spacing-04: $carbon--fluid-spacing-04 !default;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
//
|
|
2
|
+
// Copyright IBM Corp. 2018, 2018
|
|
3
|
+
//
|
|
4
|
+
// This source code is licensed under the Apache-2.0 license found in the
|
|
5
|
+
// LICENSE file in the root directory of this source tree.
|
|
6
|
+
//
|
|
7
|
+
|
|
8
|
+
/// Map deep get
|
|
9
|
+
/// @author Hugo Giraudel
|
|
10
|
+
/// @access public
|
|
11
|
+
/// @param {Map} $map - Map
|
|
12
|
+
/// @param {Arglist} $keys - Key chain
|
|
13
|
+
/// @return {*} Desired value
|
|
14
|
+
/// @group @carbon/layout
|
|
15
|
+
@function map-deep-get($map, $keys...) {
|
|
16
|
+
@each $key in $keys {
|
|
17
|
+
$map: map-get($map, $key);
|
|
18
|
+
}
|
|
19
|
+
@return $map;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
/// Provide a map and index, and get back the relevant key value
|
|
23
|
+
/// @access public
|
|
24
|
+
/// @param {Map} $map - Map
|
|
25
|
+
/// @param {Integer} $index - Key chain
|
|
26
|
+
/// @return {String} Desired value
|
|
27
|
+
/// @group @carbon/layout
|
|
28
|
+
@function carbon--key-by-index($map, $index) {
|
|
29
|
+
$keys: map-keys($map);
|
|
30
|
+
@return nth($keys, $index);
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
/// Pass in a map, and get the last one in the list back
|
|
34
|
+
/// @access public
|
|
35
|
+
/// @param {Map} $map - Map
|
|
36
|
+
/// @return {*} Desired value
|
|
37
|
+
/// @group @carbon/layout
|
|
38
|
+
@function last-map-item($map) {
|
|
39
|
+
$total-length: length($map);
|
|
40
|
+
@return map-get($map, carbon--key-by-index($map, $total-length));
|
|
41
|
+
}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
//
|
|
2
|
+
// Copyright IBM Corp. 2018, 2018
|
|
3
|
+
//
|
|
4
|
+
// This source code is licensed under the Apache-2.0 license found in the
|
|
5
|
+
// LICENSE file in the root directory of this source tree.
|
|
6
|
+
//
|
|
7
|
+
|
|
8
|
+
@import 'convert';
|
|
9
|
+
@import 'breakpoint';
|
|
10
|
+
@import 'mini-unit';
|
|
11
|
+
@import 'spacing';
|
|
12
|
+
@import 'key-height';
|