@ulu/frontend 0.6.18 → 0.6.19
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/mcp-data.json +176 -171
- package/lib/scss/_layout.scss +1 -0
- package/lib/scss/helpers/_layout.scss +5 -1
- package/package.json +1 -1
package/dist/mcp-data.json
CHANGED
|
@@ -8289,7 +8289,7 @@
|
|
|
8289
8289
|
"description": "System widths\n",
|
|
8290
8290
|
"commentRange": {
|
|
8291
8291
|
"start": 44,
|
|
8292
|
-
"end":
|
|
8292
|
+
"end": 50
|
|
8293
8293
|
},
|
|
8294
8294
|
"context": {
|
|
8295
8295
|
"type": "variable",
|
|
@@ -8297,8 +8297,8 @@
|
|
|
8297
8297
|
"value": "(\n \"small-x\": (\n \"value\": 6rem,\n \"helper-class\": true\n ),\n \"small\": (\n \"value\": 8rem,\n \"helper-class\": true\n ),\n \"medium\": (\n \"value\": 16rem,\n \"helper-class\": true\n ),\n \"large\": (\n \"value\": 32rem,\n \"helper-class\": true\n )\n)",
|
|
8298
8298
|
"scope": "default",
|
|
8299
8299
|
"line": {
|
|
8300
|
-
"start":
|
|
8301
|
-
"end":
|
|
8300
|
+
"start": 52,
|
|
8301
|
+
"end": 69
|
|
8302
8302
|
}
|
|
8303
8303
|
},
|
|
8304
8304
|
"type": "Map",
|
|
@@ -8318,6 +8318,11 @@
|
|
|
8318
8318
|
"name": "[name].helper-class",
|
|
8319
8319
|
"description": "Output a helper class for this width"
|
|
8320
8320
|
},
|
|
8321
|
+
{
|
|
8322
|
+
"type": "Boolean",
|
|
8323
|
+
"name": "[name].match-font-size",
|
|
8324
|
+
"description": "If enabled will set font size equal to width for font based icon fonts (only output with helper class)"
|
|
8325
|
+
},
|
|
8321
8326
|
{
|
|
8322
8327
|
"type": "Map",
|
|
8323
8328
|
"name": "[name].breakpoints",
|
|
@@ -8340,8 +8345,8 @@
|
|
|
8340
8345
|
"name": "set-widths",
|
|
8341
8346
|
"code": "\n $widths: utils.map-merge($widths, $changes, $merge-mode) !global;\n",
|
|
8342
8347
|
"line": {
|
|
8343
|
-
"start":
|
|
8344
|
-
"end":
|
|
8348
|
+
"start": 75,
|
|
8349
|
+
"end": 77
|
|
8345
8350
|
}
|
|
8346
8351
|
}
|
|
8347
8352
|
},
|
|
@@ -8352,8 +8357,8 @@
|
|
|
8352
8357
|
"name": "set-widths",
|
|
8353
8358
|
"code": "\n $widths: utils.map-merge($widths, $changes, $merge-mode) !global;\n",
|
|
8354
8359
|
"line": {
|
|
8355
|
-
"start":
|
|
8356
|
-
"end":
|
|
8360
|
+
"start": 75,
|
|
8361
|
+
"end": 77
|
|
8357
8362
|
}
|
|
8358
8363
|
}
|
|
8359
8364
|
},
|
|
@@ -8364,8 +8369,8 @@
|
|
|
8364
8369
|
"name": "get-width",
|
|
8365
8370
|
"code": "\n @return utils.require-map-get($widths, $name, \"layout [widths]\");\n",
|
|
8366
8371
|
"line": {
|
|
8367
|
-
"start":
|
|
8368
|
-
"end":
|
|
8372
|
+
"start": 83,
|
|
8373
|
+
"end": 85
|
|
8369
8374
|
}
|
|
8370
8375
|
}
|
|
8371
8376
|
}
|
|
@@ -8378,16 +8383,16 @@
|
|
|
8378
8383
|
"path": "/sass/core/layout/#mixin-set-widths",
|
|
8379
8384
|
"description": "Change widths config\n",
|
|
8380
8385
|
"commentRange": {
|
|
8381
|
-
"start":
|
|
8382
|
-
"end":
|
|
8386
|
+
"start": 71,
|
|
8387
|
+
"end": 73
|
|
8383
8388
|
},
|
|
8384
8389
|
"context": {
|
|
8385
8390
|
"type": "mixin",
|
|
8386
8391
|
"name": "set-widths",
|
|
8387
8392
|
"code": "\n $widths: utils.map-merge($widths, $changes, $merge-mode) !global;\n",
|
|
8388
8393
|
"line": {
|
|
8389
|
-
"start":
|
|
8390
|
-
"end":
|
|
8394
|
+
"start": 75,
|
|
8395
|
+
"end": 77
|
|
8391
8396
|
}
|
|
8392
8397
|
},
|
|
8393
8398
|
"parameter": [
|
|
@@ -8432,16 +8437,16 @@
|
|
|
8432
8437
|
"path": "/sass/core/layout/#function-get-width",
|
|
8433
8438
|
"description": "Get a width config by name\n",
|
|
8434
8439
|
"commentRange": {
|
|
8435
|
-
"start":
|
|
8436
|
-
"end":
|
|
8440
|
+
"start": 79,
|
|
8441
|
+
"end": 81
|
|
8437
8442
|
},
|
|
8438
8443
|
"context": {
|
|
8439
8444
|
"type": "function",
|
|
8440
8445
|
"name": "get-width",
|
|
8441
8446
|
"code": "\n @return utils.require-map-get($widths, $name, \"layout [widths]\");\n",
|
|
8442
8447
|
"line": {
|
|
8443
|
-
"start":
|
|
8444
|
-
"end":
|
|
8448
|
+
"start": 83,
|
|
8449
|
+
"end": 85
|
|
8445
8450
|
}
|
|
8446
8451
|
},
|
|
8447
8452
|
"parameter": [
|
|
@@ -8481,8 +8486,8 @@
|
|
|
8481
8486
|
"path": "/sass/core/layout/#variable-max-widths",
|
|
8482
8487
|
"description": "System max-widths\n",
|
|
8483
8488
|
"commentRange": {
|
|
8484
|
-
"start":
|
|
8485
|
-
"end":
|
|
8489
|
+
"start": 87,
|
|
8490
|
+
"end": 92
|
|
8486
8491
|
},
|
|
8487
8492
|
"context": {
|
|
8488
8493
|
"type": "variable",
|
|
@@ -8490,8 +8495,8 @@
|
|
|
8490
8495
|
"value": "(\n \"small\": (\n \"value\": 20rem,\n \"helper-class\": true\n ),\n \"medium\": (\n \"value\": 40rem,\n \"helper-class\": true\n ),\n \"large\": (\n \"value\": 60rem,\n \"helper-class\": true\n )\n)",
|
|
8491
8496
|
"scope": "default",
|
|
8492
8497
|
"line": {
|
|
8493
|
-
"start":
|
|
8494
|
-
"end":
|
|
8498
|
+
"start": 94,
|
|
8499
|
+
"end": 107
|
|
8495
8500
|
}
|
|
8496
8501
|
},
|
|
8497
8502
|
"type": "Map",
|
|
@@ -8533,8 +8538,8 @@
|
|
|
8533
8538
|
"name": "set-max-widths",
|
|
8534
8539
|
"code": "\n $max-widths: utils.map-merge($max-widths, $changes, $merge-mode) !global;\n",
|
|
8535
8540
|
"line": {
|
|
8536
|
-
"start":
|
|
8537
|
-
"end":
|
|
8541
|
+
"start": 113,
|
|
8542
|
+
"end": 115
|
|
8538
8543
|
}
|
|
8539
8544
|
}
|
|
8540
8545
|
},
|
|
@@ -8545,8 +8550,8 @@
|
|
|
8545
8550
|
"name": "set-max-widths",
|
|
8546
8551
|
"code": "\n $max-widths: utils.map-merge($max-widths, $changes, $merge-mode) !global;\n",
|
|
8547
8552
|
"line": {
|
|
8548
|
-
"start":
|
|
8549
|
-
"end":
|
|
8553
|
+
"start": 113,
|
|
8554
|
+
"end": 115
|
|
8550
8555
|
}
|
|
8551
8556
|
}
|
|
8552
8557
|
},
|
|
@@ -8557,8 +8562,8 @@
|
|
|
8557
8562
|
"name": "get-max-width",
|
|
8558
8563
|
"code": "\n @return utils.require-map-get($max-widths, $name, \"layout [max-widths]\");\n",
|
|
8559
8564
|
"line": {
|
|
8560
|
-
"start":
|
|
8561
|
-
"end":
|
|
8565
|
+
"start": 121,
|
|
8566
|
+
"end": 123
|
|
8562
8567
|
}
|
|
8563
8568
|
}
|
|
8564
8569
|
}
|
|
@@ -8571,16 +8576,16 @@
|
|
|
8571
8576
|
"path": "/sass/core/layout/#mixin-set-max-widths",
|
|
8572
8577
|
"description": "Change max-widths config\n",
|
|
8573
8578
|
"commentRange": {
|
|
8574
|
-
"start":
|
|
8575
|
-
"end":
|
|
8579
|
+
"start": 109,
|
|
8580
|
+
"end": 111
|
|
8576
8581
|
},
|
|
8577
8582
|
"context": {
|
|
8578
8583
|
"type": "mixin",
|
|
8579
8584
|
"name": "set-max-widths",
|
|
8580
8585
|
"code": "\n $max-widths: utils.map-merge($max-widths, $changes, $merge-mode) !global;\n",
|
|
8581
8586
|
"line": {
|
|
8582
|
-
"start":
|
|
8583
|
-
"end":
|
|
8587
|
+
"start": 113,
|
|
8588
|
+
"end": 115
|
|
8584
8589
|
}
|
|
8585
8590
|
},
|
|
8586
8591
|
"parameter": [
|
|
@@ -8625,16 +8630,16 @@
|
|
|
8625
8630
|
"path": "/sass/core/layout/#function-get-max-width",
|
|
8626
8631
|
"description": "Get a max-width config by name\n",
|
|
8627
8632
|
"commentRange": {
|
|
8628
|
-
"start":
|
|
8629
|
-
"end":
|
|
8633
|
+
"start": 117,
|
|
8634
|
+
"end": 119
|
|
8630
8635
|
},
|
|
8631
8636
|
"context": {
|
|
8632
8637
|
"type": "function",
|
|
8633
8638
|
"name": "get-max-width",
|
|
8634
8639
|
"code": "\n @return utils.require-map-get($max-widths, $name, \"layout [max-widths]\");\n",
|
|
8635
8640
|
"line": {
|
|
8636
|
-
"start":
|
|
8637
|
-
"end":
|
|
8641
|
+
"start": 121,
|
|
8642
|
+
"end": 123
|
|
8638
8643
|
}
|
|
8639
8644
|
},
|
|
8640
8645
|
"parameter": [
|
|
@@ -8674,8 +8679,8 @@
|
|
|
8674
8679
|
"path": "/sass/core/layout/#variable-containers",
|
|
8675
8680
|
"description": "Containers Lookup (use set-containers)\n",
|
|
8676
8681
|
"commentRange": {
|
|
8677
|
-
"start":
|
|
8678
|
-
"end":
|
|
8682
|
+
"start": 125,
|
|
8683
|
+
"end": 127
|
|
8679
8684
|
},
|
|
8680
8685
|
"context": {
|
|
8681
8686
|
"type": "variable",
|
|
@@ -8683,8 +8688,8 @@
|
|
|
8683
8688
|
"value": "(\n \"container\" : (\n \"width\" : 100%,\n \"max-width\" : get(\"max-width\"),\n \"padding\" : (get(\"margin\") get(\"margin\")),\n \"breakpoints\" : null,\n \"responsive\" : false,\n \"responsive-amount\" : 3vw\n )\n)",
|
|
8684
8689
|
"scope": "default",
|
|
8685
8690
|
"line": {
|
|
8686
|
-
"start":
|
|
8687
|
-
"end":
|
|
8691
|
+
"start": 129,
|
|
8692
|
+
"end": 139
|
|
8688
8693
|
}
|
|
8689
8694
|
},
|
|
8690
8695
|
"type": "Map",
|
|
@@ -8705,8 +8710,8 @@
|
|
|
8705
8710
|
"name": "set-containers",
|
|
8706
8711
|
"code": "\n $containers: utils.map-merge($containers, $changes, $merge-mode) !global;\n",
|
|
8707
8712
|
"line": {
|
|
8708
|
-
"start":
|
|
8709
|
-
"end":
|
|
8713
|
+
"start": 146,
|
|
8714
|
+
"end": 148
|
|
8710
8715
|
}
|
|
8711
8716
|
}
|
|
8712
8717
|
},
|
|
@@ -8717,8 +8722,8 @@
|
|
|
8717
8722
|
"name": "set-containers",
|
|
8718
8723
|
"code": "\n $containers: utils.map-merge($containers, $changes, $merge-mode) !global;\n",
|
|
8719
8724
|
"line": {
|
|
8720
|
-
"start":
|
|
8721
|
-
"end":
|
|
8725
|
+
"start": 146,
|
|
8726
|
+
"end": 148
|
|
8722
8727
|
}
|
|
8723
8728
|
}
|
|
8724
8729
|
},
|
|
@@ -8729,8 +8734,8 @@
|
|
|
8729
8734
|
"name": "get-container",
|
|
8730
8735
|
"code": "\n $container: null;\n @if ($required) {\n $container: utils.require-map-get($containers, $name, \"Layout [get-container]\");\n } @else {\n $container: map.get($containers, $name);\n }\n\n @if ($container and $breakpoint) {\n $breakpoints: map.get($container, \"breakpoints\");\n @if ($required) {\n @if ($breakpoints) {\n @return utils.require-map-get($breakpoints, $breakpoint, \"[container breakpoint]\");\n } @else {\n @error 'ULU: No container breakpoints for container \"#{ $name }\", requested breakpoint #{ $breakpoint }';\n }\n } @else {\n @if ($breakpoints) {\n @return map.get($breakpoints, $breakpoint);\n } @else {\n @return null;\n }\n }\n }\n\n @return $container;\n",
|
|
8731
8736
|
"line": {
|
|
8732
|
-
"start":
|
|
8733
|
-
"end":
|
|
8737
|
+
"start": 154,
|
|
8738
|
+
"end": 180
|
|
8734
8739
|
}
|
|
8735
8740
|
}
|
|
8736
8741
|
},
|
|
@@ -8741,8 +8746,8 @@
|
|
|
8741
8746
|
"name": "get-container",
|
|
8742
8747
|
"code": "\n $container: null;\n @if ($required) {\n $container: utils.require-map-get($containers, $name, \"Layout [get-container]\");\n } @else {\n $container: map.get($containers, $name);\n }\n\n @if ($container and $breakpoint) {\n $breakpoints: map.get($container, \"breakpoints\");\n @if ($required) {\n @if ($breakpoints) {\n @return utils.require-map-get($breakpoints, $breakpoint, \"[container breakpoint]\");\n } @else {\n @error 'ULU: No container breakpoints for container \"#{ $name }\", requested breakpoint #{ $breakpoint }';\n }\n } @else {\n @if ($breakpoints) {\n @return map.get($breakpoints, $breakpoint);\n } @else {\n @return null;\n }\n }\n }\n\n @return $container;\n",
|
|
8743
8748
|
"line": {
|
|
8744
|
-
"start":
|
|
8745
|
-
"end":
|
|
8749
|
+
"start": 154,
|
|
8750
|
+
"end": 180
|
|
8746
8751
|
}
|
|
8747
8752
|
}
|
|
8748
8753
|
}
|
|
@@ -8755,16 +8760,16 @@
|
|
|
8755
8760
|
"path": "/sass/core/layout/#mixin-set-containers",
|
|
8756
8761
|
"description": "Set layout containers\n- See the $containers variable for example of container properties\n",
|
|
8757
8762
|
"commentRange": {
|
|
8758
|
-
"start":
|
|
8759
|
-
"end":
|
|
8763
|
+
"start": 141,
|
|
8764
|
+
"end": 144
|
|
8760
8765
|
},
|
|
8761
8766
|
"context": {
|
|
8762
8767
|
"type": "mixin",
|
|
8763
8768
|
"name": "set-containers",
|
|
8764
8769
|
"code": "\n $containers: utils.map-merge($containers, $changes, $merge-mode) !global;\n",
|
|
8765
8770
|
"line": {
|
|
8766
|
-
"start":
|
|
8767
|
-
"end":
|
|
8771
|
+
"start": 146,
|
|
8772
|
+
"end": 148
|
|
8768
8773
|
}
|
|
8769
8774
|
},
|
|
8770
8775
|
"parameter": [
|
|
@@ -8809,16 +8814,16 @@
|
|
|
8809
8814
|
"path": "/sass/core/layout/#function-get-container",
|
|
8810
8815
|
"description": "Get a container map\n",
|
|
8811
8816
|
"commentRange": {
|
|
8812
|
-
"start":
|
|
8813
|
-
"end":
|
|
8817
|
+
"start": 150,
|
|
8818
|
+
"end": 152
|
|
8814
8819
|
},
|
|
8815
8820
|
"context": {
|
|
8816
8821
|
"type": "function",
|
|
8817
8822
|
"name": "get-container",
|
|
8818
8823
|
"code": "\n $container: null;\n @if ($required) {\n $container: utils.require-map-get($containers, $name, \"Layout [get-container]\");\n } @else {\n $container: map.get($containers, $name);\n }\n\n @if ($container and $breakpoint) {\n $breakpoints: map.get($container, \"breakpoints\");\n @if ($required) {\n @if ($breakpoints) {\n @return utils.require-map-get($breakpoints, $breakpoint, \"[container breakpoint]\");\n } @else {\n @error 'ULU: No container breakpoints for container \"#{ $name }\", requested breakpoint #{ $breakpoint }';\n }\n } @else {\n @if ($breakpoints) {\n @return map.get($breakpoints, $breakpoint);\n } @else {\n @return null;\n }\n }\n }\n\n @return $container;\n",
|
|
8819
8824
|
"line": {
|
|
8820
|
-
"start":
|
|
8821
|
-
"end":
|
|
8825
|
+
"start": 154,
|
|
8826
|
+
"end": 180
|
|
8822
8827
|
}
|
|
8823
8828
|
},
|
|
8824
8829
|
"parameter": [
|
|
@@ -8882,8 +8887,8 @@
|
|
|
8882
8887
|
"name": "match-container-padding",
|
|
8883
8888
|
"code": "\n $container: get-container($name);\n $breakpoints: map.get($container, \"breakpoints\");\n #{ $property }: get-container-padding($name, $sides);\n @if $breakpoints {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n #{ $property }: get-container-padding($name, $sides, $breakpoint);\n }\n }\n }\n",
|
|
8884
8889
|
"line": {
|
|
8885
|
-
"start":
|
|
8886
|
-
"end":
|
|
8890
|
+
"start": 188,
|
|
8891
|
+
"end": 200
|
|
8887
8892
|
}
|
|
8888
8893
|
}
|
|
8889
8894
|
},
|
|
@@ -8894,8 +8899,8 @@
|
|
|
8894
8899
|
"name": "match-container-margin",
|
|
8895
8900
|
"code": "\n $container: get-container($name);\n $breakpoints: map.get($container, \"breakpoints\");\n $padding: 0;\n @if ($include-padding) {\n $padding: get-container-padding($name, true);\n }\n $max: map.get($container, \"max-width\");\n #{ $property }: max(((100vw - $max) / 2) + $padding, $padding);\n @if $breakpoints {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n $pad: 0;\n @if ($include-padding) {\n $pad: get-container-padding($name, true, $breakpoint);\n }\n #{ $property }: max(((100vw - $max) / 2) + $pad, $pad);\n }\n }\n }\n",
|
|
8896
8901
|
"line": {
|
|
8897
|
-
"start":
|
|
8898
|
-
"end":
|
|
8902
|
+
"start": 211,
|
|
8903
|
+
"end": 232
|
|
8899
8904
|
}
|
|
8900
8905
|
}
|
|
8901
8906
|
},
|
|
@@ -8906,8 +8911,8 @@
|
|
|
8906
8911
|
"name": "get-container-padding",
|
|
8907
8912
|
"code": "\n $container: get-container($name, $specific-breakpoint);\n $padding: map.get($container, \"padding\");\n $is-list: meta.type-of($padding) == \"list\"; // Else number\n @if (not $is-list) {\n @return $padding;\n } @else {\n @return list.nth($padding, utils.when($sides, 2, 1));\n }\n",
|
|
8908
8913
|
"line": {
|
|
8909
|
-
"start":
|
|
8910
|
-
"end":
|
|
8914
|
+
"start": 239,
|
|
8915
|
+
"end": 248
|
|
8911
8916
|
}
|
|
8912
8917
|
}
|
|
8913
8918
|
},
|
|
@@ -8918,8 +8923,8 @@
|
|
|
8918
8923
|
"name": "container-padding",
|
|
8919
8924
|
"code": "\n $container: get-container($name, $specific-breakpoint);\n $responsive: map.get($container, \"responsive\");\n $x: get-container-padding-x($name, $specific-breakpoint);\n $y: get-container-padding-y($name, $specific-breakpoint);\n $resp-amount: utils.when(meta.type-of($responsive) == number, $responsive, utils.get(\"responsive-change\"));\n \n @if $responsive {\n @if $sides {\n @include utils.responsive-property(\"padding-left\", $x, $resp-amount);\n @include utils.responsive-property(\"padding-right\", $x, $resp-amount);\n }\n @if $ends {\n @include utils.responsive-property(\"padding-top\", $y, $resp-amount);\n @include utils.responsive-property(\"padding-bottom\", $y, $resp-amount);\n }\n } @else {\n @if $sides {\n padding-left: $x;\n padding-right: $x;\n }\n @if $ends {\n padding-top: $y;\n padding-bottom: $y;\n }\n }\n",
|
|
8920
8925
|
"line": {
|
|
8921
|
-
"start":
|
|
8922
|
-
"end":
|
|
8926
|
+
"start": 255,
|
|
8927
|
+
"end": 281
|
|
8923
8928
|
}
|
|
8924
8929
|
}
|
|
8925
8930
|
},
|
|
@@ -8930,8 +8935,8 @@
|
|
|
8930
8935
|
"name": "container-styles",
|
|
8931
8936
|
"code": "\n $container: get-container($name, $specific-breakpoint);\n $breakpoints: map.get($container, \"breakpoints\");\n \n $width: map.get($container, \"width\");\n\n @if ($width == null) {\n $width: 100%;\n }\n display: block;\n margin-left: auto;\n margin-right: auto;\n width: $width;\n max-width: map.get($container, \"max-width\");\n @include container-padding($name, $specific-breakpoint: $specific-breakpoint);\n\n // Recursive print other breakpoints\n @if $breakpoints and not $specific-breakpoint {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n @include container-styles($name, $breakpoint);\n }\n }\n }\n",
|
|
8932
8937
|
"line": {
|
|
8933
|
-
"start":
|
|
8934
|
-
"end":
|
|
8938
|
+
"start": 303,
|
|
8939
|
+
"end": 328
|
|
8935
8940
|
}
|
|
8936
8941
|
}
|
|
8937
8942
|
}
|
|
@@ -8944,16 +8949,16 @@
|
|
|
8944
8949
|
"path": "/sass/core/layout/#mixin-match-container-padding",
|
|
8945
8950
|
"description": "Returns padding to another property including breakpoints\nie. { top: $containers-padding; }\n",
|
|
8946
8951
|
"commentRange": {
|
|
8947
|
-
"start":
|
|
8948
|
-
"end":
|
|
8952
|
+
"start": 182,
|
|
8953
|
+
"end": 186
|
|
8949
8954
|
},
|
|
8950
8955
|
"context": {
|
|
8951
8956
|
"type": "mixin",
|
|
8952
8957
|
"name": "match-container-padding",
|
|
8953
8958
|
"code": "\n $container: get-container($name);\n $breakpoints: map.get($container, \"breakpoints\");\n #{ $property }: get-container-padding($name, $sides);\n @if $breakpoints {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n #{ $property }: get-container-padding($name, $sides, $breakpoint);\n }\n }\n }\n",
|
|
8954
8959
|
"line": {
|
|
8955
|
-
"start":
|
|
8956
|
-
"end":
|
|
8960
|
+
"start": 188,
|
|
8961
|
+
"end": 200
|
|
8957
8962
|
}
|
|
8958
8963
|
},
|
|
8959
8964
|
"parameter": [
|
|
@@ -9012,16 +9017,16 @@
|
|
|
9012
9017
|
"path": "/sass/core/layout/#mixin-match-container-margin",
|
|
9013
9018
|
"description": "For a given property for every breakpoint in a given container\ncreates a css calc value that will match the containers side margin\nThe margin is created via empty space when the container hits the max-width\nIf passing include padding it would be the containers\nside (x) + the padding. This accounts for the containers max-width to give an absolute value\n",
|
|
9014
9019
|
"commentRange": {
|
|
9015
|
-
"start":
|
|
9016
|
-
"end":
|
|
9020
|
+
"start": 202,
|
|
9021
|
+
"end": 209
|
|
9017
9022
|
},
|
|
9018
9023
|
"context": {
|
|
9019
9024
|
"type": "mixin",
|
|
9020
9025
|
"name": "match-container-margin",
|
|
9021
9026
|
"code": "\n $container: get-container($name);\n $breakpoints: map.get($container, \"breakpoints\");\n $padding: 0;\n @if ($include-padding) {\n $padding: get-container-padding($name, true);\n }\n $max: map.get($container, \"max-width\");\n #{ $property }: max(((100vw - $max) / 2) + $padding, $padding);\n @if $breakpoints {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n $pad: 0;\n @if ($include-padding) {\n $pad: get-container-padding($name, true, $breakpoint);\n }\n #{ $property }: max(((100vw - $max) / 2) + $pad, $pad);\n }\n }\n }\n",
|
|
9022
9027
|
"line": {
|
|
9023
|
-
"start":
|
|
9024
|
-
"end":
|
|
9028
|
+
"start": 211,
|
|
9029
|
+
"end": 232
|
|
9025
9030
|
}
|
|
9026
9031
|
},
|
|
9027
9032
|
"parameter": [
|
|
@@ -9084,16 +9089,16 @@
|
|
|
9084
9089
|
"path": "/sass/core/layout/#function-get-container-padding",
|
|
9085
9090
|
"description": "Get a containers padding value\n",
|
|
9086
9091
|
"commentRange": {
|
|
9087
|
-
"start":
|
|
9088
|
-
"end":
|
|
9092
|
+
"start": 234,
|
|
9093
|
+
"end": 237
|
|
9089
9094
|
},
|
|
9090
9095
|
"context": {
|
|
9091
9096
|
"type": "function",
|
|
9092
9097
|
"name": "get-container-padding",
|
|
9093
9098
|
"code": "\n $container: get-container($name, $specific-breakpoint);\n $padding: map.get($container, \"padding\");\n $is-list: meta.type-of($padding) == \"list\"; // Else number\n @if (not $is-list) {\n @return $padding;\n } @else {\n @return list.nth($padding, utils.when($sides, 2, 1));\n }\n",
|
|
9094
9099
|
"line": {
|
|
9095
|
-
"start":
|
|
9096
|
-
"end":
|
|
9100
|
+
"start": 239,
|
|
9101
|
+
"end": 248
|
|
9097
9102
|
}
|
|
9098
9103
|
},
|
|
9099
9104
|
"parameter": [
|
|
@@ -9145,8 +9150,8 @@
|
|
|
9145
9150
|
"name": "match-container-padding",
|
|
9146
9151
|
"code": "\n $container: get-container($name);\n $breakpoints: map.get($container, \"breakpoints\");\n #{ $property }: get-container-padding($name, $sides);\n @if $breakpoints {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n #{ $property }: get-container-padding($name, $sides, $breakpoint);\n }\n }\n }\n",
|
|
9147
9152
|
"line": {
|
|
9148
|
-
"start":
|
|
9149
|
-
"end":
|
|
9153
|
+
"start": 188,
|
|
9154
|
+
"end": 200
|
|
9150
9155
|
}
|
|
9151
9156
|
}
|
|
9152
9157
|
},
|
|
@@ -9157,8 +9162,8 @@
|
|
|
9157
9162
|
"name": "match-container-padding",
|
|
9158
9163
|
"code": "\n $container: get-container($name);\n $breakpoints: map.get($container, \"breakpoints\");\n #{ $property }: get-container-padding($name, $sides);\n @if $breakpoints {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n #{ $property }: get-container-padding($name, $sides, $breakpoint);\n }\n }\n }\n",
|
|
9159
9164
|
"line": {
|
|
9160
|
-
"start":
|
|
9161
|
-
"end":
|
|
9165
|
+
"start": 188,
|
|
9166
|
+
"end": 200
|
|
9162
9167
|
}
|
|
9163
9168
|
}
|
|
9164
9169
|
},
|
|
@@ -9169,8 +9174,8 @@
|
|
|
9169
9174
|
"name": "match-container-margin",
|
|
9170
9175
|
"code": "\n $container: get-container($name);\n $breakpoints: map.get($container, \"breakpoints\");\n $padding: 0;\n @if ($include-padding) {\n $padding: get-container-padding($name, true);\n }\n $max: map.get($container, \"max-width\");\n #{ $property }: max(((100vw - $max) / 2) + $padding, $padding);\n @if $breakpoints {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n $pad: 0;\n @if ($include-padding) {\n $pad: get-container-padding($name, true, $breakpoint);\n }\n #{ $property }: max(((100vw - $max) / 2) + $pad, $pad);\n }\n }\n }\n",
|
|
9171
9176
|
"line": {
|
|
9172
|
-
"start":
|
|
9173
|
-
"end":
|
|
9177
|
+
"start": 211,
|
|
9178
|
+
"end": 232
|
|
9174
9179
|
}
|
|
9175
9180
|
}
|
|
9176
9181
|
},
|
|
@@ -9181,8 +9186,8 @@
|
|
|
9181
9186
|
"name": "match-container-margin",
|
|
9182
9187
|
"code": "\n $container: get-container($name);\n $breakpoints: map.get($container, \"breakpoints\");\n $padding: 0;\n @if ($include-padding) {\n $padding: get-container-padding($name, true);\n }\n $max: map.get($container, \"max-width\");\n #{ $property }: max(((100vw - $max) / 2) + $padding, $padding);\n @if $breakpoints {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n $pad: 0;\n @if ($include-padding) {\n $pad: get-container-padding($name, true, $breakpoint);\n }\n #{ $property }: max(((100vw - $max) / 2) + $pad, $pad);\n }\n }\n }\n",
|
|
9183
9188
|
"line": {
|
|
9184
|
-
"start":
|
|
9185
|
-
"end":
|
|
9189
|
+
"start": 211,
|
|
9190
|
+
"end": 232
|
|
9186
9191
|
}
|
|
9187
9192
|
}
|
|
9188
9193
|
},
|
|
@@ -9193,8 +9198,8 @@
|
|
|
9193
9198
|
"name": "get-container-padding-x",
|
|
9194
9199
|
"code": "\n @return get-container-padding($name, true, $specific-breakpoint);\n",
|
|
9195
9200
|
"line": {
|
|
9196
|
-
"start":
|
|
9197
|
-
"end":
|
|
9201
|
+
"start": 287,
|
|
9202
|
+
"end": 289
|
|
9198
9203
|
}
|
|
9199
9204
|
}
|
|
9200
9205
|
},
|
|
@@ -9205,8 +9210,8 @@
|
|
|
9205
9210
|
"name": "get-container-padding-y",
|
|
9206
9211
|
"code": "\n @return get-container-padding($name, false, $specific-breakpoint);\n",
|
|
9207
9212
|
"line": {
|
|
9208
|
-
"start":
|
|
9209
|
-
"end":
|
|
9213
|
+
"start": 295,
|
|
9214
|
+
"end": 297
|
|
9210
9215
|
}
|
|
9211
9216
|
}
|
|
9212
9217
|
}
|
|
@@ -9219,16 +9224,16 @@
|
|
|
9219
9224
|
"path": "/sass/core/layout/#mixin-container-padding",
|
|
9220
9225
|
"description": "Print the containers padding properties\n",
|
|
9221
9226
|
"commentRange": {
|
|
9222
|
-
"start":
|
|
9223
|
-
"end":
|
|
9227
|
+
"start": 250,
|
|
9228
|
+
"end": 253
|
|
9224
9229
|
},
|
|
9225
9230
|
"context": {
|
|
9226
9231
|
"type": "mixin",
|
|
9227
9232
|
"name": "container-padding",
|
|
9228
9233
|
"code": "\n $container: get-container($name, $specific-breakpoint);\n $responsive: map.get($container, \"responsive\");\n $x: get-container-padding-x($name, $specific-breakpoint);\n $y: get-container-padding-y($name, $specific-breakpoint);\n $resp-amount: utils.when(meta.type-of($responsive) == number, $responsive, utils.get(\"responsive-change\"));\n \n @if $responsive {\n @if $sides {\n @include utils.responsive-property(\"padding-left\", $x, $resp-amount);\n @include utils.responsive-property(\"padding-right\", $x, $resp-amount);\n }\n @if $ends {\n @include utils.responsive-property(\"padding-top\", $y, $resp-amount);\n @include utils.responsive-property(\"padding-bottom\", $y, $resp-amount);\n }\n } @else {\n @if $sides {\n padding-left: $x;\n padding-right: $x;\n }\n @if $ends {\n padding-top: $y;\n padding-bottom: $y;\n }\n }\n",
|
|
9229
9234
|
"line": {
|
|
9230
|
-
"start":
|
|
9231
|
-
"end":
|
|
9235
|
+
"start": 255,
|
|
9236
|
+
"end": 281
|
|
9232
9237
|
}
|
|
9233
9238
|
},
|
|
9234
9239
|
"parameter": [
|
|
@@ -9292,8 +9297,8 @@
|
|
|
9292
9297
|
"name": "container-styles",
|
|
9293
9298
|
"code": "\n $container: get-container($name, $specific-breakpoint);\n $breakpoints: map.get($container, \"breakpoints\");\n \n $width: map.get($container, \"width\");\n\n @if ($width == null) {\n $width: 100%;\n }\n display: block;\n margin-left: auto;\n margin-right: auto;\n width: $width;\n max-width: map.get($container, \"max-width\");\n @include container-padding($name, $specific-breakpoint: $specific-breakpoint);\n\n // Recursive print other breakpoints\n @if $breakpoints and not $specific-breakpoint {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n @include container-styles($name, $breakpoint);\n }\n }\n }\n",
|
|
9294
9299
|
"line": {
|
|
9295
|
-
"start":
|
|
9296
|
-
"end":
|
|
9300
|
+
"start": 303,
|
|
9301
|
+
"end": 328
|
|
9297
9302
|
}
|
|
9298
9303
|
}
|
|
9299
9304
|
}
|
|
@@ -9306,16 +9311,16 @@
|
|
|
9306
9311
|
"path": "/sass/core/layout/#function-get-container-padding-x",
|
|
9307
9312
|
"description": "Get containers padding X value (side)\n",
|
|
9308
9313
|
"commentRange": {
|
|
9309
|
-
"start":
|
|
9310
|
-
"end":
|
|
9314
|
+
"start": 283,
|
|
9315
|
+
"end": 285
|
|
9311
9316
|
},
|
|
9312
9317
|
"context": {
|
|
9313
9318
|
"type": "function",
|
|
9314
9319
|
"name": "get-container-padding-x",
|
|
9315
9320
|
"code": "\n @return get-container-padding($name, true, $specific-breakpoint);\n",
|
|
9316
9321
|
"line": {
|
|
9317
|
-
"start":
|
|
9318
|
-
"end":
|
|
9322
|
+
"start": 287,
|
|
9323
|
+
"end": 289
|
|
9319
9324
|
}
|
|
9320
9325
|
},
|
|
9321
9326
|
"parameter": [
|
|
@@ -9352,8 +9357,8 @@
|
|
|
9352
9357
|
"name": "container-padding",
|
|
9353
9358
|
"code": "\n $container: get-container($name, $specific-breakpoint);\n $responsive: map.get($container, \"responsive\");\n $x: get-container-padding-x($name, $specific-breakpoint);\n $y: get-container-padding-y($name, $specific-breakpoint);\n $resp-amount: utils.when(meta.type-of($responsive) == number, $responsive, utils.get(\"responsive-change\"));\n \n @if $responsive {\n @if $sides {\n @include utils.responsive-property(\"padding-left\", $x, $resp-amount);\n @include utils.responsive-property(\"padding-right\", $x, $resp-amount);\n }\n @if $ends {\n @include utils.responsive-property(\"padding-top\", $y, $resp-amount);\n @include utils.responsive-property(\"padding-bottom\", $y, $resp-amount);\n }\n } @else {\n @if $sides {\n padding-left: $x;\n padding-right: $x;\n }\n @if $ends {\n padding-top: $y;\n padding-bottom: $y;\n }\n }\n",
|
|
9354
9359
|
"line": {
|
|
9355
|
-
"start":
|
|
9356
|
-
"end":
|
|
9360
|
+
"start": 255,
|
|
9361
|
+
"end": 281
|
|
9357
9362
|
}
|
|
9358
9363
|
}
|
|
9359
9364
|
}
|
|
@@ -9366,16 +9371,16 @@
|
|
|
9366
9371
|
"path": "/sass/core/layout/#function-get-container-padding-y",
|
|
9367
9372
|
"description": "Get containers padding Y value (ends)\n",
|
|
9368
9373
|
"commentRange": {
|
|
9369
|
-
"start":
|
|
9370
|
-
"end":
|
|
9374
|
+
"start": 291,
|
|
9375
|
+
"end": 293
|
|
9371
9376
|
},
|
|
9372
9377
|
"context": {
|
|
9373
9378
|
"type": "function",
|
|
9374
9379
|
"name": "get-container-padding-y",
|
|
9375
9380
|
"code": "\n @return get-container-padding($name, false, $specific-breakpoint);\n",
|
|
9376
9381
|
"line": {
|
|
9377
|
-
"start":
|
|
9378
|
-
"end":
|
|
9382
|
+
"start": 295,
|
|
9383
|
+
"end": 297
|
|
9379
9384
|
}
|
|
9380
9385
|
},
|
|
9381
9386
|
"parameter": [
|
|
@@ -9412,8 +9417,8 @@
|
|
|
9412
9417
|
"name": "container-padding",
|
|
9413
9418
|
"code": "\n $container: get-container($name, $specific-breakpoint);\n $responsive: map.get($container, \"responsive\");\n $x: get-container-padding-x($name, $specific-breakpoint);\n $y: get-container-padding-y($name, $specific-breakpoint);\n $resp-amount: utils.when(meta.type-of($responsive) == number, $responsive, utils.get(\"responsive-change\"));\n \n @if $responsive {\n @if $sides {\n @include utils.responsive-property(\"padding-left\", $x, $resp-amount);\n @include utils.responsive-property(\"padding-right\", $x, $resp-amount);\n }\n @if $ends {\n @include utils.responsive-property(\"padding-top\", $y, $resp-amount);\n @include utils.responsive-property(\"padding-bottom\", $y, $resp-amount);\n }\n } @else {\n @if $sides {\n padding-left: $x;\n padding-right: $x;\n }\n @if $ends {\n padding-top: $y;\n padding-bottom: $y;\n }\n }\n",
|
|
9414
9419
|
"line": {
|
|
9415
|
-
"start":
|
|
9416
|
-
"end":
|
|
9420
|
+
"start": 255,
|
|
9421
|
+
"end": 281
|
|
9417
9422
|
}
|
|
9418
9423
|
}
|
|
9419
9424
|
}
|
|
@@ -9426,16 +9431,16 @@
|
|
|
9426
9431
|
"path": "/sass/core/layout/#mixin-container-styles",
|
|
9427
9432
|
"description": "Print all container styles for a given container\n",
|
|
9428
9433
|
"commentRange": {
|
|
9429
|
-
"start":
|
|
9430
|
-
"end":
|
|
9434
|
+
"start": 299,
|
|
9435
|
+
"end": 301
|
|
9431
9436
|
},
|
|
9432
9437
|
"context": {
|
|
9433
9438
|
"type": "mixin",
|
|
9434
9439
|
"name": "container-styles",
|
|
9435
9440
|
"code": "\n $container: get-container($name, $specific-breakpoint);\n $breakpoints: map.get($container, \"breakpoints\");\n \n $width: map.get($container, \"width\");\n\n @if ($width == null) {\n $width: 100%;\n }\n display: block;\n margin-left: auto;\n margin-right: auto;\n width: $width;\n max-width: map.get($container, \"max-width\");\n @include container-padding($name, $specific-breakpoint: $specific-breakpoint);\n\n // Recursive print other breakpoints\n @if $breakpoints and not $specific-breakpoint {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n @include container-styles($name, $breakpoint);\n }\n }\n }\n",
|
|
9436
9441
|
"line": {
|
|
9437
|
-
"start":
|
|
9438
|
-
"end":
|
|
9442
|
+
"start": 303,
|
|
9443
|
+
"end": 328
|
|
9439
9444
|
}
|
|
9440
9445
|
},
|
|
9441
9446
|
"parameter": [
|
|
@@ -9492,16 +9497,16 @@
|
|
|
9492
9497
|
"path": "/sass/core/layout/#mixin-clearfix",
|
|
9493
9498
|
"description": "Prints clearfix styles\n",
|
|
9494
9499
|
"commentRange": {
|
|
9495
|
-
"start":
|
|
9496
|
-
"end":
|
|
9500
|
+
"start": 330,
|
|
9501
|
+
"end": 330
|
|
9497
9502
|
},
|
|
9498
9503
|
"context": {
|
|
9499
9504
|
"type": "mixin",
|
|
9500
9505
|
"name": "clearfix",
|
|
9501
9506
|
"code": "\n &::before,\n &::after {\n content: \"\";\n display: table;\n flex-basis: 0; // Flexbox, clear fix for pseudo elements in Safari\n order: 1;\n }\n &::after { \n clear: both; \n }\n",
|
|
9502
9507
|
"line": {
|
|
9503
|
-
"start":
|
|
9504
|
-
"end":
|
|
9508
|
+
"start": 332,
|
|
9509
|
+
"end": 343
|
|
9505
9510
|
}
|
|
9506
9511
|
},
|
|
9507
9512
|
"group": [
|
|
@@ -9520,16 +9525,16 @@
|
|
|
9520
9525
|
"path": "/sass/core/layout/#mixin-remove-scrollbar",
|
|
9521
9526
|
"description": "Removes scrollbar with CSS\n",
|
|
9522
9527
|
"commentRange": {
|
|
9523
|
-
"start":
|
|
9524
|
-
"end":
|
|
9528
|
+
"start": 345,
|
|
9529
|
+
"end": 345
|
|
9525
9530
|
},
|
|
9526
9531
|
"context": {
|
|
9527
9532
|
"type": "mixin",
|
|
9528
9533
|
"name": "remove-scrollbar",
|
|
9529
9534
|
"code": "\n -ms-overflow-style: none; /* for Internet Explorer, Edge */\n scrollbar-width: none; /* for Firefox */\n &::-webkit-scrollbar {\n display: none; /* for Chrome, Safari, and Opera */\n }\n",
|
|
9530
9535
|
"line": {
|
|
9531
|
-
"start":
|
|
9532
|
-
"end":
|
|
9536
|
+
"start": 346,
|
|
9537
|
+
"end": 352
|
|
9533
9538
|
}
|
|
9534
9539
|
},
|
|
9535
9540
|
"group": [
|
|
@@ -9548,16 +9553,16 @@
|
|
|
9548
9553
|
"path": "/sass/core/layout/#mixin-absolute-fill",
|
|
9549
9554
|
"description": "Layout utility for absolute (zero on all sides)\n- Probably helpful for gzip if we use this when these exact styles are needed\n so they are identical for compression\n",
|
|
9550
9555
|
"commentRange": {
|
|
9551
|
-
"start":
|
|
9552
|
-
"end":
|
|
9556
|
+
"start": 354,
|
|
9557
|
+
"end": 357
|
|
9553
9558
|
},
|
|
9554
9559
|
"context": {
|
|
9555
9560
|
"type": "mixin",
|
|
9556
9561
|
"name": "absolute-fill",
|
|
9557
9562
|
"code": "\n position: absolute;\n top: 0;\n left: 0;\n @if not $set-size {\n right: 0;\n bottom: 0;\n } @else {\n width: 100%;\n height: 100%;\n }\n",
|
|
9558
9563
|
"line": {
|
|
9559
|
-
"start":
|
|
9560
|
-
"end":
|
|
9564
|
+
"start": 358,
|
|
9565
|
+
"end": 369
|
|
9561
9566
|
}
|
|
9562
9567
|
},
|
|
9563
9568
|
"parameter": [
|
|
@@ -57788,8 +57793,8 @@
|
|
|
57788
57793
|
"name": "get-container",
|
|
57789
57794
|
"code": "\n $container: null;\n @if ($required) {\n $container: utils.require-map-get($containers, $name, \"Layout [get-container]\");\n } @else {\n $container: map.get($containers, $name);\n }\n\n @if ($container and $breakpoint) {\n $breakpoints: map.get($container, \"breakpoints\");\n @if ($required) {\n @if ($breakpoints) {\n @return utils.require-map-get($breakpoints, $breakpoint, \"[container breakpoint]\");\n } @else {\n @error 'ULU: No container breakpoints for container \"#{ $name }\", requested breakpoint #{ $breakpoint }';\n }\n } @else {\n @if ($breakpoints) {\n @return map.get($breakpoints, $breakpoint);\n } @else {\n @return null;\n }\n }\n }\n\n @return $container;\n",
|
|
57790
57795
|
"line": {
|
|
57791
|
-
"start":
|
|
57792
|
-
"end":
|
|
57796
|
+
"start": 154,
|
|
57797
|
+
"end": 180
|
|
57793
57798
|
}
|
|
57794
57799
|
}
|
|
57795
57800
|
},
|
|
@@ -57800,8 +57805,8 @@
|
|
|
57800
57805
|
"name": "get-container",
|
|
57801
57806
|
"code": "\n $container: null;\n @if ($required) {\n $container: utils.require-map-get($containers, $name, \"Layout [get-container]\");\n } @else {\n $container: map.get($containers, $name);\n }\n\n @if ($container and $breakpoint) {\n $breakpoints: map.get($container, \"breakpoints\");\n @if ($required) {\n @if ($breakpoints) {\n @return utils.require-map-get($breakpoints, $breakpoint, \"[container breakpoint]\");\n } @else {\n @error 'ULU: No container breakpoints for container \"#{ $name }\", requested breakpoint #{ $breakpoint }';\n }\n } @else {\n @if ($breakpoints) {\n @return map.get($breakpoints, $breakpoint);\n } @else {\n @return null;\n }\n }\n }\n\n @return $container;\n",
|
|
57802
57807
|
"line": {
|
|
57803
|
-
"start":
|
|
57804
|
-
"end":
|
|
57808
|
+
"start": 154,
|
|
57809
|
+
"end": 180
|
|
57805
57810
|
}
|
|
57806
57811
|
}
|
|
57807
57812
|
},
|
|
@@ -57812,8 +57817,8 @@
|
|
|
57812
57817
|
"name": "get-container",
|
|
57813
57818
|
"code": "\n $container: null;\n @if ($required) {\n $container: utils.require-map-get($containers, $name, \"Layout [get-container]\");\n } @else {\n $container: map.get($containers, $name);\n }\n\n @if ($container and $breakpoint) {\n $breakpoints: map.get($container, \"breakpoints\");\n @if ($required) {\n @if ($breakpoints) {\n @return utils.require-map-get($breakpoints, $breakpoint, \"[container breakpoint]\");\n } @else {\n @error 'ULU: No container breakpoints for container \"#{ $name }\", requested breakpoint #{ $breakpoint }';\n }\n } @else {\n @if ($breakpoints) {\n @return map.get($breakpoints, $breakpoint);\n } @else {\n @return null;\n }\n }\n }\n\n @return $container;\n",
|
|
57814
57819
|
"line": {
|
|
57815
|
-
"start":
|
|
57816
|
-
"end":
|
|
57820
|
+
"start": 154,
|
|
57821
|
+
"end": 180
|
|
57817
57822
|
}
|
|
57818
57823
|
}
|
|
57819
57824
|
},
|
|
@@ -57824,8 +57829,8 @@
|
|
|
57824
57829
|
"name": "match-container-padding",
|
|
57825
57830
|
"code": "\n $container: get-container($name);\n $breakpoints: map.get($container, \"breakpoints\");\n #{ $property }: get-container-padding($name, $sides);\n @if $breakpoints {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n #{ $property }: get-container-padding($name, $sides, $breakpoint);\n }\n }\n }\n",
|
|
57826
57831
|
"line": {
|
|
57827
|
-
"start":
|
|
57828
|
-
"end":
|
|
57832
|
+
"start": 188,
|
|
57833
|
+
"end": 200
|
|
57829
57834
|
}
|
|
57830
57835
|
}
|
|
57831
57836
|
},
|
|
@@ -57836,8 +57841,8 @@
|
|
|
57836
57841
|
"name": "match-container-padding",
|
|
57837
57842
|
"code": "\n $container: get-container($name);\n $breakpoints: map.get($container, \"breakpoints\");\n #{ $property }: get-container-padding($name, $sides);\n @if $breakpoints {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n #{ $property }: get-container-padding($name, $sides, $breakpoint);\n }\n }\n }\n",
|
|
57838
57843
|
"line": {
|
|
57839
|
-
"start":
|
|
57840
|
-
"end":
|
|
57844
|
+
"start": 188,
|
|
57845
|
+
"end": 200
|
|
57841
57846
|
}
|
|
57842
57847
|
}
|
|
57843
57848
|
},
|
|
@@ -57848,8 +57853,8 @@
|
|
|
57848
57853
|
"name": "match-container-margin",
|
|
57849
57854
|
"code": "\n $container: get-container($name);\n $breakpoints: map.get($container, \"breakpoints\");\n $padding: 0;\n @if ($include-padding) {\n $padding: get-container-padding($name, true);\n }\n $max: map.get($container, \"max-width\");\n #{ $property }: max(((100vw - $max) / 2) + $padding, $padding);\n @if $breakpoints {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n $pad: 0;\n @if ($include-padding) {\n $pad: get-container-padding($name, true, $breakpoint);\n }\n #{ $property }: max(((100vw - $max) / 2) + $pad, $pad);\n }\n }\n }\n",
|
|
57850
57855
|
"line": {
|
|
57851
|
-
"start":
|
|
57852
|
-
"end":
|
|
57856
|
+
"start": 211,
|
|
57857
|
+
"end": 232
|
|
57853
57858
|
}
|
|
57854
57859
|
}
|
|
57855
57860
|
},
|
|
@@ -57860,8 +57865,8 @@
|
|
|
57860
57865
|
"name": "match-container-margin",
|
|
57861
57866
|
"code": "\n $container: get-container($name);\n $breakpoints: map.get($container, \"breakpoints\");\n $padding: 0;\n @if ($include-padding) {\n $padding: get-container-padding($name, true);\n }\n $max: map.get($container, \"max-width\");\n #{ $property }: max(((100vw - $max) / 2) + $padding, $padding);\n @if $breakpoints {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n $pad: 0;\n @if ($include-padding) {\n $pad: get-container-padding($name, true, $breakpoint);\n }\n #{ $property }: max(((100vw - $max) / 2) + $pad, $pad);\n }\n }\n }\n",
|
|
57862
57867
|
"line": {
|
|
57863
|
-
"start":
|
|
57864
|
-
"end":
|
|
57868
|
+
"start": 211,
|
|
57869
|
+
"end": 232
|
|
57865
57870
|
}
|
|
57866
57871
|
}
|
|
57867
57872
|
},
|
|
@@ -57872,8 +57877,8 @@
|
|
|
57872
57877
|
"name": "match-container-margin",
|
|
57873
57878
|
"code": "\n $container: get-container($name);\n $breakpoints: map.get($container, \"breakpoints\");\n $padding: 0;\n @if ($include-padding) {\n $padding: get-container-padding($name, true);\n }\n $max: map.get($container, \"max-width\");\n #{ $property }: max(((100vw - $max) / 2) + $padding, $padding);\n @if $breakpoints {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n $pad: 0;\n @if ($include-padding) {\n $pad: get-container-padding($name, true, $breakpoint);\n }\n #{ $property }: max(((100vw - $max) / 2) + $pad, $pad);\n }\n }\n }\n",
|
|
57874
57879
|
"line": {
|
|
57875
|
-
"start":
|
|
57876
|
-
"end":
|
|
57880
|
+
"start": 211,
|
|
57881
|
+
"end": 232
|
|
57877
57882
|
}
|
|
57878
57883
|
}
|
|
57879
57884
|
},
|
|
@@ -57884,8 +57889,8 @@
|
|
|
57884
57889
|
"name": "get-container-padding",
|
|
57885
57890
|
"code": "\n $container: get-container($name, $specific-breakpoint);\n $padding: map.get($container, \"padding\");\n $is-list: meta.type-of($padding) == \"list\"; // Else number\n @if (not $is-list) {\n @return $padding;\n } @else {\n @return list.nth($padding, utils.when($sides, 2, 1));\n }\n",
|
|
57886
57891
|
"line": {
|
|
57887
|
-
"start":
|
|
57888
|
-
"end":
|
|
57892
|
+
"start": 239,
|
|
57893
|
+
"end": 248
|
|
57889
57894
|
}
|
|
57890
57895
|
}
|
|
57891
57896
|
},
|
|
@@ -57896,8 +57901,8 @@
|
|
|
57896
57901
|
"name": "container-padding",
|
|
57897
57902
|
"code": "\n $container: get-container($name, $specific-breakpoint);\n $responsive: map.get($container, \"responsive\");\n $x: get-container-padding-x($name, $specific-breakpoint);\n $y: get-container-padding-y($name, $specific-breakpoint);\n $resp-amount: utils.when(meta.type-of($responsive) == number, $responsive, utils.get(\"responsive-change\"));\n \n @if $responsive {\n @if $sides {\n @include utils.responsive-property(\"padding-left\", $x, $resp-amount);\n @include utils.responsive-property(\"padding-right\", $x, $resp-amount);\n }\n @if $ends {\n @include utils.responsive-property(\"padding-top\", $y, $resp-amount);\n @include utils.responsive-property(\"padding-bottom\", $y, $resp-amount);\n }\n } @else {\n @if $sides {\n padding-left: $x;\n padding-right: $x;\n }\n @if $ends {\n padding-top: $y;\n padding-bottom: $y;\n }\n }\n",
|
|
57898
57903
|
"line": {
|
|
57899
|
-
"start":
|
|
57900
|
-
"end":
|
|
57904
|
+
"start": 255,
|
|
57905
|
+
"end": 281
|
|
57901
57906
|
}
|
|
57902
57907
|
}
|
|
57903
57908
|
},
|
|
@@ -57908,8 +57913,8 @@
|
|
|
57908
57913
|
"name": "container-padding",
|
|
57909
57914
|
"code": "\n $container: get-container($name, $specific-breakpoint);\n $responsive: map.get($container, \"responsive\");\n $x: get-container-padding-x($name, $specific-breakpoint);\n $y: get-container-padding-y($name, $specific-breakpoint);\n $resp-amount: utils.when(meta.type-of($responsive) == number, $responsive, utils.get(\"responsive-change\"));\n \n @if $responsive {\n @if $sides {\n @include utils.responsive-property(\"padding-left\", $x, $resp-amount);\n @include utils.responsive-property(\"padding-right\", $x, $resp-amount);\n }\n @if $ends {\n @include utils.responsive-property(\"padding-top\", $y, $resp-amount);\n @include utils.responsive-property(\"padding-bottom\", $y, $resp-amount);\n }\n } @else {\n @if $sides {\n padding-left: $x;\n padding-right: $x;\n }\n @if $ends {\n padding-top: $y;\n padding-bottom: $y;\n }\n }\n",
|
|
57910
57915
|
"line": {
|
|
57911
|
-
"start":
|
|
57912
|
-
"end":
|
|
57916
|
+
"start": 255,
|
|
57917
|
+
"end": 281
|
|
57913
57918
|
}
|
|
57914
57919
|
}
|
|
57915
57920
|
},
|
|
@@ -57920,8 +57925,8 @@
|
|
|
57920
57925
|
"name": "container-styles",
|
|
57921
57926
|
"code": "\n $container: get-container($name, $specific-breakpoint);\n $breakpoints: map.get($container, \"breakpoints\");\n \n $width: map.get($container, \"width\");\n\n @if ($width == null) {\n $width: 100%;\n }\n display: block;\n margin-left: auto;\n margin-right: auto;\n width: $width;\n max-width: map.get($container, \"max-width\");\n @include container-padding($name, $specific-breakpoint: $specific-breakpoint);\n\n // Recursive print other breakpoints\n @if $breakpoints and not $specific-breakpoint {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n @include container-styles($name, $breakpoint);\n }\n }\n }\n",
|
|
57922
57927
|
"line": {
|
|
57923
|
-
"start":
|
|
57924
|
-
"end":
|
|
57928
|
+
"start": 303,
|
|
57929
|
+
"end": 328
|
|
57925
57930
|
}
|
|
57926
57931
|
}
|
|
57927
57932
|
},
|
|
@@ -57932,8 +57937,8 @@
|
|
|
57932
57937
|
"name": "container-styles",
|
|
57933
57938
|
"code": "\n $container: get-container($name, $specific-breakpoint);\n $breakpoints: map.get($container, \"breakpoints\");\n \n $width: map.get($container, \"width\");\n\n @if ($width == null) {\n $width: 100%;\n }\n display: block;\n margin-left: auto;\n margin-right: auto;\n width: $width;\n max-width: map.get($container, \"max-width\");\n @include container-padding($name, $specific-breakpoint: $specific-breakpoint);\n\n // Recursive print other breakpoints\n @if $breakpoints and not $specific-breakpoint {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n @include container-styles($name, $breakpoint);\n }\n }\n }\n",
|
|
57934
57939
|
"line": {
|
|
57935
|
-
"start":
|
|
57936
|
-
"end":
|
|
57940
|
+
"start": 303,
|
|
57941
|
+
"end": 328
|
|
57937
57942
|
}
|
|
57938
57943
|
}
|
|
57939
57944
|
},
|
|
@@ -57944,8 +57949,8 @@
|
|
|
57944
57949
|
"name": "container-styles",
|
|
57945
57950
|
"code": "\n $container: get-container($name, $specific-breakpoint);\n $breakpoints: map.get($container, \"breakpoints\");\n \n $width: map.get($container, \"width\");\n\n @if ($width == null) {\n $width: 100%;\n }\n display: block;\n margin-left: auto;\n margin-right: auto;\n width: $width;\n max-width: map.get($container, \"max-width\");\n @include container-padding($name, $specific-breakpoint: $specific-breakpoint);\n\n // Recursive print other breakpoints\n @if $breakpoints and not $specific-breakpoint {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n @include container-styles($name, $breakpoint);\n }\n }\n }\n",
|
|
57946
57951
|
"line": {
|
|
57947
|
-
"start":
|
|
57948
|
-
"end":
|
|
57952
|
+
"start": 303,
|
|
57953
|
+
"end": 328
|
|
57949
57954
|
}
|
|
57950
57955
|
}
|
|
57951
57956
|
},
|
|
@@ -57956,8 +57961,8 @@
|
|
|
57956
57961
|
"name": "container-styles",
|
|
57957
57962
|
"code": "\n $container: get-container($name, $specific-breakpoint);\n $breakpoints: map.get($container, \"breakpoints\");\n \n $width: map.get($container, \"width\");\n\n @if ($width == null) {\n $width: 100%;\n }\n display: block;\n margin-left: auto;\n margin-right: auto;\n width: $width;\n max-width: map.get($container, \"max-width\");\n @include container-padding($name, $specific-breakpoint: $specific-breakpoint);\n\n // Recursive print other breakpoints\n @if $breakpoints and not $specific-breakpoint {\n @each $breakpoint, $props in $breakpoints {\n $direction: map.get($props, \"direction\");\n @include breakpoint.from($breakpoint, $direction) {\n @include container-styles($name, $breakpoint);\n }\n }\n }\n",
|
|
57958
57963
|
"line": {
|
|
57959
|
-
"start":
|
|
57960
|
-
"end":
|
|
57964
|
+
"start": 303,
|
|
57965
|
+
"end": 328
|
|
57961
57966
|
}
|
|
57962
57967
|
}
|
|
57963
57968
|
},
|
|
@@ -63018,8 +63023,8 @@
|
|
|
63018
63023
|
"name": "get-width",
|
|
63019
63024
|
"code": "\n @return utils.require-map-get($widths, $name, \"layout [widths]\");\n",
|
|
63020
63025
|
"line": {
|
|
63021
|
-
"start":
|
|
63022
|
-
"end":
|
|
63026
|
+
"start": 83,
|
|
63027
|
+
"end": 85
|
|
63023
63028
|
}
|
|
63024
63029
|
}
|
|
63025
63030
|
},
|
|
@@ -63030,8 +63035,8 @@
|
|
|
63030
63035
|
"name": "get-max-width",
|
|
63031
63036
|
"code": "\n @return utils.require-map-get($max-widths, $name, \"layout [max-widths]\");\n",
|
|
63032
63037
|
"line": {
|
|
63033
|
-
"start":
|
|
63034
|
-
"end":
|
|
63038
|
+
"start": 121,
|
|
63039
|
+
"end": 123
|
|
63035
63040
|
}
|
|
63036
63041
|
}
|
|
63037
63042
|
},
|
|
@@ -63042,8 +63047,8 @@
|
|
|
63042
63047
|
"name": "get-container",
|
|
63043
63048
|
"code": "\n $container: null;\n @if ($required) {\n $container: utils.require-map-get($containers, $name, \"Layout [get-container]\");\n } @else {\n $container: map.get($containers, $name);\n }\n\n @if ($container and $breakpoint) {\n $breakpoints: map.get($container, \"breakpoints\");\n @if ($required) {\n @if ($breakpoints) {\n @return utils.require-map-get($breakpoints, $breakpoint, \"[container breakpoint]\");\n } @else {\n @error 'ULU: No container breakpoints for container \"#{ $name }\", requested breakpoint #{ $breakpoint }';\n }\n } @else {\n @if ($breakpoints) {\n @return map.get($breakpoints, $breakpoint);\n } @else {\n @return null;\n }\n }\n }\n\n @return $container;\n",
|
|
63044
63049
|
"line": {
|
|
63045
|
-
"start":
|
|
63046
|
-
"end":
|
|
63050
|
+
"start": 154,
|
|
63051
|
+
"end": 180
|
|
63047
63052
|
}
|
|
63048
63053
|
}
|
|
63049
63054
|
},
|
|
@@ -63054,8 +63059,8 @@
|
|
|
63054
63059
|
"name": "get-container",
|
|
63055
63060
|
"code": "\n $container: null;\n @if ($required) {\n $container: utils.require-map-get($containers, $name, \"Layout [get-container]\");\n } @else {\n $container: map.get($containers, $name);\n }\n\n @if ($container and $breakpoint) {\n $breakpoints: map.get($container, \"breakpoints\");\n @if ($required) {\n @if ($breakpoints) {\n @return utils.require-map-get($breakpoints, $breakpoint, \"[container breakpoint]\");\n } @else {\n @error 'ULU: No container breakpoints for container \"#{ $name }\", requested breakpoint #{ $breakpoint }';\n }\n } @else {\n @if ($breakpoints) {\n @return map.get($breakpoints, $breakpoint);\n } @else {\n @return null;\n }\n }\n }\n\n @return $container;\n",
|
|
63056
63061
|
"line": {
|
|
63057
|
-
"start":
|
|
63058
|
-
"end":
|
|
63062
|
+
"start": 154,
|
|
63063
|
+
"end": 180
|
|
63059
63064
|
}
|
|
63060
63065
|
}
|
|
63061
63066
|
},
|
|
@@ -63528,8 +63533,8 @@
|
|
|
63528
63533
|
"name": "get-container-padding",
|
|
63529
63534
|
"code": "\n $container: get-container($name, $specific-breakpoint);\n $padding: map.get($container, \"padding\");\n $is-list: meta.type-of($padding) == \"list\"; // Else number\n @if (not $is-list) {\n @return $padding;\n } @else {\n @return list.nth($padding, utils.when($sides, 2, 1));\n }\n",
|
|
63530
63535
|
"line": {
|
|
63531
|
-
"start":
|
|
63532
|
-
"end":
|
|
63536
|
+
"start": 239,
|
|
63537
|
+
"end": 248
|
|
63533
63538
|
}
|
|
63534
63539
|
}
|
|
63535
63540
|
},
|
|
@@ -63540,8 +63545,8 @@
|
|
|
63540
63545
|
"name": "container-padding",
|
|
63541
63546
|
"code": "\n $container: get-container($name, $specific-breakpoint);\n $responsive: map.get($container, \"responsive\");\n $x: get-container-padding-x($name, $specific-breakpoint);\n $y: get-container-padding-y($name, $specific-breakpoint);\n $resp-amount: utils.when(meta.type-of($responsive) == number, $responsive, utils.get(\"responsive-change\"));\n \n @if $responsive {\n @if $sides {\n @include utils.responsive-property(\"padding-left\", $x, $resp-amount);\n @include utils.responsive-property(\"padding-right\", $x, $resp-amount);\n }\n @if $ends {\n @include utils.responsive-property(\"padding-top\", $y, $resp-amount);\n @include utils.responsive-property(\"padding-bottom\", $y, $resp-amount);\n }\n } @else {\n @if $sides {\n padding-left: $x;\n padding-right: $x;\n }\n @if $ends {\n padding-top: $y;\n padding-bottom: $y;\n }\n }\n",
|
|
63542
63547
|
"line": {
|
|
63543
|
-
"start":
|
|
63544
|
-
"end":
|
|
63548
|
+
"start": 255,
|
|
63549
|
+
"end": 281
|
|
63545
63550
|
}
|
|
63546
63551
|
}
|
|
63547
63552
|
},
|
|
@@ -64092,8 +64097,8 @@
|
|
|
64092
64097
|
"name": "set-widths",
|
|
64093
64098
|
"code": "\n $widths: utils.map-merge($widths, $changes, $merge-mode) !global;\n",
|
|
64094
64099
|
"line": {
|
|
64095
|
-
"start":
|
|
64096
|
-
"end":
|
|
64100
|
+
"start": 75,
|
|
64101
|
+
"end": 77
|
|
64097
64102
|
}
|
|
64098
64103
|
}
|
|
64099
64104
|
},
|
|
@@ -64104,8 +64109,8 @@
|
|
|
64104
64109
|
"name": "set-max-widths",
|
|
64105
64110
|
"code": "\n $max-widths: utils.map-merge($max-widths, $changes, $merge-mode) !global;\n",
|
|
64106
64111
|
"line": {
|
|
64107
|
-
"start":
|
|
64108
|
-
"end":
|
|
64112
|
+
"start": 113,
|
|
64113
|
+
"end": 115
|
|
64109
64114
|
}
|
|
64110
64115
|
}
|
|
64111
64116
|
},
|
|
@@ -64116,8 +64121,8 @@
|
|
|
64116
64121
|
"name": "set-containers",
|
|
64117
64122
|
"code": "\n $containers: utils.map-merge($containers, $changes, $merge-mode) !global;\n",
|
|
64118
64123
|
"line": {
|
|
64119
|
-
"start":
|
|
64120
|
-
"end":
|
|
64124
|
+
"start": 146,
|
|
64125
|
+
"end": 148
|
|
64121
64126
|
}
|
|
64122
64127
|
}
|
|
64123
64128
|
},
|
package/lib/scss/_layout.scss
CHANGED
|
@@ -46,6 +46,7 @@ $config: (
|
|
|
46
46
|
/// @prop {Map} [name] The width definition
|
|
47
47
|
/// @prop {String|Number} [name].value The base width value
|
|
48
48
|
/// @prop {Boolean} [name].helper-class Output a helper class for this width
|
|
49
|
+
/// @prop {Boolean} [name].match-font-size If enabled will set font size equal to width for font based icon fonts (only output with helper class)
|
|
49
50
|
/// @prop {Map} [name].breakpoints Responsive breakpoints (optional)
|
|
50
51
|
|
|
51
52
|
$widths: (
|
|
@@ -19,8 +19,12 @@
|
|
|
19
19
|
@each $name, $props in layout.$widths {
|
|
20
20
|
@if map.get($props, "helper-class") {
|
|
21
21
|
#{ $prefix-width }-#{ $name } {
|
|
22
|
-
|
|
22
|
+
$var-name: "width-#{ $name }";
|
|
23
|
+
width: cssvar.use-ulu($var-name);
|
|
23
24
|
max-width: 100%;
|
|
25
|
+
@if (map.get($props, "match-font-size")) {
|
|
26
|
+
font-size: cssvar.use-ulu($var-name);
|
|
27
|
+
}
|
|
24
28
|
}
|
|
25
29
|
}
|
|
26
30
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ulu/frontend",
|
|
3
|
-
"version": "0.6.
|
|
3
|
+
"version": "0.6.19",
|
|
4
4
|
"description": "A framework-agnostic frontend toolkit providing a modular, tree-shakable library of accessible components and utilities. Designed for seamless integration, it features a highly configurable SCSS system for any environment and vanilla JavaScript modules optimized for traditional websites and content management systems.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"files": [
|