pacem-less 0.52.3-abel → 0.52.3-boyle
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.
|
@@ -246,18 +246,19 @@ each(@sizes, {
|
|
|
246
246
|
}
|
|
247
247
|
|
|
248
248
|
// container queries
|
|
249
|
+
@PCSSs: ~"@{PCSS} ";
|
|
249
250
|
@_threshold_xs: @threshold_sm - 1;
|
|
250
|
-
@container @
|
|
251
|
+
@container @PCSSs (max-width: @_threshold_xs) {
|
|
251
252
|
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
253
|
+
.@{PCSS}-grid.grid-contained > .@{PCSS}-cell {
|
|
254
|
+
.ColsMid(cols, xs, 12);
|
|
255
|
+
.RowsMid(rows, xs, 12);
|
|
256
|
+
}
|
|
256
257
|
}
|
|
257
258
|
|
|
258
259
|
each(@sizes, {
|
|
259
260
|
@_threshold: ~"threshold_@{value}";
|
|
260
|
-
@container @
|
|
261
|
+
@container @PCSSs (min-width: @_threshold) {
|
|
261
262
|
|
|
262
263
|
.@{PCSS}-grid.grid-contained > .@{PCSS}-cell {
|
|
263
264
|
.ColsMid(cols, @value, 12);
|
|
@@ -301,70 +301,72 @@
|
|
|
301
301
|
.ShowWhenAtLeast(h);
|
|
302
302
|
}
|
|
303
303
|
|
|
304
|
+
@PCSSs: ~"@{PCSS} ";
|
|
305
|
+
|
|
304
306
|
.@{PCSS}-container {
|
|
305
307
|
// hide when below 'small' width
|
|
306
|
-
@container @
|
|
308
|
+
@container @PCSSs (max-width: @threshold_sm - 1) {
|
|
307
309
|
.HideWhenLessThan(sm);
|
|
308
310
|
.HideWhenAtMost(xs);
|
|
309
311
|
// exception (show-xs: show only when EXACTLY 'xs')
|
|
310
312
|
.ShowWhenAtLeast(xs);
|
|
311
313
|
}
|
|
312
314
|
// show when at least 'small' wide
|
|
313
|
-
@container @
|
|
315
|
+
@container @PCSSs (min-width: @threshold_sm) {
|
|
314
316
|
.ShowWhenAtLeast(sm);
|
|
315
317
|
}
|
|
316
318
|
// hide when at most 'small' wide
|
|
317
|
-
@container @
|
|
319
|
+
@container @PCSSs (max-width: @threshold_md - 1) {
|
|
318
320
|
.HideWhenLessThan(md);
|
|
319
321
|
.HideWhenAtMost(sm);
|
|
320
322
|
}
|
|
321
323
|
// show when at least 'medium' wide
|
|
322
|
-
@container @
|
|
324
|
+
@container @PCSSs (min-width: @threshold_md) {
|
|
323
325
|
.ShowWhenAtLeast(md);
|
|
324
326
|
}
|
|
325
327
|
// hide when at most 'medium' wide
|
|
326
|
-
@container @
|
|
328
|
+
@container @PCSSs (max-width: @threshold_lg - 1) {
|
|
327
329
|
.HideWhenLessThan(lg);
|
|
328
330
|
.HideWhenAtMost(md);
|
|
329
331
|
}
|
|
330
332
|
// show when at least 'lg' wide
|
|
331
|
-
@container @
|
|
333
|
+
@container @PCSSs (min-width: @threshold_lg) {
|
|
332
334
|
.ShowWhenAtLeast(lg);
|
|
333
335
|
}
|
|
334
336
|
// hide when at most 'lg' wide
|
|
335
|
-
@container @
|
|
337
|
+
@container @PCSSs (max-width: @threshold_xl - 1) {
|
|
336
338
|
.HideWhenLessThan(xl);
|
|
337
339
|
.HideWhenAtMost(lg);
|
|
338
340
|
}
|
|
339
341
|
// show when at least 'xl' wide
|
|
340
|
-
@container @
|
|
342
|
+
@container @PCSSs (min-width: @threshold_xl) {
|
|
341
343
|
.ShowWhenAtLeast(xl);
|
|
342
344
|
}
|
|
343
345
|
// hide when at most 'xl' wide
|
|
344
|
-
@container @
|
|
346
|
+
@container @PCSSs (max-width: @threshold_hd - 1) {
|
|
345
347
|
.HideWhenLessThan(hd);
|
|
346
348
|
.HideWhenAtMost(xl);
|
|
347
349
|
}
|
|
348
350
|
// show when at least 'hd' wide
|
|
349
|
-
@container @
|
|
351
|
+
@container @PCSSs (min-width: @threshold_hd) {
|
|
350
352
|
.ShowWhenAtLeast(hd);
|
|
351
353
|
}
|
|
352
354
|
// hide when at most 'hd' wide
|
|
353
|
-
@container @
|
|
355
|
+
@container @PCSSs (max-width: @threshold_2k - 1) {
|
|
354
356
|
.HideWhenLessThan(2k);
|
|
355
357
|
.HideWhenAtMost(hd);
|
|
356
358
|
}
|
|
357
359
|
// show when at least '2k' wide
|
|
358
|
-
@container @
|
|
360
|
+
@container @PCSSs (min-width: @threshold_2k) {
|
|
359
361
|
.ShowWhenAtLeast(2k);
|
|
360
362
|
}
|
|
361
363
|
// hide when at most '2k' wide
|
|
362
|
-
@container @
|
|
364
|
+
@container @PCSSs (max-width: @threshold_4k - 1) {
|
|
363
365
|
.HideWhenLessThan(4k);
|
|
364
366
|
.HideWhenAtMost(2k);
|
|
365
367
|
}
|
|
366
368
|
// show when at least '4k' wide
|
|
367
|
-
@container @
|
|
369
|
+
@container @PCSSs (min-width: @threshold_4k) {
|
|
368
370
|
.ShowWhenAtLeast(4k);
|
|
369
371
|
}
|
|
370
372
|
}
|
package/package.json
CHANGED