@gemeentenijmegen/layout-css 0.0.1-alpha.1

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/dist/grid.css ADDED
@@ -0,0 +1,430 @@
1
+ .nijmegen-grid {
2
+ display: grid;
3
+ gap: var(--nijmegen-grid-gap, 1.5rem);
4
+ grid-template-columns: repeat(12, 1fr);
5
+ grid-template-rows: repeat(var(--nijmegen-grid-rows, 1), 1fr);
6
+ }
7
+ .nijmegen-grid .nijmegen-g-col-1 {
8
+ grid-column: auto/span 1;
9
+ }
10
+ .nijmegen-grid .nijmegen-g-col-2 {
11
+ grid-column: auto/span 2;
12
+ }
13
+ .nijmegen-grid .nijmegen-g-col-3 {
14
+ grid-column: auto/span 3;
15
+ }
16
+ .nijmegen-grid .nijmegen-g-col-4 {
17
+ grid-column: auto/span 4;
18
+ }
19
+ .nijmegen-grid .nijmegen-g-col-5 {
20
+ grid-column: auto/span 5;
21
+ }
22
+ .nijmegen-grid .nijmegen-g-col-6 {
23
+ grid-column: auto/span 6;
24
+ }
25
+ .nijmegen-grid .nijmegen-g-col-7 {
26
+ grid-column: auto/span 7;
27
+ }
28
+ .nijmegen-grid .nijmegen-g-col-8 {
29
+ grid-column: auto/span 8;
30
+ }
31
+ .nijmegen-grid .nijmegen-g-col-9 {
32
+ grid-column: auto/span 9;
33
+ }
34
+ .nijmegen-grid .nijmegen-g-col-10 {
35
+ grid-column: auto/span 10;
36
+ }
37
+ .nijmegen-grid .nijmegen-g-col-11 {
38
+ grid-column: auto/span 11;
39
+ }
40
+ .nijmegen-grid .nijmegen-g-col-12 {
41
+ grid-column: auto/span 12;
42
+ }
43
+ .nijmegen-grid .nijmegen-g-start-1 {
44
+ grid-column-start: 1;
45
+ }
46
+ .nijmegen-grid .nijmegen-g-start-2 {
47
+ grid-column-start: 2;
48
+ }
49
+ .nijmegen-grid .nijmegen-g-start-3 {
50
+ grid-column-start: 3;
51
+ }
52
+ .nijmegen-grid .nijmegen-g-start-4 {
53
+ grid-column-start: 4;
54
+ }
55
+ .nijmegen-grid .nijmegen-g-start-5 {
56
+ grid-column-start: 5;
57
+ }
58
+ .nijmegen-grid .nijmegen-g-start-6 {
59
+ grid-column-start: 6;
60
+ }
61
+ .nijmegen-grid .nijmegen-g-start-7 {
62
+ grid-column-start: 7;
63
+ }
64
+ .nijmegen-grid .nijmegen-g-start-8 {
65
+ grid-column-start: 8;
66
+ }
67
+ .nijmegen-grid .nijmegen-g-start-9 {
68
+ grid-column-start: 9;
69
+ }
70
+ .nijmegen-grid .nijmegen-g-start-10 {
71
+ grid-column-start: 10;
72
+ }
73
+ .nijmegen-grid .nijmegen-g-start-11 {
74
+ grid-column-start: 11;
75
+ }
76
+ @media (min-width: 576px) {
77
+ .nijmegen-grid .nijmegen-g-col-sm-1 {
78
+ grid-column: auto/span 1;
79
+ }
80
+ .nijmegen-grid .nijmegen-g-col-sm-2 {
81
+ grid-column: auto/span 2;
82
+ }
83
+ .nijmegen-grid .nijmegen-g-col-sm-3 {
84
+ grid-column: auto/span 3;
85
+ }
86
+ .nijmegen-grid .nijmegen-g-col-sm-4 {
87
+ grid-column: auto/span 4;
88
+ }
89
+ .nijmegen-grid .nijmegen-g-col-sm-5 {
90
+ grid-column: auto/span 5;
91
+ }
92
+ .nijmegen-grid .nijmegen-g-col-sm-6 {
93
+ grid-column: auto/span 6;
94
+ }
95
+ .nijmegen-grid .nijmegen-g-col-sm-7 {
96
+ grid-column: auto/span 7;
97
+ }
98
+ .nijmegen-grid .nijmegen-g-col-sm-8 {
99
+ grid-column: auto/span 8;
100
+ }
101
+ .nijmegen-grid .nijmegen-g-col-sm-9 {
102
+ grid-column: auto/span 9;
103
+ }
104
+ .nijmegen-grid .nijmegen-g-col-sm-10 {
105
+ grid-column: auto/span 10;
106
+ }
107
+ .nijmegen-grid .nijmegen-g-col-sm-11 {
108
+ grid-column: auto/span 11;
109
+ }
110
+ .nijmegen-grid .nijmegen-g-col-sm-12 {
111
+ grid-column: auto/span 12;
112
+ }
113
+ .nijmegen-grid .nijmegen-g-start-sm-1 {
114
+ grid-column-start: 1;
115
+ }
116
+ .nijmegen-grid .nijmegen-g-start-sm-2 {
117
+ grid-column-start: 2;
118
+ }
119
+ .nijmegen-grid .nijmegen-g-start-sm-3 {
120
+ grid-column-start: 3;
121
+ }
122
+ .nijmegen-grid .nijmegen-g-start-sm-4 {
123
+ grid-column-start: 4;
124
+ }
125
+ .nijmegen-grid .nijmegen-g-start-sm-5 {
126
+ grid-column-start: 5;
127
+ }
128
+ .nijmegen-grid .nijmegen-g-start-sm-6 {
129
+ grid-column-start: 6;
130
+ }
131
+ .nijmegen-grid .nijmegen-g-start-sm-7 {
132
+ grid-column-start: 7;
133
+ }
134
+ .nijmegen-grid .nijmegen-g-start-sm-8 {
135
+ grid-column-start: 8;
136
+ }
137
+ .nijmegen-grid .nijmegen-g-start-sm-9 {
138
+ grid-column-start: 9;
139
+ }
140
+ .nijmegen-grid .nijmegen-g-start-sm-10 {
141
+ grid-column-start: 10;
142
+ }
143
+ .nijmegen-grid .nijmegen-g-start-sm-11 {
144
+ grid-column-start: 11;
145
+ }
146
+ }
147
+ @media (min-width: 768px) {
148
+ .nijmegen-grid .nijmegen-g-col-md-1 {
149
+ grid-column: auto/span 1;
150
+ }
151
+ .nijmegen-grid .nijmegen-g-col-md-2 {
152
+ grid-column: auto/span 2;
153
+ }
154
+ .nijmegen-grid .nijmegen-g-col-md-3 {
155
+ grid-column: auto/span 3;
156
+ }
157
+ .nijmegen-grid .nijmegen-g-col-md-4 {
158
+ grid-column: auto/span 4;
159
+ }
160
+ .nijmegen-grid .nijmegen-g-col-md-5 {
161
+ grid-column: auto/span 5;
162
+ }
163
+ .nijmegen-grid .nijmegen-g-col-md-6 {
164
+ grid-column: auto/span 6;
165
+ }
166
+ .nijmegen-grid .nijmegen-g-col-md-7 {
167
+ grid-column: auto/span 7;
168
+ }
169
+ .nijmegen-grid .nijmegen-g-col-md-8 {
170
+ grid-column: auto/span 8;
171
+ }
172
+ .nijmegen-grid .nijmegen-g-col-md-9 {
173
+ grid-column: auto/span 9;
174
+ }
175
+ .nijmegen-grid .nijmegen-g-col-md-10 {
176
+ grid-column: auto/span 10;
177
+ }
178
+ .nijmegen-grid .nijmegen-g-col-md-11 {
179
+ grid-column: auto/span 11;
180
+ }
181
+ .nijmegen-grid .nijmegen-g-col-md-12 {
182
+ grid-column: auto/span 12;
183
+ }
184
+ .nijmegen-grid .nijmegen-g-start-md-1 {
185
+ grid-column-start: 1;
186
+ }
187
+ .nijmegen-grid .nijmegen-g-start-md-2 {
188
+ grid-column-start: 2;
189
+ }
190
+ .nijmegen-grid .nijmegen-g-start-md-3 {
191
+ grid-column-start: 3;
192
+ }
193
+ .nijmegen-grid .nijmegen-g-start-md-4 {
194
+ grid-column-start: 4;
195
+ }
196
+ .nijmegen-grid .nijmegen-g-start-md-5 {
197
+ grid-column-start: 5;
198
+ }
199
+ .nijmegen-grid .nijmegen-g-start-md-6 {
200
+ grid-column-start: 6;
201
+ }
202
+ .nijmegen-grid .nijmegen-g-start-md-7 {
203
+ grid-column-start: 7;
204
+ }
205
+ .nijmegen-grid .nijmegen-g-start-md-8 {
206
+ grid-column-start: 8;
207
+ }
208
+ .nijmegen-grid .nijmegen-g-start-md-9 {
209
+ grid-column-start: 9;
210
+ }
211
+ .nijmegen-grid .nijmegen-g-start-md-10 {
212
+ grid-column-start: 10;
213
+ }
214
+ .nijmegen-grid .nijmegen-g-start-md-11 {
215
+ grid-column-start: 11;
216
+ }
217
+ }
218
+ @media (min-width: 992px) {
219
+ .nijmegen-grid .nijmegen-g-col-lg-1 {
220
+ grid-column: auto/span 1;
221
+ }
222
+ .nijmegen-grid .nijmegen-g-col-lg-2 {
223
+ grid-column: auto/span 2;
224
+ }
225
+ .nijmegen-grid .nijmegen-g-col-lg-3 {
226
+ grid-column: auto/span 3;
227
+ }
228
+ .nijmegen-grid .nijmegen-g-col-lg-4 {
229
+ grid-column: auto/span 4;
230
+ }
231
+ .nijmegen-grid .nijmegen-g-col-lg-5 {
232
+ grid-column: auto/span 5;
233
+ }
234
+ .nijmegen-grid .nijmegen-g-col-lg-6 {
235
+ grid-column: auto/span 6;
236
+ }
237
+ .nijmegen-grid .nijmegen-g-col-lg-7 {
238
+ grid-column: auto/span 7;
239
+ }
240
+ .nijmegen-grid .nijmegen-g-col-lg-8 {
241
+ grid-column: auto/span 8;
242
+ }
243
+ .nijmegen-grid .nijmegen-g-col-lg-9 {
244
+ grid-column: auto/span 9;
245
+ }
246
+ .nijmegen-grid .nijmegen-g-col-lg-10 {
247
+ grid-column: auto/span 10;
248
+ }
249
+ .nijmegen-grid .nijmegen-g-col-lg-11 {
250
+ grid-column: auto/span 11;
251
+ }
252
+ .nijmegen-grid .nijmegen-g-col-lg-12 {
253
+ grid-column: auto/span 12;
254
+ }
255
+ .nijmegen-grid .nijmegen-g-start-lg-1 {
256
+ grid-column-start: 1;
257
+ }
258
+ .nijmegen-grid .nijmegen-g-start-lg-2 {
259
+ grid-column-start: 2;
260
+ }
261
+ .nijmegen-grid .nijmegen-g-start-lg-3 {
262
+ grid-column-start: 3;
263
+ }
264
+ .nijmegen-grid .nijmegen-g-start-lg-4 {
265
+ grid-column-start: 4;
266
+ }
267
+ .nijmegen-grid .nijmegen-g-start-lg-5 {
268
+ grid-column-start: 5;
269
+ }
270
+ .nijmegen-grid .nijmegen-g-start-lg-6 {
271
+ grid-column-start: 6;
272
+ }
273
+ .nijmegen-grid .nijmegen-g-start-lg-7 {
274
+ grid-column-start: 7;
275
+ }
276
+ .nijmegen-grid .nijmegen-g-start-lg-8 {
277
+ grid-column-start: 8;
278
+ }
279
+ .nijmegen-grid .nijmegen-g-start-lg-9 {
280
+ grid-column-start: 9;
281
+ }
282
+ .nijmegen-grid .nijmegen-g-start-lg-10 {
283
+ grid-column-start: 10;
284
+ }
285
+ .nijmegen-grid .nijmegen-g-start-lg-11 {
286
+ grid-column-start: 11;
287
+ }
288
+ }
289
+ @media (min-width: 1200px) {
290
+ .nijmegen-grid .nijmegen-g-col-xl-1 {
291
+ grid-column: auto/span 1;
292
+ }
293
+ .nijmegen-grid .nijmegen-g-col-xl-2 {
294
+ grid-column: auto/span 2;
295
+ }
296
+ .nijmegen-grid .nijmegen-g-col-xl-3 {
297
+ grid-column: auto/span 3;
298
+ }
299
+ .nijmegen-grid .nijmegen-g-col-xl-4 {
300
+ grid-column: auto/span 4;
301
+ }
302
+ .nijmegen-grid .nijmegen-g-col-xl-5 {
303
+ grid-column: auto/span 5;
304
+ }
305
+ .nijmegen-grid .nijmegen-g-col-xl-6 {
306
+ grid-column: auto/span 6;
307
+ }
308
+ .nijmegen-grid .nijmegen-g-col-xl-7 {
309
+ grid-column: auto/span 7;
310
+ }
311
+ .nijmegen-grid .nijmegen-g-col-xl-8 {
312
+ grid-column: auto/span 8;
313
+ }
314
+ .nijmegen-grid .nijmegen-g-col-xl-9 {
315
+ grid-column: auto/span 9;
316
+ }
317
+ .nijmegen-grid .nijmegen-g-col-xl-10 {
318
+ grid-column: auto/span 10;
319
+ }
320
+ .nijmegen-grid .nijmegen-g-col-xl-11 {
321
+ grid-column: auto/span 11;
322
+ }
323
+ .nijmegen-grid .nijmegen-g-col-xl-12 {
324
+ grid-column: auto/span 12;
325
+ }
326
+ .nijmegen-grid .nijmegen-g-start-xl-1 {
327
+ grid-column-start: 1;
328
+ }
329
+ .nijmegen-grid .nijmegen-g-start-xl-2 {
330
+ grid-column-start: 2;
331
+ }
332
+ .nijmegen-grid .nijmegen-g-start-xl-3 {
333
+ grid-column-start: 3;
334
+ }
335
+ .nijmegen-grid .nijmegen-g-start-xl-4 {
336
+ grid-column-start: 4;
337
+ }
338
+ .nijmegen-grid .nijmegen-g-start-xl-5 {
339
+ grid-column-start: 5;
340
+ }
341
+ .nijmegen-grid .nijmegen-g-start-xl-6 {
342
+ grid-column-start: 6;
343
+ }
344
+ .nijmegen-grid .nijmegen-g-start-xl-7 {
345
+ grid-column-start: 7;
346
+ }
347
+ .nijmegen-grid .nijmegen-g-start-xl-8 {
348
+ grid-column-start: 8;
349
+ }
350
+ .nijmegen-grid .nijmegen-g-start-xl-9 {
351
+ grid-column-start: 9;
352
+ }
353
+ .nijmegen-grid .nijmegen-g-start-xl-10 {
354
+ grid-column-start: 10;
355
+ }
356
+ .nijmegen-grid .nijmegen-g-start-xl-11 {
357
+ grid-column-start: 11;
358
+ }
359
+ }
360
+ @media (min-width: 1400px) {
361
+ .nijmegen-grid .nijmegen-g-col-xxl-1 {
362
+ grid-column: auto/span 1;
363
+ }
364
+ .nijmegen-grid .nijmegen-g-col-xxl-2 {
365
+ grid-column: auto/span 2;
366
+ }
367
+ .nijmegen-grid .nijmegen-g-col-xxl-3 {
368
+ grid-column: auto/span 3;
369
+ }
370
+ .nijmegen-grid .nijmegen-g-col-xxl-4 {
371
+ grid-column: auto/span 4;
372
+ }
373
+ .nijmegen-grid .nijmegen-g-col-xxl-5 {
374
+ grid-column: auto/span 5;
375
+ }
376
+ .nijmegen-grid .nijmegen-g-col-xxl-6 {
377
+ grid-column: auto/span 6;
378
+ }
379
+ .nijmegen-grid .nijmegen-g-col-xxl-7 {
380
+ grid-column: auto/span 7;
381
+ }
382
+ .nijmegen-grid .nijmegen-g-col-xxl-8 {
383
+ grid-column: auto/span 8;
384
+ }
385
+ .nijmegen-grid .nijmegen-g-col-xxl-9 {
386
+ grid-column: auto/span 9;
387
+ }
388
+ .nijmegen-grid .nijmegen-g-col-xxl-10 {
389
+ grid-column: auto/span 10;
390
+ }
391
+ .nijmegen-grid .nijmegen-g-col-xxl-11 {
392
+ grid-column: auto/span 11;
393
+ }
394
+ .nijmegen-grid .nijmegen-g-col-xxl-12 {
395
+ grid-column: auto/span 12;
396
+ }
397
+ .nijmegen-grid .nijmegen-g-start-xxl-1 {
398
+ grid-column-start: 1;
399
+ }
400
+ .nijmegen-grid .nijmegen-g-start-xxl-2 {
401
+ grid-column-start: 2;
402
+ }
403
+ .nijmegen-grid .nijmegen-g-start-xxl-3 {
404
+ grid-column-start: 3;
405
+ }
406
+ .nijmegen-grid .nijmegen-g-start-xxl-4 {
407
+ grid-column-start: 4;
408
+ }
409
+ .nijmegen-grid .nijmegen-g-start-xxl-5 {
410
+ grid-column-start: 5;
411
+ }
412
+ .nijmegen-grid .nijmegen-g-start-xxl-6 {
413
+ grid-column-start: 6;
414
+ }
415
+ .nijmegen-grid .nijmegen-g-start-xxl-7 {
416
+ grid-column-start: 7;
417
+ }
418
+ .nijmegen-grid .nijmegen-g-start-xxl-8 {
419
+ grid-column-start: 8;
420
+ }
421
+ .nijmegen-grid .nijmegen-g-start-xxl-9 {
422
+ grid-column-start: 9;
423
+ }
424
+ .nijmegen-grid .nijmegen-g-start-xxl-10 {
425
+ grid-column-start: 10;
426
+ }
427
+ .nijmegen-grid .nijmegen-g-start-xxl-11 {
428
+ grid-column-start: 11;
429
+ }
430
+ }