@fluentui/web-components 3.0.0-beta.89 → 3.0.0-beta.90
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/CHANGELOG.md +12 -2
- package/dist/dts/accordion-item/accordion-item.base.d.ts +0 -12
- package/dist/dts/accordion-item/accordion-item.d.ts +0 -18
- package/dist/dts/avatar/avatar.base.d.ts +0 -12
- package/dist/dts/avatar/avatar.d.ts +13 -2
- package/dist/dts/badge/badge.d.ts +0 -30
- package/dist/dts/button/button.d.ts +0 -24
- package/dist/dts/checkbox/checkbox.d.ts +0 -16
- package/dist/dts/counter-badge/counter-badge.d.ts +0 -30
- package/dist/dts/divider/divider.d.ts +0 -18
- package/dist/dts/dropdown/dropdown.d.ts +0 -16
- package/dist/dts/image/image.d.ts +0 -36
- package/dist/dts/label/label.d.ts +0 -24
- package/dist/dts/link/link.d.ts +0 -12
- package/dist/dts/message-bar/message-bar.d.ts +0 -18
- package/dist/dts/progress-bar/progress-bar.d.ts +0 -12
- package/dist/dts/rating-display/rating-display.d.ts +0 -14
- package/dist/dts/slider/slider.d.ts +0 -1
- package/dist/dts/spinner/spinner.d.ts +0 -12
- package/dist/dts/styles/states/index.d.ts +0 -500
- package/dist/dts/tablist/tablist.d.ts +0 -8
- package/dist/dts/text/text.d.ts +1 -34
- package/dist/dts/text-input/text-input.d.ts +0 -12
- package/dist/dts/textarea/textarea.d.ts +0 -4
- package/dist/dts/tree-item/tree-item.d.ts +1 -1
- package/dist/esm/accordion-item/accordion-item.base.js +0 -17
- package/dist/esm/accordion-item/accordion-item.base.js.map +1 -1
- package/dist/esm/accordion-item/accordion-item.js +0 -26
- package/dist/esm/accordion-item/accordion-item.js.map +1 -1
- package/dist/esm/accordion-item/accordion-item.styles.js +19 -20
- package/dist/esm/accordion-item/accordion-item.styles.js.map +1 -1
- package/dist/esm/avatar/avatar.base.js +0 -3
- package/dist/esm/avatar/avatar.base.js.map +1 -1
- package/dist/esm/avatar/avatar.js +4 -2
- package/dist/esm/avatar/avatar.js.map +1 -1
- package/dist/esm/avatar/avatar.styles.js +31 -32
- package/dist/esm/avatar/avatar.styles.js.map +1 -1
- package/dist/esm/badge/badge.js +1 -40
- package/dist/esm/badge/badge.js.map +1 -1
- package/dist/esm/badge/badge.styles.js +7 -10
- package/dist/esm/badge/badge.styles.js.map +1 -1
- package/dist/esm/button/button.js +0 -34
- package/dist/esm/button/button.js.map +1 -1
- package/dist/esm/button/button.styles.js +34 -35
- package/dist/esm/button/button.styles.js.map +1 -1
- package/dist/esm/checkbox/checkbox.js +1 -22
- package/dist/esm/checkbox/checkbox.js.map +1 -1
- package/dist/esm/checkbox/checkbox.styles.js +6 -6
- package/dist/esm/checkbox/checkbox.styles.js.map +1 -1
- package/dist/esm/compound-button/compound-button.styles.js +12 -13
- package/dist/esm/compound-button/compound-button.styles.js.map +1 -1
- package/dist/esm/counter-badge/counter-badge.js +0 -42
- package/dist/esm/counter-badge/counter-badge.js.map +1 -1
- package/dist/esm/counter-badge/counter-badge.styles.js +3 -7
- package/dist/esm/counter-badge/counter-badge.styles.js.map +1 -1
- package/dist/esm/divider/divider.js +0 -26
- package/dist/esm/divider/divider.js.map +1 -1
- package/dist/esm/divider/divider.styles.js +32 -35
- package/dist/esm/divider/divider.styles.js.map +1 -1
- package/dist/esm/dropdown/dropdown.js +1 -22
- package/dist/esm/dropdown/dropdown.js.map +1 -1
- package/dist/esm/dropdown/dropdown.styles.js +18 -18
- package/dist/esm/dropdown/dropdown.styles.js.map +1 -1
- package/dist/esm/image/image.js +0 -51
- package/dist/esm/image/image.js.map +1 -1
- package/dist/esm/image/image.styles.js +9 -10
- package/dist/esm/image/image.styles.js.map +1 -1
- package/dist/esm/label/label.js +0 -32
- package/dist/esm/label/label.js.map +1 -1
- package/dist/esm/label/label.styles.js +5 -6
- package/dist/esm/label/label.styles.js.map +1 -1
- package/dist/esm/link/link.js +0 -18
- package/dist/esm/link/link.js.map +1 -1
- package/dist/esm/link/link.styles.js +4 -5
- package/dist/esm/link/link.styles.js.map +1 -1
- package/dist/esm/message-bar/message-bar.js +0 -26
- package/dist/esm/message-bar/message-bar.js.map +1 -1
- package/dist/esm/message-bar/message-bar.styles.js +9 -10
- package/dist/esm/message-bar/message-bar.styles.js.map +1 -1
- package/dist/esm/progress-bar/progress-bar.js +0 -18
- package/dist/esm/progress-bar/progress-bar.js.map +1 -1
- package/dist/esm/progress-bar/progress-bar.styles.js +6 -7
- package/dist/esm/progress-bar/progress-bar.styles.js.map +1 -1
- package/dist/esm/radio-group/radio-group.styles.js +0 -1
- package/dist/esm/radio-group/radio-group.styles.js.map +1 -1
- package/dist/esm/rating-display/rating-display.js +0 -20
- package/dist/esm/rating-display/rating-display.js.map +1 -1
- package/dist/esm/rating-display/rating-display.styles.js +16 -19
- package/dist/esm/rating-display/rating-display.styles.js.map +1 -1
- package/dist/esm/slider/slider.js +1 -6
- package/dist/esm/slider/slider.js.map +1 -1
- package/dist/esm/slider/slider.styles.js +6 -7
- package/dist/esm/slider/slider.styles.js.map +1 -1
- package/dist/esm/spinner/spinner.js +0 -18
- package/dist/esm/spinner/spinner.js.map +1 -1
- package/dist/esm/spinner/spinner.styles.js +8 -9
- package/dist/esm/spinner/spinner.styles.js.map +1 -1
- package/dist/esm/styles/partials/badge.partials.js +42 -43
- package/dist/esm/styles/partials/badge.partials.js.map +1 -1
- package/dist/esm/styles/states/index.js +0 -500
- package/dist/esm/styles/states/index.js.map +1 -1
- package/dist/esm/tablist/tablist.js +1 -14
- package/dist/esm/tablist/tablist.js.map +1 -1
- package/dist/esm/tablist/tablist.styles.js +26 -27
- package/dist/esm/tablist/tablist.styles.js.map +1 -1
- package/dist/esm/text/text.js +1 -66
- package/dist/esm/text/text.js.map +1 -1
- package/dist/esm/text/text.styles.js +26 -27
- package/dist/esm/text/text.styles.js.map +1 -1
- package/dist/esm/text-input/text-input.js +0 -18
- package/dist/esm/text-input/text-input.js.map +1 -1
- package/dist/esm/text-input/text-input.styles.js +22 -23
- package/dist/esm/text-input/text-input.styles.js.map +1 -1
- package/dist/esm/textarea/textarea.js +1 -29
- package/dist/esm/textarea/textarea.js.map +1 -1
- package/dist/esm/textarea/textarea.styles.js +14 -14
- package/dist/esm/textarea/textarea.styles.js.map +1 -1
- package/dist/esm/toggle-button/toggle-button.styles.js +19 -20
- package/dist/esm/toggle-button/toggle-button.styles.js.map +1 -1
- package/dist/esm/tree-item/tree-item.js +1 -1
- package/dist/esm/tree-item/tree-item.js.map +1 -1
- package/dist/esm/tree-item/tree-item.styles.js.map +1 -1
- package/dist/esm/tree-item/tree-item.template.js +1 -1
- package/dist/esm/tree-item/tree-item.template.js.map +1 -1
- package/dist/web-components.d.ts +13 -363
- package/dist/web-components.js +178 -987
- package/dist/web-components.min.js +357 -354
- package/package.json +1 -1
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { css } from '@microsoft/fast-element';
|
|
2
2
|
import { display, forcedColorsStylesheetBehavior } from '../utils/index.js';
|
|
3
3
|
import { colorBrandStroke1, colorBrandStroke2, colorNeutralStrokeOnBrand2, curveEasyEase, strokeWidthThick, strokeWidthThicker, strokeWidthThickest, } from '../theme/design-tokens.js';
|
|
4
|
-
import { extraLargeState, extraSmallState, hugeState, invertedState, largeState, smallState, tinyState, } from '../styles/states/index.js';
|
|
5
4
|
export const styles = css `
|
|
6
5
|
${display('inline-flex')}
|
|
7
6
|
|
|
@@ -15,27 +14,27 @@ export const styles = css `
|
|
|
15
14
|
content-visibility: auto;
|
|
16
15
|
}
|
|
17
16
|
|
|
18
|
-
:host(
|
|
17
|
+
:host([size='tiny']) {
|
|
19
18
|
--indicatorSize: ${strokeWidthThick};
|
|
20
19
|
--size: 20px;
|
|
21
20
|
}
|
|
22
|
-
:host(
|
|
21
|
+
:host([size='extra-small']) {
|
|
23
22
|
--indicatorSize: ${strokeWidthThick};
|
|
24
23
|
--size: 24px;
|
|
25
24
|
}
|
|
26
|
-
:host(
|
|
25
|
+
:host([size='small']) {
|
|
27
26
|
--indicatorSize: ${strokeWidthThick};
|
|
28
27
|
--size: 28px;
|
|
29
28
|
}
|
|
30
|
-
:host(
|
|
29
|
+
:host([size='large']) {
|
|
31
30
|
--indicatorSize: ${strokeWidthThicker};
|
|
32
31
|
--size: 36px;
|
|
33
32
|
}
|
|
34
|
-
:host(
|
|
33
|
+
:host([size='extra-large']) {
|
|
35
34
|
--indicatorSize: ${strokeWidthThicker};
|
|
36
35
|
--size: 40px;
|
|
37
36
|
}
|
|
38
|
-
:host(
|
|
37
|
+
:host([size='huge']) {
|
|
39
38
|
--indicatorSize: ${strokeWidthThickest};
|
|
40
39
|
--size: 44px;
|
|
41
40
|
}
|
|
@@ -66,7 +65,7 @@ export const styles = css `
|
|
|
66
65
|
border-radius: 50%;
|
|
67
66
|
}
|
|
68
67
|
|
|
69
|
-
:host(
|
|
68
|
+
:host([appearance='inverted']) .background {
|
|
70
69
|
border-color: rgba(255, 255, 255, 0.2);
|
|
71
70
|
}
|
|
72
71
|
|
|
@@ -93,7 +92,7 @@ export const styles = css `
|
|
|
93
92
|
border-right-color: currentcolor;
|
|
94
93
|
}
|
|
95
94
|
|
|
96
|
-
:host(
|
|
95
|
+
:host([appearance='inverted']) .indicator {
|
|
97
96
|
color: ${colorNeutralStrokeOnBrand2};
|
|
98
97
|
}
|
|
99
98
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spinner.styles.js","sourceRoot":"","sources":["../../../src/spinner/spinner.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,8BAA8B,EAAE,MAAM,mBAAmB,CAAC;AAC5E,OAAO,EACL,iBAAiB,EACjB,iBAAiB,EACjB,0BAA0B,EAC1B,aAAa,EACb,gBAAgB,EAChB,kBAAkB,EAClB,mBAAmB,GACpB,MAAM,2BAA2B,CAAC;
|
|
1
|
+
{"version":3,"file":"spinner.styles.js","sourceRoot":"","sources":["../../../src/spinner/spinner.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,8BAA8B,EAAE,MAAM,mBAAmB,CAAC;AAC5E,OAAO,EACL,iBAAiB,EACjB,iBAAiB,EACjB,0BAA0B,EAC1B,aAAa,EACb,gBAAgB,EAChB,kBAAkB,EAClB,mBAAmB,GACpB,MAAM,2BAA2B,CAAC;AAEnC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,aAAa,CAAC;;;;uBAIH,kBAAkB;;;;;;;;;uBASlB,gBAAgB;;;;uBAIhB,gBAAgB;;;;uBAIhB,gBAAgB;;;;uBAIhB,kBAAkB;;;;uBAIlB,kBAAkB;;;;uBAIlB,mBAAmB;;;;;;;;;;;;;;;;;+CAiBK,aAAa;;;;;;;;;yCASnB,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;aAuB7C,iBAAiB;;;;;;;;;aASjB,0BAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDtC,CAAC,aAAa,CACb,8BAA8B,CAAC,GAAG,CAAA;;;;;;;;;GASjC,CAAC,CACH,CAAC"}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { css } from '@microsoft/fast-element';
|
|
2
2
|
import { display } from '../../utils/index.js';
|
|
3
3
|
import { borderRadiusCircular, colorBrandBackground, colorBrandBackground2, colorBrandForeground1, colorBrandForeground2, colorBrandStroke2, colorNeutralBackground1, colorNeutralBackground4, colorNeutralBackground5, colorNeutralForeground1, colorNeutralForeground1Static, colorNeutralForeground3, colorNeutralForegroundInverted, colorNeutralForegroundOnBrand, colorNeutralForegroundStaticInverted, colorNeutralStroke2, colorNeutralStrokeAccessible, colorPaletteDarkOrangeBackground1, colorPaletteDarkOrangeBackground3, colorPaletteDarkOrangeBorder1, colorPaletteDarkOrangeForeground1, colorPaletteDarkOrangeForeground3, colorPaletteGreenBackground1, colorPaletteGreenBackground3, colorPaletteGreenBorder2, colorPaletteGreenForeground1, colorPaletteGreenForeground2, colorPaletteGreenForeground3, colorPaletteRedBackground1, colorPaletteRedBackground3, colorPaletteRedBorder1, colorPaletteRedForeground1, colorPaletteRedForeground3, colorPaletteYellowBackground1, colorPaletteYellowBackground3, colorPaletteYellowBorder1, colorPaletteYellowForeground2, colorTransparentStroke, fontFamilyBase, fontSizeBase100, fontSizeBase200, fontWeightSemibold, lineHeightBase100, lineHeightBase200, spacingHorizontalSNudge, spacingHorizontalXS, spacingHorizontalXXS, strokeWidthThin, } from '../../theme/design-tokens.js';
|
|
4
|
-
import { dangerState, extraLargeState, extraSmallState, ghostState, importantState, informativeState, largeState, outlineState, severeState, smallState, subtleState, successState, tintState, tinyState, warningState, } from '../states/index.js';
|
|
5
4
|
export const badgeBaseStyles = css.partial `
|
|
6
5
|
${display('inline-flex')} :host {
|
|
7
6
|
position: relative;
|
|
@@ -26,7 +25,7 @@ export const badgeBaseStyles = css.partial `
|
|
|
26
25
|
font-size: 12px;
|
|
27
26
|
}
|
|
28
27
|
|
|
29
|
-
:host(:not(
|
|
28
|
+
:host(:not([appearance='ghost']))::after {
|
|
30
29
|
position: absolute;
|
|
31
30
|
content: '';
|
|
32
31
|
top: 0;
|
|
@@ -44,7 +43,7 @@ export const badgeBaseStyles = css.partial `
|
|
|
44
43
|
* The badge's size styles
|
|
45
44
|
*/
|
|
46
45
|
export const badgeSizeStyles = css.partial `
|
|
47
|
-
:host(
|
|
46
|
+
:host([size='tiny']) {
|
|
48
47
|
width: 6px;
|
|
49
48
|
height: 6px;
|
|
50
49
|
font-size: 4px;
|
|
@@ -52,10 +51,10 @@ export const badgeSizeStyles = css.partial `
|
|
|
52
51
|
padding-inline: 0;
|
|
53
52
|
min-width: unset;
|
|
54
53
|
}
|
|
55
|
-
:host(
|
|
54
|
+
:host([size='tiny']) ::slotted(svg) {
|
|
56
55
|
font-size: 6px;
|
|
57
56
|
}
|
|
58
|
-
:host(
|
|
57
|
+
:host([size='extra-small']) {
|
|
59
58
|
width: 10px;
|
|
60
59
|
height: 10px;
|
|
61
60
|
font-size: 6px;
|
|
@@ -63,37 +62,37 @@ export const badgeSizeStyles = css.partial `
|
|
|
63
62
|
padding-inline: 0;
|
|
64
63
|
min-width: unset;
|
|
65
64
|
}
|
|
66
|
-
:host(
|
|
65
|
+
:host([size='extra-small']) ::slotted(svg) {
|
|
67
66
|
font-size: 10px;
|
|
68
67
|
}
|
|
69
|
-
:host(
|
|
68
|
+
:host([size='small']) {
|
|
70
69
|
min-width: 16px;
|
|
71
70
|
height: 16px;
|
|
72
71
|
font-size: ${fontSizeBase100};
|
|
73
72
|
line-height: ${lineHeightBase100};
|
|
74
73
|
padding-inline: calc(${spacingHorizontalXXS} + ${spacingHorizontalXXS});
|
|
75
74
|
}
|
|
76
|
-
:host(
|
|
75
|
+
:host([size='small']) ::slotted(svg) {
|
|
77
76
|
font-size: 12px;
|
|
78
77
|
}
|
|
79
|
-
:host(
|
|
78
|
+
:host([size='large']) {
|
|
80
79
|
min-width: 24px;
|
|
81
80
|
height: 24px;
|
|
82
81
|
font-size: ${fontSizeBase200};
|
|
83
82
|
line-height: ${lineHeightBase200};
|
|
84
83
|
padding-inline: calc(${spacingHorizontalXS} + ${spacingHorizontalXXS});
|
|
85
84
|
}
|
|
86
|
-
:host(
|
|
85
|
+
:host([size='large']) ::slotted(svg) {
|
|
87
86
|
font-size: 16px;
|
|
88
87
|
}
|
|
89
|
-
:host(
|
|
88
|
+
:host([size='extra-large']) {
|
|
90
89
|
min-width: 32px;
|
|
91
90
|
height: 32px;
|
|
92
91
|
font-size: ${fontSizeBase200};
|
|
93
92
|
line-height: ${lineHeightBase200};
|
|
94
93
|
padding-inline: calc(${spacingHorizontalSNudge} + ${spacingHorizontalXXS});
|
|
95
94
|
}
|
|
96
|
-
:host(
|
|
95
|
+
:host([size='extra-large']) ::slotted(svg) {
|
|
97
96
|
font-size: 20px;
|
|
98
97
|
}
|
|
99
98
|
`;
|
|
@@ -104,37 +103,37 @@ export const badgeSizeStyles = css.partial `
|
|
|
104
103
|
* @public
|
|
105
104
|
*/
|
|
106
105
|
export const badgeFilledStyles = css.partial `
|
|
107
|
-
:host(
|
|
106
|
+
:host([color='danger']) {
|
|
108
107
|
background-color: ${colorPaletteRedBackground3};
|
|
109
108
|
color: ${colorNeutralForegroundOnBrand};
|
|
110
109
|
}
|
|
111
110
|
|
|
112
|
-
:host(
|
|
111
|
+
:host([color='important']) {
|
|
113
112
|
background-color: ${colorNeutralForeground1};
|
|
114
113
|
color: ${colorNeutralBackground1};
|
|
115
114
|
}
|
|
116
115
|
|
|
117
|
-
:host(
|
|
116
|
+
:host([color='informative']) {
|
|
118
117
|
background-color: ${colorNeutralBackground5};
|
|
119
118
|
color: ${colorNeutralForeground3};
|
|
120
119
|
}
|
|
121
120
|
|
|
122
|
-
:host(
|
|
121
|
+
:host([color='severe']) {
|
|
123
122
|
background-color: ${colorPaletteDarkOrangeBackground3};
|
|
124
123
|
color: ${colorNeutralForegroundOnBrand};
|
|
125
124
|
}
|
|
126
125
|
|
|
127
|
-
:host(
|
|
126
|
+
:host([color='subtle']) {
|
|
128
127
|
background-color: ${colorNeutralBackground1};
|
|
129
128
|
color: ${colorNeutralForeground1};
|
|
130
129
|
}
|
|
131
130
|
|
|
132
|
-
:host(
|
|
131
|
+
:host([color='success']) {
|
|
133
132
|
background-color: ${colorPaletteGreenBackground3};
|
|
134
133
|
color: ${colorNeutralForegroundOnBrand};
|
|
135
134
|
}
|
|
136
135
|
|
|
137
|
-
:host(
|
|
136
|
+
:host([color='warning']) {
|
|
138
137
|
background-color: ${colorPaletteYellowBackground3};
|
|
139
138
|
color: ${colorNeutralForeground1Static};
|
|
140
139
|
}
|
|
@@ -144,36 +143,36 @@ export const badgeFilledStyles = css.partial `
|
|
|
144
143
|
* @public
|
|
145
144
|
*/
|
|
146
145
|
export const badgeGhostStyles = css.partial `
|
|
147
|
-
:host(
|
|
146
|
+
:host([appearance='ghost']) {
|
|
148
147
|
color: ${colorBrandForeground1};
|
|
149
148
|
background-color: initial;
|
|
150
149
|
}
|
|
151
150
|
|
|
152
|
-
:host(
|
|
151
|
+
:host([appearance='ghost'][color='danger']) {
|
|
153
152
|
color: ${colorPaletteRedForeground3};
|
|
154
153
|
}
|
|
155
154
|
|
|
156
|
-
:host(
|
|
155
|
+
:host([appearance='ghost'][color='important']) {
|
|
157
156
|
color: ${colorNeutralForeground1};
|
|
158
157
|
}
|
|
159
158
|
|
|
160
|
-
:host(
|
|
159
|
+
:host([appearance='ghost'][color='informative']) {
|
|
161
160
|
color: ${colorNeutralForeground3};
|
|
162
161
|
}
|
|
163
162
|
|
|
164
|
-
:host(
|
|
163
|
+
:host([appearance='ghost'][color='severe']) {
|
|
165
164
|
color: ${colorPaletteDarkOrangeForeground3};
|
|
166
165
|
}
|
|
167
166
|
|
|
168
|
-
:host(
|
|
167
|
+
:host([appearance='ghost'][color='subtle']) {
|
|
169
168
|
color: ${colorNeutralForegroundInverted};
|
|
170
169
|
}
|
|
171
170
|
|
|
172
|
-
:host(
|
|
171
|
+
:host([appearance='ghost'][color='success']) {
|
|
173
172
|
color: ${colorPaletteGreenForeground3};
|
|
174
173
|
}
|
|
175
174
|
|
|
176
|
-
:host(
|
|
175
|
+
:host([appearance='ghost'][color='warning']) {
|
|
177
176
|
color: ${colorPaletteYellowForeground2};
|
|
178
177
|
}
|
|
179
178
|
`;
|
|
@@ -182,39 +181,39 @@ export const badgeGhostStyles = css.partial `
|
|
|
182
181
|
* @public
|
|
183
182
|
*/
|
|
184
183
|
export const badgeOutlineStyles = css.partial `
|
|
185
|
-
:host(
|
|
184
|
+
:host([appearance='outline']) {
|
|
186
185
|
border-color: currentColor;
|
|
187
186
|
color: ${colorBrandForeground1};
|
|
188
187
|
background-color: initial;
|
|
189
188
|
}
|
|
190
189
|
|
|
191
|
-
:host(
|
|
190
|
+
:host([appearance='outline'][color='danger']) {
|
|
192
191
|
color: ${colorPaletteRedForeground3};
|
|
193
192
|
}
|
|
194
193
|
|
|
195
|
-
:host(
|
|
194
|
+
:host([appearance='outline'][color='important']) {
|
|
196
195
|
color: ${colorNeutralForeground3};
|
|
197
196
|
border-color: ${colorNeutralStrokeAccessible};
|
|
198
197
|
}
|
|
199
198
|
|
|
200
|
-
:host(
|
|
199
|
+
:host([appearance='outline'][color='informative']) {
|
|
201
200
|
color: ${colorNeutralForeground3};
|
|
202
201
|
border-color: ${colorNeutralStroke2};
|
|
203
202
|
}
|
|
204
203
|
|
|
205
|
-
:host(
|
|
204
|
+
:host([appearance='outline'][color='severe']) {
|
|
206
205
|
color: ${colorPaletteDarkOrangeForeground3};
|
|
207
206
|
}
|
|
208
207
|
|
|
209
|
-
:host(
|
|
208
|
+
:host([appearance='outline'][color='subtle']) {
|
|
210
209
|
color: ${colorNeutralForegroundStaticInverted};
|
|
211
210
|
}
|
|
212
211
|
|
|
213
|
-
:host(
|
|
212
|
+
:host([appearance='outline'][color='success']) {
|
|
214
213
|
color: ${colorPaletteGreenForeground2};
|
|
215
214
|
}
|
|
216
215
|
|
|
217
|
-
:host(
|
|
216
|
+
:host([appearance='outline'][color='warning']) {
|
|
218
217
|
color: ${colorPaletteYellowForeground2};
|
|
219
218
|
}
|
|
220
219
|
`;
|
|
@@ -223,49 +222,49 @@ export const badgeOutlineStyles = css.partial `
|
|
|
223
222
|
* @public
|
|
224
223
|
*/
|
|
225
224
|
export const badgeTintStyles = css.partial `
|
|
226
|
-
:host(
|
|
225
|
+
:host([appearance='tint']) {
|
|
227
226
|
background-color: ${colorBrandBackground2};
|
|
228
227
|
color: ${colorBrandForeground2};
|
|
229
228
|
border-color: ${colorBrandStroke2};
|
|
230
229
|
}
|
|
231
230
|
|
|
232
|
-
:host(
|
|
231
|
+
:host([appearance='tint'][color='danger']) {
|
|
233
232
|
background-color: ${colorPaletteRedBackground1};
|
|
234
233
|
color: ${colorPaletteRedForeground1};
|
|
235
234
|
border-color: ${colorPaletteRedBorder1};
|
|
236
235
|
}
|
|
237
236
|
|
|
238
|
-
:host(
|
|
237
|
+
:host([appearance='tint'][color='important']) {
|
|
239
238
|
background-color: ${colorNeutralForeground3};
|
|
240
239
|
color: ${colorNeutralBackground1};
|
|
241
240
|
border-color: ${colorTransparentStroke};
|
|
242
241
|
}
|
|
243
242
|
|
|
244
|
-
:host(
|
|
243
|
+
:host([appearance='tint'][color='informative']) {
|
|
245
244
|
background-color: ${colorNeutralBackground4};
|
|
246
245
|
color: ${colorNeutralForeground3};
|
|
247
246
|
border-color: ${colorNeutralStroke2};
|
|
248
247
|
}
|
|
249
248
|
|
|
250
|
-
:host(
|
|
249
|
+
:host([appearance='tint'][color='severe']) {
|
|
251
250
|
background-color: ${colorPaletteDarkOrangeBackground1};
|
|
252
251
|
color: ${colorPaletteDarkOrangeForeground1};
|
|
253
252
|
border-color: ${colorPaletteDarkOrangeBorder1};
|
|
254
253
|
}
|
|
255
254
|
|
|
256
|
-
:host(
|
|
255
|
+
:host([appearance='tint'][color='subtle']) {
|
|
257
256
|
background-color: ${colorNeutralBackground1};
|
|
258
257
|
color: ${colorNeutralForeground3};
|
|
259
258
|
border-color: ${colorNeutralStroke2};
|
|
260
259
|
}
|
|
261
260
|
|
|
262
|
-
:host(
|
|
261
|
+
:host([appearance='tint'][color='success']) {
|
|
263
262
|
background-color: ${colorPaletteGreenBackground1};
|
|
264
263
|
color: ${colorPaletteGreenForeground1};
|
|
265
264
|
border-color: ${colorPaletteGreenBorder2};
|
|
266
265
|
}
|
|
267
266
|
|
|
268
|
-
:host(
|
|
267
|
+
:host([appearance='tint'][color='warning']) {
|
|
269
268
|
background-color: ${colorPaletteYellowBackground1};
|
|
270
269
|
color: ${colorPaletteYellowForeground2};
|
|
271
270
|
border-color: ${colorPaletteYellowBorder1};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"badge.partials.js","sourceRoot":"","sources":["../../../../src/styles/partials/badge.partials.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EACL,oBAAoB,EACpB,oBAAoB,EACpB,qBAAqB,EACrB,qBAAqB,EACrB,qBAAqB,EACrB,iBAAiB,EACjB,uBAAuB,EACvB,uBAAuB,EACvB,uBAAuB,EACvB,uBAAuB,EACvB,6BAA6B,EAC7B,uBAAuB,EACvB,8BAA8B,EAC9B,6BAA6B,EAC7B,oCAAoC,EACpC,mBAAmB,EACnB,4BAA4B,EAC5B,iCAAiC,EACjC,iCAAiC,EACjC,6BAA6B,EAC7B,iCAAiC,EACjC,iCAAiC,EACjC,4BAA4B,EAC5B,4BAA4B,EAC5B,wBAAwB,EACxB,4BAA4B,EAC5B,4BAA4B,EAC5B,4BAA4B,EAC5B,0BAA0B,EAC1B,0BAA0B,EAC1B,sBAAsB,EACtB,0BAA0B,EAC1B,0BAA0B,EAC1B,6BAA6B,EAC7B,6BAA6B,EAC7B,yBAAyB,EACzB,6BAA6B,EAC7B,sBAAsB,EACtB,cAAc,EACd,eAAe,EACf,eAAe,EACf,kBAAkB,EAClB,iBAAiB,EACjB,iBAAiB,EACjB,uBAAuB,EACvB,mBAAmB,EACnB,oBAAoB,EACpB,eAAe,GAChB,MAAM,8BAA8B,CAAC;
|
|
1
|
+
{"version":3,"file":"badge.partials.js","sourceRoot":"","sources":["../../../../src/styles/partials/badge.partials.ts"],"names":[],"mappings":"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"}
|