@ulu/frontend 0.6.13 → 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.
@@ -1208,10 +1208,16 @@
1208
1208
  "properties": [
1209
1209
  {
1210
1210
  "name": "background-color",
1211
- "type": "Number",
1211
+ "type": "Color",
1212
1212
  "description": "Background color (if no image)",
1213
1213
  "default": "gray"
1214
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
+ },
1215
1221
  {
1216
1222
  "name": "border-radius",
1217
1223
  "type": "Number",
@@ -1220,10 +1226,28 @@
1220
1226
  },
1221
1227
  {
1222
1228
  "name": "color",
1223
- "type": "Number",
1229
+ "type": "Color",
1224
1230
  "description": "Type color",
1225
1231
  "default": "black"
1226
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
+ },
1227
1251
  {
1228
1252
  "name": "font-size",
1229
1253
  "type": "Number",
@@ -1232,13 +1256,13 @@
1232
1256
  },
1233
1257
  {
1234
1258
  "name": "font-weight",
1235
- "type": "Number",
1259
+ "type": "Keyword",
1236
1260
  "description": "Font weight",
1237
1261
  "default": "bold"
1238
1262
  },
1239
1263
  {
1240
1264
  "name": "font-family",
1241
- "type": "Number",
1265
+ "type": "String",
1242
1266
  "description": "Specify font family, defaults to typography font-family-sans",
1243
1267
  "default": "true"
1244
1268
  },
@@ -1411,6 +1435,12 @@
1411
1435
  "description": "Adjust button line wrapping, by default line's are not wrapped",
1412
1436
  "default": "nowrap"
1413
1437
  },
1438
+ {
1439
+ "name": "gap",
1440
+ "type": "Dimension",
1441
+ "description": "Gap to use between items within the button",
1442
+ "default": "0.5em"
1443
+ },
1414
1444
  {
1415
1445
  "name": "border-color",
1416
1446
  "type": "String",
@@ -13827,8 +13857,8 @@
13827
13857
  "name": "set",
13828
13858
  "code": "\n $config: map.merge($config, $changes) !global;\n",
13829
13859
  "line": {
13830
- "start": 59,
13831
- "end": 61
13860
+ "start": 67,
13861
+ "end": 69
13832
13862
  }
13833
13863
  }
13834
13864
  },
@@ -13839,8 +13869,8 @@
13839
13869
  "name": "set",
13840
13870
  "code": "\n $config: map.merge($config, $changes) !global;\n",
13841
13871
  "line": {
13842
- "start": 59,
13843
- "end": 61
13872
+ "start": 67,
13873
+ "end": 69
13844
13874
  }
13845
13875
  }
13846
13876
  },
@@ -13851,8 +13881,8 @@
13851
13881
  "name": "get",
13852
13882
  "code": "\n $value: utils.require-map-get($config, $name, \"badge [config]\");\n @return utils.function-fallback($name, $value, $-fallbacks);\n",
13853
13883
  "line": {
13854
- "start": 68,
13855
- "end": 71
13884
+ "start": 76,
13885
+ "end": 79
13856
13886
  }
13857
13887
  }
13858
13888
  },
@@ -16685,10 +16715,34 @@
16685
16715
  "context": {
16686
16716
  "type": "mixin",
16687
16717
  "name": "styles",
16688
- "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 // Incase 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 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",
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",
16731
+ "line": {
16732
+ "start": 97,
16733
+ "end": 165
16734
+ }
16735
+ }
16736
+ },
16737
+ {
16738
+ "description": "Output badge component styles\n",
16739
+ "context": {
16740
+ "type": "mixin",
16741
+ "name": "styles",
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",
16689
16743
  "line": {
16690
- "start": 89,
16691
- "end": 153
16744
+ "start": 97,
16745
+ "end": 165
16692
16746
  }
16693
16747
  }
16694
16748
  },
@@ -16697,10 +16751,10 @@
16697
16751
  "context": {
16698
16752
  "type": "mixin",
16699
16753
  "name": "styles",
16700
- "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 // Incase 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 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",
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",
16701
16755
  "line": {
16702
- "start": 89,
16703
- "end": 153
16756
+ "start": 97,
16757
+ "end": 165
16704
16758
  }
16705
16759
  }
16706
16760
  },
@@ -16709,10 +16763,10 @@
16709
16763
  "context": {
16710
16764
  "type": "mixin",
16711
16765
  "name": "styles",
16712
- "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 // Incase 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 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",
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",
16713
16767
  "line": {
16714
- "start": 89,
16715
- "end": 153
16768
+ "start": 97,
16769
+ "end": 165
16716
16770
  }
16717
16771
  }
16718
16772
  },
@@ -16721,10 +16775,22 @@
16721
16775
  "context": {
16722
16776
  "type": "mixin",
16723
16777
  "name": "styles",
16724
- "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 // Incase 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 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",
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",
16725
16779
  "line": {
16726
- "start": 89,
16727
- "end": 153
16780
+ "start": 97,
16781
+ "end": 165
16782
+ }
16783
+ }
16784
+ },
16785
+ {
16786
+ "description": "Output badge component styles\n",
16787
+ "context": {
16788
+ "type": "mixin",
16789
+ "name": "styles",
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",
16791
+ "line": {
16792
+ "start": 97,
16793
+ "end": 165
16728
16794
  }
16729
16795
  }
16730
16796
  },
@@ -16733,10 +16799,10 @@
16733
16799
  "context": {
16734
16800
  "type": "mixin",
16735
16801
  "name": "styles",
16736
- "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 // Incase 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 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",
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",
16737
16803
  "line": {
16738
- "start": 89,
16739
- "end": 153
16804
+ "start": 97,
16805
+ "end": 165
16740
16806
  }
16741
16807
  }
16742
16808
  },
@@ -16745,10 +16811,10 @@
16745
16811
  "context": {
16746
16812
  "type": "mixin",
16747
16813
  "name": "styles",
16748
- "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 // Incase 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 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",
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",
16749
16815
  "line": {
16750
- "start": 89,
16751
- "end": 153
16816
+ "start": 97,
16817
+ "end": 165
16752
16818
  }
16753
16819
  }
16754
16820
  },
@@ -16757,10 +16823,10 @@
16757
16823
  "context": {
16758
16824
  "type": "mixin",
16759
16825
  "name": "styles",
16760
- "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 // Incase 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 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",
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",
16761
16827
  "line": {
16762
- "start": 89,
16763
- "end": 153
16828
+ "start": 97,
16829
+ "end": 165
16764
16830
  }
16765
16831
  }
16766
16832
  },
@@ -16769,10 +16835,10 @@
16769
16835
  "context": {
16770
16836
  "type": "mixin",
16771
16837
  "name": "styles",
16772
- "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 // Incase 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 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",
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",
16773
16839
  "line": {
16774
- "start": 89,
16775
- "end": 153
16840
+ "start": 97,
16841
+ "end": 165
16776
16842
  }
16777
16843
  }
16778
16844
  },
@@ -16781,10 +16847,10 @@
16781
16847
  "context": {
16782
16848
  "type": "mixin",
16783
16849
  "name": "styles",
16784
- "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 // Incase 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 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",
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",
16785
16851
  "line": {
16786
- "start": 89,
16787
- "end": 153
16852
+ "start": 97,
16853
+ "end": 165
16788
16854
  }
16789
16855
  }
16790
16856
  },
@@ -16793,10 +16859,10 @@
16793
16859
  "context": {
16794
16860
  "type": "mixin",
16795
16861
  "name": "styles",
16796
- "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 // Incase 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 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",
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",
16797
16863
  "line": {
16798
- "start": 89,
16799
- "end": 153
16864
+ "start": 97,
16865
+ "end": 165
16800
16866
  }
16801
16867
  }
16802
16868
  },
@@ -16805,10 +16871,10 @@
16805
16871
  "context": {
16806
16872
  "type": "mixin",
16807
16873
  "name": "styles",
16808
- "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 // Incase 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 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",
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",
16809
16875
  "line": {
16810
- "start": 89,
16811
- "end": 153
16876
+ "start": 97,
16877
+ "end": 165
16812
16878
  }
16813
16879
  }
16814
16880
  },
@@ -16817,10 +16883,10 @@
16817
16883
  "context": {
16818
16884
  "type": "mixin",
16819
16885
  "name": "styles",
16820
- "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 // Incase 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 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",
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",
16821
16887
  "line": {
16822
- "start": 89,
16823
- "end": 153
16888
+ "start": 97,
16889
+ "end": 165
16824
16890
  }
16825
16891
  }
16826
16892
  },
@@ -16829,10 +16895,10 @@
16829
16895
  "context": {
16830
16896
  "type": "mixin",
16831
16897
  "name": "styles",
16832
- "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 // Incase 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 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",
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",
16833
16899
  "line": {
16834
- "start": 89,
16835
- "end": 153
16900
+ "start": 97,
16901
+ "end": 165
16836
16902
  }
16837
16903
  }
16838
16904
  },
@@ -16841,10 +16907,10 @@
16841
16907
  "context": {
16842
16908
  "type": "mixin",
16843
16909
  "name": "styles",
16844
- "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 // Incase 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 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",
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",
16845
16911
  "line": {
16846
- "start": 89,
16847
- "end": 153
16912
+ "start": 97,
16913
+ "end": 165
16848
16914
  }
16849
16915
  }
16850
16916
  },
@@ -16853,10 +16919,46 @@
16853
16919
  "context": {
16854
16920
  "type": "mixin",
16855
16921
  "name": "styles",
16856
- "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 // Incase 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 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",
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",
16857
16923
  "line": {
16858
- "start": 89,
16859
- "end": 153
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
16860
16962
  }
16861
16963
  }
16862
16964
  },
@@ -32650,26 +32752,32 @@
32650
32752
  "description": "Module Settings\n",
32651
32753
  "commentRange": {
32652
32754
  "start": 21,
32653
- "end": 31
32755
+ "end": 35
32654
32756
  },
32655
32757
  "context": {
32656
32758
  "type": "variable",
32657
32759
  "name": "config",
32658
- "value": "(\n \"background-color\": gray,\n \"border-radius\": 50%,\n \"color\": black,\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)",
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)",
32659
32761
  "scope": "default",
32660
32762
  "line": {
32661
- "start": 33,
32662
- "end": 52
32763
+ "start": 37,
32764
+ "end": 60
32663
32765
  }
32664
32766
  },
32665
32767
  "type": "Map",
32666
32768
  "property": [
32667
32769
  {
32668
- "type": "Number",
32770
+ "type": "Color",
32669
32771
  "name": "background-color",
32670
32772
  "default": "gray",
32671
32773
  "description": "Background color (if no image)"
32672
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
+ },
32673
32781
  {
32674
32782
  "type": "Number",
32675
32783
  "name": "border-radius",
@@ -32677,11 +32785,29 @@
32677
32785
  "description": "Border radius of badge"
32678
32786
  },
32679
32787
  {
32680
- "type": "Number",
32788
+ "type": "Color",
32681
32789
  "name": "color",
32682
32790
  "default": "black",
32683
32791
  "description": "Type color"
32684
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
+ },
32685
32811
  {
32686
32812
  "type": "Number",
32687
32813
  "name": "font-size",
@@ -32689,13 +32815,13 @@
32689
32815
  "description": "Font size (basic ie. 1.3rem) for badge"
32690
32816
  },
32691
32817
  {
32692
- "type": "Number",
32818
+ "type": "Keyword",
32693
32819
  "name": "font-weight",
32694
32820
  "default": "bold",
32695
32821
  "description": "Font weight"
32696
32822
  },
32697
32823
  {
32698
- "type": "Number",
32824
+ "type": "String",
32699
32825
  "name": "font-family",
32700
32826
  "default": "true",
32701
32827
  "description": "Specify font family, defaults to typography font-family-sans"
@@ -32735,16 +32861,16 @@
32735
32861
  "path": "/sass/components/badge/#mixin-set",
32736
32862
  "description": "Change modules $config\n",
32737
32863
  "commentRange": {
32738
- "start": 54,
32739
- "end": 57
32864
+ "start": 62,
32865
+ "end": 65
32740
32866
  },
32741
32867
  "context": {
32742
32868
  "type": "mixin",
32743
32869
  "name": "set",
32744
32870
  "code": "\n $config: map.merge($config, $changes) !global;\n",
32745
32871
  "line": {
32746
- "start": 59,
32747
- "end": 61
32872
+ "start": 67,
32873
+ "end": 69
32748
32874
  }
32749
32875
  },
32750
32876
  "parameter": [
@@ -32786,16 +32912,16 @@
32786
32912
  "path": "/sass/components/badge/#function-get",
32787
32913
  "description": "Get a config option\n",
32788
32914
  "commentRange": {
32789
- "start": 63,
32790
- "end": 66
32915
+ "start": 71,
32916
+ "end": 74
32791
32917
  },
32792
32918
  "context": {
32793
32919
  "type": "function",
32794
32920
  "name": "get",
32795
32921
  "code": "\n $value: utils.require-map-get($config, $name, \"badge [config]\");\n @return utils.function-fallback($name, $value, $-fallbacks);\n",
32796
32922
  "line": {
32797
- "start": 68,
32798
- "end": 71
32923
+ "start": 76,
32924
+ "end": 79
32799
32925
  }
32800
32926
  },
32801
32927
  "parameter": [
@@ -32833,16 +32959,16 @@
32833
32959
  "path": "/sass/components/badge/#mixin-styles",
32834
32960
  "description": "Output badge component styles\n",
32835
32961
  "commentRange": {
32836
- "start": 73,
32837
- "end": 87
32962
+ "start": 81,
32963
+ "end": 95
32838
32964
  },
32839
32965
  "context": {
32840
32966
  "type": "mixin",
32841
32967
  "name": "styles",
32842
- "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 // Incase 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 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",
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",
32843
32969
  "line": {
32844
- "start": 89,
32845
- "end": 153
32970
+ "start": 97,
32971
+ "end": 165
32846
32972
  }
32847
32973
  },
32848
32974
  "example": [
@@ -32918,6 +33044,30 @@
32918
33044
  "type": "function",
32919
33045
  "name": "get"
32920
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
+ },
32921
33071
  {
32922
33072
  "type": "function",
32923
33073
  "name": "get"
@@ -33646,7 +33796,7 @@
33646
33796
  "description": "Module Settings\n",
33647
33797
  "commentRange": {
33648
33798
  "start": 21,
33649
- "end": 53
33799
+ "end": 54
33650
33800
  },
33651
33801
  "context": {
33652
33802
  "type": "variable",
@@ -33654,8 +33804,8 @@
33654
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)",
33655
33805
  "scope": "default",
33656
33806
  "line": {
33657
- "start": 55,
33658
- "end": 88
33807
+ "start": 56,
33808
+ "end": 89
33659
33809
  }
33660
33810
  },
33661
33811
  "type": "Map",
@@ -33707,6 +33857,12 @@
33707
33857
  "default": "nowrap",
33708
33858
  "description": "Adjust button line wrapping, by default line's are not wrapped"
33709
33859
  },
33860
+ {
33861
+ "type": "Dimension",
33862
+ "name": "gap",
33863
+ "default": "0.5em",
33864
+ "description": "Gap to use between items within the button"
33865
+ },
33710
33866
  {
33711
33867
  "type": "String",
33712
33868
  "name": "border-color",
@@ -33862,8 +34018,8 @@
33862
34018
  "path": "/sass/core/button/#variable-sizes",
33863
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",
33864
34020
  "commentRange": {
33865
- "start": 90,
33866
- "end": 94
34021
+ "start": 91,
34022
+ "end": 95
33867
34023
  },
33868
34024
  "context": {
33869
34025
  "type": "variable",
@@ -33871,8 +34027,8 @@
33871
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)",
33872
34028
  "scope": "default",
33873
34029
  "line": {
33874
- "start": 95,
33875
- "end": 108
34030
+ "start": 96,
34031
+ "end": 109
33876
34032
  }
33877
34033
  },
33878
34034
  "type": "Map",
@@ -33892,8 +34048,8 @@
33892
34048
  "path": "/sass/core/button/#variable-styles",
33893
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",
33894
34050
  "commentRange": {
33895
- "start": 110,
33896
- "end": 113
34051
+ "start": 111,
34052
+ "end": 114
33897
34053
  },
33898
34054
  "context": {
33899
34055
  "type": "variable",
@@ -33901,8 +34057,8 @@
33901
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)",
33902
34058
  "scope": "default",
33903
34059
  "line": {
33904
- "start": 115,
33905
- "end": 138
34060
+ "start": 116,
34061
+ "end": 139
33906
34062
  }
33907
34063
  },
33908
34064
  "type": "Map",
@@ -33922,8 +34078,8 @@
33922
34078
  "name": "set-styles",
33923
34079
  "code": "\n $styles: utils.map-merge($styles, $changes, $merge-mode) !global;\n",
33924
34080
  "line": {
33925
- "start": 165,
33926
- "end": 167
34081
+ "start": 166,
34082
+ "end": 168
33927
34083
  }
33928
34084
  }
33929
34085
  },
@@ -33934,8 +34090,8 @@
33934
34090
  "name": "set-styles",
33935
34091
  "code": "\n $styles: utils.map-merge($styles, $changes, $merge-mode) !global;\n",
33936
34092
  "line": {
33937
- "start": 165,
33938
- "end": 167
34093
+ "start": 166,
34094
+ "end": 168
33939
34095
  }
33940
34096
  }
33941
34097
  },
@@ -33946,8 +34102,8 @@
33946
34102
  "name": "get-style-value",
33947
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",
33948
34104
  "line": {
33949
- "start": 296,
33950
- "end": 318
34105
+ "start": 297,
34106
+ "end": 319
33951
34107
  }
33952
34108
  }
33953
34109
  }
@@ -33960,16 +34116,16 @@
33960
34116
  "path": "/sass/core/button/#mixin-set",
33961
34117
  "description": "Change modules $config\n",
33962
34118
  "commentRange": {
33963
- "start": 140,
33964
- "end": 143
34119
+ "start": 141,
34120
+ "end": 144
33965
34121
  },
33966
34122
  "context": {
33967
34123
  "type": "mixin",
33968
34124
  "name": "set",
33969
34125
  "code": "\n $config: map.merge($config, $changes) !global;\n",
33970
34126
  "line": {
33971
- "start": 145,
33972
- "end": 147
34127
+ "start": 146,
34128
+ "end": 148
33973
34129
  }
33974
34130
  },
33975
34131
  "parameter": [
@@ -34012,16 +34168,16 @@
34012
34168
  "path": "/sass/core/button/#function-get",
34013
34169
  "description": "Get a config option\n",
34014
34170
  "commentRange": {
34015
- "start": 149,
34016
- "end": 153
34171
+ "start": 150,
34172
+ "end": 154
34017
34173
  },
34018
34174
  "context": {
34019
34175
  "type": "function",
34020
34176
  "name": "get",
34021
34177
  "code": "\n $value: utils.require-map-get($config, $name, \"button [config]\");\n @return utils.function-fallback($name, $value, $-fallbacks);\n",
34022
34178
  "line": {
34023
- "start": 155,
34024
- "end": 158
34179
+ "start": 156,
34180
+ "end": 159
34025
34181
  }
34026
34182
  },
34027
34183
  "parameter": [
@@ -34072,16 +34228,16 @@
34072
34228
  "path": "/sass/core/button/#mixin-set-styles",
34073
34229
  "description": "Set button styles \n- See $styles for example of structure of map\n",
34074
34230
  "commentRange": {
34075
- "start": 160,
34076
- "end": 163
34231
+ "start": 161,
34232
+ "end": 164
34077
34233
  },
34078
34234
  "context": {
34079
34235
  "type": "mixin",
34080
34236
  "name": "set-styles",
34081
34237
  "code": "\n $styles: utils.map-merge($styles, $changes, $merge-mode) !global;\n",
34082
34238
  "line": {
34083
- "start": 165,
34084
- "end": 167
34239
+ "start": 166,
34240
+ "end": 168
34085
34241
  }
34086
34242
  },
34087
34243
  "parameter": [
@@ -34126,16 +34282,16 @@
34126
34282
  "path": "/sass/core/button/#mixin-set-sizes",
34127
34283
  "description": "Set Button Sizes\n- See $sizes for example of structure of map\n",
34128
34284
  "commentRange": {
34129
- "start": 169,
34130
- "end": 172
34285
+ "start": 170,
34286
+ "end": 173
34131
34287
  },
34132
34288
  "context": {
34133
34289
  "type": "mixin",
34134
34290
  "name": "set-sizes",
34135
34291
  "code": "\n $sizes: utils.map-merge($sizes, $changes, $merge-mode) !global;\n",
34136
34292
  "line": {
34137
- "start": 174,
34138
- "end": 176
34293
+ "start": 175,
34294
+ "end": 177
34139
34295
  }
34140
34296
  },
34141
34297
  "parameter": [
@@ -34180,16 +34336,16 @@
34180
34336
  "path": "/sass/core/button/#mixin-reset",
34181
34337
  "description": "Reset CSS for button (to change browser defaults for button styling)\n",
34182
34338
  "commentRange": {
34183
- "start": 178,
34184
- "end": 178
34339
+ "start": 179,
34340
+ "end": 179
34185
34341
  },
34186
34342
  "context": {
34187
34343
  "type": "mixin",
34188
34344
  "name": "reset",
34189
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",
34190
34346
  "line": {
34191
- "start": 180,
34192
- "end": 191
34347
+ "start": 181,
34348
+ "end": 192
34193
34349
  }
34194
34350
  },
34195
34351
  "group": [
@@ -34208,8 +34364,8 @@
34208
34364
  "name": "default",
34209
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",
34210
34366
  "line": {
34211
- "start": 196,
34212
- "end": 255
34367
+ "start": 197,
34368
+ "end": 256
34213
34369
  }
34214
34370
  }
34215
34371
  }
@@ -34222,16 +34378,16 @@
34222
34378
  "path": "/sass/core/button/#mixin-default",
34223
34379
  "description": "Output the default button styles\n",
34224
34380
  "commentRange": {
34225
- "start": 193,
34226
- "end": 194
34381
+ "start": 194,
34382
+ "end": 195
34227
34383
  },
34228
34384
  "context": {
34229
34385
  "type": "mixin",
34230
34386
  "name": "default",
34231
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",
34232
34388
  "line": {
34233
- "start": 196,
34234
- "end": 255
34389
+ "start": 197,
34390
+ "end": 256
34235
34391
  }
34236
34392
  },
34237
34393
  "parameter": [
@@ -34420,16 +34576,16 @@
34420
34576
  "path": "/sass/core/button/#mixin-when-active",
34421
34577
  "description": "Mixin to wrap in active selectors\n- Use to match the button's active selector\n",
34422
34578
  "commentRange": {
34423
- "start": 257,
34424
- "end": 265
34579
+ "start": 258,
34580
+ "end": 266
34425
34581
  },
34426
34582
  "context": {
34427
34583
  "type": "mixin",
34428
34584
  "name": "when-active",
34429
34585
  "code": "\n #{ get(\"active-selector\") } {\n @content;\n }\n",
34430
34586
  "line": {
34431
- "start": 267,
34432
- "end": 271
34587
+ "start": 268,
34588
+ "end": 272
34433
34589
  }
34434
34590
  },
34435
34591
  "example": [
@@ -34461,8 +34617,8 @@
34461
34617
  "name": "default",
34462
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",
34463
34619
  "line": {
34464
- "start": 196,
34465
- "end": 255
34620
+ "start": 197,
34621
+ "end": 256
34466
34622
  }
34467
34623
  }
34468
34624
  },
@@ -34473,8 +34629,8 @@
34473
34629
  "name": "style",
34474
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",
34475
34631
  "line": {
34476
- "start": 374,
34477
- "end": 390
34632
+ "start": 375,
34633
+ "end": 391
34478
34634
  }
34479
34635
  }
34480
34636
  }
@@ -34487,16 +34643,16 @@
34487
34643
  "path": "/sass/core/button/#mixin-size",
34488
34644
  "description": "Print button size styles for a specific size\n",
34489
34645
  "commentRange": {
34490
- "start": 273,
34491
- "end": 276
34646
+ "start": 274,
34647
+ "end": 277
34492
34648
  },
34493
34649
  "context": {
34494
34650
  "type": "mixin",
34495
34651
  "name": "size",
34496
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",
34497
34653
  "line": {
34498
- "start": 278,
34499
- "end": 288
34654
+ "start": 279,
34655
+ "end": 289
34500
34656
  }
34501
34657
  },
34502
34658
  "parameter": [
@@ -34599,16 +34755,16 @@
34599
34755
  "path": "/sass/core/button/#function-get-style-value",
34600
34756
  "description": "Get a value from a button style\n",
34601
34757
  "commentRange": {
34602
- "start": 290,
34603
- "end": 294
34758
+ "start": 291,
34759
+ "end": 295
34604
34760
  },
34605
34761
  "context": {
34606
34762
  "type": "function",
34607
34763
  "name": "get-style-value",
34608
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",
34609
34765
  "line": {
34610
- "start": 296,
34611
- "end": 318
34766
+ "start": 297,
34767
+ "end": 319
34612
34768
  }
34613
34769
  },
34614
34770
  "parameter": [
@@ -34627,8 +34783,8 @@
34627
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)",
34628
34784
  "scope": "default",
34629
34785
  "line": {
34630
- "start": 115,
34631
- "end": 138
34786
+ "start": 116,
34787
+ "end": 139
34632
34788
  }
34633
34789
  },
34634
34790
  "group": [
@@ -34642,8 +34798,8 @@
34642
34798
  "name": "set-styles",
34643
34799
  "code": "\n $styles: utils.map-merge($styles, $changes, $merge-mode) !global;\n",
34644
34800
  "line": {
34645
- "start": 165,
34646
- "end": 167
34801
+ "start": 166,
34802
+ "end": 168
34647
34803
  }
34648
34804
  },
34649
34805
  "group": [
@@ -34709,8 +34865,8 @@
34709
34865
  "name": "style-styles",
34710
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",
34711
34867
  "line": {
34712
- "start": 327,
34713
- "end": 338
34868
+ "start": 328,
34869
+ "end": 339
34714
34870
  }
34715
34871
  }
34716
34872
  },
@@ -34721,8 +34877,8 @@
34721
34877
  "name": "style-styles",
34722
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",
34723
34879
  "line": {
34724
- "start": 327,
34725
- "end": 338
34880
+ "start": 328,
34881
+ "end": 339
34726
34882
  }
34727
34883
  }
34728
34884
  },
@@ -34733,8 +34889,8 @@
34733
34889
  "name": "style-styles",
34734
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",
34735
34891
  "line": {
34736
- "start": 327,
34737
- "end": 338
34892
+ "start": 328,
34893
+ "end": 339
34738
34894
  }
34739
34895
  }
34740
34896
  },
@@ -34745,8 +34901,8 @@
34745
34901
  "name": "style-styles",
34746
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",
34747
34903
  "line": {
34748
- "start": 327,
34749
- "end": 338
34904
+ "start": 328,
34905
+ "end": 339
34750
34906
  }
34751
34907
  }
34752
34908
  },
@@ -34757,8 +34913,8 @@
34757
34913
  "name": "style-styles",
34758
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",
34759
34915
  "line": {
34760
- "start": 327,
34761
- "end": 338
34916
+ "start": 328,
34917
+ "end": 339
34762
34918
  }
34763
34919
  }
34764
34920
  },
@@ -34769,8 +34925,8 @@
34769
34925
  "name": "style-styles",
34770
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",
34771
34927
  "line": {
34772
- "start": 327,
34773
- "end": 338
34928
+ "start": 328,
34929
+ "end": 339
34774
34930
  }
34775
34931
  }
34776
34932
  },
@@ -34781,8 +34937,8 @@
34781
34937
  "name": "style-styles",
34782
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",
34783
34939
  "line": {
34784
- "start": 327,
34785
- "end": 338
34940
+ "start": 328,
34941
+ "end": 339
34786
34942
  }
34787
34943
  }
34788
34944
  },
@@ -34793,8 +34949,8 @@
34793
34949
  "name": "style-styles",
34794
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",
34795
34951
  "line": {
34796
- "start": 327,
34797
- "end": 338
34952
+ "start": 328,
34953
+ "end": 339
34798
34954
  }
34799
34955
  }
34800
34956
  },
@@ -34805,8 +34961,8 @@
34805
34961
  "name": "style-styles",
34806
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",
34807
34963
  "line": {
34808
- "start": 327,
34809
- "end": 338
34964
+ "start": 328,
34965
+ "end": 339
34810
34966
  }
34811
34967
  }
34812
34968
  },
@@ -34817,8 +34973,8 @@
34817
34973
  "name": "style-styles-hover",
34818
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",
34819
34975
  "line": {
34820
- "start": 347,
34821
- "end": 353
34976
+ "start": 348,
34977
+ "end": 354
34822
34978
  }
34823
34979
  }
34824
34980
  },
@@ -34829,8 +34985,8 @@
34829
34985
  "name": "style-styles-hover",
34830
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",
34831
34987
  "line": {
34832
- "start": 347,
34833
- "end": 353
34988
+ "start": 348,
34989
+ "end": 354
34834
34990
  }
34835
34991
  }
34836
34992
  },
@@ -34841,8 +34997,8 @@
34841
34997
  "name": "style-styles-hover",
34842
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",
34843
34999
  "line": {
34844
- "start": 347,
34845
- "end": 353
35000
+ "start": 348,
35001
+ "end": 354
34846
35002
  }
34847
35003
  }
34848
35004
  },
@@ -34853,8 +35009,8 @@
34853
35009
  "name": "style-styles-hover",
34854
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",
34855
35011
  "line": {
34856
- "start": 347,
34857
- "end": 353
35012
+ "start": 348,
35013
+ "end": 354
34858
35014
  }
34859
35015
  }
34860
35016
  },
@@ -34865,8 +35021,8 @@
34865
35021
  "name": "style-styles-hover",
34866
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",
34867
35023
  "line": {
34868
- "start": 347,
34869
- "end": 353
35024
+ "start": 348,
35025
+ "end": 354
34870
35026
  }
34871
35027
  }
34872
35028
  }
@@ -34879,16 +35035,16 @@
34879
35035
  "path": "/sass/core/button/#mixin-style-styles",
34880
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",
34881
35037
  "commentRange": {
34882
- "start": 320,
34883
- "end": 325
35038
+ "start": 321,
35039
+ "end": 326
34884
35040
  },
34885
35041
  "context": {
34886
35042
  "type": "mixin",
34887
35043
  "name": "style-styles",
34888
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",
34889
35045
  "line": {
34890
- "start": 327,
34891
- "end": 338
35046
+ "start": 328,
35047
+ "end": 339
34892
35048
  }
34893
35049
  },
34894
35050
  "parameter": [
@@ -34907,8 +35063,8 @@
34907
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)",
34908
35064
  "scope": "default",
34909
35065
  "line": {
34910
- "start": 115,
34911
- "end": 138
35066
+ "start": 116,
35067
+ "end": 139
34912
35068
  }
34913
35069
  },
34914
35070
  "group": [
@@ -34922,8 +35078,8 @@
34922
35078
  "name": "set-styles",
34923
35079
  "code": "\n $styles: utils.map-merge($styles, $changes, $merge-mode) !global;\n",
34924
35080
  "line": {
34925
- "start": 165,
34926
- "end": 167
35081
+ "start": 166,
35082
+ "end": 168
34927
35083
  }
34928
35084
  },
34929
35085
  "group": [
@@ -34985,8 +35141,8 @@
34985
35141
  "name": "style",
34986
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",
34987
35143
  "line": {
34988
- "start": 374,
34989
- "end": 390
35144
+ "start": 375,
35145
+ "end": 391
34990
35146
  }
34991
35147
  }
34992
35148
  },
@@ -34997,8 +35153,8 @@
34997
35153
  "name": "style",
34998
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",
34999
35155
  "line": {
35000
- "start": 374,
35001
- "end": 390
35156
+ "start": 375,
35157
+ "end": 391
35002
35158
  }
35003
35159
  }
35004
35160
  }
@@ -35011,16 +35167,16 @@
35011
35167
  "path": "/sass/core/button/#mixin-style-styles-hover",
35012
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",
35013
35169
  "commentRange": {
35014
- "start": 340,
35015
- "end": 345
35170
+ "start": 341,
35171
+ "end": 346
35016
35172
  },
35017
35173
  "context": {
35018
35174
  "type": "mixin",
35019
35175
  "name": "style-styles-hover",
35020
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",
35021
35177
  "line": {
35022
- "start": 347,
35023
- "end": 353
35178
+ "start": 348,
35179
+ "end": 354
35024
35180
  }
35025
35181
  },
35026
35182
  "parameter": [
@@ -35039,8 +35195,8 @@
35039
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)",
35040
35196
  "scope": "default",
35041
35197
  "line": {
35042
- "start": 115,
35043
- "end": 138
35198
+ "start": 116,
35199
+ "end": 139
35044
35200
  }
35045
35201
  },
35046
35202
  "group": [
@@ -35054,8 +35210,8 @@
35054
35210
  "name": "set-styles",
35055
35211
  "code": "\n $styles: utils.map-merge($styles, $changes, $merge-mode) !global;\n",
35056
35212
  "line": {
35057
- "start": 165,
35058
- "end": 167
35213
+ "start": 166,
35214
+ "end": 168
35059
35215
  }
35060
35216
  },
35061
35217
  "group": [
@@ -35101,8 +35257,8 @@
35101
35257
  "name": "style",
35102
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",
35103
35259
  "line": {
35104
- "start": 374,
35105
- "end": 390
35260
+ "start": 375,
35261
+ "end": 391
35106
35262
  }
35107
35263
  }
35108
35264
  }
@@ -35115,16 +35271,16 @@
35115
35271
  "path": "/sass/core/button/#mixin-style",
35116
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",
35117
35273
  "commentRange": {
35118
- "start": 363,
35119
- "end": 372
35274
+ "start": 364,
35275
+ "end": 373
35120
35276
  },
35121
35277
  "context": {
35122
35278
  "type": "mixin",
35123
35279
  "name": "style",
35124
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",
35125
35281
  "line": {
35126
- "start": 374,
35127
- "end": 390
35282
+ "start": 375,
35283
+ "end": 391
35128
35284
  }
35129
35285
  },
35130
35286
  "parameter": [
@@ -35149,8 +35305,8 @@
35149
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)",
35150
35306
  "scope": "default",
35151
35307
  "line": {
35152
- "start": 115,
35153
- "end": 138
35308
+ "start": 116,
35309
+ "end": 139
35154
35310
  }
35155
35311
  },
35156
35312
  "group": [
@@ -35164,8 +35320,8 @@
35164
35320
  "name": "set-styles",
35165
35321
  "code": "\n $styles: utils.map-merge($styles, $changes, $merge-mode) !global;\n",
35166
35322
  "line": {
35167
- "start": 165,
35168
- "end": 167
35323
+ "start": 166,
35324
+ "end": 168
35169
35325
  }
35170
35326
  },
35171
35327
  "group": [
@@ -55764,8 +55920,8 @@
55764
55920
  "name": "set",
55765
55921
  "code": "\n $config: map.merge($config, $changes) !global;\n",
55766
55922
  "line": {
55767
- "start": 145,
55768
- "end": 147
55923
+ "start": 146,
55924
+ "end": 148
55769
55925
  }
55770
55926
  }
55771
55927
  },
@@ -55776,8 +55932,8 @@
55776
55932
  "name": "set",
55777
55933
  "code": "\n $config: map.merge($config, $changes) !global;\n",
55778
55934
  "line": {
55779
- "start": 145,
55780
- "end": 147
55935
+ "start": 146,
55936
+ "end": 148
55781
55937
  }
55782
55938
  }
55783
55939
  },
@@ -55788,8 +55944,8 @@
55788
55944
  "name": "get",
55789
55945
  "code": "\n $value: utils.require-map-get($config, $name, \"button [config]\");\n @return utils.function-fallback($name, $value, $-fallbacks);\n",
55790
55946
  "line": {
55791
- "start": 155,
55792
- "end": 158
55947
+ "start": 156,
55948
+ "end": 159
55793
55949
  }
55794
55950
  }
55795
55951
  },
@@ -56283,8 +56439,8 @@
56283
56439
  "name": "default",
56284
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",
56285
56441
  "line": {
56286
- "start": 196,
56287
- "end": 255
56442
+ "start": 197,
56443
+ "end": 256
56288
56444
  }
56289
56445
  }
56290
56446
  },
@@ -56295,8 +56451,8 @@
56295
56451
  "name": "default",
56296
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",
56297
56453
  "line": {
56298
- "start": 196,
56299
- "end": 255
56454
+ "start": 197,
56455
+ "end": 256
56300
56456
  }
56301
56457
  }
56302
56458
  },
@@ -56307,8 +56463,8 @@
56307
56463
  "name": "default",
56308
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",
56309
56465
  "line": {
56310
- "start": 196,
56311
- "end": 255
56466
+ "start": 197,
56467
+ "end": 256
56312
56468
  }
56313
56469
  }
56314
56470
  },
@@ -56319,8 +56475,8 @@
56319
56475
  "name": "default",
56320
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",
56321
56477
  "line": {
56322
- "start": 196,
56323
- "end": 255
56478
+ "start": 197,
56479
+ "end": 256
56324
56480
  }
56325
56481
  }
56326
56482
  },
@@ -56331,8 +56487,8 @@
56331
56487
  "name": "default",
56332
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",
56333
56489
  "line": {
56334
- "start": 196,
56335
- "end": 255
56490
+ "start": 197,
56491
+ "end": 256
56336
56492
  }
56337
56493
  }
56338
56494
  },
@@ -56343,8 +56499,8 @@
56343
56499
  "name": "default",
56344
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",
56345
56501
  "line": {
56346
- "start": 196,
56347
- "end": 255
56502
+ "start": 197,
56503
+ "end": 256
56348
56504
  }
56349
56505
  }
56350
56506
  },
@@ -56355,8 +56511,8 @@
56355
56511
  "name": "default",
56356
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",
56357
56513
  "line": {
56358
- "start": 196,
56359
- "end": 255
56514
+ "start": 197,
56515
+ "end": 256
56360
56516
  }
56361
56517
  }
56362
56518
  },
@@ -56367,8 +56523,8 @@
56367
56523
  "name": "default",
56368
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",
56369
56525
  "line": {
56370
- "start": 196,
56371
- "end": 255
56526
+ "start": 197,
56527
+ "end": 256
56372
56528
  }
56373
56529
  }
56374
56530
  },
@@ -56379,8 +56535,8 @@
56379
56535
  "name": "default",
56380
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",
56381
56537
  "line": {
56382
- "start": 196,
56383
- "end": 255
56538
+ "start": 197,
56539
+ "end": 256
56384
56540
  }
56385
56541
  }
56386
56542
  },
@@ -56391,8 +56547,8 @@
56391
56547
  "name": "default",
56392
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",
56393
56549
  "line": {
56394
- "start": 196,
56395
- "end": 255
56550
+ "start": 197,
56551
+ "end": 256
56396
56552
  }
56397
56553
  }
56398
56554
  },
@@ -56403,8 +56559,8 @@
56403
56559
  "name": "default",
56404
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",
56405
56561
  "line": {
56406
- "start": 196,
56407
- "end": 255
56562
+ "start": 197,
56563
+ "end": 256
56408
56564
  }
56409
56565
  }
56410
56566
  },
@@ -56415,8 +56571,8 @@
56415
56571
  "name": "default",
56416
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",
56417
56573
  "line": {
56418
- "start": 196,
56419
- "end": 255
56574
+ "start": 197,
56575
+ "end": 256
56420
56576
  }
56421
56577
  }
56422
56578
  },
@@ -56427,8 +56583,8 @@
56427
56583
  "name": "default",
56428
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",
56429
56585
  "line": {
56430
- "start": 196,
56431
- "end": 255
56586
+ "start": 197,
56587
+ "end": 256
56432
56588
  }
56433
56589
  }
56434
56590
  },
@@ -56439,8 +56595,8 @@
56439
56595
  "name": "default",
56440
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",
56441
56597
  "line": {
56442
- "start": 196,
56443
- "end": 255
56598
+ "start": 197,
56599
+ "end": 256
56444
56600
  }
56445
56601
  }
56446
56602
  },
@@ -56451,8 +56607,8 @@
56451
56607
  "name": "default",
56452
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",
56453
56609
  "line": {
56454
- "start": 196,
56455
- "end": 255
56610
+ "start": 197,
56611
+ "end": 256
56456
56612
  }
56457
56613
  }
56458
56614
  },
@@ -56463,8 +56619,8 @@
56463
56619
  "name": "default",
56464
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",
56465
56621
  "line": {
56466
- "start": 196,
56467
- "end": 255
56622
+ "start": 197,
56623
+ "end": 256
56468
56624
  }
56469
56625
  }
56470
56626
  },
@@ -56475,8 +56631,8 @@
56475
56631
  "name": "default",
56476
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",
56477
56633
  "line": {
56478
- "start": 196,
56479
- "end": 255
56634
+ "start": 197,
56635
+ "end": 256
56480
56636
  }
56481
56637
  }
56482
56638
  },
@@ -56487,8 +56643,8 @@
56487
56643
  "name": "default",
56488
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",
56489
56645
  "line": {
56490
- "start": 196,
56491
- "end": 255
56646
+ "start": 197,
56647
+ "end": 256
56492
56648
  }
56493
56649
  }
56494
56650
  },
@@ -56499,8 +56655,8 @@
56499
56655
  "name": "default",
56500
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",
56501
56657
  "line": {
56502
- "start": 196,
56503
- "end": 255
56658
+ "start": 197,
56659
+ "end": 256
56504
56660
  }
56505
56661
  }
56506
56662
  },
@@ -56511,8 +56667,8 @@
56511
56667
  "name": "default",
56512
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",
56513
56669
  "line": {
56514
- "start": 196,
56515
- "end": 255
56670
+ "start": 197,
56671
+ "end": 256
56516
56672
  }
56517
56673
  }
56518
56674
  },
@@ -56523,8 +56679,8 @@
56523
56679
  "name": "default",
56524
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",
56525
56681
  "line": {
56526
- "start": 196,
56527
- "end": 255
56682
+ "start": 197,
56683
+ "end": 256
56528
56684
  }
56529
56685
  }
56530
56686
  },
@@ -56535,8 +56691,8 @@
56535
56691
  "name": "default",
56536
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",
56537
56693
  "line": {
56538
- "start": 196,
56539
- "end": 255
56694
+ "start": 197,
56695
+ "end": 256
56540
56696
  }
56541
56697
  }
56542
56698
  },
@@ -56547,8 +56703,8 @@
56547
56703
  "name": "default",
56548
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",
56549
56705
  "line": {
56550
- "start": 196,
56551
- "end": 255
56706
+ "start": 197,
56707
+ "end": 256
56552
56708
  }
56553
56709
  }
56554
56710
  },
@@ -56559,8 +56715,8 @@
56559
56715
  "name": "default",
56560
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",
56561
56717
  "line": {
56562
- "start": 196,
56563
- "end": 255
56718
+ "start": 197,
56719
+ "end": 256
56564
56720
  }
56565
56721
  }
56566
56722
  },
@@ -56571,8 +56727,8 @@
56571
56727
  "name": "default",
56572
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",
56573
56729
  "line": {
56574
- "start": 196,
56575
- "end": 255
56730
+ "start": 197,
56731
+ "end": 256
56576
56732
  }
56577
56733
  }
56578
56734
  },
@@ -56583,8 +56739,8 @@
56583
56739
  "name": "default",
56584
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",
56585
56741
  "line": {
56586
- "start": 196,
56587
- "end": 255
56742
+ "start": 197,
56743
+ "end": 256
56588
56744
  }
56589
56745
  }
56590
56746
  },
@@ -56595,8 +56751,8 @@
56595
56751
  "name": "default",
56596
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",
56597
56753
  "line": {
56598
- "start": 196,
56599
- "end": 255
56754
+ "start": 197,
56755
+ "end": 256
56600
56756
  }
56601
56757
  }
56602
56758
  },
@@ -56607,8 +56763,8 @@
56607
56763
  "name": "default",
56608
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",
56609
56765
  "line": {
56610
- "start": 196,
56611
- "end": 255
56766
+ "start": 197,
56767
+ "end": 256
56612
56768
  }
56613
56769
  }
56614
56770
  },
@@ -56619,8 +56775,8 @@
56619
56775
  "name": "default",
56620
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",
56621
56777
  "line": {
56622
- "start": 196,
56623
- "end": 255
56778
+ "start": 197,
56779
+ "end": 256
56624
56780
  }
56625
56781
  }
56626
56782
  },
@@ -56631,8 +56787,8 @@
56631
56787
  "name": "default",
56632
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",
56633
56789
  "line": {
56634
- "start": 196,
56635
- "end": 255
56790
+ "start": 197,
56791
+ "end": 256
56636
56792
  }
56637
56793
  }
56638
56794
  },
@@ -56643,8 +56799,8 @@
56643
56799
  "name": "default",
56644
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",
56645
56801
  "line": {
56646
- "start": 196,
56647
- "end": 255
56802
+ "start": 197,
56803
+ "end": 256
56648
56804
  }
56649
56805
  }
56650
56806
  },
@@ -56655,8 +56811,8 @@
56655
56811
  "name": "default",
56656
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",
56657
56813
  "line": {
56658
- "start": 196,
56659
- "end": 255
56814
+ "start": 197,
56815
+ "end": 256
56660
56816
  }
56661
56817
  }
56662
56818
  },
@@ -56667,8 +56823,8 @@
56667
56823
  "name": "default",
56668
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",
56669
56825
  "line": {
56670
- "start": 196,
56671
- "end": 255
56826
+ "start": 197,
56827
+ "end": 256
56672
56828
  }
56673
56829
  }
56674
56830
  },
@@ -56679,8 +56835,8 @@
56679
56835
  "name": "default",
56680
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",
56681
56837
  "line": {
56682
- "start": 196,
56683
- "end": 255
56838
+ "start": 197,
56839
+ "end": 256
56684
56840
  }
56685
56841
  }
56686
56842
  },
@@ -56691,8 +56847,8 @@
56691
56847
  "name": "default",
56692
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",
56693
56849
  "line": {
56694
- "start": 196,
56695
- "end": 255
56850
+ "start": 197,
56851
+ "end": 256
56696
56852
  }
56697
56853
  }
56698
56854
  },
@@ -56703,8 +56859,8 @@
56703
56859
  "name": "default",
56704
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",
56705
56861
  "line": {
56706
- "start": 196,
56707
- "end": 255
56862
+ "start": 197,
56863
+ "end": 256
56708
56864
  }
56709
56865
  }
56710
56866
  },
@@ -56715,8 +56871,8 @@
56715
56871
  "name": "default",
56716
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",
56717
56873
  "line": {
56718
- "start": 196,
56719
- "end": 255
56874
+ "start": 197,
56875
+ "end": 256
56720
56876
  }
56721
56877
  }
56722
56878
  },
@@ -56727,8 +56883,8 @@
56727
56883
  "name": "default",
56728
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",
56729
56885
  "line": {
56730
- "start": 196,
56731
- "end": 255
56886
+ "start": 197,
56887
+ "end": 256
56732
56888
  }
56733
56889
  }
56734
56890
  },
@@ -56739,8 +56895,8 @@
56739
56895
  "name": "when-active",
56740
56896
  "code": "\n #{ get(\"active-selector\") } {\n @content;\n }\n",
56741
56897
  "line": {
56742
- "start": 267,
56743
- "end": 271
56898
+ "start": 268,
56899
+ "end": 272
56744
56900
  }
56745
56901
  }
56746
56902
  },
@@ -56751,8 +56907,8 @@
56751
56907
  "name": "size",
56752
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",
56753
56909
  "line": {
56754
- "start": 278,
56755
- "end": 288
56910
+ "start": 279,
56911
+ "end": 289
56756
56912
  }
56757
56913
  }
56758
56914
  },
@@ -56763,8 +56919,8 @@
56763
56919
  "name": "size",
56764
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",
56765
56921
  "line": {
56766
- "start": 278,
56767
- "end": 288
56922
+ "start": 279,
56923
+ "end": 289
56768
56924
  }
56769
56925
  }
56770
56926
  },
@@ -56775,8 +56931,8 @@
56775
56931
  "name": "size",
56776
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",
56777
56933
  "line": {
56778
- "start": 278,
56779
- "end": 288
56934
+ "start": 279,
56935
+ "end": 289
56780
56936
  }
56781
56937
  }
56782
56938
  },
@@ -56787,8 +56943,8 @@
56787
56943
  "name": "size",
56788
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",
56789
56945
  "line": {
56790
- "start": 278,
56791
- "end": 288
56946
+ "start": 279,
56947
+ "end": 289
56792
56948
  }
56793
56949
  }
56794
56950
  },
@@ -56799,8 +56955,8 @@
56799
56955
  "name": "size",
56800
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",
56801
56957
  "line": {
56802
- "start": 278,
56803
- "end": 288
56958
+ "start": 279,
56959
+ "end": 289
56804
56960
  }
56805
56961
  }
56806
56962
  },
@@ -56811,8 +56967,8 @@
56811
56967
  "name": "get-style-value",
56812
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",
56813
56969
  "line": {
56814
- "start": 296,
56815
- "end": 318
56970
+ "start": 297,
56971
+ "end": 319
56816
56972
  }
56817
56973
  }
56818
56974
  },
@@ -56823,8 +56979,8 @@
56823
56979
  "name": "get-style-value",
56824
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",
56825
56981
  "line": {
56826
- "start": 296,
56827
- "end": 318
56982
+ "start": 297,
56983
+ "end": 319
56828
56984
  }
56829
56985
  }
56830
56986
  },
@@ -56835,8 +56991,8 @@
56835
56991
  "name": "get-style-value",
56836
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",
56837
56993
  "line": {
56838
- "start": 296,
56839
- "end": 318
56994
+ "start": 297,
56995
+ "end": 319
56840
56996
  }
56841
56997
  }
56842
56998
  },
@@ -56847,8 +57003,8 @@
56847
57003
  "name": "get-style-value",
56848
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",
56849
57005
  "line": {
56850
- "start": 296,
56851
- "end": 318
57006
+ "start": 297,
57007
+ "end": 319
56852
57008
  }
56853
57009
  }
56854
57010
  },
@@ -58451,8 +58607,8 @@
58451
58607
  "name": "set-sizes",
58452
58608
  "code": "\n $sizes: utils.map-merge($sizes, $changes, $merge-mode) !global;\n",
58453
58609
  "line": {
58454
- "start": 174,
58455
- "end": 176
58610
+ "start": 175,
58611
+ "end": 177
58456
58612
  }
58457
58613
  }
58458
58614
  },
@@ -58463,8 +58619,8 @@
58463
58619
  "name": "set-sizes",
58464
58620
  "code": "\n $sizes: utils.map-merge($sizes, $changes, $merge-mode) !global;\n",
58465
58621
  "line": {
58466
- "start": 174,
58467
- "end": 176
58622
+ "start": 175,
58623
+ "end": 177
58468
58624
  }
58469
58625
  }
58470
58626
  },
@@ -58475,8 +58631,8 @@
58475
58631
  "name": "size",
58476
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",
58477
58633
  "line": {
58478
- "start": 278,
58479
- "end": 288
58634
+ "start": 279,
58635
+ "end": 289
58480
58636
  }
58481
58637
  }
58482
58638
  },
@@ -62713,8 +62869,8 @@
62713
62869
  "name": "get",
62714
62870
  "code": "\n $value: utils.require-map-get($config, $name, \"button [config]\");\n @return utils.function-fallback($name, $value, $-fallbacks);\n",
62715
62871
  "line": {
62716
- "start": 155,
62717
- "end": 158
62872
+ "start": 156,
62873
+ "end": 159
62718
62874
  }
62719
62875
  }
62720
62876
  },
@@ -62725,8 +62881,8 @@
62725
62881
  "name": "size",
62726
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",
62727
62883
  "line": {
62728
- "start": 278,
62729
- "end": 288
62884
+ "start": 279,
62885
+ "end": 289
62730
62886
  }
62731
62887
  }
62732
62888
  },
@@ -62737,8 +62893,8 @@
62737
62893
  "name": "get-style-value",
62738
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",
62739
62895
  "line": {
62740
- "start": 296,
62741
- "end": 318
62896
+ "start": 297,
62897
+ "end": 319
62742
62898
  }
62743
62899
  }
62744
62900
  },
@@ -63259,8 +63415,8 @@
63259
63415
  "name": "get-style-value",
63260
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",
63261
63417
  "line": {
63262
- "start": 296,
63263
- "end": 318
63418
+ "start": 297,
63419
+ "end": 319
63264
63420
  }
63265
63421
  }
63266
63422
  },
@@ -63271,8 +63427,8 @@
63271
63427
  "name": "get-style-value",
63272
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",
63273
63429
  "line": {
63274
- "start": 296,
63275
- "end": 318
63430
+ "start": 297,
63431
+ "end": 319
63276
63432
  }
63277
63433
  }
63278
63434
  },
@@ -63283,8 +63439,8 @@
63283
63439
  "name": "get-style-value",
63284
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",
63285
63441
  "line": {
63286
- "start": 296,
63287
- "end": 318
63442
+ "start": 297,
63443
+ "end": 319
63288
63444
  }
63289
63445
  }
63290
63446
  },
@@ -63859,8 +64015,8 @@
63859
64015
  "name": "set-styles",
63860
64016
  "code": "\n $styles: utils.map-merge($styles, $changes, $merge-mode) !global;\n",
63861
64017
  "line": {
63862
- "start": 165,
63863
- "end": 167
64018
+ "start": 166,
64019
+ "end": 168
63864
64020
  }
63865
64021
  }
63866
64022
  },
@@ -63871,8 +64027,8 @@
63871
64027
  "name": "set-sizes",
63872
64028
  "code": "\n $sizes: utils.map-merge($sizes, $changes, $merge-mode) !global;\n",
63873
64029
  "line": {
63874
- "start": 174,
63875
- "end": 176
64030
+ "start": 175,
64031
+ "end": 177
63876
64032
  }
63877
64033
  }
63878
64034
  },
@@ -64419,8 +64575,8 @@
64419
64575
  "name": "get",
64420
64576
  "code": "\n $value: utils.require-map-get($config, $name, \"button [config]\");\n @return utils.function-fallback($name, $value, $-fallbacks);\n",
64421
64577
  "line": {
64422
- "start": 155,
64423
- "end": 158
64578
+ "start": 156,
64579
+ "end": 159
64424
64580
  }
64425
64581
  }
64426
64582
  }