@ulu/frontend 0.6.14 → 0.6.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/mcp-data.json
CHANGED
|
@@ -1272,6 +1272,12 @@
|
|
|
1272
1272
|
"description": "Width of badge (default size)",
|
|
1273
1273
|
"default": "10rem"
|
|
1274
1274
|
},
|
|
1275
|
+
{
|
|
1276
|
+
"name": "transition-duration",
|
|
1277
|
+
"type": "Time",
|
|
1278
|
+
"description": "Transition duration amount for transitioned properties",
|
|
1279
|
+
"default": "110ms"
|
|
1280
|
+
},
|
|
1275
1281
|
{
|
|
1276
1282
|
"name": "hover-scale",
|
|
1277
1283
|
"type": "Number",
|
|
@@ -13857,8 +13863,8 @@
|
|
|
13857
13863
|
"name": "set",
|
|
13858
13864
|
"code": "\n $config: map.merge($config, $changes) !global;\n",
|
|
13859
13865
|
"line": {
|
|
13860
|
-
"start":
|
|
13861
|
-
"end":
|
|
13866
|
+
"start": 69,
|
|
13867
|
+
"end": 71
|
|
13862
13868
|
}
|
|
13863
13869
|
}
|
|
13864
13870
|
},
|
|
@@ -13869,8 +13875,8 @@
|
|
|
13869
13875
|
"name": "set",
|
|
13870
13876
|
"code": "\n $config: map.merge($config, $changes) !global;\n",
|
|
13871
13877
|
"line": {
|
|
13872
|
-
"start":
|
|
13873
|
-
"end":
|
|
13878
|
+
"start": 69,
|
|
13879
|
+
"end": 71
|
|
13874
13880
|
}
|
|
13875
13881
|
}
|
|
13876
13882
|
},
|
|
@@ -13881,8 +13887,8 @@
|
|
|
13881
13887
|
"name": "get",
|
|
13882
13888
|
"code": "\n $value: utils.require-map-get($config, $name, \"badge [config]\");\n @return utils.function-fallback($name, $value, $-fallbacks);\n",
|
|
13883
13889
|
"line": {
|
|
13884
|
-
"start":
|
|
13885
|
-
"end":
|
|
13890
|
+
"start": 78,
|
|
13891
|
+
"end": 81
|
|
13886
13892
|
}
|
|
13887
13893
|
}
|
|
13888
13894
|
},
|
|
@@ -16715,10 +16721,10 @@
|
|
|
16715
16721
|
"context": {
|
|
16716
16722
|
"type": "mixin",
|
|
16717
16723
|
"name": "styles",
|
|
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
|
|
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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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
16725
|
"line": {
|
|
16720
|
-
"start":
|
|
16721
|
-
"end":
|
|
16726
|
+
"start": 99,
|
|
16727
|
+
"end": 169
|
|
16722
16728
|
}
|
|
16723
16729
|
}
|
|
16724
16730
|
},
|
|
@@ -16727,10 +16733,10 @@
|
|
|
16727
16733
|
"context": {
|
|
16728
16734
|
"type": "mixin",
|
|
16729
16735
|
"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
|
|
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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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
16737
|
"line": {
|
|
16732
|
-
"start":
|
|
16733
|
-
"end":
|
|
16738
|
+
"start": 99,
|
|
16739
|
+
"end": 169
|
|
16734
16740
|
}
|
|
16735
16741
|
}
|
|
16736
16742
|
},
|
|
@@ -16739,10 +16745,10 @@
|
|
|
16739
16745
|
"context": {
|
|
16740
16746
|
"type": "mixin",
|
|
16741
16747
|
"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
|
|
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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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",
|
|
16743
16749
|
"line": {
|
|
16744
|
-
"start":
|
|
16745
|
-
"end":
|
|
16750
|
+
"start": 99,
|
|
16751
|
+
"end": 169
|
|
16746
16752
|
}
|
|
16747
16753
|
}
|
|
16748
16754
|
},
|
|
@@ -16751,10 +16757,10 @@
|
|
|
16751
16757
|
"context": {
|
|
16752
16758
|
"type": "mixin",
|
|
16753
16759
|
"name": "styles",
|
|
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
|
|
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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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",
|
|
16755
16761
|
"line": {
|
|
16756
|
-
"start":
|
|
16757
|
-
"end":
|
|
16762
|
+
"start": 99,
|
|
16763
|
+
"end": 169
|
|
16758
16764
|
}
|
|
16759
16765
|
}
|
|
16760
16766
|
},
|
|
@@ -16763,10 +16769,10 @@
|
|
|
16763
16769
|
"context": {
|
|
16764
16770
|
"type": "mixin",
|
|
16765
16771
|
"name": "styles",
|
|
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
|
|
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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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",
|
|
16767
16773
|
"line": {
|
|
16768
|
-
"start":
|
|
16769
|
-
"end":
|
|
16774
|
+
"start": 99,
|
|
16775
|
+
"end": 169
|
|
16770
16776
|
}
|
|
16771
16777
|
}
|
|
16772
16778
|
},
|
|
@@ -16775,10 +16781,10 @@
|
|
|
16775
16781
|
"context": {
|
|
16776
16782
|
"type": "mixin",
|
|
16777
16783
|
"name": "styles",
|
|
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
|
|
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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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",
|
|
16779
16785
|
"line": {
|
|
16780
|
-
"start":
|
|
16781
|
-
"end":
|
|
16786
|
+
"start": 99,
|
|
16787
|
+
"end": 169
|
|
16782
16788
|
}
|
|
16783
16789
|
}
|
|
16784
16790
|
},
|
|
@@ -16787,10 +16793,10 @@
|
|
|
16787
16793
|
"context": {
|
|
16788
16794
|
"type": "mixin",
|
|
16789
16795
|
"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
|
|
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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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
16797
|
"line": {
|
|
16792
|
-
"start":
|
|
16793
|
-
"end":
|
|
16798
|
+
"start": 99,
|
|
16799
|
+
"end": 169
|
|
16794
16800
|
}
|
|
16795
16801
|
}
|
|
16796
16802
|
},
|
|
@@ -16799,10 +16805,10 @@
|
|
|
16799
16805
|
"context": {
|
|
16800
16806
|
"type": "mixin",
|
|
16801
16807
|
"name": "styles",
|
|
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
|
|
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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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",
|
|
16803
16809
|
"line": {
|
|
16804
|
-
"start":
|
|
16805
|
-
"end":
|
|
16810
|
+
"start": 99,
|
|
16811
|
+
"end": 169
|
|
16806
16812
|
}
|
|
16807
16813
|
}
|
|
16808
16814
|
},
|
|
@@ -16811,10 +16817,10 @@
|
|
|
16811
16817
|
"context": {
|
|
16812
16818
|
"type": "mixin",
|
|
16813
16819
|
"name": "styles",
|
|
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
|
|
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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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",
|
|
16815
16821
|
"line": {
|
|
16816
|
-
"start":
|
|
16817
|
-
"end":
|
|
16822
|
+
"start": 99,
|
|
16823
|
+
"end": 169
|
|
16818
16824
|
}
|
|
16819
16825
|
}
|
|
16820
16826
|
},
|
|
@@ -16823,10 +16829,10 @@
|
|
|
16823
16829
|
"context": {
|
|
16824
16830
|
"type": "mixin",
|
|
16825
16831
|
"name": "styles",
|
|
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
|
|
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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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",
|
|
16827
16833
|
"line": {
|
|
16828
|
-
"start":
|
|
16829
|
-
"end":
|
|
16834
|
+
"start": 99,
|
|
16835
|
+
"end": 169
|
|
16830
16836
|
}
|
|
16831
16837
|
}
|
|
16832
16838
|
},
|
|
@@ -16835,10 +16841,10 @@
|
|
|
16835
16841
|
"context": {
|
|
16836
16842
|
"type": "mixin",
|
|
16837
16843
|
"name": "styles",
|
|
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
|
|
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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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",
|
|
16839
16845
|
"line": {
|
|
16840
|
-
"start":
|
|
16841
|
-
"end":
|
|
16846
|
+
"start": 99,
|
|
16847
|
+
"end": 169
|
|
16842
16848
|
}
|
|
16843
16849
|
}
|
|
16844
16850
|
},
|
|
@@ -16847,10 +16853,10 @@
|
|
|
16847
16853
|
"context": {
|
|
16848
16854
|
"type": "mixin",
|
|
16849
16855
|
"name": "styles",
|
|
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
|
|
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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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",
|
|
16851
16857
|
"line": {
|
|
16852
|
-
"start":
|
|
16853
|
-
"end":
|
|
16858
|
+
"start": 99,
|
|
16859
|
+
"end": 169
|
|
16854
16860
|
}
|
|
16855
16861
|
}
|
|
16856
16862
|
},
|
|
@@ -16859,10 +16865,10 @@
|
|
|
16859
16865
|
"context": {
|
|
16860
16866
|
"type": "mixin",
|
|
16861
16867
|
"name": "styles",
|
|
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
|
|
16868
|
+
"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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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",
|
|
16863
16869
|
"line": {
|
|
16864
|
-
"start":
|
|
16865
|
-
"end":
|
|
16870
|
+
"start": 99,
|
|
16871
|
+
"end": 169
|
|
16866
16872
|
}
|
|
16867
16873
|
}
|
|
16868
16874
|
},
|
|
@@ -16871,10 +16877,10 @@
|
|
|
16871
16877
|
"context": {
|
|
16872
16878
|
"type": "mixin",
|
|
16873
16879
|
"name": "styles",
|
|
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
|
|
16880
|
+
"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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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",
|
|
16875
16881
|
"line": {
|
|
16876
|
-
"start":
|
|
16877
|
-
"end":
|
|
16882
|
+
"start": 99,
|
|
16883
|
+
"end": 169
|
|
16878
16884
|
}
|
|
16879
16885
|
}
|
|
16880
16886
|
},
|
|
@@ -16883,10 +16889,10 @@
|
|
|
16883
16889
|
"context": {
|
|
16884
16890
|
"type": "mixin",
|
|
16885
16891
|
"name": "styles",
|
|
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
|
|
16892
|
+
"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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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",
|
|
16887
16893
|
"line": {
|
|
16888
|
-
"start":
|
|
16889
|
-
"end":
|
|
16894
|
+
"start": 99,
|
|
16895
|
+
"end": 169
|
|
16890
16896
|
}
|
|
16891
16897
|
}
|
|
16892
16898
|
},
|
|
@@ -16895,10 +16901,10 @@
|
|
|
16895
16901
|
"context": {
|
|
16896
16902
|
"type": "mixin",
|
|
16897
16903
|
"name": "styles",
|
|
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
|
|
16904
|
+
"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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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",
|
|
16899
16905
|
"line": {
|
|
16900
|
-
"start":
|
|
16901
|
-
"end":
|
|
16906
|
+
"start": 99,
|
|
16907
|
+
"end": 169
|
|
16902
16908
|
}
|
|
16903
16909
|
}
|
|
16904
16910
|
},
|
|
@@ -16907,10 +16913,10 @@
|
|
|
16907
16913
|
"context": {
|
|
16908
16914
|
"type": "mixin",
|
|
16909
16915
|
"name": "styles",
|
|
16910
|
-
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform
|
|
16916
|
+
"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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16911
16917
|
"line": {
|
|
16912
|
-
"start":
|
|
16913
|
-
"end":
|
|
16918
|
+
"start": 99,
|
|
16919
|
+
"end": 169
|
|
16914
16920
|
}
|
|
16915
16921
|
}
|
|
16916
16922
|
},
|
|
@@ -16919,10 +16925,10 @@
|
|
|
16919
16925
|
"context": {
|
|
16920
16926
|
"type": "mixin",
|
|
16921
16927
|
"name": "styles",
|
|
16922
|
-
"code": "\n $prefix: selector.class(\"badge\");\n // Badge content can be text, image, icon, or background-image\n #{ $prefix } {\n display: block;\n width: get(\"width\");\n max-width: 100%;\n flex: 0 0 get(\"width\");\n font-size: get(\"font-size\");\n font-weight: get(\"font-weight\");\n font-family: get(\"font-family\");\n }\n #{ $prefix }__inner {\n display: block;\n padding-bottom: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center center;\n text-align: center;\n border-radius: get(\"border-radius\");\n transition: transform
|
|
16928
|
+
"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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: ease-in-out;\n box-shadow: get(\"box-shadow\");\n // In case this is used as a link or router-link\n &,\n &:hover,\n &:focus,\n &:visited {\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n }\n }\n #{ $prefix }--clickable,\n button#{ $prefix },\n a#{ $prefix } {\n &:hover,\n &:focus {\n #{ $prefix }__inner {\n color: color.get(get(\"color-hover\"));\n background-color: color.get(get(\"background-color-hover\"));\n box-shadow: get(\"box-shadow-hover\");\n transform: scale(get(\"hover-scale\"));\n }\n }\n }\n #{ $prefix }__inner > * {\n display: block;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n #{ $prefix }__inner > img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n margin: 0 !important;\n }\n\n @each $name, $props in get(\"sizes\") {\n #{ $prefix }--#{ $name } {\n width: map.get($props, \"width\");\n font-size: map.get($props, \"font-size\");\n flex-basis: map.get($props, \"width\");\n }\n }\n",
|
|
16923
16929
|
"line": {
|
|
16924
|
-
"start":
|
|
16925
|
-
"end":
|
|
16930
|
+
"start": 99,
|
|
16931
|
+
"end": 169
|
|
16926
16932
|
}
|
|
16927
16933
|
}
|
|
16928
16934
|
},
|
|
@@ -16931,10 +16937,10 @@
|
|
|
16931
16937
|
"context": {
|
|
16932
16938
|
"type": "mixin",
|
|
16933
16939
|
"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
|
|
16940
|
+
"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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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
16941
|
"line": {
|
|
16936
|
-
"start":
|
|
16937
|
-
"end":
|
|
16942
|
+
"start": 99,
|
|
16943
|
+
"end": 169
|
|
16938
16944
|
}
|
|
16939
16945
|
}
|
|
16940
16946
|
},
|
|
@@ -16943,10 +16949,10 @@
|
|
|
16943
16949
|
"context": {
|
|
16944
16950
|
"type": "mixin",
|
|
16945
16951
|
"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
|
|
16952
|
+
"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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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
16953
|
"line": {
|
|
16948
|
-
"start":
|
|
16949
|
-
"end":
|
|
16954
|
+
"start": 99,
|
|
16955
|
+
"end": 169
|
|
16950
16956
|
}
|
|
16951
16957
|
}
|
|
16952
16958
|
},
|
|
@@ -16955,10 +16961,22 @@
|
|
|
16955
16961
|
"context": {
|
|
16956
16962
|
"type": "mixin",
|
|
16957
16963
|
"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
|
|
16964
|
+
"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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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
16965
|
"line": {
|
|
16960
|
-
"start":
|
|
16961
|
-
"end":
|
|
16966
|
+
"start": 99,
|
|
16967
|
+
"end": 169
|
|
16968
|
+
}
|
|
16969
|
+
}
|
|
16970
|
+
},
|
|
16971
|
+
{
|
|
16972
|
+
"description": "Output badge component styles\n",
|
|
16973
|
+
"context": {
|
|
16974
|
+
"type": "mixin",
|
|
16975
|
+
"name": "styles",
|
|
16976
|
+
"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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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",
|
|
16977
|
+
"line": {
|
|
16978
|
+
"start": 99,
|
|
16979
|
+
"end": 169
|
|
16962
16980
|
}
|
|
16963
16981
|
}
|
|
16964
16982
|
},
|
|
@@ -27407,10 +27425,10 @@
|
|
|
27407
27425
|
"context": {
|
|
27408
27426
|
"type": "mixin",
|
|
27409
27427
|
"name": "styles",
|
|
27410
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27428
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27411
27429
|
"line": {
|
|
27412
27430
|
"start": 120,
|
|
27413
|
-
"end":
|
|
27431
|
+
"end": 240
|
|
27414
27432
|
}
|
|
27415
27433
|
}
|
|
27416
27434
|
},
|
|
@@ -27419,10 +27437,10 @@
|
|
|
27419
27437
|
"context": {
|
|
27420
27438
|
"type": "mixin",
|
|
27421
27439
|
"name": "styles",
|
|
27422
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27440
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27423
27441
|
"line": {
|
|
27424
27442
|
"start": 120,
|
|
27425
|
-
"end":
|
|
27443
|
+
"end": 240
|
|
27426
27444
|
}
|
|
27427
27445
|
}
|
|
27428
27446
|
},
|
|
@@ -27431,10 +27449,10 @@
|
|
|
27431
27449
|
"context": {
|
|
27432
27450
|
"type": "mixin",
|
|
27433
27451
|
"name": "styles",
|
|
27434
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27452
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27435
27453
|
"line": {
|
|
27436
27454
|
"start": 120,
|
|
27437
|
-
"end":
|
|
27455
|
+
"end": 240
|
|
27438
27456
|
}
|
|
27439
27457
|
}
|
|
27440
27458
|
},
|
|
@@ -27443,10 +27461,10 @@
|
|
|
27443
27461
|
"context": {
|
|
27444
27462
|
"type": "mixin",
|
|
27445
27463
|
"name": "styles",
|
|
27446
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27464
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27447
27465
|
"line": {
|
|
27448
27466
|
"start": 120,
|
|
27449
|
-
"end":
|
|
27467
|
+
"end": 240
|
|
27450
27468
|
}
|
|
27451
27469
|
}
|
|
27452
27470
|
},
|
|
@@ -27455,10 +27473,10 @@
|
|
|
27455
27473
|
"context": {
|
|
27456
27474
|
"type": "mixin",
|
|
27457
27475
|
"name": "styles",
|
|
27458
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27476
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27459
27477
|
"line": {
|
|
27460
27478
|
"start": 120,
|
|
27461
|
-
"end":
|
|
27479
|
+
"end": 240
|
|
27462
27480
|
}
|
|
27463
27481
|
}
|
|
27464
27482
|
},
|
|
@@ -27467,10 +27485,10 @@
|
|
|
27467
27485
|
"context": {
|
|
27468
27486
|
"type": "mixin",
|
|
27469
27487
|
"name": "styles",
|
|
27470
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27488
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27471
27489
|
"line": {
|
|
27472
27490
|
"start": 120,
|
|
27473
|
-
"end":
|
|
27491
|
+
"end": 240
|
|
27474
27492
|
}
|
|
27475
27493
|
}
|
|
27476
27494
|
},
|
|
@@ -27479,10 +27497,10 @@
|
|
|
27479
27497
|
"context": {
|
|
27480
27498
|
"type": "mixin",
|
|
27481
27499
|
"name": "styles",
|
|
27482
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27500
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27483
27501
|
"line": {
|
|
27484
27502
|
"start": 120,
|
|
27485
|
-
"end":
|
|
27503
|
+
"end": 240
|
|
27486
27504
|
}
|
|
27487
27505
|
}
|
|
27488
27506
|
},
|
|
@@ -27491,10 +27509,10 @@
|
|
|
27491
27509
|
"context": {
|
|
27492
27510
|
"type": "mixin",
|
|
27493
27511
|
"name": "styles",
|
|
27494
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27512
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27495
27513
|
"line": {
|
|
27496
27514
|
"start": 120,
|
|
27497
|
-
"end":
|
|
27515
|
+
"end": 240
|
|
27498
27516
|
}
|
|
27499
27517
|
}
|
|
27500
27518
|
},
|
|
@@ -27503,10 +27521,10 @@
|
|
|
27503
27521
|
"context": {
|
|
27504
27522
|
"type": "mixin",
|
|
27505
27523
|
"name": "styles",
|
|
27506
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27524
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27507
27525
|
"line": {
|
|
27508
27526
|
"start": 120,
|
|
27509
|
-
"end":
|
|
27527
|
+
"end": 240
|
|
27510
27528
|
}
|
|
27511
27529
|
}
|
|
27512
27530
|
},
|
|
@@ -27515,10 +27533,10 @@
|
|
|
27515
27533
|
"context": {
|
|
27516
27534
|
"type": "mixin",
|
|
27517
27535
|
"name": "styles",
|
|
27518
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27536
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27519
27537
|
"line": {
|
|
27520
27538
|
"start": 120,
|
|
27521
|
-
"end":
|
|
27539
|
+
"end": 240
|
|
27522
27540
|
}
|
|
27523
27541
|
}
|
|
27524
27542
|
},
|
|
@@ -27527,10 +27545,10 @@
|
|
|
27527
27545
|
"context": {
|
|
27528
27546
|
"type": "mixin",
|
|
27529
27547
|
"name": "styles",
|
|
27530
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27548
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27531
27549
|
"line": {
|
|
27532
27550
|
"start": 120,
|
|
27533
|
-
"end":
|
|
27551
|
+
"end": 240
|
|
27534
27552
|
}
|
|
27535
27553
|
}
|
|
27536
27554
|
},
|
|
@@ -27539,10 +27557,10 @@
|
|
|
27539
27557
|
"context": {
|
|
27540
27558
|
"type": "mixin",
|
|
27541
27559
|
"name": "styles",
|
|
27542
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27560
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27543
27561
|
"line": {
|
|
27544
27562
|
"start": 120,
|
|
27545
|
-
"end":
|
|
27563
|
+
"end": 240
|
|
27546
27564
|
}
|
|
27547
27565
|
}
|
|
27548
27566
|
},
|
|
@@ -27551,10 +27569,10 @@
|
|
|
27551
27569
|
"context": {
|
|
27552
27570
|
"type": "mixin",
|
|
27553
27571
|
"name": "styles",
|
|
27554
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27572
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27555
27573
|
"line": {
|
|
27556
27574
|
"start": 120,
|
|
27557
|
-
"end":
|
|
27575
|
+
"end": 240
|
|
27558
27576
|
}
|
|
27559
27577
|
}
|
|
27560
27578
|
},
|
|
@@ -27563,10 +27581,10 @@
|
|
|
27563
27581
|
"context": {
|
|
27564
27582
|
"type": "mixin",
|
|
27565
27583
|
"name": "styles",
|
|
27566
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27584
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27567
27585
|
"line": {
|
|
27568
27586
|
"start": 120,
|
|
27569
|
-
"end":
|
|
27587
|
+
"end": 240
|
|
27570
27588
|
}
|
|
27571
27589
|
}
|
|
27572
27590
|
},
|
|
@@ -27575,10 +27593,10 @@
|
|
|
27575
27593
|
"context": {
|
|
27576
27594
|
"type": "mixin",
|
|
27577
27595
|
"name": "styles",
|
|
27578
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27596
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27579
27597
|
"line": {
|
|
27580
27598
|
"start": 120,
|
|
27581
|
-
"end":
|
|
27599
|
+
"end": 240
|
|
27582
27600
|
}
|
|
27583
27601
|
}
|
|
27584
27602
|
},
|
|
@@ -27587,10 +27605,10 @@
|
|
|
27587
27605
|
"context": {
|
|
27588
27606
|
"type": "mixin",
|
|
27589
27607
|
"name": "styles",
|
|
27590
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27608
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27591
27609
|
"line": {
|
|
27592
27610
|
"start": 120,
|
|
27593
|
-
"end":
|
|
27611
|
+
"end": 240
|
|
27594
27612
|
}
|
|
27595
27613
|
}
|
|
27596
27614
|
},
|
|
@@ -27599,10 +27617,10 @@
|
|
|
27599
27617
|
"context": {
|
|
27600
27618
|
"type": "mixin",
|
|
27601
27619
|
"name": "styles",
|
|
27602
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27620
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27603
27621
|
"line": {
|
|
27604
27622
|
"start": 120,
|
|
27605
|
-
"end":
|
|
27623
|
+
"end": 240
|
|
27606
27624
|
}
|
|
27607
27625
|
}
|
|
27608
27626
|
},
|
|
@@ -27611,10 +27629,10 @@
|
|
|
27611
27629
|
"context": {
|
|
27612
27630
|
"type": "mixin",
|
|
27613
27631
|
"name": "styles",
|
|
27614
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27632
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27615
27633
|
"line": {
|
|
27616
27634
|
"start": 120,
|
|
27617
|
-
"end":
|
|
27635
|
+
"end": 240
|
|
27618
27636
|
}
|
|
27619
27637
|
}
|
|
27620
27638
|
},
|
|
@@ -27623,10 +27641,10 @@
|
|
|
27623
27641
|
"context": {
|
|
27624
27642
|
"type": "mixin",
|
|
27625
27643
|
"name": "styles",
|
|
27626
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27644
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27627
27645
|
"line": {
|
|
27628
27646
|
"start": 120,
|
|
27629
|
-
"end":
|
|
27647
|
+
"end": 240
|
|
27630
27648
|
}
|
|
27631
27649
|
}
|
|
27632
27650
|
},
|
|
@@ -27635,10 +27653,10 @@
|
|
|
27635
27653
|
"context": {
|
|
27636
27654
|
"type": "mixin",
|
|
27637
27655
|
"name": "styles",
|
|
27638
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27656
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27639
27657
|
"line": {
|
|
27640
27658
|
"start": 120,
|
|
27641
|
-
"end":
|
|
27659
|
+
"end": 240
|
|
27642
27660
|
}
|
|
27643
27661
|
}
|
|
27644
27662
|
},
|
|
@@ -27647,10 +27665,10 @@
|
|
|
27647
27665
|
"context": {
|
|
27648
27666
|
"type": "mixin",
|
|
27649
27667
|
"name": "styles",
|
|
27650
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27668
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27651
27669
|
"line": {
|
|
27652
27670
|
"start": 120,
|
|
27653
|
-
"end":
|
|
27671
|
+
"end": 240
|
|
27654
27672
|
}
|
|
27655
27673
|
}
|
|
27656
27674
|
},
|
|
@@ -27659,10 +27677,10 @@
|
|
|
27659
27677
|
"context": {
|
|
27660
27678
|
"type": "mixin",
|
|
27661
27679
|
"name": "styles",
|
|
27662
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27680
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27663
27681
|
"line": {
|
|
27664
27682
|
"start": 120,
|
|
27665
|
-
"end":
|
|
27683
|
+
"end": 240
|
|
27666
27684
|
}
|
|
27667
27685
|
}
|
|
27668
27686
|
},
|
|
@@ -27671,10 +27689,10 @@
|
|
|
27671
27689
|
"context": {
|
|
27672
27690
|
"type": "mixin",
|
|
27673
27691
|
"name": "styles",
|
|
27674
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27692
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27675
27693
|
"line": {
|
|
27676
27694
|
"start": 120,
|
|
27677
|
-
"end":
|
|
27695
|
+
"end": 240
|
|
27678
27696
|
}
|
|
27679
27697
|
}
|
|
27680
27698
|
},
|
|
@@ -27683,10 +27701,10 @@
|
|
|
27683
27701
|
"context": {
|
|
27684
27702
|
"type": "mixin",
|
|
27685
27703
|
"name": "styles",
|
|
27686
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27704
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27687
27705
|
"line": {
|
|
27688
27706
|
"start": 120,
|
|
27689
|
-
"end":
|
|
27707
|
+
"end": 240
|
|
27690
27708
|
}
|
|
27691
27709
|
}
|
|
27692
27710
|
},
|
|
@@ -27695,10 +27713,10 @@
|
|
|
27695
27713
|
"context": {
|
|
27696
27714
|
"type": "mixin",
|
|
27697
27715
|
"name": "styles",
|
|
27698
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27716
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27699
27717
|
"line": {
|
|
27700
27718
|
"start": 120,
|
|
27701
|
-
"end":
|
|
27719
|
+
"end": 240
|
|
27702
27720
|
}
|
|
27703
27721
|
}
|
|
27704
27722
|
},
|
|
@@ -27707,10 +27725,10 @@
|
|
|
27707
27725
|
"context": {
|
|
27708
27726
|
"type": "mixin",
|
|
27709
27727
|
"name": "styles",
|
|
27710
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27728
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27711
27729
|
"line": {
|
|
27712
27730
|
"start": 120,
|
|
27713
|
-
"end":
|
|
27731
|
+
"end": 240
|
|
27714
27732
|
}
|
|
27715
27733
|
}
|
|
27716
27734
|
},
|
|
@@ -27719,10 +27737,10 @@
|
|
|
27719
27737
|
"context": {
|
|
27720
27738
|
"type": "mixin",
|
|
27721
27739
|
"name": "styles",
|
|
27722
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27740
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27723
27741
|
"line": {
|
|
27724
27742
|
"start": 120,
|
|
27725
|
-
"end":
|
|
27743
|
+
"end": 240
|
|
27726
27744
|
}
|
|
27727
27745
|
}
|
|
27728
27746
|
},
|
|
@@ -27731,10 +27749,10 @@
|
|
|
27731
27749
|
"context": {
|
|
27732
27750
|
"type": "mixin",
|
|
27733
27751
|
"name": "styles",
|
|
27734
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27752
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27735
27753
|
"line": {
|
|
27736
27754
|
"start": 120,
|
|
27737
|
-
"end":
|
|
27755
|
+
"end": 240
|
|
27738
27756
|
}
|
|
27739
27757
|
}
|
|
27740
27758
|
},
|
|
@@ -27743,10 +27761,10 @@
|
|
|
27743
27761
|
"context": {
|
|
27744
27762
|
"type": "mixin",
|
|
27745
27763
|
"name": "styles",
|
|
27746
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27764
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27747
27765
|
"line": {
|
|
27748
27766
|
"start": 120,
|
|
27749
|
-
"end":
|
|
27767
|
+
"end": 240
|
|
27750
27768
|
}
|
|
27751
27769
|
}
|
|
27752
27770
|
},
|
|
@@ -27755,10 +27773,10 @@
|
|
|
27755
27773
|
"context": {
|
|
27756
27774
|
"type": "mixin",
|
|
27757
27775
|
"name": "styles",
|
|
27758
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27776
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27759
27777
|
"line": {
|
|
27760
27778
|
"start": 120,
|
|
27761
|
-
"end":
|
|
27779
|
+
"end": 240
|
|
27762
27780
|
}
|
|
27763
27781
|
}
|
|
27764
27782
|
},
|
|
@@ -27767,10 +27785,10 @@
|
|
|
27767
27785
|
"context": {
|
|
27768
27786
|
"type": "mixin",
|
|
27769
27787
|
"name": "styles",
|
|
27770
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27788
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27771
27789
|
"line": {
|
|
27772
27790
|
"start": 120,
|
|
27773
|
-
"end":
|
|
27791
|
+
"end": 240
|
|
27774
27792
|
}
|
|
27775
27793
|
}
|
|
27776
27794
|
},
|
|
@@ -27779,10 +27797,10 @@
|
|
|
27779
27797
|
"context": {
|
|
27780
27798
|
"type": "mixin",
|
|
27781
27799
|
"name": "styles",
|
|
27782
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27800
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27783
27801
|
"line": {
|
|
27784
27802
|
"start": 120,
|
|
27785
|
-
"end":
|
|
27803
|
+
"end": 240
|
|
27786
27804
|
}
|
|
27787
27805
|
}
|
|
27788
27806
|
},
|
|
@@ -27791,10 +27809,10 @@
|
|
|
27791
27809
|
"context": {
|
|
27792
27810
|
"type": "mixin",
|
|
27793
27811
|
"name": "styles",
|
|
27794
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27812
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27795
27813
|
"line": {
|
|
27796
27814
|
"start": 120,
|
|
27797
|
-
"end":
|
|
27815
|
+
"end": 240
|
|
27798
27816
|
}
|
|
27799
27817
|
}
|
|
27800
27818
|
},
|
|
@@ -27803,10 +27821,10 @@
|
|
|
27803
27821
|
"context": {
|
|
27804
27822
|
"type": "mixin",
|
|
27805
27823
|
"name": "styles",
|
|
27806
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27824
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27807
27825
|
"line": {
|
|
27808
27826
|
"start": 120,
|
|
27809
|
-
"end":
|
|
27827
|
+
"end": 240
|
|
27810
27828
|
}
|
|
27811
27829
|
}
|
|
27812
27830
|
},
|
|
@@ -27815,10 +27833,10 @@
|
|
|
27815
27833
|
"context": {
|
|
27816
27834
|
"type": "mixin",
|
|
27817
27835
|
"name": "styles",
|
|
27818
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27836
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27819
27837
|
"line": {
|
|
27820
27838
|
"start": 120,
|
|
27821
|
-
"end":
|
|
27839
|
+
"end": 240
|
|
27822
27840
|
}
|
|
27823
27841
|
}
|
|
27824
27842
|
},
|
|
@@ -27827,10 +27845,10 @@
|
|
|
27827
27845
|
"context": {
|
|
27828
27846
|
"type": "mixin",
|
|
27829
27847
|
"name": "styles",
|
|
27830
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27848
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27831
27849
|
"line": {
|
|
27832
27850
|
"start": 120,
|
|
27833
|
-
"end":
|
|
27851
|
+
"end": 240
|
|
27834
27852
|
}
|
|
27835
27853
|
}
|
|
27836
27854
|
},
|
|
@@ -27839,10 +27857,10 @@
|
|
|
27839
27857
|
"context": {
|
|
27840
27858
|
"type": "mixin",
|
|
27841
27859
|
"name": "styles",
|
|
27842
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27860
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27843
27861
|
"line": {
|
|
27844
27862
|
"start": 120,
|
|
27845
|
-
"end":
|
|
27863
|
+
"end": 240
|
|
27846
27864
|
}
|
|
27847
27865
|
}
|
|
27848
27866
|
},
|
|
@@ -27851,10 +27869,10 @@
|
|
|
27851
27869
|
"context": {
|
|
27852
27870
|
"type": "mixin",
|
|
27853
27871
|
"name": "styles",
|
|
27854
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27872
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27855
27873
|
"line": {
|
|
27856
27874
|
"start": 120,
|
|
27857
|
-
"end":
|
|
27875
|
+
"end": 240
|
|
27858
27876
|
}
|
|
27859
27877
|
}
|
|
27860
27878
|
},
|
|
@@ -27863,10 +27881,10 @@
|
|
|
27863
27881
|
"context": {
|
|
27864
27882
|
"type": "mixin",
|
|
27865
27883
|
"name": "styles",
|
|
27866
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27884
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27867
27885
|
"line": {
|
|
27868
27886
|
"start": 120,
|
|
27869
|
-
"end":
|
|
27887
|
+
"end": 240
|
|
27870
27888
|
}
|
|
27871
27889
|
}
|
|
27872
27890
|
},
|
|
@@ -27875,10 +27893,10 @@
|
|
|
27875
27893
|
"context": {
|
|
27876
27894
|
"type": "mixin",
|
|
27877
27895
|
"name": "styles",
|
|
27878
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27896
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27879
27897
|
"line": {
|
|
27880
27898
|
"start": 120,
|
|
27881
|
-
"end":
|
|
27899
|
+
"end": 240
|
|
27882
27900
|
}
|
|
27883
27901
|
}
|
|
27884
27902
|
},
|
|
@@ -27887,10 +27905,10 @@
|
|
|
27887
27905
|
"context": {
|
|
27888
27906
|
"type": "mixin",
|
|
27889
27907
|
"name": "styles",
|
|
27890
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27908
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27891
27909
|
"line": {
|
|
27892
27910
|
"start": 120,
|
|
27893
|
-
"end":
|
|
27911
|
+
"end": 240
|
|
27894
27912
|
}
|
|
27895
27913
|
}
|
|
27896
27914
|
},
|
|
@@ -27899,10 +27917,10 @@
|
|
|
27899
27917
|
"context": {
|
|
27900
27918
|
"type": "mixin",
|
|
27901
27919
|
"name": "styles",
|
|
27902
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
27920
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
27903
27921
|
"line": {
|
|
27904
27922
|
"start": 120,
|
|
27905
|
-
"end":
|
|
27923
|
+
"end": 240
|
|
27906
27924
|
}
|
|
27907
27925
|
}
|
|
27908
27926
|
},
|
|
@@ -32752,16 +32770,16 @@
|
|
|
32752
32770
|
"description": "Module Settings\n",
|
|
32753
32771
|
"commentRange": {
|
|
32754
32772
|
"start": 21,
|
|
32755
|
-
"end":
|
|
32773
|
+
"end": 36
|
|
32756
32774
|
},
|
|
32757
32775
|
"context": {
|
|
32758
32776
|
"type": "variable",
|
|
32759
32777
|
"name": "config",
|
|
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)",
|
|
32778
|
+
"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 \"transition-duration\" : 110ms,\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)",
|
|
32761
32779
|
"scope": "default",
|
|
32762
32780
|
"line": {
|
|
32763
|
-
"start":
|
|
32764
|
-
"end":
|
|
32781
|
+
"start": 38,
|
|
32782
|
+
"end": 62
|
|
32765
32783
|
}
|
|
32766
32784
|
},
|
|
32767
32785
|
"type": "Map",
|
|
@@ -32832,6 +32850,12 @@
|
|
|
32832
32850
|
"default": "10rem",
|
|
32833
32851
|
"description": "Width of badge (default size)"
|
|
32834
32852
|
},
|
|
32853
|
+
{
|
|
32854
|
+
"type": "Time",
|
|
32855
|
+
"name": "transition-duration",
|
|
32856
|
+
"default": "110ms",
|
|
32857
|
+
"description": "Transition duration amount for transitioned properties"
|
|
32858
|
+
},
|
|
32835
32859
|
{
|
|
32836
32860
|
"type": "Number",
|
|
32837
32861
|
"name": "hover-scale",
|
|
@@ -32861,16 +32885,16 @@
|
|
|
32861
32885
|
"path": "/sass/components/badge/#mixin-set",
|
|
32862
32886
|
"description": "Change modules $config\n",
|
|
32863
32887
|
"commentRange": {
|
|
32864
|
-
"start":
|
|
32865
|
-
"end":
|
|
32888
|
+
"start": 64,
|
|
32889
|
+
"end": 67
|
|
32866
32890
|
},
|
|
32867
32891
|
"context": {
|
|
32868
32892
|
"type": "mixin",
|
|
32869
32893
|
"name": "set",
|
|
32870
32894
|
"code": "\n $config: map.merge($config, $changes) !global;\n",
|
|
32871
32895
|
"line": {
|
|
32872
|
-
"start":
|
|
32873
|
-
"end":
|
|
32896
|
+
"start": 69,
|
|
32897
|
+
"end": 71
|
|
32874
32898
|
}
|
|
32875
32899
|
},
|
|
32876
32900
|
"parameter": [
|
|
@@ -32912,16 +32936,16 @@
|
|
|
32912
32936
|
"path": "/sass/components/badge/#function-get",
|
|
32913
32937
|
"description": "Get a config option\n",
|
|
32914
32938
|
"commentRange": {
|
|
32915
|
-
"start":
|
|
32916
|
-
"end":
|
|
32939
|
+
"start": 73,
|
|
32940
|
+
"end": 76
|
|
32917
32941
|
},
|
|
32918
32942
|
"context": {
|
|
32919
32943
|
"type": "function",
|
|
32920
32944
|
"name": "get",
|
|
32921
32945
|
"code": "\n $value: utils.require-map-get($config, $name, \"badge [config]\");\n @return utils.function-fallback($name, $value, $-fallbacks);\n",
|
|
32922
32946
|
"line": {
|
|
32923
|
-
"start":
|
|
32924
|
-
"end":
|
|
32947
|
+
"start": 78,
|
|
32948
|
+
"end": 81
|
|
32925
32949
|
}
|
|
32926
32950
|
},
|
|
32927
32951
|
"parameter": [
|
|
@@ -32959,16 +32983,16 @@
|
|
|
32959
32983
|
"path": "/sass/components/badge/#mixin-styles",
|
|
32960
32984
|
"description": "Output badge component styles\n",
|
|
32961
32985
|
"commentRange": {
|
|
32962
|
-
"start":
|
|
32963
|
-
"end":
|
|
32986
|
+
"start": 83,
|
|
32987
|
+
"end": 97
|
|
32964
32988
|
},
|
|
32965
32989
|
"context": {
|
|
32966
32990
|
"type": "mixin",
|
|
32967
32991
|
"name": "styles",
|
|
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
|
|
32992
|
+
"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-property: transform, color, box-shadow, background-color;\n transition-duration: get(\"transition-duration\");\n transition-timing-function: 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",
|
|
32969
32993
|
"line": {
|
|
32970
|
-
"start":
|
|
32971
|
-
"end":
|
|
32994
|
+
"start": 99,
|
|
32995
|
+
"end": 169
|
|
32972
32996
|
}
|
|
32973
32997
|
},
|
|
32974
32998
|
"example": [
|
|
@@ -33068,6 +33092,10 @@
|
|
|
33068
33092
|
"type": "function",
|
|
33069
33093
|
"name": "get"
|
|
33070
33094
|
},
|
|
33095
|
+
{
|
|
33096
|
+
"type": "function",
|
|
33097
|
+
"name": "get"
|
|
33098
|
+
},
|
|
33071
33099
|
{
|
|
33072
33100
|
"type": "function",
|
|
33073
33101
|
"name": "get"
|
|
@@ -48784,10 +48812,10 @@
|
|
|
48784
48812
|
"context": {
|
|
48785
48813
|
"type": "mixin",
|
|
48786
48814
|
"name": "styles",
|
|
48787
|
-
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n
|
|
48815
|
+
"code": "\n $prefix: selector.class(\"popover\");\n\n @if (get(\"arrow-size\")) {\n @include -arrow-styles();\n }\n // Default position is on the right of the container (Popper handles positioning)\n #{ $prefix } {\n display: none;\n position: absolute;\n z-index: get(\"z-index\") + 1;\n background-color: color.get(get(\"background-color\"));\n color: color.get(get(\"color\"));\n width: cssvar.use-ulu(\"popover-width\", get(\"width\"));\n max-width: min(cssvar.use-ulu(\"popover-max-width\", 100vw), get(\"max-width\"));\n box-shadow: get(\"box-shadow\");\n border-radius: get(\"border-radius\");\n text-align: left;\n @if (get(\"type-size\")) {\n @include typography.size(get(\"type-size\"));\n }\n &.is-active {\n display: block;\n }\n }\n #{ $prefix }__inner,\n #{ $prefix }__header,\n #{ $prefix }__footer {\n display: block;\n border-radius: get(\"border-radius\");\n position: relative;\n z-index: 2; // Above arrow\n flex: 0;\n }\n #{ $prefix }__inner {\n overflow-y: auto;\n max-height: get(\"max-height\");\n padding: get(\"padding\");\n flex: 1; // When used with footer\n }\n // Image, video above content\n #{ $prefix }__header {\n overflow: hidden;\n padding: get(\"header-padding-y\") get(\"padding\");\n color: color.get(get(\"header-color\"));\n background-color: color.get(get(\"header-background-color\"));\n }\n #{ $prefix }__header--media {\n padding: 0;\n background-color: color.get(get(\"header-media-background-color\"));\n }\n #{ $prefix }__footer {\n border-top: get(\"footer-border-top\");\n padding: get(\"footer-padding-y\") get(\"padding\");\n color: color.get(get(\"footer-color\"));\n background-color: color.get(get(\"footer-background-color\"));\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n #{ $prefix }__header:has(+ #{ $prefix }__inner),\n #{ $prefix }__header:has(+ #{ $prefix }__footer),\n #{ $prefix }__inner:has(+ #{ $prefix }__footer) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n // Modifiers\n #{ $prefix }--tooltip {\n @include cssvar.declare-ulu(\"popover-width\", get(\"tooltip-width\"));\n @include cssvar.declare-ulu(\"popover-max-width\", get(\"tooltip-max-width\"));\n color: color.get(get(\"tooltip-color\"));\n background-color: color.get(get(\"tooltip-background-color\"));\n pointer-events: none;\n #{ $prefix }__inner {\n padding: get(\"tooltip-padding\");\n min-height: 0;\n }\n }\n // For fixed strategy\n #{ $prefix }--fixed {\n position: fixed;\n }\n // Allow popover to grow/shrink to content's size\n #{ $prefix }--fit {\n @include cssvar.declare-ulu(\"popover-width\", max-content);\n }\n \n #{ $prefix }--large {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large\"));\n }\n #{ $prefix }--large-x {\n @include cssvar.declare-ulu(\"popover-width\", get(\"width-large-x\"));\n }\n #{ $prefix }--large,\n #{ $prefix }--large-x {\n #{ $prefix }__inner {\n padding: get(\"padding-large\");\n }\n #{ $prefix }__footer {\n padding: get(\"footer-padding-y-large\") get(\"padding-large\");\n }\n }\n // If you want to do something custom (and have it touch the edges)\n #{ $prefix }--no-padding {\n #{ $prefix }__inner {\n padding: 0;\n }\n }\n #{ $prefix }--prints {\n @media print {\n display: block;\n position: static;\n width: auto;\n box-shadow: none;\n max-width: none;\n #{ $prefix }__arrow {\n display: none;\n }\n }\n }\n",
|
|
48788
48816
|
"line": {
|
|
48789
48817
|
"start": 120,
|
|
48790
|
-
"end":
|
|
48818
|
+
"end": 240
|
|
48791
48819
|
}
|
|
48792
48820
|
},
|
|
48793
48821
|
"example": [
|