@ulu/frontend 0.6.12 → 0.6.14
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
CHANGED
|
@@ -131,6 +131,11 @@
|
|
|
131
131
|
"title": "Large Button",
|
|
132
132
|
"description": "A larger button variant.",
|
|
133
133
|
"html": "<button class=\"button button--large\">Large Button</button>"
|
|
134
|
+
},
|
|
135
|
+
{
|
|
136
|
+
"title": "Left Aligned Button",
|
|
137
|
+
"description": "A button with its content aligned to the left, useful when the button spans a larger width.",
|
|
138
|
+
"html": "<button class=\"button button--left\" style=\"width: 100%;\">Left Aligned</button>"
|
|
134
139
|
}
|
|
135
140
|
],
|
|
136
141
|
"callout": [
|
|
@@ -1203,10 +1208,16 @@
|
|
|
1203
1208
|
"properties": [
|
|
1204
1209
|
{
|
|
1205
1210
|
"name": "background-color",
|
|
1206
|
-
"type": "
|
|
1211
|
+
"type": "Color",
|
|
1207
1212
|
"description": "Background color (if no image)",
|
|
1208
1213
|
"default": "gray"
|
|
1209
1214
|
},
|
|
1215
|
+
{
|
|
1216
|
+
"name": "background-color-hover",
|
|
1217
|
+
"type": "Color",
|
|
1218
|
+
"description": "Optional background color for hover when using badge--clickable modifier",
|
|
1219
|
+
"default": "null"
|
|
1220
|
+
},
|
|
1210
1221
|
{
|
|
1211
1222
|
"name": "border-radius",
|
|
1212
1223
|
"type": "Number",
|
|
@@ -1215,10 +1226,28 @@
|
|
|
1215
1226
|
},
|
|
1216
1227
|
{
|
|
1217
1228
|
"name": "color",
|
|
1218
|
-
"type": "
|
|
1229
|
+
"type": "Color",
|
|
1219
1230
|
"description": "Type color",
|
|
1220
1231
|
"default": "black"
|
|
1221
1232
|
},
|
|
1233
|
+
{
|
|
1234
|
+
"name": "color-hover",
|
|
1235
|
+
"type": "Color",
|
|
1236
|
+
"description": "Optional color for hover when using badge--clickable modifier",
|
|
1237
|
+
"default": "null"
|
|
1238
|
+
},
|
|
1239
|
+
{
|
|
1240
|
+
"name": "box-shadow",
|
|
1241
|
+
"type": "CssValue",
|
|
1242
|
+
"description": "Optional box-shadow",
|
|
1243
|
+
"default": "null"
|
|
1244
|
+
},
|
|
1245
|
+
{
|
|
1246
|
+
"name": "box-shadow-hover",
|
|
1247
|
+
"type": "CssValue",
|
|
1248
|
+
"description": "Optional box-shadow for hover when using badge--clickable modifier",
|
|
1249
|
+
"default": "null"
|
|
1250
|
+
},
|
|
1222
1251
|
{
|
|
1223
1252
|
"name": "font-size",
|
|
1224
1253
|
"type": "Number",
|
|
@@ -1227,13 +1256,13 @@
|
|
|
1227
1256
|
},
|
|
1228
1257
|
{
|
|
1229
1258
|
"name": "font-weight",
|
|
1230
|
-
"type": "
|
|
1259
|
+
"type": "Keyword",
|
|
1231
1260
|
"description": "Font weight",
|
|
1232
1261
|
"default": "bold"
|
|
1233
1262
|
},
|
|
1234
1263
|
{
|
|
1235
1264
|
"name": "font-family",
|
|
1236
|
-
"type": "
|
|
1265
|
+
"type": "String",
|
|
1237
1266
|
"description": "Specify font family, defaults to typography font-family-sans",
|
|
1238
1267
|
"default": "true"
|
|
1239
1268
|
},
|
|
@@ -1406,6 +1435,12 @@
|
|
|
1406
1435
|
"description": "Adjust button line wrapping, by default line's are not wrapped",
|
|
1407
1436
|
"default": "nowrap"
|
|
1408
1437
|
},
|
|
1438
|
+
{
|
|
1439
|
+
"name": "gap",
|
|
1440
|
+
"type": "Dimension",
|
|
1441
|
+
"description": "Gap to use between items within the button",
|
|
1442
|
+
"default": "0.5em"
|
|
1443
|
+
},
|
|
1409
1444
|
{
|
|
1410
1445
|
"name": "border-color",
|
|
1411
1446
|
"type": "String",
|
|
@@ -13822,8 +13857,8 @@
|
|
|
13822
13857
|
"name": "set",
|
|
13823
13858
|
"code": "\n $config: map.merge($config, $changes) !global;\n",
|
|
13824
13859
|
"line": {
|
|
13825
|
-
"start":
|
|
13826
|
-
"end":
|
|
13860
|
+
"start": 67,
|
|
13861
|
+
"end": 69
|
|
13827
13862
|
}
|
|
13828
13863
|
}
|
|
13829
13864
|
},
|
|
@@ -13834,8 +13869,8 @@
|
|
|
13834
13869
|
"name": "set",
|
|
13835
13870
|
"code": "\n $config: map.merge($config, $changes) !global;\n",
|
|
13836
13871
|
"line": {
|
|
13837
|
-
"start":
|
|
13838
|
-
"end":
|
|
13872
|
+
"start": 67,
|
|
13873
|
+
"end": 69
|
|
13839
13874
|
}
|
|
13840
13875
|
}
|
|
13841
13876
|
},
|
|
@@ -13846,8 +13881,8 @@
|
|
|
13846
13881
|
"name": "get",
|
|
13847
13882
|
"code": "\n $value: utils.require-map-get($config, $name, \"badge [config]\");\n @return utils.function-fallback($name, $value, $-fallbacks);\n",
|
|
13848
13883
|
"line": {
|
|
13849
|
-
"start":
|
|
13850
|
-
"end":
|
|
13884
|
+
"start": 76,
|
|
13885
|
+
"end": 79
|
|
13851
13886
|
}
|
|
13852
13887
|
}
|
|
13853
13888
|
},
|
|
@@ -13966,8 +14001,8 @@
|
|
|
13966
14001
|
"name": "set",
|
|
13967
14002
|
"code": "\n $config: map.merge($config, $changes) !global;\n",
|
|
13968
14003
|
"line": {
|
|
13969
|
-
"start":
|
|
13970
|
-
"end":
|
|
14004
|
+
"start": 31,
|
|
14005
|
+
"end": 33
|
|
13971
14006
|
}
|
|
13972
14007
|
}
|
|
13973
14008
|
},
|
|
@@ -13978,8 +14013,8 @@
|
|
|
13978
14013
|
"name": "set",
|
|
13979
14014
|
"code": "\n $config: map.merge($config, $changes) !global;\n",
|
|
13980
14015
|
"line": {
|
|
13981
|
-
"start":
|
|
13982
|
-
"end":
|
|
14016
|
+
"start": 31,
|
|
14017
|
+
"end": 33
|
|
13983
14018
|
}
|
|
13984
14019
|
}
|
|
13985
14020
|
},
|
|
@@ -13990,8 +14025,8 @@
|
|
|
13990
14025
|
"name": "get",
|
|
13991
14026
|
"code": "\n $value: utils.require-map-get($config, $name, \"component-button [config]\");\n @return utils.function-fallback($name, $value, $-fallbacks);\n",
|
|
13992
14027
|
"line": {
|
|
13993
|
-
"start":
|
|
13994
|
-
"end":
|
|
14028
|
+
"start": 40,
|
|
14029
|
+
"end": 43
|
|
13995
14030
|
}
|
|
13996
14031
|
}
|
|
13997
14032
|
},
|
|
@@ -16680,10 +16715,22 @@
|
|
|
16680
16715
|
"context": {
|
|
16681
16716
|
"type": "mixin",
|
|
16682
16717
|
"name": "styles",
|
|
16683
|
-
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n //
|
|
16718
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16719
|
+
"line": {
|
|
16720
|
+
"start": 97,
|
|
16721
|
+
"end": 165
|
|
16722
|
+
}
|
|
16723
|
+
}
|
|
16724
|
+
},
|
|
16725
|
+
{
|
|
16726
|
+
"description": "Output badge component styles\n",
|
|
16727
|
+
"context": {
|
|
16728
|
+
"type": "mixin",
|
|
16729
|
+
"name": "styles",
|
|
16730
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16684
16731
|
"line": {
|
|
16685
|
-
"start":
|
|
16686
|
-
"end":
|
|
16732
|
+
"start": 97,
|
|
16733
|
+
"end": 165
|
|
16687
16734
|
}
|
|
16688
16735
|
}
|
|
16689
16736
|
},
|
|
@@ -16692,10 +16739,10 @@
|
|
|
16692
16739
|
"context": {
|
|
16693
16740
|
"type": "mixin",
|
|
16694
16741
|
"name": "styles",
|
|
16695
|
-
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n //
|
|
16742
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16696
16743
|
"line": {
|
|
16697
|
-
"start":
|
|
16698
|
-
"end":
|
|
16744
|
+
"start": 97,
|
|
16745
|
+
"end": 165
|
|
16699
16746
|
}
|
|
16700
16747
|
}
|
|
16701
16748
|
},
|
|
@@ -16704,10 +16751,10 @@
|
|
|
16704
16751
|
"context": {
|
|
16705
16752
|
"type": "mixin",
|
|
16706
16753
|
"name": "styles",
|
|
16707
|
-
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n //
|
|
16754
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16708
16755
|
"line": {
|
|
16709
|
-
"start":
|
|
16710
|
-
"end":
|
|
16756
|
+
"start": 97,
|
|
16757
|
+
"end": 165
|
|
16711
16758
|
}
|
|
16712
16759
|
}
|
|
16713
16760
|
},
|
|
@@ -16716,10 +16763,10 @@
|
|
|
16716
16763
|
"context": {
|
|
16717
16764
|
"type": "mixin",
|
|
16718
16765
|
"name": "styles",
|
|
16719
|
-
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n //
|
|
16766
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16720
16767
|
"line": {
|
|
16721
|
-
"start":
|
|
16722
|
-
"end":
|
|
16768
|
+
"start": 97,
|
|
16769
|
+
"end": 165
|
|
16723
16770
|
}
|
|
16724
16771
|
}
|
|
16725
16772
|
},
|
|
@@ -16728,10 +16775,10 @@
|
|
|
16728
16775
|
"context": {
|
|
16729
16776
|
"type": "mixin",
|
|
16730
16777
|
"name": "styles",
|
|
16731
|
-
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n //
|
|
16778
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16732
16779
|
"line": {
|
|
16733
|
-
"start":
|
|
16734
|
-
"end":
|
|
16780
|
+
"start": 97,
|
|
16781
|
+
"end": 165
|
|
16735
16782
|
}
|
|
16736
16783
|
}
|
|
16737
16784
|
},
|
|
@@ -16740,10 +16787,10 @@
|
|
|
16740
16787
|
"context": {
|
|
16741
16788
|
"type": "mixin",
|
|
16742
16789
|
"name": "styles",
|
|
16743
|
-
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n //
|
|
16790
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16744
16791
|
"line": {
|
|
16745
|
-
"start":
|
|
16746
|
-
"end":
|
|
16792
|
+
"start": 97,
|
|
16793
|
+
"end": 165
|
|
16747
16794
|
}
|
|
16748
16795
|
}
|
|
16749
16796
|
},
|
|
@@ -16752,10 +16799,10 @@
|
|
|
16752
16799
|
"context": {
|
|
16753
16800
|
"type": "mixin",
|
|
16754
16801
|
"name": "styles",
|
|
16755
|
-
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n //
|
|
16802
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16756
16803
|
"line": {
|
|
16757
|
-
"start":
|
|
16758
|
-
"end":
|
|
16804
|
+
"start": 97,
|
|
16805
|
+
"end": 165
|
|
16759
16806
|
}
|
|
16760
16807
|
}
|
|
16761
16808
|
},
|
|
@@ -16764,10 +16811,10 @@
|
|
|
16764
16811
|
"context": {
|
|
16765
16812
|
"type": "mixin",
|
|
16766
16813
|
"name": "styles",
|
|
16767
|
-
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n //
|
|
16814
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16768
16815
|
"line": {
|
|
16769
|
-
"start":
|
|
16770
|
-
"end":
|
|
16816
|
+
"start": 97,
|
|
16817
|
+
"end": 165
|
|
16771
16818
|
}
|
|
16772
16819
|
}
|
|
16773
16820
|
},
|
|
@@ -16776,10 +16823,10 @@
|
|
|
16776
16823
|
"context": {
|
|
16777
16824
|
"type": "mixin",
|
|
16778
16825
|
"name": "styles",
|
|
16779
|
-
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n //
|
|
16826
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16780
16827
|
"line": {
|
|
16781
|
-
"start":
|
|
16782
|
-
"end":
|
|
16828
|
+
"start": 97,
|
|
16829
|
+
"end": 165
|
|
16783
16830
|
}
|
|
16784
16831
|
}
|
|
16785
16832
|
},
|
|
@@ -16788,10 +16835,10 @@
|
|
|
16788
16835
|
"context": {
|
|
16789
16836
|
"type": "mixin",
|
|
16790
16837
|
"name": "styles",
|
|
16791
|
-
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n //
|
|
16838
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16792
16839
|
"line": {
|
|
16793
|
-
"start":
|
|
16794
|
-
"end":
|
|
16840
|
+
"start": 97,
|
|
16841
|
+
"end": 165
|
|
16795
16842
|
}
|
|
16796
16843
|
}
|
|
16797
16844
|
},
|
|
@@ -16800,10 +16847,10 @@
|
|
|
16800
16847
|
"context": {
|
|
16801
16848
|
"type": "mixin",
|
|
16802
16849
|
"name": "styles",
|
|
16803
|
-
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n //
|
|
16850
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16804
16851
|
"line": {
|
|
16805
|
-
"start":
|
|
16806
|
-
"end":
|
|
16852
|
+
"start": 97,
|
|
16853
|
+
"end": 165
|
|
16807
16854
|
}
|
|
16808
16855
|
}
|
|
16809
16856
|
},
|
|
@@ -16812,10 +16859,10 @@
|
|
|
16812
16859
|
"context": {
|
|
16813
16860
|
"type": "mixin",
|
|
16814
16861
|
"name": "styles",
|
|
16815
|
-
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n //
|
|
16862
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16816
16863
|
"line": {
|
|
16817
|
-
"start":
|
|
16818
|
-
"end":
|
|
16864
|
+
"start": 97,
|
|
16865
|
+
"end": 165
|
|
16819
16866
|
}
|
|
16820
16867
|
}
|
|
16821
16868
|
},
|
|
@@ -16824,10 +16871,10 @@
|
|
|
16824
16871
|
"context": {
|
|
16825
16872
|
"type": "mixin",
|
|
16826
16873
|
"name": "styles",
|
|
16827
|
-
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n //
|
|
16874
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16828
16875
|
"line": {
|
|
16829
|
-
"start":
|
|
16830
|
-
"end":
|
|
16876
|
+
"start": 97,
|
|
16877
|
+
"end": 165
|
|
16831
16878
|
}
|
|
16832
16879
|
}
|
|
16833
16880
|
},
|
|
@@ -16836,10 +16883,10 @@
|
|
|
16836
16883
|
"context": {
|
|
16837
16884
|
"type": "mixin",
|
|
16838
16885
|
"name": "styles",
|
|
16839
|
-
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n //
|
|
16886
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16840
16887
|
"line": {
|
|
16841
|
-
"start":
|
|
16842
|
-
"end":
|
|
16888
|
+
"start": 97,
|
|
16889
|
+
"end": 165
|
|
16843
16890
|
}
|
|
16844
16891
|
}
|
|
16845
16892
|
},
|
|
@@ -16848,10 +16895,70 @@
|
|
|
16848
16895
|
"context": {
|
|
16849
16896
|
"type": "mixin",
|
|
16850
16897
|
"name": "styles",
|
|
16851
|
-
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n //
|
|
16898
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16852
16899
|
"line": {
|
|
16853
|
-
"start":
|
|
16854
|
-
"end":
|
|
16900
|
+
"start": 97,
|
|
16901
|
+
"end": 165
|
|
16902
|
+
}
|
|
16903
|
+
}
|
|
16904
|
+
},
|
|
16905
|
+
{
|
|
16906
|
+
"description": "Output badge component styles\n",
|
|
16907
|
+
"context": {
|
|
16908
|
+
"type": "mixin",
|
|
16909
|
+
"name": "styles",
|
|
16910
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16911
|
+
"line": {
|
|
16912
|
+
"start": 97,
|
|
16913
|
+
"end": 165
|
|
16914
|
+
}
|
|
16915
|
+
}
|
|
16916
|
+
},
|
|
16917
|
+
{
|
|
16918
|
+
"description": "Output badge component styles\n",
|
|
16919
|
+
"context": {
|
|
16920
|
+
"type": "mixin",
|
|
16921
|
+
"name": "styles",
|
|
16922
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16923
|
+
"line": {
|
|
16924
|
+
"start": 97,
|
|
16925
|
+
"end": 165
|
|
16926
|
+
}
|
|
16927
|
+
}
|
|
16928
|
+
},
|
|
16929
|
+
{
|
|
16930
|
+
"description": "Output badge component styles\n",
|
|
16931
|
+
"context": {
|
|
16932
|
+
"type": "mixin",
|
|
16933
|
+
"name": "styles",
|
|
16934
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16935
|
+
"line": {
|
|
16936
|
+
"start": 97,
|
|
16937
|
+
"end": 165
|
|
16938
|
+
}
|
|
16939
|
+
}
|
|
16940
|
+
},
|
|
16941
|
+
{
|
|
16942
|
+
"description": "Output badge component styles\n",
|
|
16943
|
+
"context": {
|
|
16944
|
+
"type": "mixin",
|
|
16945
|
+
"name": "styles",
|
|
16946
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16947
|
+
"line": {
|
|
16948
|
+
"start": 97,
|
|
16949
|
+
"end": 165
|
|
16950
|
+
}
|
|
16951
|
+
}
|
|
16952
|
+
},
|
|
16953
|
+
{
|
|
16954
|
+
"description": "Output badge component styles\n",
|
|
16955
|
+
"context": {
|
|
16956
|
+
"type": "mixin",
|
|
16957
|
+
"name": "styles",
|
|
16958
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16959
|
+
"line": {
|
|
16960
|
+
"start": 97,
|
|
16961
|
+
"end": 165
|
|
16855
16962
|
}
|
|
16856
16963
|
}
|
|
16857
16964
|
},
|
|
@@ -17196,34 +17303,10 @@
|
|
|
17196
17303
|
"context": {
|
|
17197
17304
|
"type": "mixin",
|
|
17198
17305
|
"name": "styles",
|
|
17199
|
-
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }
|
|
17306
|
+
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }--left {\n justify-content: flex-start;\n text-align: left;\n }\n \n @each $size, $values in button.$sizes {\n #{ $prefix }--#{$size} {\n @include button.size($size);\n }\n }\n \n @each $style, $values in button.$styles {\n #{ $prefix }--#{$style} {\n @include button.style($style);\n }\n }\n \n #{ $icon-selector } {\n \n min-width: 0;\n max-width: none;\n border-radius: button.get(\"icon-border-radius\");\n font-size: button.get(\"icon-font-size\");\n width: button.get(\"icon-size\");\n height: button.get(\"icon-size\");\n padding: 0 !important;\n\n #{ $prefix }__icon {\n transform: translateY(get(\"icon-centered-vertical-offset\"));\n margin: 0;\n }\n }\n\n @each $size, $values in button.$sizes {\n $icon-size: map.get($values, \"icon-size\");\n $icon-font-size: map.get($values, \"icon-font-size\");\n @if ($icon-size or $icon-font-size) {\n #{ $prefix }--#{$size}#{ $icon-selector } {\n width: $icon-size;\n height: $icon-size;\n font-size: $icon-font-size;\n }\n }\n }\n",
|
|
17200
17307
|
"line": {
|
|
17201
|
-
"start":
|
|
17202
|
-
"end":
|
|
17203
|
-
}
|
|
17204
|
-
}
|
|
17205
|
-
},
|
|
17206
|
-
{
|
|
17207
|
-
"description": "Output button component styles\n",
|
|
17208
|
-
"context": {
|
|
17209
|
-
"type": "mixin",
|
|
17210
|
-
"name": "styles",
|
|
17211
|
-
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }__icon {\n &:not(:first-child) { \n margin-inline-start: get(\"icon-margin\"); \n }\n &:not(:last-child) { \n margin-inline-end: get(\"icon-margin\"); \n }\n }\n \n @each $size, $values in button.$sizes {\n #{ $prefix }--#{$size} {\n @include button.size($size);\n }\n }\n \n @each $style, $values in button.$styles {\n #{ $prefix }--#{$style} {\n @include button.style($style);\n }\n }\n \n #{ $icon-selector } {\n \n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 0;\n max-width: none;\n border-radius: button.get(\"icon-border-radius\");\n font-size: button.get(\"icon-font-size\");\n width: button.get(\"icon-size\");\n height: button.get(\"icon-size\");\n padding: 0 !important;\n\n #{ $prefix }__icon {\n transform: translateY(get(\"icon-centered-vertical-offset\"));\n margin: 0;\n }\n }\n\n @each $size, $values in button.$sizes {\n $icon-size: map.get($values, \"icon-size\");\n $icon-font-size: map.get($values, \"icon-font-size\");\n @if ($icon-size or $icon-font-size) {\n #{ $prefix }--#{$size}#{ $icon-selector } {\n width: $icon-size;\n height: $icon-size;\n font-size: $icon-font-size;\n }\n }\n }\n",
|
|
17212
|
-
"line": {
|
|
17213
|
-
"start": 53,
|
|
17214
|
-
"end": 119
|
|
17215
|
-
}
|
|
17216
|
-
}
|
|
17217
|
-
},
|
|
17218
|
-
{
|
|
17219
|
-
"description": "Output button component styles\n",
|
|
17220
|
-
"context": {
|
|
17221
|
-
"type": "mixin",
|
|
17222
|
-
"name": "styles",
|
|
17223
|
-
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }__icon {\n &:not(:first-child) { \n margin-inline-start: get(\"icon-margin\"); \n }\n &:not(:last-child) { \n margin-inline-end: get(\"icon-margin\"); \n }\n }\n \n @each $size, $values in button.$sizes {\n #{ $prefix }--#{$size} {\n @include button.size($size);\n }\n }\n \n @each $style, $values in button.$styles {\n #{ $prefix }--#{$style} {\n @include button.style($style);\n }\n }\n \n #{ $icon-selector } {\n \n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 0;\n max-width: none;\n border-radius: button.get(\"icon-border-radius\");\n font-size: button.get(\"icon-font-size\");\n width: button.get(\"icon-size\");\n height: button.get(\"icon-size\");\n padding: 0 !important;\n\n #{ $prefix }__icon {\n transform: translateY(get(\"icon-centered-vertical-offset\"));\n margin: 0;\n }\n }\n\n @each $size, $values in button.$sizes {\n $icon-size: map.get($values, \"icon-size\");\n $icon-font-size: map.get($values, \"icon-font-size\");\n @if ($icon-size or $icon-font-size) {\n #{ $prefix }--#{$size}#{ $icon-selector } {\n width: $icon-size;\n height: $icon-size;\n font-size: $icon-font-size;\n }\n }\n }\n",
|
|
17224
|
-
"line": {
|
|
17225
|
-
"start": 53,
|
|
17226
|
-
"end": 119
|
|
17308
|
+
"start": 51,
|
|
17309
|
+
"end": 110
|
|
17227
17310
|
}
|
|
17228
17311
|
}
|
|
17229
17312
|
},
|
|
@@ -17232,10 +17315,10 @@
|
|
|
17232
17315
|
"context": {
|
|
17233
17316
|
"type": "mixin",
|
|
17234
17317
|
"name": "styles",
|
|
17235
|
-
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }
|
|
17318
|
+
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }--left {\n justify-content: flex-start;\n text-align: left;\n }\n \n @each $size, $values in button.$sizes {\n #{ $prefix }--#{$size} {\n @include button.size($size);\n }\n }\n \n @each $style, $values in button.$styles {\n #{ $prefix }--#{$style} {\n @include button.style($style);\n }\n }\n \n #{ $icon-selector } {\n \n min-width: 0;\n max-width: none;\n border-radius: button.get(\"icon-border-radius\");\n font-size: button.get(\"icon-font-size\");\n width: button.get(\"icon-size\");\n height: button.get(\"icon-size\");\n padding: 0 !important;\n\n #{ $prefix }__icon {\n transform: translateY(get(\"icon-centered-vertical-offset\"));\n margin: 0;\n }\n }\n\n @each $size, $values in button.$sizes {\n $icon-size: map.get($values, \"icon-size\");\n $icon-font-size: map.get($values, \"icon-font-size\");\n @if ($icon-size or $icon-font-size) {\n #{ $prefix }--#{$size}#{ $icon-selector } {\n width: $icon-size;\n height: $icon-size;\n font-size: $icon-font-size;\n }\n }\n }\n",
|
|
17236
17319
|
"line": {
|
|
17237
|
-
"start":
|
|
17238
|
-
"end":
|
|
17320
|
+
"start": 51,
|
|
17321
|
+
"end": 110
|
|
17239
17322
|
}
|
|
17240
17323
|
}
|
|
17241
17324
|
},
|
|
@@ -17244,10 +17327,10 @@
|
|
|
17244
17327
|
"context": {
|
|
17245
17328
|
"type": "mixin",
|
|
17246
17329
|
"name": "styles",
|
|
17247
|
-
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }
|
|
17330
|
+
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }--left {\n justify-content: flex-start;\n text-align: left;\n }\n \n @each $size, $values in button.$sizes {\n #{ $prefix }--#{$size} {\n @include button.size($size);\n }\n }\n \n @each $style, $values in button.$styles {\n #{ $prefix }--#{$style} {\n @include button.style($style);\n }\n }\n \n #{ $icon-selector } {\n \n min-width: 0;\n max-width: none;\n border-radius: button.get(\"icon-border-radius\");\n font-size: button.get(\"icon-font-size\");\n width: button.get(\"icon-size\");\n height: button.get(\"icon-size\");\n padding: 0 !important;\n\n #{ $prefix }__icon {\n transform: translateY(get(\"icon-centered-vertical-offset\"));\n margin: 0;\n }\n }\n\n @each $size, $values in button.$sizes {\n $icon-size: map.get($values, \"icon-size\");\n $icon-font-size: map.get($values, \"icon-font-size\");\n @if ($icon-size or $icon-font-size) {\n #{ $prefix }--#{$size}#{ $icon-selector } {\n width: $icon-size;\n height: $icon-size;\n font-size: $icon-font-size;\n }\n }\n }\n",
|
|
17248
17331
|
"line": {
|
|
17249
|
-
"start":
|
|
17250
|
-
"end":
|
|
17332
|
+
"start": 51,
|
|
17333
|
+
"end": 110
|
|
17251
17334
|
}
|
|
17252
17335
|
}
|
|
17253
17336
|
},
|
|
@@ -17256,10 +17339,10 @@
|
|
|
17256
17339
|
"context": {
|
|
17257
17340
|
"type": "mixin",
|
|
17258
17341
|
"name": "styles",
|
|
17259
|
-
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }
|
|
17342
|
+
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }--left {\n justify-content: flex-start;\n text-align: left;\n }\n \n @each $size, $values in button.$sizes {\n #{ $prefix }--#{$size} {\n @include button.size($size);\n }\n }\n \n @each $style, $values in button.$styles {\n #{ $prefix }--#{$style} {\n @include button.style($style);\n }\n }\n \n #{ $icon-selector } {\n \n min-width: 0;\n max-width: none;\n border-radius: button.get(\"icon-border-radius\");\n font-size: button.get(\"icon-font-size\");\n width: button.get(\"icon-size\");\n height: button.get(\"icon-size\");\n padding: 0 !important;\n\n #{ $prefix }__icon {\n transform: translateY(get(\"icon-centered-vertical-offset\"));\n margin: 0;\n }\n }\n\n @each $size, $values in button.$sizes {\n $icon-size: map.get($values, \"icon-size\");\n $icon-font-size: map.get($values, \"icon-font-size\");\n @if ($icon-size or $icon-font-size) {\n #{ $prefix }--#{$size}#{ $icon-selector } {\n width: $icon-size;\n height: $icon-size;\n font-size: $icon-font-size;\n }\n }\n }\n",
|
|
17260
17343
|
"line": {
|
|
17261
|
-
"start":
|
|
17262
|
-
"end":
|
|
17344
|
+
"start": 51,
|
|
17345
|
+
"end": 110
|
|
17263
17346
|
}
|
|
17264
17347
|
}
|
|
17265
17348
|
},
|
|
@@ -17268,10 +17351,10 @@
|
|
|
17268
17351
|
"context": {
|
|
17269
17352
|
"type": "mixin",
|
|
17270
17353
|
"name": "styles",
|
|
17271
|
-
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }
|
|
17354
|
+
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }--left {\n justify-content: flex-start;\n text-align: left;\n }\n \n @each $size, $values in button.$sizes {\n #{ $prefix }--#{$size} {\n @include button.size($size);\n }\n }\n \n @each $style, $values in button.$styles {\n #{ $prefix }--#{$style} {\n @include button.style($style);\n }\n }\n \n #{ $icon-selector } {\n \n min-width: 0;\n max-width: none;\n border-radius: button.get(\"icon-border-radius\");\n font-size: button.get(\"icon-font-size\");\n width: button.get(\"icon-size\");\n height: button.get(\"icon-size\");\n padding: 0 !important;\n\n #{ $prefix }__icon {\n transform: translateY(get(\"icon-centered-vertical-offset\"));\n margin: 0;\n }\n }\n\n @each $size, $values in button.$sizes {\n $icon-size: map.get($values, \"icon-size\");\n $icon-font-size: map.get($values, \"icon-font-size\");\n @if ($icon-size or $icon-font-size) {\n #{ $prefix }--#{$size}#{ $icon-selector } {\n width: $icon-size;\n height: $icon-size;\n font-size: $icon-font-size;\n }\n }\n }\n",
|
|
17272
17355
|
"line": {
|
|
17273
|
-
"start":
|
|
17274
|
-
"end":
|
|
17356
|
+
"start": 51,
|
|
17357
|
+
"end": 110
|
|
17275
17358
|
}
|
|
17276
17359
|
}
|
|
17277
17360
|
},
|
|
@@ -17280,10 +17363,10 @@
|
|
|
17280
17363
|
"context": {
|
|
17281
17364
|
"type": "mixin",
|
|
17282
17365
|
"name": "styles",
|
|
17283
|
-
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }
|
|
17366
|
+
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }--left {\n justify-content: flex-start;\n text-align: left;\n }\n \n @each $size, $values in button.$sizes {\n #{ $prefix }--#{$size} {\n @include button.size($size);\n }\n }\n \n @each $style, $values in button.$styles {\n #{ $prefix }--#{$style} {\n @include button.style($style);\n }\n }\n \n #{ $icon-selector } {\n \n min-width: 0;\n max-width: none;\n border-radius: button.get(\"icon-border-radius\");\n font-size: button.get(\"icon-font-size\");\n width: button.get(\"icon-size\");\n height: button.get(\"icon-size\");\n padding: 0 !important;\n\n #{ $prefix }__icon {\n transform: translateY(get(\"icon-centered-vertical-offset\"));\n margin: 0;\n }\n }\n\n @each $size, $values in button.$sizes {\n $icon-size: map.get($values, \"icon-size\");\n $icon-font-size: map.get($values, \"icon-font-size\");\n @if ($icon-size or $icon-font-size) {\n #{ $prefix }--#{$size}#{ $icon-selector } {\n width: $icon-size;\n height: $icon-size;\n font-size: $icon-font-size;\n }\n }\n }\n",
|
|
17284
17367
|
"line": {
|
|
17285
|
-
"start":
|
|
17286
|
-
"end":
|
|
17368
|
+
"start": 51,
|
|
17369
|
+
"end": 110
|
|
17287
17370
|
}
|
|
17288
17371
|
}
|
|
17289
17372
|
},
|
|
@@ -17292,10 +17375,10 @@
|
|
|
17292
17375
|
"context": {
|
|
17293
17376
|
"type": "mixin",
|
|
17294
17377
|
"name": "styles",
|
|
17295
|
-
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }
|
|
17378
|
+
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }--left {\n justify-content: flex-start;\n text-align: left;\n }\n \n @each $size, $values in button.$sizes {\n #{ $prefix }--#{$size} {\n @include button.size($size);\n }\n }\n \n @each $style, $values in button.$styles {\n #{ $prefix }--#{$style} {\n @include button.style($style);\n }\n }\n \n #{ $icon-selector } {\n \n min-width: 0;\n max-width: none;\n border-radius: button.get(\"icon-border-radius\");\n font-size: button.get(\"icon-font-size\");\n width: button.get(\"icon-size\");\n height: button.get(\"icon-size\");\n padding: 0 !important;\n\n #{ $prefix }__icon {\n transform: translateY(get(\"icon-centered-vertical-offset\"));\n margin: 0;\n }\n }\n\n @each $size, $values in button.$sizes {\n $icon-size: map.get($values, \"icon-size\");\n $icon-font-size: map.get($values, \"icon-font-size\");\n @if ($icon-size or $icon-font-size) {\n #{ $prefix }--#{$size}#{ $icon-selector } {\n width: $icon-size;\n height: $icon-size;\n font-size: $icon-font-size;\n }\n }\n }\n",
|
|
17296
17379
|
"line": {
|
|
17297
|
-
"start":
|
|
17298
|
-
"end":
|
|
17380
|
+
"start": 51,
|
|
17381
|
+
"end": 110
|
|
17299
17382
|
}
|
|
17300
17383
|
}
|
|
17301
17384
|
},
|
|
@@ -17304,10 +17387,10 @@
|
|
|
17304
17387
|
"context": {
|
|
17305
17388
|
"type": "mixin",
|
|
17306
17389
|
"name": "styles",
|
|
17307
|
-
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }
|
|
17390
|
+
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }--left {\n justify-content: flex-start;\n text-align: left;\n }\n \n @each $size, $values in button.$sizes {\n #{ $prefix }--#{$size} {\n @include button.size($size);\n }\n }\n \n @each $style, $values in button.$styles {\n #{ $prefix }--#{$style} {\n @include button.style($style);\n }\n }\n \n #{ $icon-selector } {\n \n min-width: 0;\n max-width: none;\n border-radius: button.get(\"icon-border-radius\");\n font-size: button.get(\"icon-font-size\");\n width: button.get(\"icon-size\");\n height: button.get(\"icon-size\");\n padding: 0 !important;\n\n #{ $prefix }__icon {\n transform: translateY(get(\"icon-centered-vertical-offset\"));\n margin: 0;\n }\n }\n\n @each $size, $values in button.$sizes {\n $icon-size: map.get($values, \"icon-size\");\n $icon-font-size: map.get($values, \"icon-font-size\");\n @if ($icon-size or $icon-font-size) {\n #{ $prefix }--#{$size}#{ $icon-selector } {\n width: $icon-size;\n height: $icon-size;\n font-size: $icon-font-size;\n }\n }\n }\n",
|
|
17308
17391
|
"line": {
|
|
17309
|
-
"start":
|
|
17310
|
-
"end":
|
|
17392
|
+
"start": 51,
|
|
17393
|
+
"end": 110
|
|
17311
17394
|
}
|
|
17312
17395
|
}
|
|
17313
17396
|
},
|
|
@@ -32306,10 +32389,10 @@
|
|
|
32306
32389
|
"context": {
|
|
32307
32390
|
"type": "mixin",
|
|
32308
32391
|
"name": "styles",
|
|
32309
|
-
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }
|
|
32392
|
+
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }--left {\n justify-content: flex-start;\n text-align: left;\n }\n \n @each $size, $values in button.$sizes {\n #{ $prefix }--#{$size} {\n @include button.size($size);\n }\n }\n \n @each $style, $values in button.$styles {\n #{ $prefix }--#{$style} {\n @include button.style($style);\n }\n }\n \n #{ $icon-selector } {\n \n min-width: 0;\n max-width: none;\n border-radius: button.get(\"icon-border-radius\");\n font-size: button.get(\"icon-font-size\");\n width: button.get(\"icon-size\");\n height: button.get(\"icon-size\");\n padding: 0 !important;\n\n #{ $prefix }__icon {\n transform: translateY(get(\"icon-centered-vertical-offset\"));\n margin: 0;\n }\n }\n\n @each $size, $values in button.$sizes {\n $icon-size: map.get($values, \"icon-size\");\n $icon-font-size: map.get($values, \"icon-font-size\");\n @if ($icon-size or $icon-font-size) {\n #{ $prefix }--#{$size}#{ $icon-selector } {\n width: $icon-size;\n height: $icon-size;\n font-size: $icon-font-size;\n }\n }\n }\n",
|
|
32310
32393
|
"line": {
|
|
32311
|
-
"start":
|
|
32312
|
-
"end":
|
|
32394
|
+
"start": 51,
|
|
32395
|
+
"end": 110
|
|
32313
32396
|
}
|
|
32314
32397
|
}
|
|
32315
32398
|
},
|
|
@@ -32318,10 +32401,10 @@
|
|
|
32318
32401
|
"context": {
|
|
32319
32402
|
"type": "mixin",
|
|
32320
32403
|
"name": "styles",
|
|
32321
|
-
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }
|
|
32404
|
+
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }--left {\n justify-content: flex-start;\n text-align: left;\n }\n \n @each $size, $values in button.$sizes {\n #{ $prefix }--#{$size} {\n @include button.size($size);\n }\n }\n \n @each $style, $values in button.$styles {\n #{ $prefix }--#{$style} {\n @include button.style($style);\n }\n }\n \n #{ $icon-selector } {\n \n min-width: 0;\n max-width: none;\n border-radius: button.get(\"icon-border-radius\");\n font-size: button.get(\"icon-font-size\");\n width: button.get(\"icon-size\");\n height: button.get(\"icon-size\");\n padding: 0 !important;\n\n #{ $prefix }__icon {\n transform: translateY(get(\"icon-centered-vertical-offset\"));\n margin: 0;\n }\n }\n\n @each $size, $values in button.$sizes {\n $icon-size: map.get($values, \"icon-size\");\n $icon-font-size: map.get($values, \"icon-font-size\");\n @if ($icon-size or $icon-font-size) {\n #{ $prefix }--#{$size}#{ $icon-selector } {\n width: $icon-size;\n height: $icon-size;\n font-size: $icon-font-size;\n }\n }\n }\n",
|
|
32322
32405
|
"line": {
|
|
32323
|
-
"start":
|
|
32324
|
-
"end":
|
|
32406
|
+
"start": 51,
|
|
32407
|
+
"end": 110
|
|
32325
32408
|
}
|
|
32326
32409
|
}
|
|
32327
32410
|
},
|
|
@@ -32669,26 +32752,32 @@
|
|
|
32669
32752
|
"description": "Module Settings\n",
|
|
32670
32753
|
"commentRange": {
|
|
32671
32754
|
"start": 21,
|
|
32672
|
-
"end":
|
|
32755
|
+
"end": 35
|
|
32673
32756
|
},
|
|
32674
32757
|
"context": {
|
|
32675
32758
|
"type": "variable",
|
|
32676
32759
|
"name": "config",
|
|
32677
|
-
"value": "(\n \"background-color\":
|
|
32760
|
+
"value": "(\n \"background-color\": rgb(205, 205, 205),\n \"background-color-hover\": null,\n \"border-radius\": 50%,\n \"color\": black,\n \"color-hover\": null,\n \"box-shadow\" : null,\n \"box-shadow-hover\" : null,\n \"font-size\": 1.5rem,\n \"font-weight\": bold,\n \"font-family\": true,\n \"width\": 7rem,\n \"hover-scale\": 1.2,\n \"sizes\" : (\n \"small\" : (\n \"font-size\" : 1.2rem,\n \"width\" : 4rem\n ),\n \"large\" : (\n \"font-size\" : 2.75rem,\n \"width\" : 9rem\n )\n )\n)",
|
|
32678
32761
|
"scope": "default",
|
|
32679
32762
|
"line": {
|
|
32680
|
-
"start":
|
|
32681
|
-
"end":
|
|
32763
|
+
"start": 37,
|
|
32764
|
+
"end": 60
|
|
32682
32765
|
}
|
|
32683
32766
|
},
|
|
32684
32767
|
"type": "Map",
|
|
32685
32768
|
"property": [
|
|
32686
32769
|
{
|
|
32687
|
-
"type": "
|
|
32770
|
+
"type": "Color",
|
|
32688
32771
|
"name": "background-color",
|
|
32689
32772
|
"default": "gray",
|
|
32690
32773
|
"description": "Background color (if no image)"
|
|
32691
32774
|
},
|
|
32775
|
+
{
|
|
32776
|
+
"type": "Color",
|
|
32777
|
+
"name": "background-color-hover",
|
|
32778
|
+
"default": "null",
|
|
32779
|
+
"description": "Optional background color for hover when using badge--clickable modifier"
|
|
32780
|
+
},
|
|
32692
32781
|
{
|
|
32693
32782
|
"type": "Number",
|
|
32694
32783
|
"name": "border-radius",
|
|
@@ -32696,11 +32785,29 @@
|
|
|
32696
32785
|
"description": "Border radius of badge"
|
|
32697
32786
|
},
|
|
32698
32787
|
{
|
|
32699
|
-
"type": "
|
|
32788
|
+
"type": "Color",
|
|
32700
32789
|
"name": "color",
|
|
32701
32790
|
"default": "black",
|
|
32702
32791
|
"description": "Type color"
|
|
32703
32792
|
},
|
|
32793
|
+
{
|
|
32794
|
+
"type": "Color",
|
|
32795
|
+
"name": "color-hover",
|
|
32796
|
+
"default": "null",
|
|
32797
|
+
"description": "Optional color for hover when using badge--clickable modifier"
|
|
32798
|
+
},
|
|
32799
|
+
{
|
|
32800
|
+
"type": "CssValue",
|
|
32801
|
+
"name": "box-shadow",
|
|
32802
|
+
"default": "null",
|
|
32803
|
+
"description": "Optional box-shadow"
|
|
32804
|
+
},
|
|
32805
|
+
{
|
|
32806
|
+
"type": "CssValue",
|
|
32807
|
+
"name": "box-shadow-hover",
|
|
32808
|
+
"default": "null",
|
|
32809
|
+
"description": "Optional box-shadow for hover when using badge--clickable modifier"
|
|
32810
|
+
},
|
|
32704
32811
|
{
|
|
32705
32812
|
"type": "Number",
|
|
32706
32813
|
"name": "font-size",
|
|
@@ -32708,13 +32815,13 @@
|
|
|
32708
32815
|
"description": "Font size (basic ie. 1.3rem) for badge"
|
|
32709
32816
|
},
|
|
32710
32817
|
{
|
|
32711
|
-
"type": "
|
|
32818
|
+
"type": "Keyword",
|
|
32712
32819
|
"name": "font-weight",
|
|
32713
32820
|
"default": "bold",
|
|
32714
32821
|
"description": "Font weight"
|
|
32715
32822
|
},
|
|
32716
32823
|
{
|
|
32717
|
-
"type": "
|
|
32824
|
+
"type": "String",
|
|
32718
32825
|
"name": "font-family",
|
|
32719
32826
|
"default": "true",
|
|
32720
32827
|
"description": "Specify font family, defaults to typography font-family-sans"
|
|
@@ -32754,16 +32861,16 @@
|
|
|
32754
32861
|
"path": "/sass/components/badge/#mixin-set",
|
|
32755
32862
|
"description": "Change modules $config\n",
|
|
32756
32863
|
"commentRange": {
|
|
32757
|
-
"start":
|
|
32758
|
-
"end":
|
|
32864
|
+
"start": 62,
|
|
32865
|
+
"end": 65
|
|
32759
32866
|
},
|
|
32760
32867
|
"context": {
|
|
32761
32868
|
"type": "mixin",
|
|
32762
32869
|
"name": "set",
|
|
32763
32870
|
"code": "\n $config: map.merge($config, $changes) !global;\n",
|
|
32764
32871
|
"line": {
|
|
32765
|
-
"start":
|
|
32766
|
-
"end":
|
|
32872
|
+
"start": 67,
|
|
32873
|
+
"end": 69
|
|
32767
32874
|
}
|
|
32768
32875
|
},
|
|
32769
32876
|
"parameter": [
|
|
@@ -32805,16 +32912,16 @@
|
|
|
32805
32912
|
"path": "/sass/components/badge/#function-get",
|
|
32806
32913
|
"description": "Get a config option\n",
|
|
32807
32914
|
"commentRange": {
|
|
32808
|
-
"start":
|
|
32809
|
-
"end":
|
|
32915
|
+
"start": 71,
|
|
32916
|
+
"end": 74
|
|
32810
32917
|
},
|
|
32811
32918
|
"context": {
|
|
32812
32919
|
"type": "function",
|
|
32813
32920
|
"name": "get",
|
|
32814
32921
|
"code": "\n $value: utils.require-map-get($config, $name, \"badge [config]\");\n @return utils.function-fallback($name, $value, $-fallbacks);\n",
|
|
32815
32922
|
"line": {
|
|
32816
|
-
"start":
|
|
32817
|
-
"end":
|
|
32923
|
+
"start": 76,
|
|
32924
|
+
"end": 79
|
|
32818
32925
|
}
|
|
32819
32926
|
},
|
|
32820
32927
|
"parameter": [
|
|
@@ -32852,16 +32959,16 @@
|
|
|
32852
32959
|
"path": "/sass/components/badge/#mixin-styles",
|
|
32853
32960
|
"description": "Output badge component styles\n",
|
|
32854
32961
|
"commentRange": {
|
|
32855
|
-
"start":
|
|
32856
|
-
"end":
|
|
32962
|
+
"start": 81,
|
|
32963
|
+
"end": 95
|
|
32857
32964
|
},
|
|
32858
32965
|
"context": {
|
|
32859
32966
|
"type": "mixin",
|
|
32860
32967
|
"name": "styles",
|
|
32861
|
-
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n //
|
|
32968
|
+
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform 100ms ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
32862
32969
|
"line": {
|
|
32863
|
-
"start":
|
|
32864
|
-
"end":
|
|
32970
|
+
"start": 97,
|
|
32971
|
+
"end": 165
|
|
32865
32972
|
}
|
|
32866
32973
|
},
|
|
32867
32974
|
"example": [
|
|
@@ -32937,6 +33044,30 @@
|
|
|
32937
33044
|
"type": "function",
|
|
32938
33045
|
"name": "get"
|
|
32939
33046
|
},
|
|
33047
|
+
{
|
|
33048
|
+
"type": "function",
|
|
33049
|
+
"name": "get"
|
|
33050
|
+
},
|
|
33051
|
+
{
|
|
33052
|
+
"type": "function",
|
|
33053
|
+
"name": "get"
|
|
33054
|
+
},
|
|
33055
|
+
{
|
|
33056
|
+
"type": "function",
|
|
33057
|
+
"name": "get"
|
|
33058
|
+
},
|
|
33059
|
+
{
|
|
33060
|
+
"type": "function",
|
|
33061
|
+
"name": "get"
|
|
33062
|
+
},
|
|
33063
|
+
{
|
|
33064
|
+
"type": "function",
|
|
33065
|
+
"name": "get"
|
|
33066
|
+
},
|
|
33067
|
+
{
|
|
33068
|
+
"type": "function",
|
|
33069
|
+
"name": "get"
|
|
33070
|
+
},
|
|
32940
33071
|
{
|
|
32941
33072
|
"type": "function",
|
|
32942
33073
|
"name": "get"
|
|
@@ -33665,16 +33796,16 @@
|
|
|
33665
33796
|
"description": "Module Settings\n",
|
|
33666
33797
|
"commentRange": {
|
|
33667
33798
|
"start": 21,
|
|
33668
|
-
"end":
|
|
33799
|
+
"end": 54
|
|
33669
33800
|
},
|
|
33670
33801
|
"context": {
|
|
33671
33802
|
"type": "variable",
|
|
33672
33803
|
"name": "config",
|
|
33673
|
-
"value": "(\n \"active-selector\": \"&.is-active\",\n \"box-shadow\": true,\n \"line-height\": 1.1,\n \"letter-spacing\": 0.02em,\n \"margin\": (0.45em 0.5em 0.45em 0),\n \"min-width\": 9rem,\n \"padding\": (0.75em 1.5em),\n \"white-space\": nowrap,\n \"border-color\": \"control-border\",\n \"border-color-active\": \"control-border-active\",\n \"border-color-hover\": \"control-border-hover\",\n \"border-radius\": 2rem,\n \"border-width\": 1px,\n \"background-color\": \"control-background\",\n \"background-color-hover\": \"control-background-hover\",\n \"background-color-active\": \"control-background-active\",\n \"color\": \"control\",\n \"color-hover\": \"control-hover\",\n \"color-active\": \"control-active\",\n \"font-family\": inherit,\n \"font-weight\": bold,\n \"font-size\": \"base\",\n \"icon-size\": 2.5rem,\n \"icon-font-size\": 1.38rem,\n \"icon-border-radius\": 50%,\n \"text-shadow\": none,\n \"text-transform\": none,\n \"text-decoration\": none,\n \"transition-enabled\": true,\n \"transition-duration\": 200ms,\n \"transition-properties\": (border-color, background-color, color, box-shadow),\n \"
|
|
33804
|
+
"value": "(\n \"active-selector\": \"&.is-active\",\n \"box-shadow\": true,\n \"line-height\": 1.1,\n \"letter-spacing\": 0.02em,\n \"margin\": (0.45em 0.5em 0.45em 0),\n \"min-width\": 9rem,\n \"padding\": (0.75em 1.5em),\n \"white-space\": nowrap,\n \"border-color\": \"control-border\",\n \"border-color-active\": \"control-border-active\",\n \"border-color-hover\": \"control-border-hover\",\n \"border-radius\": 2rem,\n \"border-width\": 1px,\n \"background-color\": \"control-background\",\n \"background-color-hover\": \"control-background-hover\",\n \"background-color-active\": \"control-background-active\",\n \"color\": \"control\",\n \"color-hover\": \"control-hover\",\n \"color-active\": \"control-active\",\n \"font-family\": inherit,\n \"font-weight\": bold,\n \"font-size\": \"base\",\n \"icon-size\": 2.5rem,\n \"icon-font-size\": 1.38rem,\n \"icon-border-radius\": 50%,\n \"text-shadow\": none,\n \"text-transform\": none,\n \"text-decoration\": none,\n \"transition-enabled\": true,\n \"transition-duration\": 200ms,\n \"transition-properties\": (border-color, background-color, color, box-shadow),\n \"gap\": 0.5em,\n)",
|
|
33674
33805
|
"scope": "default",
|
|
33675
33806
|
"line": {
|
|
33676
|
-
"start":
|
|
33677
|
-
"end":
|
|
33807
|
+
"start": 56,
|
|
33808
|
+
"end": 89
|
|
33678
33809
|
}
|
|
33679
33810
|
},
|
|
33680
33811
|
"type": "Map",
|
|
@@ -33726,6 +33857,12 @@
|
|
|
33726
33857
|
"default": "nowrap",
|
|
33727
33858
|
"description": "Adjust button line wrapping, by default line's are not wrapped"
|
|
33728
33859
|
},
|
|
33860
|
+
{
|
|
33861
|
+
"type": "Dimension",
|
|
33862
|
+
"name": "gap",
|
|
33863
|
+
"default": "0.5em",
|
|
33864
|
+
"description": "Gap to use between items within the button"
|
|
33865
|
+
},
|
|
33729
33866
|
{
|
|
33730
33867
|
"type": "String",
|
|
33731
33868
|
"name": "border-color",
|
|
@@ -33881,8 +34018,8 @@
|
|
|
33881
34018
|
"path": "/sass/core/button/#variable-sizes",
|
|
33882
34019
|
"description": "Button sizes\n- A map that holds to the sizes for buttons in the theme\n- Use set-sizes() to adjust the sizes for the theme\n- Don't edit sizes variable directly\n",
|
|
33883
34020
|
"commentRange": {
|
|
33884
|
-
"start":
|
|
33885
|
-
"end":
|
|
34021
|
+
"start": 91,
|
|
34022
|
+
"end": 95
|
|
33886
34023
|
},
|
|
33887
34024
|
"context": {
|
|
33888
34025
|
"type": "variable",
|
|
@@ -33890,8 +34027,8 @@
|
|
|
33890
34027
|
"value": "(\n \"small\" : (\n \"padding\": (0.35em 1em),\n \"min-width\": 0,\n \"icon-size\": 2rem,\n \"icon-font-size\": 1rem\n ),\n \"large\" : (\n \"padding\": (1em 2em),\n \"min-width\": 11rem,\n \"icon-size\": 3.5rem\n )\n)",
|
|
33891
34028
|
"scope": "default",
|
|
33892
34029
|
"line": {
|
|
33893
|
-
"start":
|
|
33894
|
-
"end":
|
|
34030
|
+
"start": 96,
|
|
34031
|
+
"end": 109
|
|
33895
34032
|
}
|
|
33896
34033
|
},
|
|
33897
34034
|
"type": "Map",
|
|
@@ -33911,8 +34048,8 @@
|
|
|
33911
34048
|
"path": "/sass/core/button/#variable-styles",
|
|
33912
34049
|
"description": "Button styles\n- A map of styles for each button in the theme. Us set-styles() to overwrite or merge into these styles\n- Don't edit styles variable directly\n",
|
|
33913
34050
|
"commentRange": {
|
|
33914
|
-
"start":
|
|
33915
|
-
"end":
|
|
34051
|
+
"start": 111,
|
|
34052
|
+
"end": 114
|
|
33916
34053
|
},
|
|
33917
34054
|
"context": {
|
|
33918
34055
|
"type": "variable",
|
|
@@ -33920,8 +34057,8 @@
|
|
|
33920
34057
|
"value": "(\n \"transparent\" : (\n \"background-color\" : transparent,\n \"color\" : \"type\",\n \"border-color\" : transparent,\n \"box-shadow\" : none,\n \"hover\" : (\n \"background-color\" : \"control-background\",\n \"color\" : \"control\",\n \"border-color\" : \"control-border\",\n )\n ),\n \"outline\" : (\n \"background-color\" : transparent,\n \"color\" : \"type\",\n \"border-color\" : \"rule-light\",\n \"box-shadow\" : none,\n \"hover\" : (\n \"background-color\" : \"control-background\",\n \"color\" : \"control\",\n \"border-color\" : \"control-border\",\n )\n ),\n)",
|
|
33921
34058
|
"scope": "default",
|
|
33922
34059
|
"line": {
|
|
33923
|
-
"start":
|
|
33924
|
-
"end":
|
|
34060
|
+
"start": 116,
|
|
34061
|
+
"end": 139
|
|
33925
34062
|
}
|
|
33926
34063
|
},
|
|
33927
34064
|
"type": "Map",
|
|
@@ -33941,8 +34078,8 @@
|
|
|
33941
34078
|
"name": "set-styles",
|
|
33942
34079
|
"code": "\n $styles: utils.map-merge($styles, $changes, $merge-mode) !global;\n",
|
|
33943
34080
|
"line": {
|
|
33944
|
-
"start":
|
|
33945
|
-
"end":
|
|
34081
|
+
"start": 166,
|
|
34082
|
+
"end": 168
|
|
33946
34083
|
}
|
|
33947
34084
|
}
|
|
33948
34085
|
},
|
|
@@ -33953,8 +34090,8 @@
|
|
|
33953
34090
|
"name": "set-styles",
|
|
33954
34091
|
"code": "\n $styles: utils.map-merge($styles, $changes, $merge-mode) !global;\n",
|
|
33955
34092
|
"line": {
|
|
33956
|
-
"start":
|
|
33957
|
-
"end":
|
|
34093
|
+
"start": 166,
|
|
34094
|
+
"end": 168
|
|
33958
34095
|
}
|
|
33959
34096
|
}
|
|
33960
34097
|
},
|
|
@@ -33965,8 +34102,8 @@
|
|
|
33965
34102
|
"name": "get-style-value",
|
|
33966
34103
|
"code": "\n $style: utils.require-map-get($styles, $name, 'button [color value]');\n $state-style: ();\n // If a specific state [hover, active] grab that map\n @if ($state) {\n $state-style: map.get($style, $state);\n $state-style: utils.when($state-style, $state-style, ());\n }\n // From is the map to grab styles from\n $from: utils.when($state, $state-style, $style);\n $value: map.get($from, $prop);\n\n // Fallback to parent (if hover)\n @if ($state == \"hover\") {\n $value: utils.when($value, $value, map.get($style, $prop)); \n }\n\n @if (meta.type-of($value) == \"string\" and string.index($prop, \"color\")) {\n @return color.get($value);\n } @else {\n @return $value;\n }\n",
|
|
33967
34104
|
"line": {
|
|
33968
|
-
"start":
|
|
33969
|
-
"end":
|
|
34105
|
+
"start": 297,
|
|
34106
|
+
"end": 319
|
|
33970
34107
|
}
|
|
33971
34108
|
}
|
|
33972
34109
|
}
|
|
@@ -33979,16 +34116,16 @@
|
|
|
33979
34116
|
"path": "/sass/core/button/#mixin-set",
|
|
33980
34117
|
"description": "Change modules $config\n",
|
|
33981
34118
|
"commentRange": {
|
|
33982
|
-
"start":
|
|
33983
|
-
"end":
|
|
34119
|
+
"start": 141,
|
|
34120
|
+
"end": 144
|
|
33984
34121
|
},
|
|
33985
34122
|
"context": {
|
|
33986
34123
|
"type": "mixin",
|
|
33987
34124
|
"name": "set",
|
|
33988
34125
|
"code": "\n $config: map.merge($config, $changes) !global;\n",
|
|
33989
34126
|
"line": {
|
|
33990
|
-
"start":
|
|
33991
|
-
"end":
|
|
34127
|
+
"start": 146,
|
|
34128
|
+
"end": 148
|
|
33992
34129
|
}
|
|
33993
34130
|
},
|
|
33994
34131
|
"parameter": [
|
|
@@ -34031,16 +34168,16 @@
|
|
|
34031
34168
|
"path": "/sass/core/button/#function-get",
|
|
34032
34169
|
"description": "Get a config option\n",
|
|
34033
34170
|
"commentRange": {
|
|
34034
|
-
"start":
|
|
34035
|
-
"end":
|
|
34171
|
+
"start": 150,
|
|
34172
|
+
"end": 154
|
|
34036
34173
|
},
|
|
34037
34174
|
"context": {
|
|
34038
34175
|
"type": "function",
|
|
34039
34176
|
"name": "get",
|
|
34040
34177
|
"code": "\n $value: utils.require-map-get($config, $name, \"button [config]\");\n @return utils.function-fallback($name, $value, $-fallbacks);\n",
|
|
34041
34178
|
"line": {
|
|
34042
|
-
"start":
|
|
34043
|
-
"end":
|
|
34179
|
+
"start": 156,
|
|
34180
|
+
"end": 159
|
|
34044
34181
|
}
|
|
34045
34182
|
},
|
|
34046
34183
|
"parameter": [
|
|
@@ -34091,16 +34228,16 @@
|
|
|
34091
34228
|
"path": "/sass/core/button/#mixin-set-styles",
|
|
34092
34229
|
"description": "Set button styles \n- See $styles for example of structure of map\n",
|
|
34093
34230
|
"commentRange": {
|
|
34094
|
-
"start":
|
|
34095
|
-
"end":
|
|
34231
|
+
"start": 161,
|
|
34232
|
+
"end": 164
|
|
34096
34233
|
},
|
|
34097
34234
|
"context": {
|
|
34098
34235
|
"type": "mixin",
|
|
34099
34236
|
"name": "set-styles",
|
|
34100
34237
|
"code": "\n $styles: utils.map-merge($styles, $changes, $merge-mode) !global;\n",
|
|
34101
34238
|
"line": {
|
|
34102
|
-
"start":
|
|
34103
|
-
"end":
|
|
34239
|
+
"start": 166,
|
|
34240
|
+
"end": 168
|
|
34104
34241
|
}
|
|
34105
34242
|
},
|
|
34106
34243
|
"parameter": [
|
|
@@ -34145,16 +34282,16 @@
|
|
|
34145
34282
|
"path": "/sass/core/button/#mixin-set-sizes",
|
|
34146
34283
|
"description": "Set Button Sizes\n- See $sizes for example of structure of map\n",
|
|
34147
34284
|
"commentRange": {
|
|
34148
|
-
"start":
|
|
34149
|
-
"end":
|
|
34285
|
+
"start": 170,
|
|
34286
|
+
"end": 173
|
|
34150
34287
|
},
|
|
34151
34288
|
"context": {
|
|
34152
34289
|
"type": "mixin",
|
|
34153
34290
|
"name": "set-sizes",
|
|
34154
34291
|
"code": "\n $sizes: utils.map-merge($sizes, $changes, $merge-mode) !global;\n",
|
|
34155
34292
|
"line": {
|
|
34156
|
-
"start":
|
|
34157
|
-
"end":
|
|
34293
|
+
"start": 175,
|
|
34294
|
+
"end": 177
|
|
34158
34295
|
}
|
|
34159
34296
|
},
|
|
34160
34297
|
"parameter": [
|
|
@@ -34199,16 +34336,16 @@
|
|
|
34199
34336
|
"path": "/sass/core/button/#mixin-reset",
|
|
34200
34337
|
"description": "Reset CSS for button (to change browser defaults for button styling)\n",
|
|
34201
34338
|
"commentRange": {
|
|
34202
|
-
"start":
|
|
34203
|
-
"end":
|
|
34339
|
+
"start": 179,
|
|
34340
|
+
"end": 179
|
|
34204
34341
|
},
|
|
34205
34342
|
"context": {
|
|
34206
34343
|
"type": "mixin",
|
|
34207
34344
|
"name": "reset",
|
|
34208
34345
|
"code": "\n text-transform: none;\n text-align: inherit;\n background-color: transparent;\n border: transparent;\n border-radius: 0;\n margin: 0;\n padding: 0;\n appearance: none; \n color: inherit; \n cursor: pointer;\n",
|
|
34209
34346
|
"line": {
|
|
34210
|
-
"start":
|
|
34211
|
-
"end":
|
|
34347
|
+
"start": 181,
|
|
34348
|
+
"end": 192
|
|
34212
34349
|
}
|
|
34213
34350
|
},
|
|
34214
34351
|
"group": [
|
|
@@ -34225,10 +34362,10 @@
|
|
|
34225
34362
|
"context": {
|
|
34226
34363
|
"type": "mixin",
|
|
34227
34364
|
"name": "default",
|
|
34228
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
34365
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
34229
34366
|
"line": {
|
|
34230
|
-
"start":
|
|
34231
|
-
"end":
|
|
34367
|
+
"start": 197,
|
|
34368
|
+
"end": 256
|
|
34232
34369
|
}
|
|
34233
34370
|
}
|
|
34234
34371
|
}
|
|
@@ -34241,16 +34378,16 @@
|
|
|
34241
34378
|
"path": "/sass/core/button/#mixin-default",
|
|
34242
34379
|
"description": "Output the default button styles\n",
|
|
34243
34380
|
"commentRange": {
|
|
34244
|
-
"start":
|
|
34245
|
-
"end":
|
|
34381
|
+
"start": 194,
|
|
34382
|
+
"end": 195
|
|
34246
34383
|
},
|
|
34247
34384
|
"context": {
|
|
34248
34385
|
"type": "mixin",
|
|
34249
34386
|
"name": "default",
|
|
34250
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
34387
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
34251
34388
|
"line": {
|
|
34252
|
-
"start":
|
|
34253
|
-
"end":
|
|
34389
|
+
"start": 197,
|
|
34390
|
+
"end": 256
|
|
34254
34391
|
}
|
|
34255
34392
|
},
|
|
34256
34393
|
"parameter": [
|
|
@@ -34418,6 +34555,10 @@
|
|
|
34418
34555
|
"type": "function",
|
|
34419
34556
|
"name": "get"
|
|
34420
34557
|
},
|
|
34558
|
+
{
|
|
34559
|
+
"type": "function",
|
|
34560
|
+
"name": "get"
|
|
34561
|
+
},
|
|
34421
34562
|
{
|
|
34422
34563
|
"type": "function",
|
|
34423
34564
|
"name": "get"
|
|
@@ -34435,16 +34576,16 @@
|
|
|
34435
34576
|
"path": "/sass/core/button/#mixin-when-active",
|
|
34436
34577
|
"description": "Mixin to wrap in active selectors\n- Use to match the button's active selector\n",
|
|
34437
34578
|
"commentRange": {
|
|
34438
|
-
"start":
|
|
34439
|
-
"end":
|
|
34579
|
+
"start": 258,
|
|
34580
|
+
"end": 266
|
|
34440
34581
|
},
|
|
34441
34582
|
"context": {
|
|
34442
34583
|
"type": "mixin",
|
|
34443
34584
|
"name": "when-active",
|
|
34444
34585
|
"code": "\n #{ get(\"active-selector\") } {\n @content;\n }\n",
|
|
34445
34586
|
"line": {
|
|
34446
|
-
"start":
|
|
34447
|
-
"end":
|
|
34587
|
+
"start": 268,
|
|
34588
|
+
"end": 272
|
|
34448
34589
|
}
|
|
34449
34590
|
},
|
|
34450
34591
|
"example": [
|
|
@@ -34474,10 +34615,10 @@
|
|
|
34474
34615
|
"context": {
|
|
34475
34616
|
"type": "mixin",
|
|
34476
34617
|
"name": "default",
|
|
34477
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
34618
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
34478
34619
|
"line": {
|
|
34479
|
-
"start":
|
|
34480
|
-
"end":
|
|
34620
|
+
"start": 197,
|
|
34621
|
+
"end": 256
|
|
34481
34622
|
}
|
|
34482
34623
|
}
|
|
34483
34624
|
},
|
|
@@ -34488,8 +34629,8 @@
|
|
|
34488
34629
|
"name": "style",
|
|
34489
34630
|
"code": "\n @if ($no-visited) {\n @include style-styles($name);\n } @else {\n &,\n &:visited {\n @include style-styles($name);\n }\n }\n &:hover,\n &:focus {\n @include style-styles-hover($name);\n }\n @include when-active() {\n @include style-styles-active($name);\n }\n",
|
|
34490
34631
|
"line": {
|
|
34491
|
-
"start":
|
|
34492
|
-
"end":
|
|
34632
|
+
"start": 375,
|
|
34633
|
+
"end": 391
|
|
34493
34634
|
}
|
|
34494
34635
|
}
|
|
34495
34636
|
}
|
|
@@ -34502,16 +34643,16 @@
|
|
|
34502
34643
|
"path": "/sass/core/button/#mixin-size",
|
|
34503
34644
|
"description": "Print button size styles for a specific size\n",
|
|
34504
34645
|
"commentRange": {
|
|
34505
|
-
"start":
|
|
34506
|
-
"end":
|
|
34646
|
+
"start": 274,
|
|
34647
|
+
"end": 277
|
|
34507
34648
|
},
|
|
34508
34649
|
"context": {
|
|
34509
34650
|
"type": "mixin",
|
|
34510
34651
|
"name": "size",
|
|
34511
34652
|
"code": "\n $size: utils.require-map-get($sizes, $name, 'button [size]');\n $font-size: map.get($size, \"font-size\");\n padding: map.get($size, \"padding\");\n border-radius: map.get($size, \"border-radius\");\n border-width: map.get($size, \"border-width\");\n min-width: map.get($size, \"min-width\");\n @if $font-size {\n @include typography.size($font-size);\n }\n",
|
|
34512
34653
|
"line": {
|
|
34513
|
-
"start":
|
|
34514
|
-
"end":
|
|
34654
|
+
"start": 279,
|
|
34655
|
+
"end": 289
|
|
34515
34656
|
}
|
|
34516
34657
|
},
|
|
34517
34658
|
"parameter": [
|
|
@@ -34614,16 +34755,16 @@
|
|
|
34614
34755
|
"path": "/sass/core/button/#function-get-style-value",
|
|
34615
34756
|
"description": "Get a value from a button style\n",
|
|
34616
34757
|
"commentRange": {
|
|
34617
|
-
"start":
|
|
34618
|
-
"end":
|
|
34758
|
+
"start": 291,
|
|
34759
|
+
"end": 295
|
|
34619
34760
|
},
|
|
34620
34761
|
"context": {
|
|
34621
34762
|
"type": "function",
|
|
34622
34763
|
"name": "get-style-value",
|
|
34623
34764
|
"code": "\n $style: utils.require-map-get($styles, $name, 'button [color value]');\n $state-style: ();\n // If a specific state [hover, active] grab that map\n @if ($state) {\n $state-style: map.get($style, $state);\n $state-style: utils.when($state-style, $state-style, ());\n }\n // From is the map to grab styles from\n $from: utils.when($state, $state-style, $style);\n $value: map.get($from, $prop);\n\n // Fallback to parent (if hover)\n @if ($state == \"hover\") {\n $value: utils.when($value, $value, map.get($style, $prop)); \n }\n\n @if (meta.type-of($value) == \"string\" and string.index($prop, \"color\")) {\n @return color.get($value);\n } @else {\n @return $value;\n }\n",
|
|
34624
34765
|
"line": {
|
|
34625
|
-
"start":
|
|
34626
|
-
"end":
|
|
34766
|
+
"start": 297,
|
|
34767
|
+
"end": 319
|
|
34627
34768
|
}
|
|
34628
34769
|
},
|
|
34629
34770
|
"parameter": [
|
|
@@ -34642,8 +34783,8 @@
|
|
|
34642
34783
|
"value": "(\n \"transparent\" : (\n \"background-color\" : transparent,\n \"color\" : \"type\",\n \"border-color\" : transparent,\n \"box-shadow\" : none,\n \"hover\" : (\n \"background-color\" : \"control-background\",\n \"color\" : \"control\",\n \"border-color\" : \"control-border\",\n )\n ),\n \"outline\" : (\n \"background-color\" : transparent,\n \"color\" : \"type\",\n \"border-color\" : \"rule-light\",\n \"box-shadow\" : none,\n \"hover\" : (\n \"background-color\" : \"control-background\",\n \"color\" : \"control\",\n \"border-color\" : \"control-border\",\n )\n ),\n)",
|
|
34643
34784
|
"scope": "default",
|
|
34644
34785
|
"line": {
|
|
34645
|
-
"start":
|
|
34646
|
-
"end":
|
|
34786
|
+
"start": 116,
|
|
34787
|
+
"end": 139
|
|
34647
34788
|
}
|
|
34648
34789
|
},
|
|
34649
34790
|
"group": [
|
|
@@ -34657,8 +34798,8 @@
|
|
|
34657
34798
|
"name": "set-styles",
|
|
34658
34799
|
"code": "\n $styles: utils.map-merge($styles, $changes, $merge-mode) !global;\n",
|
|
34659
34800
|
"line": {
|
|
34660
|
-
"start":
|
|
34661
|
-
"end":
|
|
34801
|
+
"start": 166,
|
|
34802
|
+
"end": 168
|
|
34662
34803
|
}
|
|
34663
34804
|
},
|
|
34664
34805
|
"group": [
|
|
@@ -34724,8 +34865,8 @@
|
|
|
34724
34865
|
"name": "style-styles",
|
|
34725
34866
|
"code": "\n background-color: get-style-value($name, \"background-color\");\n color: get-style-value($name, \"color\");\n border-color: get-style-value($name, \"border-color\");\n border-width: get-style-value($name, \"border-width\");\n box-shadow: get-style-value($name, \"box-shadow\");\n text-decoration: get-style-value($name, \"text-decoration\");\n font-weight: get-style-value($name, \"font-weight\");\n @if get-style-value($name, \"transition-duration\") {\n transition-duration: get-style-value($name, \"transition-duration\");\n }\n",
|
|
34726
34867
|
"line": {
|
|
34727
|
-
"start":
|
|
34728
|
-
"end":
|
|
34868
|
+
"start": 328,
|
|
34869
|
+
"end": 339
|
|
34729
34870
|
}
|
|
34730
34871
|
}
|
|
34731
34872
|
},
|
|
@@ -34736,8 +34877,8 @@
|
|
|
34736
34877
|
"name": "style-styles",
|
|
34737
34878
|
"code": "\n background-color: get-style-value($name, \"background-color\");\n color: get-style-value($name, \"color\");\n border-color: get-style-value($name, \"border-color\");\n border-width: get-style-value($name, \"border-width\");\n box-shadow: get-style-value($name, \"box-shadow\");\n text-decoration: get-style-value($name, \"text-decoration\");\n font-weight: get-style-value($name, \"font-weight\");\n @if get-style-value($name, \"transition-duration\") {\n transition-duration: get-style-value($name, \"transition-duration\");\n }\n",
|
|
34738
34879
|
"line": {
|
|
34739
|
-
"start":
|
|
34740
|
-
"end":
|
|
34880
|
+
"start": 328,
|
|
34881
|
+
"end": 339
|
|
34741
34882
|
}
|
|
34742
34883
|
}
|
|
34743
34884
|
},
|
|
@@ -34748,8 +34889,8 @@
|
|
|
34748
34889
|
"name": "style-styles",
|
|
34749
34890
|
"code": "\n background-color: get-style-value($name, \"background-color\");\n color: get-style-value($name, \"color\");\n border-color: get-style-value($name, \"border-color\");\n border-width: get-style-value($name, \"border-width\");\n box-shadow: get-style-value($name, \"box-shadow\");\n text-decoration: get-style-value($name, \"text-decoration\");\n font-weight: get-style-value($name, \"font-weight\");\n @if get-style-value($name, \"transition-duration\") {\n transition-duration: get-style-value($name, \"transition-duration\");\n }\n",
|
|
34750
34891
|
"line": {
|
|
34751
|
-
"start":
|
|
34752
|
-
"end":
|
|
34892
|
+
"start": 328,
|
|
34893
|
+
"end": 339
|
|
34753
34894
|
}
|
|
34754
34895
|
}
|
|
34755
34896
|
},
|
|
@@ -34760,8 +34901,8 @@
|
|
|
34760
34901
|
"name": "style-styles",
|
|
34761
34902
|
"code": "\n background-color: get-style-value($name, \"background-color\");\n color: get-style-value($name, \"color\");\n border-color: get-style-value($name, \"border-color\");\n border-width: get-style-value($name, \"border-width\");\n box-shadow: get-style-value($name, \"box-shadow\");\n text-decoration: get-style-value($name, \"text-decoration\");\n font-weight: get-style-value($name, \"font-weight\");\n @if get-style-value($name, \"transition-duration\") {\n transition-duration: get-style-value($name, \"transition-duration\");\n }\n",
|
|
34762
34903
|
"line": {
|
|
34763
|
-
"start":
|
|
34764
|
-
"end":
|
|
34904
|
+
"start": 328,
|
|
34905
|
+
"end": 339
|
|
34765
34906
|
}
|
|
34766
34907
|
}
|
|
34767
34908
|
},
|
|
@@ -34772,8 +34913,8 @@
|
|
|
34772
34913
|
"name": "style-styles",
|
|
34773
34914
|
"code": "\n background-color: get-style-value($name, \"background-color\");\n color: get-style-value($name, \"color\");\n border-color: get-style-value($name, \"border-color\");\n border-width: get-style-value($name, \"border-width\");\n box-shadow: get-style-value($name, \"box-shadow\");\n text-decoration: get-style-value($name, \"text-decoration\");\n font-weight: get-style-value($name, \"font-weight\");\n @if get-style-value($name, \"transition-duration\") {\n transition-duration: get-style-value($name, \"transition-duration\");\n }\n",
|
|
34774
34915
|
"line": {
|
|
34775
|
-
"start":
|
|
34776
|
-
"end":
|
|
34916
|
+
"start": 328,
|
|
34917
|
+
"end": 339
|
|
34777
34918
|
}
|
|
34778
34919
|
}
|
|
34779
34920
|
},
|
|
@@ -34784,8 +34925,8 @@
|
|
|
34784
34925
|
"name": "style-styles",
|
|
34785
34926
|
"code": "\n background-color: get-style-value($name, \"background-color\");\n color: get-style-value($name, \"color\");\n border-color: get-style-value($name, \"border-color\");\n border-width: get-style-value($name, \"border-width\");\n box-shadow: get-style-value($name, \"box-shadow\");\n text-decoration: get-style-value($name, \"text-decoration\");\n font-weight: get-style-value($name, \"font-weight\");\n @if get-style-value($name, \"transition-duration\") {\n transition-duration: get-style-value($name, \"transition-duration\");\n }\n",
|
|
34786
34927
|
"line": {
|
|
34787
|
-
"start":
|
|
34788
|
-
"end":
|
|
34928
|
+
"start": 328,
|
|
34929
|
+
"end": 339
|
|
34789
34930
|
}
|
|
34790
34931
|
}
|
|
34791
34932
|
},
|
|
@@ -34796,8 +34937,8 @@
|
|
|
34796
34937
|
"name": "style-styles",
|
|
34797
34938
|
"code": "\n background-color: get-style-value($name, \"background-color\");\n color: get-style-value($name, \"color\");\n border-color: get-style-value($name, \"border-color\");\n border-width: get-style-value($name, \"border-width\");\n box-shadow: get-style-value($name, \"box-shadow\");\n text-decoration: get-style-value($name, \"text-decoration\");\n font-weight: get-style-value($name, \"font-weight\");\n @if get-style-value($name, \"transition-duration\") {\n transition-duration: get-style-value($name, \"transition-duration\");\n }\n",
|
|
34798
34939
|
"line": {
|
|
34799
|
-
"start":
|
|
34800
|
-
"end":
|
|
34940
|
+
"start": 328,
|
|
34941
|
+
"end": 339
|
|
34801
34942
|
}
|
|
34802
34943
|
}
|
|
34803
34944
|
},
|
|
@@ -34808,8 +34949,8 @@
|
|
|
34808
34949
|
"name": "style-styles",
|
|
34809
34950
|
"code": "\n background-color: get-style-value($name, \"background-color\");\n color: get-style-value($name, \"color\");\n border-color: get-style-value($name, \"border-color\");\n border-width: get-style-value($name, \"border-width\");\n box-shadow: get-style-value($name, \"box-shadow\");\n text-decoration: get-style-value($name, \"text-decoration\");\n font-weight: get-style-value($name, \"font-weight\");\n @if get-style-value($name, \"transition-duration\") {\n transition-duration: get-style-value($name, \"transition-duration\");\n }\n",
|
|
34810
34951
|
"line": {
|
|
34811
|
-
"start":
|
|
34812
|
-
"end":
|
|
34952
|
+
"start": 328,
|
|
34953
|
+
"end": 339
|
|
34813
34954
|
}
|
|
34814
34955
|
}
|
|
34815
34956
|
},
|
|
@@ -34820,8 +34961,8 @@
|
|
|
34820
34961
|
"name": "style-styles",
|
|
34821
34962
|
"code": "\n background-color: get-style-value($name, \"background-color\");\n color: get-style-value($name, \"color\");\n border-color: get-style-value($name, \"border-color\");\n border-width: get-style-value($name, \"border-width\");\n box-shadow: get-style-value($name, \"box-shadow\");\n text-decoration: get-style-value($name, \"text-decoration\");\n font-weight: get-style-value($name, \"font-weight\");\n @if get-style-value($name, \"transition-duration\") {\n transition-duration: get-style-value($name, \"transition-duration\");\n }\n",
|
|
34822
34963
|
"line": {
|
|
34823
|
-
"start":
|
|
34824
|
-
"end":
|
|
34964
|
+
"start": 328,
|
|
34965
|
+
"end": 339
|
|
34825
34966
|
}
|
|
34826
34967
|
}
|
|
34827
34968
|
},
|
|
@@ -34832,8 +34973,8 @@
|
|
|
34832
34973
|
"name": "style-styles-hover",
|
|
34833
34974
|
"code": "\n background-color: get-style-value($name, \"background-color\", \"hover\");\n color: get-style-value($name, \"color\", \"hover\");\n border-color: get-style-value($name, \"border-color\", \"hover\");\n box-shadow: get-style-value($name, \"box-shadow\", \"hover\");\n text-decoration: get-style-value($name, \"text-decoration\", \"hover\");\n",
|
|
34834
34975
|
"line": {
|
|
34835
|
-
"start":
|
|
34836
|
-
"end":
|
|
34976
|
+
"start": 348,
|
|
34977
|
+
"end": 354
|
|
34837
34978
|
}
|
|
34838
34979
|
}
|
|
34839
34980
|
},
|
|
@@ -34844,8 +34985,8 @@
|
|
|
34844
34985
|
"name": "style-styles-hover",
|
|
34845
34986
|
"code": "\n background-color: get-style-value($name, \"background-color\", \"hover\");\n color: get-style-value($name, \"color\", \"hover\");\n border-color: get-style-value($name, \"border-color\", \"hover\");\n box-shadow: get-style-value($name, \"box-shadow\", \"hover\");\n text-decoration: get-style-value($name, \"text-decoration\", \"hover\");\n",
|
|
34846
34987
|
"line": {
|
|
34847
|
-
"start":
|
|
34848
|
-
"end":
|
|
34988
|
+
"start": 348,
|
|
34989
|
+
"end": 354
|
|
34849
34990
|
}
|
|
34850
34991
|
}
|
|
34851
34992
|
},
|
|
@@ -34856,8 +34997,8 @@
|
|
|
34856
34997
|
"name": "style-styles-hover",
|
|
34857
34998
|
"code": "\n background-color: get-style-value($name, \"background-color\", \"hover\");\n color: get-style-value($name, \"color\", \"hover\");\n border-color: get-style-value($name, \"border-color\", \"hover\");\n box-shadow: get-style-value($name, \"box-shadow\", \"hover\");\n text-decoration: get-style-value($name, \"text-decoration\", \"hover\");\n",
|
|
34858
34999
|
"line": {
|
|
34859
|
-
"start":
|
|
34860
|
-
"end":
|
|
35000
|
+
"start": 348,
|
|
35001
|
+
"end": 354
|
|
34861
35002
|
}
|
|
34862
35003
|
}
|
|
34863
35004
|
},
|
|
@@ -34868,8 +35009,8 @@
|
|
|
34868
35009
|
"name": "style-styles-hover",
|
|
34869
35010
|
"code": "\n background-color: get-style-value($name, \"background-color\", \"hover\");\n color: get-style-value($name, \"color\", \"hover\");\n border-color: get-style-value($name, \"border-color\", \"hover\");\n box-shadow: get-style-value($name, \"box-shadow\", \"hover\");\n text-decoration: get-style-value($name, \"text-decoration\", \"hover\");\n",
|
|
34870
35011
|
"line": {
|
|
34871
|
-
"start":
|
|
34872
|
-
"end":
|
|
35012
|
+
"start": 348,
|
|
35013
|
+
"end": 354
|
|
34873
35014
|
}
|
|
34874
35015
|
}
|
|
34875
35016
|
},
|
|
@@ -34880,8 +35021,8 @@
|
|
|
34880
35021
|
"name": "style-styles-hover",
|
|
34881
35022
|
"code": "\n background-color: get-style-value($name, \"background-color\", \"hover\");\n color: get-style-value($name, \"color\", \"hover\");\n border-color: get-style-value($name, \"border-color\", \"hover\");\n box-shadow: get-style-value($name, \"box-shadow\", \"hover\");\n text-decoration: get-style-value($name, \"text-decoration\", \"hover\");\n",
|
|
34882
35023
|
"line": {
|
|
34883
|
-
"start":
|
|
34884
|
-
"end":
|
|
35024
|
+
"start": 348,
|
|
35025
|
+
"end": 354
|
|
34885
35026
|
}
|
|
34886
35027
|
}
|
|
34887
35028
|
}
|
|
@@ -34894,16 +35035,16 @@
|
|
|
34894
35035
|
"path": "/sass/core/button/#mixin-style-styles",
|
|
34895
35036
|
"description": "Print a button style's base styles (not hover)\n- In most cases you want the style() mixin\n- This is used mainly for trying to match a buttons base styles without including the other state (hover, etc) styles\n",
|
|
34896
35037
|
"commentRange": {
|
|
34897
|
-
"start":
|
|
34898
|
-
"end":
|
|
35038
|
+
"start": 321,
|
|
35039
|
+
"end": 326
|
|
34899
35040
|
},
|
|
34900
35041
|
"context": {
|
|
34901
35042
|
"type": "mixin",
|
|
34902
35043
|
"name": "style-styles",
|
|
34903
35044
|
"code": "\n background-color: get-style-value($name, \"background-color\");\n color: get-style-value($name, \"color\");\n border-color: get-style-value($name, \"border-color\");\n border-width: get-style-value($name, \"border-width\");\n box-shadow: get-style-value($name, \"box-shadow\");\n text-decoration: get-style-value($name, \"text-decoration\");\n font-weight: get-style-value($name, \"font-weight\");\n @if get-style-value($name, \"transition-duration\") {\n transition-duration: get-style-value($name, \"transition-duration\");\n }\n",
|
|
34904
35045
|
"line": {
|
|
34905
|
-
"start":
|
|
34906
|
-
"end":
|
|
35046
|
+
"start": 328,
|
|
35047
|
+
"end": 339
|
|
34907
35048
|
}
|
|
34908
35049
|
},
|
|
34909
35050
|
"parameter": [
|
|
@@ -34922,8 +35063,8 @@
|
|
|
34922
35063
|
"value": "(\n \"transparent\" : (\n \"background-color\" : transparent,\n \"color\" : \"type\",\n \"border-color\" : transparent,\n \"box-shadow\" : none,\n \"hover\" : (\n \"background-color\" : \"control-background\",\n \"color\" : \"control\",\n \"border-color\" : \"control-border\",\n )\n ),\n \"outline\" : (\n \"background-color\" : transparent,\n \"color\" : \"type\",\n \"border-color\" : \"rule-light\",\n \"box-shadow\" : none,\n \"hover\" : (\n \"background-color\" : \"control-background\",\n \"color\" : \"control\",\n \"border-color\" : \"control-border\",\n )\n ),\n)",
|
|
34923
35064
|
"scope": "default",
|
|
34924
35065
|
"line": {
|
|
34925
|
-
"start":
|
|
34926
|
-
"end":
|
|
35066
|
+
"start": 116,
|
|
35067
|
+
"end": 139
|
|
34927
35068
|
}
|
|
34928
35069
|
},
|
|
34929
35070
|
"group": [
|
|
@@ -34937,8 +35078,8 @@
|
|
|
34937
35078
|
"name": "set-styles",
|
|
34938
35079
|
"code": "\n $styles: utils.map-merge($styles, $changes, $merge-mode) !global;\n",
|
|
34939
35080
|
"line": {
|
|
34940
|
-
"start":
|
|
34941
|
-
"end":
|
|
35081
|
+
"start": 166,
|
|
35082
|
+
"end": 168
|
|
34942
35083
|
}
|
|
34943
35084
|
},
|
|
34944
35085
|
"group": [
|
|
@@ -35000,8 +35141,8 @@
|
|
|
35000
35141
|
"name": "style",
|
|
35001
35142
|
"code": "\n @if ($no-visited) {\n @include style-styles($name);\n } @else {\n &,\n &:visited {\n @include style-styles($name);\n }\n }\n &:hover,\n &:focus {\n @include style-styles-hover($name);\n }\n @include when-active() {\n @include style-styles-active($name);\n }\n",
|
|
35002
35143
|
"line": {
|
|
35003
|
-
"start":
|
|
35004
|
-
"end":
|
|
35144
|
+
"start": 375,
|
|
35145
|
+
"end": 391
|
|
35005
35146
|
}
|
|
35006
35147
|
}
|
|
35007
35148
|
},
|
|
@@ -35012,8 +35153,8 @@
|
|
|
35012
35153
|
"name": "style",
|
|
35013
35154
|
"code": "\n @if ($no-visited) {\n @include style-styles($name);\n } @else {\n &,\n &:visited {\n @include style-styles($name);\n }\n }\n &:hover,\n &:focus {\n @include style-styles-hover($name);\n }\n @include when-active() {\n @include style-styles-active($name);\n }\n",
|
|
35014
35155
|
"line": {
|
|
35015
|
-
"start":
|
|
35016
|
-
"end":
|
|
35156
|
+
"start": 375,
|
|
35157
|
+
"end": 391
|
|
35017
35158
|
}
|
|
35018
35159
|
}
|
|
35019
35160
|
}
|
|
@@ -35026,16 +35167,16 @@
|
|
|
35026
35167
|
"path": "/sass/core/button/#mixin-style-styles-hover",
|
|
35027
35168
|
"description": "Print a button style's base styles (hover styles only)\n- In most cases you want the style() mixin\n- This is used mainly for trying to match a buttons hover styles without including the base styling\n",
|
|
35028
35169
|
"commentRange": {
|
|
35029
|
-
"start":
|
|
35030
|
-
"end":
|
|
35170
|
+
"start": 341,
|
|
35171
|
+
"end": 346
|
|
35031
35172
|
},
|
|
35032
35173
|
"context": {
|
|
35033
35174
|
"type": "mixin",
|
|
35034
35175
|
"name": "style-styles-hover",
|
|
35035
35176
|
"code": "\n background-color: get-style-value($name, \"background-color\", \"hover\");\n color: get-style-value($name, \"color\", \"hover\");\n border-color: get-style-value($name, \"border-color\", \"hover\");\n box-shadow: get-style-value($name, \"box-shadow\", \"hover\");\n text-decoration: get-style-value($name, \"text-decoration\", \"hover\");\n",
|
|
35036
35177
|
"line": {
|
|
35037
|
-
"start":
|
|
35038
|
-
"end":
|
|
35178
|
+
"start": 348,
|
|
35179
|
+
"end": 354
|
|
35039
35180
|
}
|
|
35040
35181
|
},
|
|
35041
35182
|
"parameter": [
|
|
@@ -35054,8 +35195,8 @@
|
|
|
35054
35195
|
"value": "(\n \"transparent\" : (\n \"background-color\" : transparent,\n \"color\" : \"type\",\n \"border-color\" : transparent,\n \"box-shadow\" : none,\n \"hover\" : (\n \"background-color\" : \"control-background\",\n \"color\" : \"control\",\n \"border-color\" : \"control-border\",\n )\n ),\n \"outline\" : (\n \"background-color\" : transparent,\n \"color\" : \"type\",\n \"border-color\" : \"rule-light\",\n \"box-shadow\" : none,\n \"hover\" : (\n \"background-color\" : \"control-background\",\n \"color\" : \"control\",\n \"border-color\" : \"control-border\",\n )\n ),\n)",
|
|
35055
35196
|
"scope": "default",
|
|
35056
35197
|
"line": {
|
|
35057
|
-
"start":
|
|
35058
|
-
"end":
|
|
35198
|
+
"start": 116,
|
|
35199
|
+
"end": 139
|
|
35059
35200
|
}
|
|
35060
35201
|
},
|
|
35061
35202
|
"group": [
|
|
@@ -35069,8 +35210,8 @@
|
|
|
35069
35210
|
"name": "set-styles",
|
|
35070
35211
|
"code": "\n $styles: utils.map-merge($styles, $changes, $merge-mode) !global;\n",
|
|
35071
35212
|
"line": {
|
|
35072
|
-
"start":
|
|
35073
|
-
"end":
|
|
35213
|
+
"start": 166,
|
|
35214
|
+
"end": 168
|
|
35074
35215
|
}
|
|
35075
35216
|
},
|
|
35076
35217
|
"group": [
|
|
@@ -35116,8 +35257,8 @@
|
|
|
35116
35257
|
"name": "style",
|
|
35117
35258
|
"code": "\n @if ($no-visited) {\n @include style-styles($name);\n } @else {\n &,\n &:visited {\n @include style-styles($name);\n }\n }\n &:hover,\n &:focus {\n @include style-styles-hover($name);\n }\n @include when-active() {\n @include style-styles-active($name);\n }\n",
|
|
35118
35259
|
"line": {
|
|
35119
|
-
"start":
|
|
35120
|
-
"end":
|
|
35260
|
+
"start": 375,
|
|
35261
|
+
"end": 391
|
|
35121
35262
|
}
|
|
35122
35263
|
}
|
|
35123
35264
|
}
|
|
@@ -35130,16 +35271,16 @@
|
|
|
35130
35271
|
"path": "/sass/core/button/#mixin-style",
|
|
35131
35272
|
"description": "Print a button style\n- Includes base/visited styling, and hover/focus state styles\n- To print only one of those states, use style-styles or style-styles-hover\n- By default this mixin prints the buttons base styles along with :visited state. \n This is to avoid link visited states effecting the button styles (if used in editor areas \n or other areas that apply automatic links styling for example. (param below to override behavior)\n",
|
|
35132
35273
|
"commentRange": {
|
|
35133
|
-
"start":
|
|
35134
|
-
"end":
|
|
35274
|
+
"start": 364,
|
|
35275
|
+
"end": 373
|
|
35135
35276
|
},
|
|
35136
35277
|
"context": {
|
|
35137
35278
|
"type": "mixin",
|
|
35138
35279
|
"name": "style",
|
|
35139
35280
|
"code": "\n @if ($no-visited) {\n @include style-styles($name);\n } @else {\n &,\n &:visited {\n @include style-styles($name);\n }\n }\n &:hover,\n &:focus {\n @include style-styles-hover($name);\n }\n @include when-active() {\n @include style-styles-active($name);\n }\n",
|
|
35140
35281
|
"line": {
|
|
35141
|
-
"start":
|
|
35142
|
-
"end":
|
|
35282
|
+
"start": 375,
|
|
35283
|
+
"end": 391
|
|
35143
35284
|
}
|
|
35144
35285
|
},
|
|
35145
35286
|
"parameter": [
|
|
@@ -35164,8 +35305,8 @@
|
|
|
35164
35305
|
"value": "(\n \"transparent\" : (\n \"background-color\" : transparent,\n \"color\" : \"type\",\n \"border-color\" : transparent,\n \"box-shadow\" : none,\n \"hover\" : (\n \"background-color\" : \"control-background\",\n \"color\" : \"control\",\n \"border-color\" : \"control-border\",\n )\n ),\n \"outline\" : (\n \"background-color\" : transparent,\n \"color\" : \"type\",\n \"border-color\" : \"rule-light\",\n \"box-shadow\" : none,\n \"hover\" : (\n \"background-color\" : \"control-background\",\n \"color\" : \"control\",\n \"border-color\" : \"control-border\",\n )\n ),\n)",
|
|
35165
35306
|
"scope": "default",
|
|
35166
35307
|
"line": {
|
|
35167
|
-
"start":
|
|
35168
|
-
"end":
|
|
35308
|
+
"start": 116,
|
|
35309
|
+
"end": 139
|
|
35169
35310
|
}
|
|
35170
35311
|
},
|
|
35171
35312
|
"group": [
|
|
@@ -35179,8 +35320,8 @@
|
|
|
35179
35320
|
"name": "set-styles",
|
|
35180
35321
|
"code": "\n $styles: utils.map-merge($styles, $changes, $merge-mode) !global;\n",
|
|
35181
35322
|
"line": {
|
|
35182
|
-
"start":
|
|
35183
|
-
"end":
|
|
35323
|
+
"start": 166,
|
|
35324
|
+
"end": 168
|
|
35184
35325
|
}
|
|
35185
35326
|
},
|
|
35186
35327
|
"group": [
|
|
@@ -36065,10 +36206,10 @@
|
|
|
36065
36206
|
"context": {
|
|
36066
36207
|
"type": "mixin",
|
|
36067
36208
|
"name": "styles",
|
|
36068
|
-
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }
|
|
36209
|
+
"code": "\n @include utils.file-header('component', 'button');\n\n $prefix: selector.class(\"button\");\n // $printContextual: get(\"contextual-classes\");\n // $classContextual: \"#{ selector.class(\"button-inside\") } ;\n $icon-selector: \"#{ $prefix }--icon\";\n $printDescendant: \"#{ $prefix }--icon\";\n\n #{ $prefix } {\n @include button.default();\n }\n #{ $prefix }--fit {\n min-width: 0;\n }\n #{ $prefix }--left {\n justify-content: flex-start;\n text-align: left;\n }\n \n @each $size, $values in button.$sizes {\n #{ $prefix }--#{$size} {\n @include button.size($size);\n }\n }\n \n @each $style, $values in button.$styles {\n #{ $prefix }--#{$style} {\n @include button.style($style);\n }\n }\n \n #{ $icon-selector } {\n \n min-width: 0;\n max-width: none;\n border-radius: button.get(\"icon-border-radius\");\n font-size: button.get(\"icon-font-size\");\n width: button.get(\"icon-size\");\n height: button.get(\"icon-size\");\n padding: 0 !important;\n\n #{ $prefix }__icon {\n transform: translateY(get(\"icon-centered-vertical-offset\"));\n margin: 0;\n }\n }\n\n @each $size, $values in button.$sizes {\n $icon-size: map.get($values, \"icon-size\");\n $icon-font-size: map.get($values, \"icon-font-size\");\n @if ($icon-size or $icon-font-size) {\n #{ $prefix }--#{$size}#{ $icon-selector } {\n width: $icon-size;\n height: $icon-size;\n font-size: $icon-font-size;\n }\n }\n }\n",
|
|
36069
36210
|
"line": {
|
|
36070
|
-
"start":
|
|
36071
|
-
"end":
|
|
36211
|
+
"start": 51,
|
|
36212
|
+
"end": 110
|
|
36072
36213
|
}
|
|
36073
36214
|
}
|
|
36074
36215
|
},
|
|
@@ -55779,8 +55920,8 @@
|
|
|
55779
55920
|
"name": "set",
|
|
55780
55921
|
"code": "\n $config: map.merge($config, $changes) !global;\n",
|
|
55781
55922
|
"line": {
|
|
55782
|
-
"start":
|
|
55783
|
-
"end":
|
|
55923
|
+
"start": 146,
|
|
55924
|
+
"end": 148
|
|
55784
55925
|
}
|
|
55785
55926
|
}
|
|
55786
55927
|
},
|
|
@@ -55791,8 +55932,8 @@
|
|
|
55791
55932
|
"name": "set",
|
|
55792
55933
|
"code": "\n $config: map.merge($config, $changes) !global;\n",
|
|
55793
55934
|
"line": {
|
|
55794
|
-
"start":
|
|
55795
|
-
"end":
|
|
55935
|
+
"start": 146,
|
|
55936
|
+
"end": 148
|
|
55796
55937
|
}
|
|
55797
55938
|
}
|
|
55798
55939
|
},
|
|
@@ -55803,8 +55944,8 @@
|
|
|
55803
55944
|
"name": "get",
|
|
55804
55945
|
"code": "\n $value: utils.require-map-get($config, $name, \"button [config]\");\n @return utils.function-fallback($name, $value, $-fallbacks);\n",
|
|
55805
55946
|
"line": {
|
|
55806
|
-
"start":
|
|
55807
|
-
"end":
|
|
55947
|
+
"start": 156,
|
|
55948
|
+
"end": 159
|
|
55808
55949
|
}
|
|
55809
55950
|
}
|
|
55810
55951
|
},
|
|
@@ -56296,10 +56437,10 @@
|
|
|
56296
56437
|
"context": {
|
|
56297
56438
|
"type": "mixin",
|
|
56298
56439
|
"name": "default",
|
|
56299
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56440
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56300
56441
|
"line": {
|
|
56301
|
-
"start":
|
|
56302
|
-
"end":
|
|
56442
|
+
"start": 197,
|
|
56443
|
+
"end": 256
|
|
56303
56444
|
}
|
|
56304
56445
|
}
|
|
56305
56446
|
},
|
|
@@ -56308,10 +56449,10 @@
|
|
|
56308
56449
|
"context": {
|
|
56309
56450
|
"type": "mixin",
|
|
56310
56451
|
"name": "default",
|
|
56311
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56452
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56312
56453
|
"line": {
|
|
56313
|
-
"start":
|
|
56314
|
-
"end":
|
|
56454
|
+
"start": 197,
|
|
56455
|
+
"end": 256
|
|
56315
56456
|
}
|
|
56316
56457
|
}
|
|
56317
56458
|
},
|
|
@@ -56320,10 +56461,10 @@
|
|
|
56320
56461
|
"context": {
|
|
56321
56462
|
"type": "mixin",
|
|
56322
56463
|
"name": "default",
|
|
56323
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56464
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56324
56465
|
"line": {
|
|
56325
|
-
"start":
|
|
56326
|
-
"end":
|
|
56466
|
+
"start": 197,
|
|
56467
|
+
"end": 256
|
|
56327
56468
|
}
|
|
56328
56469
|
}
|
|
56329
56470
|
},
|
|
@@ -56332,10 +56473,10 @@
|
|
|
56332
56473
|
"context": {
|
|
56333
56474
|
"type": "mixin",
|
|
56334
56475
|
"name": "default",
|
|
56335
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56476
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56336
56477
|
"line": {
|
|
56337
|
-
"start":
|
|
56338
|
-
"end":
|
|
56478
|
+
"start": 197,
|
|
56479
|
+
"end": 256
|
|
56339
56480
|
}
|
|
56340
56481
|
}
|
|
56341
56482
|
},
|
|
@@ -56344,10 +56485,10 @@
|
|
|
56344
56485
|
"context": {
|
|
56345
56486
|
"type": "mixin",
|
|
56346
56487
|
"name": "default",
|
|
56347
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56488
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56348
56489
|
"line": {
|
|
56349
|
-
"start":
|
|
56350
|
-
"end":
|
|
56490
|
+
"start": 197,
|
|
56491
|
+
"end": 256
|
|
56351
56492
|
}
|
|
56352
56493
|
}
|
|
56353
56494
|
},
|
|
@@ -56356,10 +56497,10 @@
|
|
|
56356
56497
|
"context": {
|
|
56357
56498
|
"type": "mixin",
|
|
56358
56499
|
"name": "default",
|
|
56359
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56500
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56360
56501
|
"line": {
|
|
56361
|
-
"start":
|
|
56362
|
-
"end":
|
|
56502
|
+
"start": 197,
|
|
56503
|
+
"end": 256
|
|
56363
56504
|
}
|
|
56364
56505
|
}
|
|
56365
56506
|
},
|
|
@@ -56368,10 +56509,10 @@
|
|
|
56368
56509
|
"context": {
|
|
56369
56510
|
"type": "mixin",
|
|
56370
56511
|
"name": "default",
|
|
56371
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56512
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56372
56513
|
"line": {
|
|
56373
|
-
"start":
|
|
56374
|
-
"end":
|
|
56514
|
+
"start": 197,
|
|
56515
|
+
"end": 256
|
|
56375
56516
|
}
|
|
56376
56517
|
}
|
|
56377
56518
|
},
|
|
@@ -56380,10 +56521,10 @@
|
|
|
56380
56521
|
"context": {
|
|
56381
56522
|
"type": "mixin",
|
|
56382
56523
|
"name": "default",
|
|
56383
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56524
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56384
56525
|
"line": {
|
|
56385
|
-
"start":
|
|
56386
|
-
"end":
|
|
56526
|
+
"start": 197,
|
|
56527
|
+
"end": 256
|
|
56387
56528
|
}
|
|
56388
56529
|
}
|
|
56389
56530
|
},
|
|
@@ -56392,10 +56533,10 @@
|
|
|
56392
56533
|
"context": {
|
|
56393
56534
|
"type": "mixin",
|
|
56394
56535
|
"name": "default",
|
|
56395
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56536
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56396
56537
|
"line": {
|
|
56397
|
-
"start":
|
|
56398
|
-
"end":
|
|
56538
|
+
"start": 197,
|
|
56539
|
+
"end": 256
|
|
56399
56540
|
}
|
|
56400
56541
|
}
|
|
56401
56542
|
},
|
|
@@ -56404,10 +56545,10 @@
|
|
|
56404
56545
|
"context": {
|
|
56405
56546
|
"type": "mixin",
|
|
56406
56547
|
"name": "default",
|
|
56407
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56548
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56408
56549
|
"line": {
|
|
56409
|
-
"start":
|
|
56410
|
-
"end":
|
|
56550
|
+
"start": 197,
|
|
56551
|
+
"end": 256
|
|
56411
56552
|
}
|
|
56412
56553
|
}
|
|
56413
56554
|
},
|
|
@@ -56416,10 +56557,10 @@
|
|
|
56416
56557
|
"context": {
|
|
56417
56558
|
"type": "mixin",
|
|
56418
56559
|
"name": "default",
|
|
56419
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56560
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56420
56561
|
"line": {
|
|
56421
|
-
"start":
|
|
56422
|
-
"end":
|
|
56562
|
+
"start": 197,
|
|
56563
|
+
"end": 256
|
|
56423
56564
|
}
|
|
56424
56565
|
}
|
|
56425
56566
|
},
|
|
@@ -56428,10 +56569,10 @@
|
|
|
56428
56569
|
"context": {
|
|
56429
56570
|
"type": "mixin",
|
|
56430
56571
|
"name": "default",
|
|
56431
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56572
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56432
56573
|
"line": {
|
|
56433
|
-
"start":
|
|
56434
|
-
"end":
|
|
56574
|
+
"start": 197,
|
|
56575
|
+
"end": 256
|
|
56435
56576
|
}
|
|
56436
56577
|
}
|
|
56437
56578
|
},
|
|
@@ -56440,10 +56581,10 @@
|
|
|
56440
56581
|
"context": {
|
|
56441
56582
|
"type": "mixin",
|
|
56442
56583
|
"name": "default",
|
|
56443
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56584
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56444
56585
|
"line": {
|
|
56445
|
-
"start":
|
|
56446
|
-
"end":
|
|
56586
|
+
"start": 197,
|
|
56587
|
+
"end": 256
|
|
56447
56588
|
}
|
|
56448
56589
|
}
|
|
56449
56590
|
},
|
|
@@ -56452,10 +56593,10 @@
|
|
|
56452
56593
|
"context": {
|
|
56453
56594
|
"type": "mixin",
|
|
56454
56595
|
"name": "default",
|
|
56455
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56596
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56456
56597
|
"line": {
|
|
56457
|
-
"start":
|
|
56458
|
-
"end":
|
|
56598
|
+
"start": 197,
|
|
56599
|
+
"end": 256
|
|
56459
56600
|
}
|
|
56460
56601
|
}
|
|
56461
56602
|
},
|
|
@@ -56464,10 +56605,10 @@
|
|
|
56464
56605
|
"context": {
|
|
56465
56606
|
"type": "mixin",
|
|
56466
56607
|
"name": "default",
|
|
56467
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56608
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56468
56609
|
"line": {
|
|
56469
|
-
"start":
|
|
56470
|
-
"end":
|
|
56610
|
+
"start": 197,
|
|
56611
|
+
"end": 256
|
|
56471
56612
|
}
|
|
56472
56613
|
}
|
|
56473
56614
|
},
|
|
@@ -56476,10 +56617,10 @@
|
|
|
56476
56617
|
"context": {
|
|
56477
56618
|
"type": "mixin",
|
|
56478
56619
|
"name": "default",
|
|
56479
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56620
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56480
56621
|
"line": {
|
|
56481
|
-
"start":
|
|
56482
|
-
"end":
|
|
56622
|
+
"start": 197,
|
|
56623
|
+
"end": 256
|
|
56483
56624
|
}
|
|
56484
56625
|
}
|
|
56485
56626
|
},
|
|
@@ -56488,10 +56629,10 @@
|
|
|
56488
56629
|
"context": {
|
|
56489
56630
|
"type": "mixin",
|
|
56490
56631
|
"name": "default",
|
|
56491
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56632
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56492
56633
|
"line": {
|
|
56493
|
-
"start":
|
|
56494
|
-
"end":
|
|
56634
|
+
"start": 197,
|
|
56635
|
+
"end": 256
|
|
56495
56636
|
}
|
|
56496
56637
|
}
|
|
56497
56638
|
},
|
|
@@ -56500,10 +56641,10 @@
|
|
|
56500
56641
|
"context": {
|
|
56501
56642
|
"type": "mixin",
|
|
56502
56643
|
"name": "default",
|
|
56503
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56644
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56504
56645
|
"line": {
|
|
56505
|
-
"start":
|
|
56506
|
-
"end":
|
|
56646
|
+
"start": 197,
|
|
56647
|
+
"end": 256
|
|
56507
56648
|
}
|
|
56508
56649
|
}
|
|
56509
56650
|
},
|
|
@@ -56512,10 +56653,10 @@
|
|
|
56512
56653
|
"context": {
|
|
56513
56654
|
"type": "mixin",
|
|
56514
56655
|
"name": "default",
|
|
56515
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56656
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56516
56657
|
"line": {
|
|
56517
|
-
"start":
|
|
56518
|
-
"end":
|
|
56658
|
+
"start": 197,
|
|
56659
|
+
"end": 256
|
|
56519
56660
|
}
|
|
56520
56661
|
}
|
|
56521
56662
|
},
|
|
@@ -56524,10 +56665,10 @@
|
|
|
56524
56665
|
"context": {
|
|
56525
56666
|
"type": "mixin",
|
|
56526
56667
|
"name": "default",
|
|
56527
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56668
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56528
56669
|
"line": {
|
|
56529
|
-
"start":
|
|
56530
|
-
"end":
|
|
56670
|
+
"start": 197,
|
|
56671
|
+
"end": 256
|
|
56531
56672
|
}
|
|
56532
56673
|
}
|
|
56533
56674
|
},
|
|
@@ -56536,10 +56677,10 @@
|
|
|
56536
56677
|
"context": {
|
|
56537
56678
|
"type": "mixin",
|
|
56538
56679
|
"name": "default",
|
|
56539
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56680
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56540
56681
|
"line": {
|
|
56541
|
-
"start":
|
|
56542
|
-
"end":
|
|
56682
|
+
"start": 197,
|
|
56683
|
+
"end": 256
|
|
56543
56684
|
}
|
|
56544
56685
|
}
|
|
56545
56686
|
},
|
|
@@ -56548,10 +56689,10 @@
|
|
|
56548
56689
|
"context": {
|
|
56549
56690
|
"type": "mixin",
|
|
56550
56691
|
"name": "default",
|
|
56551
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56692
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56552
56693
|
"line": {
|
|
56553
|
-
"start":
|
|
56554
|
-
"end":
|
|
56694
|
+
"start": 197,
|
|
56695
|
+
"end": 256
|
|
56555
56696
|
}
|
|
56556
56697
|
}
|
|
56557
56698
|
},
|
|
@@ -56560,10 +56701,10 @@
|
|
|
56560
56701
|
"context": {
|
|
56561
56702
|
"type": "mixin",
|
|
56562
56703
|
"name": "default",
|
|
56563
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56704
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56564
56705
|
"line": {
|
|
56565
|
-
"start":
|
|
56566
|
-
"end":
|
|
56706
|
+
"start": 197,
|
|
56707
|
+
"end": 256
|
|
56567
56708
|
}
|
|
56568
56709
|
}
|
|
56569
56710
|
},
|
|
@@ -56572,10 +56713,10 @@
|
|
|
56572
56713
|
"context": {
|
|
56573
56714
|
"type": "mixin",
|
|
56574
56715
|
"name": "default",
|
|
56575
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56716
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56576
56717
|
"line": {
|
|
56577
|
-
"start":
|
|
56578
|
-
"end":
|
|
56718
|
+
"start": 197,
|
|
56719
|
+
"end": 256
|
|
56579
56720
|
}
|
|
56580
56721
|
}
|
|
56581
56722
|
},
|
|
@@ -56584,10 +56725,10 @@
|
|
|
56584
56725
|
"context": {
|
|
56585
56726
|
"type": "mixin",
|
|
56586
56727
|
"name": "default",
|
|
56587
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56728
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56588
56729
|
"line": {
|
|
56589
|
-
"start":
|
|
56590
|
-
"end":
|
|
56730
|
+
"start": 197,
|
|
56731
|
+
"end": 256
|
|
56591
56732
|
}
|
|
56592
56733
|
}
|
|
56593
56734
|
},
|
|
@@ -56596,10 +56737,10 @@
|
|
|
56596
56737
|
"context": {
|
|
56597
56738
|
"type": "mixin",
|
|
56598
56739
|
"name": "default",
|
|
56599
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56740
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56600
56741
|
"line": {
|
|
56601
|
-
"start":
|
|
56602
|
-
"end":
|
|
56742
|
+
"start": 197,
|
|
56743
|
+
"end": 256
|
|
56603
56744
|
}
|
|
56604
56745
|
}
|
|
56605
56746
|
},
|
|
@@ -56608,10 +56749,10 @@
|
|
|
56608
56749
|
"context": {
|
|
56609
56750
|
"type": "mixin",
|
|
56610
56751
|
"name": "default",
|
|
56611
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56752
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56612
56753
|
"line": {
|
|
56613
|
-
"start":
|
|
56614
|
-
"end":
|
|
56754
|
+
"start": 197,
|
|
56755
|
+
"end": 256
|
|
56615
56756
|
}
|
|
56616
56757
|
}
|
|
56617
56758
|
},
|
|
@@ -56620,10 +56761,10 @@
|
|
|
56620
56761
|
"context": {
|
|
56621
56762
|
"type": "mixin",
|
|
56622
56763
|
"name": "default",
|
|
56623
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56764
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56624
56765
|
"line": {
|
|
56625
|
-
"start":
|
|
56626
|
-
"end":
|
|
56766
|
+
"start": 197,
|
|
56767
|
+
"end": 256
|
|
56627
56768
|
}
|
|
56628
56769
|
}
|
|
56629
56770
|
},
|
|
@@ -56632,10 +56773,10 @@
|
|
|
56632
56773
|
"context": {
|
|
56633
56774
|
"type": "mixin",
|
|
56634
56775
|
"name": "default",
|
|
56635
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56776
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56636
56777
|
"line": {
|
|
56637
|
-
"start":
|
|
56638
|
-
"end":
|
|
56778
|
+
"start": 197,
|
|
56779
|
+
"end": 256
|
|
56639
56780
|
}
|
|
56640
56781
|
}
|
|
56641
56782
|
},
|
|
@@ -56644,10 +56785,10 @@
|
|
|
56644
56785
|
"context": {
|
|
56645
56786
|
"type": "mixin",
|
|
56646
56787
|
"name": "default",
|
|
56647
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56788
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56648
56789
|
"line": {
|
|
56649
|
-
"start":
|
|
56650
|
-
"end":
|
|
56790
|
+
"start": 197,
|
|
56791
|
+
"end": 256
|
|
56651
56792
|
}
|
|
56652
56793
|
}
|
|
56653
56794
|
},
|
|
@@ -56656,10 +56797,10 @@
|
|
|
56656
56797
|
"context": {
|
|
56657
56798
|
"type": "mixin",
|
|
56658
56799
|
"name": "default",
|
|
56659
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56800
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56660
56801
|
"line": {
|
|
56661
|
-
"start":
|
|
56662
|
-
"end":
|
|
56802
|
+
"start": 197,
|
|
56803
|
+
"end": 256
|
|
56663
56804
|
}
|
|
56664
56805
|
}
|
|
56665
56806
|
},
|
|
@@ -56668,10 +56809,10 @@
|
|
|
56668
56809
|
"context": {
|
|
56669
56810
|
"type": "mixin",
|
|
56670
56811
|
"name": "default",
|
|
56671
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56812
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56672
56813
|
"line": {
|
|
56673
|
-
"start":
|
|
56674
|
-
"end":
|
|
56814
|
+
"start": 197,
|
|
56815
|
+
"end": 256
|
|
56675
56816
|
}
|
|
56676
56817
|
}
|
|
56677
56818
|
},
|
|
@@ -56680,10 +56821,10 @@
|
|
|
56680
56821
|
"context": {
|
|
56681
56822
|
"type": "mixin",
|
|
56682
56823
|
"name": "default",
|
|
56683
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56824
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56684
56825
|
"line": {
|
|
56685
|
-
"start":
|
|
56686
|
-
"end":
|
|
56826
|
+
"start": 197,
|
|
56827
|
+
"end": 256
|
|
56687
56828
|
}
|
|
56688
56829
|
}
|
|
56689
56830
|
},
|
|
@@ -56692,10 +56833,10 @@
|
|
|
56692
56833
|
"context": {
|
|
56693
56834
|
"type": "mixin",
|
|
56694
56835
|
"name": "default",
|
|
56695
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56836
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56696
56837
|
"line": {
|
|
56697
|
-
"start":
|
|
56698
|
-
"end":
|
|
56838
|
+
"start": 197,
|
|
56839
|
+
"end": 256
|
|
56699
56840
|
}
|
|
56700
56841
|
}
|
|
56701
56842
|
},
|
|
@@ -56704,10 +56845,10 @@
|
|
|
56704
56845
|
"context": {
|
|
56705
56846
|
"type": "mixin",
|
|
56706
56847
|
"name": "default",
|
|
56707
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56848
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56708
56849
|
"line": {
|
|
56709
|
-
"start":
|
|
56710
|
-
"end":
|
|
56850
|
+
"start": 197,
|
|
56851
|
+
"end": 256
|
|
56711
56852
|
}
|
|
56712
56853
|
}
|
|
56713
56854
|
},
|
|
@@ -56716,10 +56857,10 @@
|
|
|
56716
56857
|
"context": {
|
|
56717
56858
|
"type": "mixin",
|
|
56718
56859
|
"name": "default",
|
|
56719
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56860
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56720
56861
|
"line": {
|
|
56721
|
-
"start":
|
|
56722
|
-
"end":
|
|
56862
|
+
"start": 197,
|
|
56863
|
+
"end": 256
|
|
56723
56864
|
}
|
|
56724
56865
|
}
|
|
56725
56866
|
},
|
|
@@ -56728,10 +56869,22 @@
|
|
|
56728
56869
|
"context": {
|
|
56729
56870
|
"type": "mixin",
|
|
56730
56871
|
"name": "default",
|
|
56731
|
-
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-
|
|
56872
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56732
56873
|
"line": {
|
|
56733
|
-
"start":
|
|
56734
|
-
"end":
|
|
56874
|
+
"start": 197,
|
|
56875
|
+
"end": 256
|
|
56876
|
+
}
|
|
56877
|
+
}
|
|
56878
|
+
},
|
|
56879
|
+
{
|
|
56880
|
+
"description": "Output the default button styles\n",
|
|
56881
|
+
"context": {
|
|
56882
|
+
"type": "mixin",
|
|
56883
|
+
"name": "default",
|
|
56884
|
+
"code": "\n $font-size: get(\"font-size\");\n @if ($with-reset) {\n @include reset();\n }\n appearance: none; // If used with select for example\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: get(\"gap\");\n text-transform: get(\"text-transform\");\n text-shadow: get(\"text-shadow\");\n vertical-align: middle;\n font-family: get(\"font-family\");\n font-weight: get(\"font-weight\");\n @if ($font-size) {\n @include typography.size($font-size, null, true);\n }\n border-radius: get(\"border-radius\");\n // Removed not sure why it was needed, effects buttons with \n // borders (rendering between bg and border)\n // background-clip: padding-box; \n padding: get(\"padding\");\n line-height: get(\"line-height\");\n letter-spacing: get(\"letter-spacing\");\n box-shadow: get(\"box-shadow\");\n margin: get(\"margin\");\n min-width: get(\"min-width\");\n white-space: get(\"white-space\");\n max-width: 100%; // Questionable, not sure if it's needed\n flex-shrink: 0; \n // Should override link visited coloring\n \n @if get(\"transition-enabled\") {\n transition-duration: get(\"transition-duration\");\n transition-property: get(\"transition-properties\");\n }\n &,\n &:visited {\n color: color.get(get(\"color\"));\n border: get(\"border-width\") solid color.get(get(\"border-color\"));\n background-color: color.get(get(\"background-color\"));\n text-decoration: get(\"text-decoration\");\n }\n &:last-child {\n margin-right: 0;\n }\n &:hover,\n &:focus {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n border-color: color.get(get(\"border-color-hover\"));\n text-decoration: get(\"text-decoration\");\n }\n @include when-active() {\n color: color.get(get(\"color-active\"));\n background-color: color.get(get(\"background-color-active\"));\n border-color: color.get(get(\"border-color-active\"));\n }\n",
|
|
56885
|
+
"line": {
|
|
56886
|
+
"start": 197,
|
|
56887
|
+
"end": 256
|
|
56735
56888
|
}
|
|
56736
56889
|
}
|
|
56737
56890
|
},
|
|
@@ -56742,8 +56895,8 @@
|
|
|
56742
56895
|
"name": "when-active",
|
|
56743
56896
|
"code": "\n #{ get(\"active-selector\") } {\n @content;\n }\n",
|
|
56744
56897
|
"line": {
|
|
56745
|
-
"start":
|
|
56746
|
-
"end":
|
|
56898
|
+
"start": 268,
|
|
56899
|
+
"end": 272
|
|
56747
56900
|
}
|
|
56748
56901
|
}
|
|
56749
56902
|
},
|
|
@@ -56754,8 +56907,8 @@
|
|
|
56754
56907
|
"name": "size",
|
|
56755
56908
|
"code": "\n $size: utils.require-map-get($sizes, $name, 'button [size]');\n $font-size: map.get($size, \"font-size\");\n padding: map.get($size, \"padding\");\n border-radius: map.get($size, \"border-radius\");\n border-width: map.get($size, \"border-width\");\n min-width: map.get($size, \"min-width\");\n @if $font-size {\n @include typography.size($font-size);\n }\n",
|
|
56756
56909
|
"line": {
|
|
56757
|
-
"start":
|
|
56758
|
-
"end":
|
|
56910
|
+
"start": 279,
|
|
56911
|
+
"end": 289
|
|
56759
56912
|
}
|
|
56760
56913
|
}
|
|
56761
56914
|
},
|
|
@@ -56766,8 +56919,8 @@
|
|
|
56766
56919
|
"name": "size",
|
|
56767
56920
|
"code": "\n $size: utils.require-map-get($sizes, $name, 'button [size]');\n $font-size: map.get($size, \"font-size\");\n padding: map.get($size, \"padding\");\n border-radius: map.get($size, \"border-radius\");\n border-width: map.get($size, \"border-width\");\n min-width: map.get($size, \"min-width\");\n @if $font-size {\n @include typography.size($font-size);\n }\n",
|
|
56768
56921
|
"line": {
|
|
56769
|
-
"start":
|
|
56770
|
-
"end":
|
|
56922
|
+
"start": 279,
|
|
56923
|
+
"end": 289
|
|
56771
56924
|
}
|
|
56772
56925
|
}
|
|
56773
56926
|
},
|
|
@@ -56778,8 +56931,8 @@
|
|
|
56778
56931
|
"name": "size",
|
|
56779
56932
|
"code": "\n $size: utils.require-map-get($sizes, $name, 'button [size]');\n $font-size: map.get($size, \"font-size\");\n padding: map.get($size, \"padding\");\n border-radius: map.get($size, \"border-radius\");\n border-width: map.get($size, \"border-width\");\n min-width: map.get($size, \"min-width\");\n @if $font-size {\n @include typography.size($font-size);\n }\n",
|
|
56780
56933
|
"line": {
|
|
56781
|
-
"start":
|
|
56782
|
-
"end":
|
|
56934
|
+
"start": 279,
|
|
56935
|
+
"end": 289
|
|
56783
56936
|
}
|
|
56784
56937
|
}
|
|
56785
56938
|
},
|
|
@@ -56790,8 +56943,8 @@
|
|
|
56790
56943
|
"name": "size",
|
|
56791
56944
|
"code": "\n $size: utils.require-map-get($sizes, $name, 'button [size]');\n $font-size: map.get($size, \"font-size\");\n padding: map.get($size, \"padding\");\n border-radius: map.get($size, \"border-radius\");\n border-width: map.get($size, \"border-width\");\n min-width: map.get($size, \"min-width\");\n @if $font-size {\n @include typography.size($font-size);\n }\n",
|
|
56792
56945
|
"line": {
|
|
56793
|
-
"start":
|
|
56794
|
-
"end":
|
|
56946
|
+
"start": 279,
|
|
56947
|
+
"end": 289
|
|
56795
56948
|
}
|
|
56796
56949
|
}
|
|
56797
56950
|
},
|
|
@@ -56802,8 +56955,8 @@
|
|
|
56802
56955
|
"name": "size",
|
|
56803
56956
|
"code": "\n $size: utils.require-map-get($sizes, $name, 'button [size]');\n $font-size: map.get($size, \"font-size\");\n padding: map.get($size, \"padding\");\n border-radius: map.get($size, \"border-radius\");\n border-width: map.get($size, \"border-width\");\n min-width: map.get($size, \"min-width\");\n @if $font-size {\n @include typography.size($font-size);\n }\n",
|
|
56804
56957
|
"line": {
|
|
56805
|
-
"start":
|
|
56806
|
-
"end":
|
|
56958
|
+
"start": 279,
|
|
56959
|
+
"end": 289
|
|
56807
56960
|
}
|
|
56808
56961
|
}
|
|
56809
56962
|
},
|
|
@@ -56814,8 +56967,8 @@
|
|
|
56814
56967
|
"name": "get-style-value",
|
|
56815
56968
|
"code": "\n $style: utils.require-map-get($styles, $name, 'button [color value]');\n $state-style: ();\n // If a specific state [hover, active] grab that map\n @if ($state) {\n $state-style: map.get($style, $state);\n $state-style: utils.when($state-style, $state-style, ());\n }\n // From is the map to grab styles from\n $from: utils.when($state, $state-style, $style);\n $value: map.get($from, $prop);\n\n // Fallback to parent (if hover)\n @if ($state == \"hover\") {\n $value: utils.when($value, $value, map.get($style, $prop)); \n }\n\n @if (meta.type-of($value) == \"string\" and string.index($prop, \"color\")) {\n @return color.get($value);\n } @else {\n @return $value;\n }\n",
|
|
56816
56969
|
"line": {
|
|
56817
|
-
"start":
|
|
56818
|
-
"end":
|
|
56970
|
+
"start": 297,
|
|
56971
|
+
"end": 319
|
|
56819
56972
|
}
|
|
56820
56973
|
}
|
|
56821
56974
|
},
|
|
@@ -56826,8 +56979,8 @@
|
|
|
56826
56979
|
"name": "get-style-value",
|
|
56827
56980
|
"code": "\n $style: utils.require-map-get($styles, $name, 'button [color value]');\n $state-style: ();\n // If a specific state [hover, active] grab that map\n @if ($state) {\n $state-style: map.get($style, $state);\n $state-style: utils.when($state-style, $state-style, ());\n }\n // From is the map to grab styles from\n $from: utils.when($state, $state-style, $style);\n $value: map.get($from, $prop);\n\n // Fallback to parent (if hover)\n @if ($state == \"hover\") {\n $value: utils.when($value, $value, map.get($style, $prop)); \n }\n\n @if (meta.type-of($value) == \"string\" and string.index($prop, \"color\")) {\n @return color.get($value);\n } @else {\n @return $value;\n }\n",
|
|
56828
56981
|
"line": {
|
|
56829
|
-
"start":
|
|
56830
|
-
"end":
|
|
56982
|
+
"start": 297,
|
|
56983
|
+
"end": 319
|
|
56831
56984
|
}
|
|
56832
56985
|
}
|
|
56833
56986
|
},
|
|
@@ -56838,8 +56991,8 @@
|
|
|
56838
56991
|
"name": "get-style-value",
|
|
56839
56992
|
"code": "\n $style: utils.require-map-get($styles, $name, 'button [color value]');\n $state-style: ();\n // If a specific state [hover, active] grab that map\n @if ($state) {\n $state-style: map.get($style, $state);\n $state-style: utils.when($state-style, $state-style, ());\n }\n // From is the map to grab styles from\n $from: utils.when($state, $state-style, $style);\n $value: map.get($from, $prop);\n\n // Fallback to parent (if hover)\n @if ($state == \"hover\") {\n $value: utils.when($value, $value, map.get($style, $prop)); \n }\n\n @if (meta.type-of($value) == \"string\" and string.index($prop, \"color\")) {\n @return color.get($value);\n } @else {\n @return $value;\n }\n",
|
|
56840
56993
|
"line": {
|
|
56841
|
-
"start":
|
|
56842
|
-
"end":
|
|
56994
|
+
"start": 297,
|
|
56995
|
+
"end": 319
|
|
56843
56996
|
}
|
|
56844
56997
|
}
|
|
56845
56998
|
},
|
|
@@ -56850,8 +57003,8 @@
|
|
|
56850
57003
|
"name": "get-style-value",
|
|
56851
57004
|
"code": "\n $style: utils.require-map-get($styles, $name, 'button [color value]');\n $state-style: ();\n // If a specific state [hover, active] grab that map\n @if ($state) {\n $state-style: map.get($style, $state);\n $state-style: utils.when($state-style, $state-style, ());\n }\n // From is the map to grab styles from\n $from: utils.when($state, $state-style, $style);\n $value: map.get($from, $prop);\n\n // Fallback to parent (if hover)\n @if ($state == \"hover\") {\n $value: utils.when($value, $value, map.get($style, $prop)); \n }\n\n @if (meta.type-of($value) == \"string\" and string.index($prop, \"color\")) {\n @return color.get($value);\n } @else {\n @return $value;\n }\n",
|
|
56852
57005
|
"line": {
|
|
56853
|
-
"start":
|
|
56854
|
-
"end":
|
|
57006
|
+
"start": 297,
|
|
57007
|
+
"end": 319
|
|
56855
57008
|
}
|
|
56856
57009
|
}
|
|
56857
57010
|
},
|
|
@@ -58454,8 +58607,8 @@
|
|
|
58454
58607
|
"name": "set-sizes",
|
|
58455
58608
|
"code": "\n $sizes: utils.map-merge($sizes, $changes, $merge-mode) !global;\n",
|
|
58456
58609
|
"line": {
|
|
58457
|
-
"start":
|
|
58458
|
-
"end":
|
|
58610
|
+
"start": 175,
|
|
58611
|
+
"end": 177
|
|
58459
58612
|
}
|
|
58460
58613
|
}
|
|
58461
58614
|
},
|
|
@@ -58466,8 +58619,8 @@
|
|
|
58466
58619
|
"name": "set-sizes",
|
|
58467
58620
|
"code": "\n $sizes: utils.map-merge($sizes, $changes, $merge-mode) !global;\n",
|
|
58468
58621
|
"line": {
|
|
58469
|
-
"start":
|
|
58470
|
-
"end":
|
|
58622
|
+
"start": 175,
|
|
58623
|
+
"end": 177
|
|
58471
58624
|
}
|
|
58472
58625
|
}
|
|
58473
58626
|
},
|
|
@@ -58478,8 +58631,8 @@
|
|
|
58478
58631
|
"name": "size",
|
|
58479
58632
|
"code": "\n $size: utils.require-map-get($sizes, $name, 'button [size]');\n $font-size: map.get($size, \"font-size\");\n padding: map.get($size, \"padding\");\n border-radius: map.get($size, \"border-radius\");\n border-width: map.get($size, \"border-width\");\n min-width: map.get($size, \"min-width\");\n @if $font-size {\n @include typography.size($font-size);\n }\n",
|
|
58480
58633
|
"line": {
|
|
58481
|
-
"start":
|
|
58482
|
-
"end":
|
|
58634
|
+
"start": 279,
|
|
58635
|
+
"end": 289
|
|
58483
58636
|
}
|
|
58484
58637
|
}
|
|
58485
58638
|
},
|
|
@@ -62716,8 +62869,8 @@
|
|
|
62716
62869
|
"name": "get",
|
|
62717
62870
|
"code": "\n $value: utils.require-map-get($config, $name, \"button [config]\");\n @return utils.function-fallback($name, $value, $-fallbacks);\n",
|
|
62718
62871
|
"line": {
|
|
62719
|
-
"start":
|
|
62720
|
-
"end":
|
|
62872
|
+
"start": 156,
|
|
62873
|
+
"end": 159
|
|
62721
62874
|
}
|
|
62722
62875
|
}
|
|
62723
62876
|
},
|
|
@@ -62728,8 +62881,8 @@
|
|
|
62728
62881
|
"name": "size",
|
|
62729
62882
|
"code": "\n $size: utils.require-map-get($sizes, $name, 'button [size]');\n $font-size: map.get($size, \"font-size\");\n padding: map.get($size, \"padding\");\n border-radius: map.get($size, \"border-radius\");\n border-width: map.get($size, \"border-width\");\n min-width: map.get($size, \"min-width\");\n @if $font-size {\n @include typography.size($font-size);\n }\n",
|
|
62730
62883
|
"line": {
|
|
62731
|
-
"start":
|
|
62732
|
-
"end":
|
|
62884
|
+
"start": 279,
|
|
62885
|
+
"end": 289
|
|
62733
62886
|
}
|
|
62734
62887
|
}
|
|
62735
62888
|
},
|
|
@@ -62740,8 +62893,8 @@
|
|
|
62740
62893
|
"name": "get-style-value",
|
|
62741
62894
|
"code": "\n $style: utils.require-map-get($styles, $name, 'button [color value]');\n $state-style: ();\n // If a specific state [hover, active] grab that map\n @if ($state) {\n $state-style: map.get($style, $state);\n $state-style: utils.when($state-style, $state-style, ());\n }\n // From is the map to grab styles from\n $from: utils.when($state, $state-style, $style);\n $value: map.get($from, $prop);\n\n // Fallback to parent (if hover)\n @if ($state == \"hover\") {\n $value: utils.when($value, $value, map.get($style, $prop)); \n }\n\n @if (meta.type-of($value) == \"string\" and string.index($prop, \"color\")) {\n @return color.get($value);\n } @else {\n @return $value;\n }\n",
|
|
62742
62895
|
"line": {
|
|
62743
|
-
"start":
|
|
62744
|
-
"end":
|
|
62896
|
+
"start": 297,
|
|
62897
|
+
"end": 319
|
|
62745
62898
|
}
|
|
62746
62899
|
}
|
|
62747
62900
|
},
|
|
@@ -63262,8 +63415,8 @@
|
|
|
63262
63415
|
"name": "get-style-value",
|
|
63263
63416
|
"code": "\n $style: utils.require-map-get($styles, $name, 'button [color value]');\n $state-style: ();\n // If a specific state [hover, active] grab that map\n @if ($state) {\n $state-style: map.get($style, $state);\n $state-style: utils.when($state-style, $state-style, ());\n }\n // From is the map to grab styles from\n $from: utils.when($state, $state-style, $style);\n $value: map.get($from, $prop);\n\n // Fallback to parent (if hover)\n @if ($state == \"hover\") {\n $value: utils.when($value, $value, map.get($style, $prop)); \n }\n\n @if (meta.type-of($value) == \"string\" and string.index($prop, \"color\")) {\n @return color.get($value);\n } @else {\n @return $value;\n }\n",
|
|
63264
63417
|
"line": {
|
|
63265
|
-
"start":
|
|
63266
|
-
"end":
|
|
63418
|
+
"start": 297,
|
|
63419
|
+
"end": 319
|
|
63267
63420
|
}
|
|
63268
63421
|
}
|
|
63269
63422
|
},
|
|
@@ -63274,8 +63427,8 @@
|
|
|
63274
63427
|
"name": "get-style-value",
|
|
63275
63428
|
"code": "\n $style: utils.require-map-get($styles, $name, 'button [color value]');\n $state-style: ();\n // If a specific state [hover, active] grab that map\n @if ($state) {\n $state-style: map.get($style, $state);\n $state-style: utils.when($state-style, $state-style, ());\n }\n // From is the map to grab styles from\n $from: utils.when($state, $state-style, $style);\n $value: map.get($from, $prop);\n\n // Fallback to parent (if hover)\n @if ($state == \"hover\") {\n $value: utils.when($value, $value, map.get($style, $prop)); \n }\n\n @if (meta.type-of($value) == \"string\" and string.index($prop, \"color\")) {\n @return color.get($value);\n } @else {\n @return $value;\n }\n",
|
|
63276
63429
|
"line": {
|
|
63277
|
-
"start":
|
|
63278
|
-
"end":
|
|
63430
|
+
"start": 297,
|
|
63431
|
+
"end": 319
|
|
63279
63432
|
}
|
|
63280
63433
|
}
|
|
63281
63434
|
},
|
|
@@ -63286,8 +63439,8 @@
|
|
|
63286
63439
|
"name": "get-style-value",
|
|
63287
63440
|
"code": "\n $style: utils.require-map-get($styles, $name, 'button [color value]');\n $state-style: ();\n // If a specific state [hover, active] grab that map\n @if ($state) {\n $state-style: map.get($style, $state);\n $state-style: utils.when($state-style, $state-style, ());\n }\n // From is the map to grab styles from\n $from: utils.when($state, $state-style, $style);\n $value: map.get($from, $prop);\n\n // Fallback to parent (if hover)\n @if ($state == \"hover\") {\n $value: utils.when($value, $value, map.get($style, $prop)); \n }\n\n @if (meta.type-of($value) == \"string\" and string.index($prop, \"color\")) {\n @return color.get($value);\n } @else {\n @return $value;\n }\n",
|
|
63288
63441
|
"line": {
|
|
63289
|
-
"start":
|
|
63290
|
-
"end":
|
|
63442
|
+
"start": 297,
|
|
63443
|
+
"end": 319
|
|
63291
63444
|
}
|
|
63292
63445
|
}
|
|
63293
63446
|
},
|
|
@@ -63862,8 +64015,8 @@
|
|
|
63862
64015
|
"name": "set-styles",
|
|
63863
64016
|
"code": "\n $styles: utils.map-merge($styles, $changes, $merge-mode) !global;\n",
|
|
63864
64017
|
"line": {
|
|
63865
|
-
"start":
|
|
63866
|
-
"end":
|
|
64018
|
+
"start": 166,
|
|
64019
|
+
"end": 168
|
|
63867
64020
|
}
|
|
63868
64021
|
}
|
|
63869
64022
|
},
|
|
@@ -63874,8 +64027,8 @@
|
|
|
63874
64027
|
"name": "set-sizes",
|
|
63875
64028
|
"code": "\n $sizes: utils.map-merge($sizes, $changes, $merge-mode) !global;\n",
|
|
63876
64029
|
"line": {
|
|
63877
|
-
"start":
|
|
63878
|
-
"end":
|
|
64030
|
+
"start": 175,
|
|
64031
|
+
"end": 177
|
|
63879
64032
|
}
|
|
63880
64033
|
}
|
|
63881
64034
|
},
|
|
@@ -64422,8 +64575,8 @@
|
|
|
64422
64575
|
"name": "get",
|
|
64423
64576
|
"code": "\n $value: utils.require-map-get($config, $name, \"button [config]\");\n @return utils.function-fallback($name, $value, $-fallbacks);\n",
|
|
64424
64577
|
"line": {
|
|
64425
|
-
"start":
|
|
64426
|
-
"end":
|
|
64578
|
+
"start": 156,
|
|
64579
|
+
"end": 159
|
|
64427
64580
|
}
|
|
64428
64581
|
}
|
|
64429
64582
|
}
|