@carbon/styles 1.52.0 → 1.53.0
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/README.md +9 -0
- package/css/styles.css +481 -206
- package/css/styles.min.css +1 -1
- package/package.json +15 -12
- package/scss/__tests__/theme-test.js +14 -23
- package/scss/_feature-flags.scss +1 -0
- package/scss/components/chat-button/_chat-button.scss +20 -6
- package/scss/components/checkbox/_checkbox.scss +4 -0
- package/scss/components/code-snippet/_code-snippet.scss +0 -1
- package/scss/components/data-table/_data-table.scss +4 -0
- package/scss/components/fluid-list-box/_fluid-list-box.scss +28 -0
- package/scss/components/fluid-search/_fluid-search.scss +1 -10
- package/scss/components/link/_link.scss +13 -10
- package/scss/components/list-box/_list-box.scss +84 -14
- package/scss/components/modal/_modal.scss +4 -3
- package/scss/components/popover/_popover.scss +12 -0
- package/scss/components/radio-button/_radio-button.scss +4 -0
- package/scss/components/slug/_slug.scss +8 -8
- package/scss/components/tag/_mixins.scss +14 -2
- package/scss/components/tag/_tag.scss +147 -39
- package/scss/components/tag/_tokens.scss +265 -0
- package/scss/components/tile/_tile.scss +17 -6
- package/scss/components/toggletip/_toggletip.scss +4 -0
- package/scss/utilities/_ai-gradient.scss +2 -2
- package/telemetry.yml +7 -0
package/css/styles.css
CHANGED
|
@@ -2769,13 +2769,16 @@ em {
|
|
|
2769
2769
|
--cds-ai-border-start: #78a9ff;
|
|
2770
2770
|
--cds-ai-border-strong: #4589ff;
|
|
2771
2771
|
--cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
|
|
2772
|
-
--cds-ai-gradient-end: rgba(255, 255, 255, 0);
|
|
2773
|
-
--cds-ai-gradient-start-01: rgba(242, 244, 248, 0.5);
|
|
2774
|
-
--cds-ai-gradient-start-02: rgba(237, 245, 255, 0.5);
|
|
2775
2772
|
--cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
|
|
2776
2773
|
--cds-ai-overlay: rgba(0, 17, 65, 0.5);
|
|
2777
|
-
--cds-ai-
|
|
2778
|
-
--cds-ai-
|
|
2774
|
+
--cds-ai-popover-caret-bottom: #d0e2ff;
|
|
2775
|
+
--cds-ai-popover-caret-bottom-background: #d5e5ff;
|
|
2776
|
+
--cds-ai-popover-caret-bottom-background-actions: #dae5f8;
|
|
2777
|
+
--cds-ai-popover-caret-center: #a7c7ff;
|
|
2778
|
+
--cds-ai-popover-shadow-outer-01: rgba(0, 67, 206, 0.25);
|
|
2779
|
+
--cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.1);
|
|
2780
|
+
--cds-ai-skeleton-background: #d0e2ff;
|
|
2781
|
+
--cds-ai-skeleton-element-background: #4589ff;
|
|
2779
2782
|
--cds-background: #ffffff;
|
|
2780
2783
|
--cds-background-active: rgba(141, 141, 141, 0.5);
|
|
2781
2784
|
--cds-background-brand: #0f62fe;
|
|
@@ -2806,9 +2809,17 @@ em {
|
|
|
2806
2809
|
--cds-chat-bubble-agent: #ffffff;
|
|
2807
2810
|
--cds-chat-bubble-agent-border: #e0e0e0;
|
|
2808
2811
|
--cds-chat-bubble-user: #e0e0e0;
|
|
2812
|
+
--cds-chat-button: #0f62fe;
|
|
2813
|
+
--cds-chat-button-active: rgba(141, 141, 141, 0.5);
|
|
2814
|
+
--cds-chat-button-hover: rgba(141, 141, 141, 0.12);
|
|
2815
|
+
--cds-chat-button-selected: rgba(141, 141, 141, 0.2);
|
|
2816
|
+
--cds-chat-button-text-hover: #0043ce;
|
|
2817
|
+
--cds-chat-button-text-selected: #525252;
|
|
2818
|
+
--cds-chat-header-background: #ffffff;
|
|
2809
2819
|
--cds-chat-prompt-background: #ffffff;
|
|
2810
2820
|
--cds-chat-prompt-border-end: rgba(244, 244, 244, 0);
|
|
2811
2821
|
--cds-chat-prompt-border-start: #f4f4f4;
|
|
2822
|
+
--cds-chat-shell-background: #ffffff;
|
|
2812
2823
|
--cds-field-01: #f4f4f4;
|
|
2813
2824
|
--cds-field-02: #ffffff;
|
|
2814
2825
|
--cds-field-03: #f4f4f4;
|
|
@@ -2866,26 +2877,6 @@ em {
|
|
|
2866
2877
|
--cds-skeleton-element: #c6c6c6;
|
|
2867
2878
|
--cds-slug-background: #525252;
|
|
2868
2879
|
--cds-slug-background-hover: #6f6f6f;
|
|
2869
|
-
--cds-slug-callout-aura-end: rgba(255, 255, 255, 0);
|
|
2870
|
-
--cds-slug-callout-aura-end-hover-01: rgba(255, 255, 255, 0);
|
|
2871
|
-
--cds-slug-callout-aura-end-hover-02: rgba(255, 255, 255, 0);
|
|
2872
|
-
--cds-slug-callout-aura-end-selected: rgba(255, 255, 255, 0);
|
|
2873
|
-
--cds-slug-callout-aura-start: rgba(69, 137, 255, 0.1);
|
|
2874
|
-
--cds-slug-callout-aura-start-hover-01: rgba(255, 255, 255, 0.5);
|
|
2875
|
-
--cds-slug-callout-aura-start-hover-02: rgba(208, 226, 255, 0.5);
|
|
2876
|
-
--cds-slug-callout-aura-start-selected: rgba(237, 245, 255, 0.6);
|
|
2877
|
-
--cds-slug-callout-caret-bottom: #d0e2ff;
|
|
2878
|
-
--cds-slug-callout-caret-bottom-background: #d5e5ff;
|
|
2879
|
-
--cds-slug-callout-caret-bottom-background-actions: #dae5f8;
|
|
2880
|
-
--cds-slug-callout-caret-center: #a7c7ff;
|
|
2881
|
-
--cds-slug-callout-gradient-bottom: rgba(224, 224, 224, 0.85);
|
|
2882
|
-
--cds-slug-callout-gradient-bottom-hover: rgba(209, 209, 209, 0.55);
|
|
2883
|
-
--cds-slug-callout-gradient-bottom-selected: rgba(209, 209, 209, 0.85);
|
|
2884
|
-
--cds-slug-callout-gradient-top: rgba(244, 244, 244, 0.85);
|
|
2885
|
-
--cds-slug-callout-gradient-top-hover: rgba(224, 224, 224, 0.55);
|
|
2886
|
-
--cds-slug-callout-gradient-top-selected: rgba(224, 224, 224, 0.85);
|
|
2887
|
-
--cds-slug-callout-shadow-outer-01: rgba(0, 67, 206, 0.25);
|
|
2888
|
-
--cds-slug-callout-shadow-outer-02: rgba(0, 0, 0, 0.1);
|
|
2889
2880
|
--cds-slug-hollow-hover: #474747;
|
|
2890
2881
|
--cds-support-caution-major: #ff832b;
|
|
2891
2882
|
--cds-support-caution-minor: #f1c21b;
|
|
@@ -2969,13 +2960,23 @@ em {
|
|
|
2969
2960
|
--cds-tag-color-green: #044317;
|
|
2970
2961
|
--cds-tag-hover-green: #74e792;
|
|
2971
2962
|
--cds-tag-background-gray: #e0e0e0;
|
|
2972
|
-
--cds-tag-color-gray: #
|
|
2963
|
+
--cds-tag-color-gray: #161616;
|
|
2973
2964
|
--cds-tag-hover-gray: #d1d1d1;
|
|
2965
|
+
--cds-tag-border-red: #ff8389;
|
|
2966
|
+
--cds-tag-border-blue: #78a9ff;
|
|
2967
|
+
--cds-tag-border-cyan: #33b1ff;
|
|
2968
|
+
--cds-tag-border-teal: #08bdba;
|
|
2969
|
+
--cds-tag-border-green: #42be65;
|
|
2970
|
+
--cds-tag-border-magenta: #ff7eb6;
|
|
2971
|
+
--cds-tag-border-purple: #be95ff;
|
|
2972
|
+
--cds-tag-border-gray: #a8a8a8;
|
|
2973
|
+
--cds-tag-border-cool-gray: #a2a9b0;
|
|
2974
|
+
--cds-tag-border-warm-gray: #ada8a8;
|
|
2974
2975
|
--cds-tag-background-cool-gray: #dde1e6;
|
|
2975
|
-
--cds-tag-color-cool-gray: #
|
|
2976
|
+
--cds-tag-color-cool-gray: #121619;
|
|
2976
2977
|
--cds-tag-hover-cool-gray: #cdd3da;
|
|
2977
2978
|
--cds-tag-background-warm-gray: #e5e0df;
|
|
2978
|
-
--cds-tag-color-warm-gray: #
|
|
2979
|
+
--cds-tag-color-warm-gray: #171414;
|
|
2979
2980
|
--cds-tag-hover-warm-gray: #d8d0cf;
|
|
2980
2981
|
}
|
|
2981
2982
|
|
|
@@ -2992,13 +2993,16 @@ em {
|
|
|
2992
2993
|
--cds-ai-border-start: #78a9ff;
|
|
2993
2994
|
--cds-ai-border-strong: #4589ff;
|
|
2994
2995
|
--cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
|
|
2995
|
-
--cds-ai-gradient-end: rgba(255, 255, 255, 0);
|
|
2996
|
-
--cds-ai-gradient-start-01: rgba(242, 244, 248, 0.5);
|
|
2997
|
-
--cds-ai-gradient-start-02: rgba(237, 245, 255, 0.5);
|
|
2998
2996
|
--cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
|
|
2999
2997
|
--cds-ai-overlay: rgba(0, 17, 65, 0.5);
|
|
3000
|
-
--cds-ai-
|
|
3001
|
-
--cds-ai-
|
|
2998
|
+
--cds-ai-popover-caret-bottom: #d0e2ff;
|
|
2999
|
+
--cds-ai-popover-caret-bottom-background: #ccdbf8;
|
|
3000
|
+
--cds-ai-popover-caret-bottom-background-actions: #d2dcee;
|
|
3001
|
+
--cds-ai-popover-caret-center: #a7c7ff;
|
|
3002
|
+
--cds-ai-popover-shadow-outer-01: rgba(0, 67, 206, 0.25);
|
|
3003
|
+
--cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.1);
|
|
3004
|
+
--cds-ai-skeleton-background: #d0e2ff;
|
|
3005
|
+
--cds-ai-skeleton-element-background: #4589ff;
|
|
3002
3006
|
--cds-background: #f4f4f4;
|
|
3003
3007
|
--cds-background-active: rgba(141, 141, 141, 0.5);
|
|
3004
3008
|
--cds-background-brand: #0f62fe;
|
|
@@ -3029,9 +3033,17 @@ em {
|
|
|
3029
3033
|
--cds-chat-bubble-agent: #ffffff;
|
|
3030
3034
|
--cds-chat-bubble-agent-border: #e0e0e0;
|
|
3031
3035
|
--cds-chat-bubble-user: #e0e0e0;
|
|
3036
|
+
--cds-chat-button: #0f62fe;
|
|
3037
|
+
--cds-chat-button-active: rgba(141, 141, 141, 0.5);
|
|
3038
|
+
--cds-chat-button-hover: rgba(141, 141, 141, 0.12);
|
|
3039
|
+
--cds-chat-button-selected: rgba(141, 141, 141, 0.2);
|
|
3040
|
+
--cds-chat-button-text-hover: #0043ce;
|
|
3041
|
+
--cds-chat-button-text-selected: #525252;
|
|
3042
|
+
--cds-chat-header-background: #ffffff;
|
|
3032
3043
|
--cds-chat-prompt-background: #ffffff;
|
|
3033
3044
|
--cds-chat-prompt-border-end: rgba(244, 244, 244, 0);
|
|
3034
3045
|
--cds-chat-prompt-border-start: #f4f4f4;
|
|
3046
|
+
--cds-chat-shell-background: #ffffff;
|
|
3035
3047
|
--cds-field-01: #ffffff;
|
|
3036
3048
|
--cds-field-02: #f4f4f4;
|
|
3037
3049
|
--cds-field-03: #ffffff;
|
|
@@ -3089,26 +3101,6 @@ em {
|
|
|
3089
3101
|
--cds-skeleton-element: #c6c6c6;
|
|
3090
3102
|
--cds-slug-background: #525252;
|
|
3091
3103
|
--cds-slug-background-hover: #6f6f6f;
|
|
3092
|
-
--cds-slug-callout-aura-end: rgba(255, 255, 255, 0);
|
|
3093
|
-
--cds-slug-callout-aura-end-hover-01: rgba(255, 255, 255, 0);
|
|
3094
|
-
--cds-slug-callout-aura-end-hover-02: rgba(255, 255, 255, 0);
|
|
3095
|
-
--cds-slug-callout-aura-end-selected: rgba(255, 255, 255, 0);
|
|
3096
|
-
--cds-slug-callout-aura-start: rgba(69, 137, 255, 0.1);
|
|
3097
|
-
--cds-slug-callout-aura-start-hover-01: rgba(255, 255, 255, 0.5);
|
|
3098
|
-
--cds-slug-callout-aura-start-hover-02: rgba(208, 226, 255, 0.5);
|
|
3099
|
-
--cds-slug-callout-aura-start-selected: rgba(237, 245, 255, 0.6);
|
|
3100
|
-
--cds-slug-callout-caret-bottom: #d0e2ff;
|
|
3101
|
-
--cds-slug-callout-caret-bottom-background: #ccdbf8;
|
|
3102
|
-
--cds-slug-callout-caret-bottom-background-actions: #d2dcee;
|
|
3103
|
-
--cds-slug-callout-caret-center: #a7c7ff;
|
|
3104
|
-
--cds-slug-callout-gradient-bottom: rgba(224, 224, 224, 0.85);
|
|
3105
|
-
--cds-slug-callout-gradient-bottom-hover: rgba(209, 209, 209, 0.55);
|
|
3106
|
-
--cds-slug-callout-gradient-bottom-selected: rgba(209, 209, 209, 0.85);
|
|
3107
|
-
--cds-slug-callout-gradient-top: rgba(244, 244, 244, 0.85);
|
|
3108
|
-
--cds-slug-callout-gradient-top-hover: rgba(224, 224, 224, 0.55);
|
|
3109
|
-
--cds-slug-callout-gradient-top-selected: rgba(224, 224, 224, 0.85);
|
|
3110
|
-
--cds-slug-callout-shadow-outer-01: rgba(0, 67, 206, 0.25);
|
|
3111
|
-
--cds-slug-callout-shadow-outer-02: rgba(0, 0, 0, 0.1);
|
|
3112
3104
|
--cds-slug-hollow-hover: #474747;
|
|
3113
3105
|
--cds-support-caution-major: #ff832b;
|
|
3114
3106
|
--cds-support-caution-minor: #f1c21b;
|
|
@@ -3192,13 +3184,23 @@ em {
|
|
|
3192
3184
|
--cds-tag-color-green: #044317;
|
|
3193
3185
|
--cds-tag-hover-green: #74e792;
|
|
3194
3186
|
--cds-tag-background-gray: #e0e0e0;
|
|
3195
|
-
--cds-tag-color-gray: #
|
|
3187
|
+
--cds-tag-color-gray: #161616;
|
|
3196
3188
|
--cds-tag-hover-gray: #d1d1d1;
|
|
3189
|
+
--cds-tag-border-red: #ff8389;
|
|
3190
|
+
--cds-tag-border-blue: #78a9ff;
|
|
3191
|
+
--cds-tag-border-cyan: #33b1ff;
|
|
3192
|
+
--cds-tag-border-teal: #08bdba;
|
|
3193
|
+
--cds-tag-border-green: #42be65;
|
|
3194
|
+
--cds-tag-border-magenta: #ff7eb6;
|
|
3195
|
+
--cds-tag-border-purple: #be95ff;
|
|
3196
|
+
--cds-tag-border-gray: #a8a8a8;
|
|
3197
|
+
--cds-tag-border-cool-gray: #a2a9b0;
|
|
3198
|
+
--cds-tag-border-warm-gray: #ada8a8;
|
|
3197
3199
|
--cds-tag-background-cool-gray: #dde1e6;
|
|
3198
|
-
--cds-tag-color-cool-gray: #
|
|
3200
|
+
--cds-tag-color-cool-gray: #121619;
|
|
3199
3201
|
--cds-tag-hover-cool-gray: #cdd3da;
|
|
3200
3202
|
--cds-tag-background-warm-gray: #e5e0df;
|
|
3201
|
-
--cds-tag-color-warm-gray: #
|
|
3203
|
+
--cds-tag-color-warm-gray: #171414;
|
|
3202
3204
|
--cds-tag-hover-warm-gray: #d8d0cf;
|
|
3203
3205
|
}
|
|
3204
3206
|
|
|
@@ -3215,12 +3217,16 @@ em {
|
|
|
3215
3217
|
--cds-ai-border-start: #4589ff;
|
|
3216
3218
|
--cds-ai-border-strong: #78a9ff;
|
|
3217
3219
|
--cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
|
|
3218
|
-
--cds-ai-gradient-end: rgba(38, 38, 38, 0);
|
|
3219
|
-
--cds-ai-gradient-start-01: rgba(208, 226, 255, 0.2);
|
|
3220
3220
|
--cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
|
|
3221
3221
|
--cds-ai-overlay: rgba(0, 17, 65, 0.5);
|
|
3222
|
-
--cds-ai-
|
|
3223
|
-
--cds-ai-
|
|
3222
|
+
--cds-ai-popover-caret-bottom: #465060;
|
|
3223
|
+
--cds-ai-popover-caret-bottom-background: #2d3f5c;
|
|
3224
|
+
--cds-ai-popover-caret-bottom-background-actions: #253042;
|
|
3225
|
+
--cds-ai-popover-caret-center: #456fb5;
|
|
3226
|
+
--cds-ai-popover-shadow-outer-01: rgba(0, 45, 156, 0.25);
|
|
3227
|
+
--cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.65);
|
|
3228
|
+
--cds-ai-skeleton-background: #a6c8ff;
|
|
3229
|
+
--cds-ai-skeleton-element-background: #002d9c;
|
|
3224
3230
|
--cds-background: #262626;
|
|
3225
3231
|
--cds-background-active: rgba(141, 141, 141, 0.4);
|
|
3226
3232
|
--cds-background-brand: #0f62fe;
|
|
@@ -3251,9 +3257,17 @@ em {
|
|
|
3251
3257
|
--cds-chat-bubble-agent: #262626;
|
|
3252
3258
|
--cds-chat-bubble-agent-border: #525252;
|
|
3253
3259
|
--cds-chat-bubble-user: #393939;
|
|
3260
|
+
--cds-chat-button: #78a9ff;
|
|
3261
|
+
--cds-chat-button-active: rgba(141, 141, 141, 0.4);
|
|
3262
|
+
--cds-chat-button-hover: rgba(141, 141, 141, 0.16);
|
|
3263
|
+
--cds-chat-button-selected: rgba(141, 141, 141, 0.24);
|
|
3264
|
+
--cds-chat-button-text-hover: #a6c8ff;
|
|
3265
|
+
--cds-chat-button-text-selected: #c6c6c6;
|
|
3266
|
+
--cds-chat-header-background: #262626;
|
|
3254
3267
|
--cds-chat-prompt-background: #161616;
|
|
3255
3268
|
--cds-chat-prompt-border-end: rgba(38, 38, 38, 0);
|
|
3256
3269
|
--cds-chat-prompt-border-start: #262626;
|
|
3270
|
+
--cds-chat-shell-background: #262626;
|
|
3257
3271
|
--cds-field-01: #393939;
|
|
3258
3272
|
--cds-field-02: #525252;
|
|
3259
3273
|
--cds-field-03: #6f6f6f;
|
|
@@ -3311,24 +3325,6 @@ em {
|
|
|
3311
3325
|
--cds-skeleton-element: #525252;
|
|
3312
3326
|
--cds-slug-background: #c6c6c6;
|
|
3313
3327
|
--cds-slug-background-hover: #e0e0e0;
|
|
3314
|
-
--cds-slug-callout-aura-end: rgba(0, 0, 0, 0);
|
|
3315
|
-
--cds-slug-callout-aura-end-hover-01: rgba(22, 22, 22, 0);
|
|
3316
|
-
--cds-slug-callout-aura-end-selected: rgba(22, 22, 22, 0);
|
|
3317
|
-
--cds-slug-callout-aura-start: rgba(69, 137, 255, 0.1);
|
|
3318
|
-
--cds-slug-callout-aura-start-hover-01: rgba(184, 211, 255, 0.3);
|
|
3319
|
-
--cds-slug-callout-aura-start-selected: rgba(208, 226, 255, 0.2);
|
|
3320
|
-
--cds-slug-callout-caret-bottom: #465060;
|
|
3321
|
-
--cds-slug-callout-caret-bottom-background: #2d3f5c;
|
|
3322
|
-
--cds-slug-callout-caret-bottom-background-actions: #253042;
|
|
3323
|
-
--cds-slug-callout-caret-center: #456fb5;
|
|
3324
|
-
--cds-slug-callout-gradient-bottom: rgba(38, 38, 38, 0.85);
|
|
3325
|
-
--cds-slug-callout-gradient-bottom-hover: rgba(71, 71, 71, 0.55);
|
|
3326
|
-
--cds-slug-callout-gradient-bottom-selected: rgba(71, 71, 71, 0.85);
|
|
3327
|
-
--cds-slug-callout-gradient-top: rgba(22, 22, 22, 0.85);
|
|
3328
|
-
--cds-slug-callout-gradient-top-hover: rgba(57, 57, 57, 0.55);
|
|
3329
|
-
--cds-slug-callout-gradient-top-selected: rgba(57, 57, 57, 0.85);
|
|
3330
|
-
--cds-slug-callout-shadow-outer-01: rgba(0, 45, 156, 0.25);
|
|
3331
|
-
--cds-slug-callout-shadow-outer-02: rgba(0, 0, 0, 0.65);
|
|
3332
3328
|
--cds-slug-hollow-hover: #b5b5b5;
|
|
3333
3329
|
--cds-support-caution-major: #ff832b;
|
|
3334
3330
|
--cds-support-caution-minor: #f1c21b;
|
|
@@ -3411,13 +3407,23 @@ em {
|
|
|
3411
3407
|
--cds-tag-color-green: #a7f0ba;
|
|
3412
3408
|
--cds-tag-hover-green: #11742f;
|
|
3413
3409
|
--cds-tag-background-gray: #525252;
|
|
3414
|
-
--cds-tag-color-gray: #
|
|
3410
|
+
--cds-tag-color-gray: #f4f4f4;
|
|
3415
3411
|
--cds-tag-hover-gray: #636363;
|
|
3412
|
+
--cds-tag-border-red: #fa4d56;
|
|
3413
|
+
--cds-tag-border-blue: #4589ff;
|
|
3414
|
+
--cds-tag-border-cyan: #1192e8;
|
|
3415
|
+
--cds-tag-border-teal: #009d9a;
|
|
3416
|
+
--cds-tag-border-green: #24a148;
|
|
3417
|
+
--cds-tag-border-magenta: #ee5396;
|
|
3418
|
+
--cds-tag-border-purple: #a56eff;
|
|
3419
|
+
--cds-tag-border-gray: #8d8d8d;
|
|
3420
|
+
--cds-tag-border-cool-gray: #878d96;
|
|
3421
|
+
--cds-tag-border-warm-gray: #8f8b8b;
|
|
3416
3422
|
--cds-tag-background-cool-gray: #4d5358;
|
|
3417
|
-
--cds-tag-color-cool-gray: #
|
|
3423
|
+
--cds-tag-color-cool-gray: #f2f4f8;
|
|
3418
3424
|
--cds-tag-hover-cool-gray: #5d646a;
|
|
3419
3425
|
--cds-tag-background-warm-gray: #565151;
|
|
3420
|
-
--cds-tag-color-warm-gray: #
|
|
3426
|
+
--cds-tag-color-warm-gray: #f7f3f2;
|
|
3421
3427
|
--cds-tag-hover-warm-gray: #696363;
|
|
3422
3428
|
}
|
|
3423
3429
|
|
|
@@ -3434,12 +3440,16 @@ em {
|
|
|
3434
3440
|
--cds-ai-border-start: #4589ff;
|
|
3435
3441
|
--cds-ai-border-strong: #78a9ff;
|
|
3436
3442
|
--cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
|
|
3437
|
-
--cds-ai-gradient-end: rgba(38, 38, 38, 0);
|
|
3438
|
-
--cds-ai-gradient-start-01: rgba(208, 226, 255, 0.2);
|
|
3439
3443
|
--cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
|
|
3440
3444
|
--cds-ai-overlay: rgba(0, 17, 65, 0.5);
|
|
3441
|
-
--cds-ai-
|
|
3442
|
-
--cds-ai-
|
|
3445
|
+
--cds-ai-popover-caret-bottom: #3d4655;
|
|
3446
|
+
--cds-ai-popover-caret-bottom-background: #213250;
|
|
3447
|
+
--cds-ai-popover-caret-bottom-background-actions: #192436;
|
|
3448
|
+
--cds-ai-popover-caret-center: #3f68af;
|
|
3449
|
+
--cds-ai-popover-shadow-outer-01: rgba(0, 45, 156, 0.25);
|
|
3450
|
+
--cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.65);
|
|
3451
|
+
--cds-ai-skeleton-background: #a6c8ff;
|
|
3452
|
+
--cds-ai-skeleton-element-background: #002d9c;
|
|
3443
3453
|
--cds-background: #161616;
|
|
3444
3454
|
--cds-background-active: rgba(141, 141, 141, 0.4);
|
|
3445
3455
|
--cds-background-brand: #0f62fe;
|
|
@@ -3470,9 +3480,17 @@ em {
|
|
|
3470
3480
|
--cds-chat-bubble-agent: #262626;
|
|
3471
3481
|
--cds-chat-bubble-agent-border: #525252;
|
|
3472
3482
|
--cds-chat-bubble-user: #393939;
|
|
3483
|
+
--cds-chat-button: #78a9ff;
|
|
3484
|
+
--cds-chat-button-active: rgba(141, 141, 141, 0.4);
|
|
3485
|
+
--cds-chat-button-hover: rgba(141, 141, 141, 0.16);
|
|
3486
|
+
--cds-chat-button-selected: rgba(141, 141, 141, 0.24);
|
|
3487
|
+
--cds-chat-button-text-hover: #a6c8ff;
|
|
3488
|
+
--cds-chat-button-text-selected: #c6c6c6;
|
|
3489
|
+
--cds-chat-header-background: #262626;
|
|
3473
3490
|
--cds-chat-prompt-background: #161616;
|
|
3474
3491
|
--cds-chat-prompt-border-end: rgba(38, 38, 38, 0);
|
|
3475
3492
|
--cds-chat-prompt-border-start: #262626;
|
|
3493
|
+
--cds-chat-shell-background: #262626;
|
|
3476
3494
|
--cds-field-01: #262626;
|
|
3477
3495
|
--cds-field-02: #393939;
|
|
3478
3496
|
--cds-field-03: #525252;
|
|
@@ -3530,24 +3548,6 @@ em {
|
|
|
3530
3548
|
--cds-skeleton-element: #393939;
|
|
3531
3549
|
--cds-slug-background: #c6c6c6;
|
|
3532
3550
|
--cds-slug-background-hover: #e0e0e0;
|
|
3533
|
-
--cds-slug-callout-aura-end: rgba(0, 0, 0, 0);
|
|
3534
|
-
--cds-slug-callout-aura-end-hover-01: rgba(22, 22, 22, 0);
|
|
3535
|
-
--cds-slug-callout-aura-end-selected: rgba(22, 22, 22, 0);
|
|
3536
|
-
--cds-slug-callout-aura-start: rgba(69, 137, 255, 0.1);
|
|
3537
|
-
--cds-slug-callout-aura-start-hover-01: rgba(184, 211, 255, 0.3);
|
|
3538
|
-
--cds-slug-callout-aura-start-selected: rgba(208, 226, 255, 0.2);
|
|
3539
|
-
--cds-slug-callout-caret-bottom: #3d4655;
|
|
3540
|
-
--cds-slug-callout-caret-bottom-background: #213250;
|
|
3541
|
-
--cds-slug-callout-caret-bottom-background-actions: #192436;
|
|
3542
|
-
--cds-slug-callout-caret-center: #3f68af;
|
|
3543
|
-
--cds-slug-callout-gradient-bottom: rgba(38, 38, 38, 0.85);
|
|
3544
|
-
--cds-slug-callout-gradient-bottom-hover: rgba(71, 71, 71, 0.55);
|
|
3545
|
-
--cds-slug-callout-gradient-bottom-selected: rgba(71, 71, 71, 0.85);
|
|
3546
|
-
--cds-slug-callout-gradient-top: rgba(22, 22, 22, 0.85);
|
|
3547
|
-
--cds-slug-callout-gradient-top-hover: rgba(57, 57, 57, 0.55);
|
|
3548
|
-
--cds-slug-callout-gradient-top-selected: rgba(57, 57, 57, 0.85);
|
|
3549
|
-
--cds-slug-callout-shadow-outer-01: rgba(0, 45, 156, 0.25);
|
|
3550
|
-
--cds-slug-callout-shadow-outer-02: rgba(0, 0, 0, 0.65);
|
|
3551
3551
|
--cds-slug-hollow-hover: #b5b5b5;
|
|
3552
3552
|
--cds-support-caution-major: #ff832b;
|
|
3553
3553
|
--cds-support-caution-minor: #f1c21b;
|
|
@@ -3630,13 +3630,23 @@ em {
|
|
|
3630
3630
|
--cds-tag-color-green: #a7f0ba;
|
|
3631
3631
|
--cds-tag-hover-green: #11742f;
|
|
3632
3632
|
--cds-tag-background-gray: #525252;
|
|
3633
|
-
--cds-tag-color-gray: #
|
|
3633
|
+
--cds-tag-color-gray: #f4f4f4;
|
|
3634
3634
|
--cds-tag-hover-gray: #636363;
|
|
3635
|
+
--cds-tag-border-red: #fa4d56;
|
|
3636
|
+
--cds-tag-border-blue: #4589ff;
|
|
3637
|
+
--cds-tag-border-cyan: #1192e8;
|
|
3638
|
+
--cds-tag-border-teal: #009d9a;
|
|
3639
|
+
--cds-tag-border-green: #24a148;
|
|
3640
|
+
--cds-tag-border-magenta: #ee5396;
|
|
3641
|
+
--cds-tag-border-purple: #a56eff;
|
|
3642
|
+
--cds-tag-border-gray: #8d8d8d;
|
|
3643
|
+
--cds-tag-border-cool-gray: #878d96;
|
|
3644
|
+
--cds-tag-border-warm-gray: #8f8b8b;
|
|
3635
3645
|
--cds-tag-background-cool-gray: #4d5358;
|
|
3636
|
-
--cds-tag-color-cool-gray: #
|
|
3646
|
+
--cds-tag-color-cool-gray: #f2f4f8;
|
|
3637
3647
|
--cds-tag-hover-cool-gray: #5d646a;
|
|
3638
3648
|
--cds-tag-background-warm-gray: #565151;
|
|
3639
|
-
--cds-tag-color-warm-gray: #
|
|
3649
|
+
--cds-tag-color-warm-gray: #f7f3f2;
|
|
3640
3650
|
--cds-tag-hover-warm-gray: #696363;
|
|
3641
3651
|
}
|
|
3642
3652
|
|
|
@@ -4052,6 +4062,9 @@ li.cds--accordion__item--disabled:last-of-type {
|
|
|
4052
4062
|
}
|
|
4053
4063
|
|
|
4054
4064
|
.cds--popover-content {
|
|
4065
|
+
--cds-layout-size-height-sm: 2rem;
|
|
4066
|
+
--cds-layout-size-height-md: 2.5rem;
|
|
4067
|
+
--cds-layout-size-height-lg: 3rem;
|
|
4055
4068
|
box-sizing: border-box;
|
|
4056
4069
|
padding: 0;
|
|
4057
4070
|
border: 0;
|
|
@@ -4070,6 +4083,15 @@ li.cds--accordion__item--disabled:last-of-type {
|
|
|
4070
4083
|
max-inline-size: 23rem;
|
|
4071
4084
|
pointer-events: auto;
|
|
4072
4085
|
}
|
|
4086
|
+
.cds--layout--size-sm .cds--popover-content {
|
|
4087
|
+
--cds-layout-size-height: var(--cds-layout-size-height-sm);
|
|
4088
|
+
}
|
|
4089
|
+
.cds--layout--size-md .cds--popover-content {
|
|
4090
|
+
--cds-layout-size-height: var(--cds-layout-size-height-md);
|
|
4091
|
+
}
|
|
4092
|
+
.cds--layout--size-lg .cds--popover-content {
|
|
4093
|
+
--cds-layout-size-height: var(--cds-layout-size-height-lg);
|
|
4094
|
+
}
|
|
4073
4095
|
.cds--popover-content *,
|
|
4074
4096
|
.cds--popover-content *::before,
|
|
4075
4097
|
.cds--popover-content *::after {
|
|
@@ -5562,12 +5584,20 @@ a.cds--overflow-menu-options__btn::before {
|
|
|
5562
5584
|
text-decoration: underline;
|
|
5563
5585
|
}
|
|
5564
5586
|
.cds--link:active, .cds--link:active:visited, .cds--link:active:visited:hover {
|
|
5565
|
-
|
|
5587
|
+
outline: 1px solid var(--cds-focus, #0f62fe);
|
|
5588
|
+
color: var(--cds-link-text-color, var(--cds-link-primary, #0f62fe));
|
|
5589
|
+
outline-color: var(--cds-link-focus-text-color, var(--cds-focus, #0f62fe));
|
|
5566
5590
|
text-decoration: underline;
|
|
5567
5591
|
}
|
|
5592
|
+
@media screen and (prefers-contrast) {
|
|
5593
|
+
.cds--link:active, .cds--link:active:visited, .cds--link:active:visited:hover {
|
|
5594
|
+
outline-style: dotted;
|
|
5595
|
+
}
|
|
5596
|
+
}
|
|
5568
5597
|
.cds--link:focus {
|
|
5569
5598
|
outline: 1px solid var(--cds-focus, #0f62fe);
|
|
5570
5599
|
outline-color: var(--cds-link-focus-text-color, var(--cds-focus, #0f62fe));
|
|
5600
|
+
text-decoration: underline;
|
|
5571
5601
|
}
|
|
5572
5602
|
@media screen and (prefers-contrast) {
|
|
5573
5603
|
.cds--link:focus {
|
|
@@ -5575,10 +5605,10 @@ a.cds--overflow-menu-options__btn::before {
|
|
|
5575
5605
|
}
|
|
5576
5606
|
}
|
|
5577
5607
|
.cds--link:visited {
|
|
5578
|
-
color: var(--cds-link-
|
|
5608
|
+
color: var(--cds-link-visited-text-color, var(--cds-link-visited, #8a3ffc));
|
|
5579
5609
|
}
|
|
5580
5610
|
.cds--link:visited:hover {
|
|
5581
|
-
color: var(--cds-link-
|
|
5611
|
+
color: var(--cds-link-visited-text-color, var(--cds-link-visited, #8a3ffc));
|
|
5582
5612
|
}
|
|
5583
5613
|
|
|
5584
5614
|
.cds--link--disabled,
|
|
@@ -5609,20 +5639,17 @@ a.cds--overflow-menu-options__btn::before {
|
|
|
5609
5639
|
}
|
|
5610
5640
|
|
|
5611
5641
|
.cds--link.cds--link--visited:visited {
|
|
5612
|
-
color: var(--cds-link-visited, #8a3ffc);
|
|
5642
|
+
color: var(--cds-link-visited-text-color, var(--cds-link-visited, #8a3ffc));
|
|
5613
5643
|
}
|
|
5614
5644
|
|
|
5615
5645
|
.cds--link.cds--link--visited:visited:hover {
|
|
5616
|
-
color: var(--cds-link-primary-hover, #0043ce);
|
|
5646
|
+
color: var(--cds-link-hover-text-color, var(--cds-link-primary-hover, #0043ce));
|
|
5617
5647
|
}
|
|
5618
5648
|
|
|
5619
5649
|
.cds--link.cds--link--inline {
|
|
5620
5650
|
display: inline;
|
|
5621
5651
|
text-decoration: underline;
|
|
5622
5652
|
}
|
|
5623
|
-
.cds--link.cds--link--inline:focus, .cds--link.cds--link--inline:visited {
|
|
5624
|
-
text-decoration: none;
|
|
5625
|
-
}
|
|
5626
5653
|
|
|
5627
5654
|
.cds--link--disabled.cds--link--inline {
|
|
5628
5655
|
text-decoration: underline;
|
|
@@ -5667,12 +5694,21 @@ a.cds--overflow-menu-options__btn::before {
|
|
|
5667
5694
|
|
|
5668
5695
|
.cds--chat-btn--quick-action {
|
|
5669
5696
|
align-items: center;
|
|
5670
|
-
border: 1px solid var(--cds-
|
|
5697
|
+
border: 1px solid var(--cds-chat-button, #0f62fe);
|
|
5698
|
+
background: transparent;
|
|
5699
|
+
color: var(--cds-chat-button, #0f62fe);
|
|
5671
5700
|
}
|
|
5672
5701
|
|
|
5673
5702
|
.cds--chat-btn--quick-action:hover:not(:active):not([disabled]) {
|
|
5674
5703
|
border-color: transparent;
|
|
5675
|
-
background: var(--cds-
|
|
5704
|
+
background: var(--cds-chat-button-hover, rgba(141, 141, 141, 0.12));
|
|
5705
|
+
color: var(--cds-chat-button-text-hover, #0043ce);
|
|
5706
|
+
}
|
|
5707
|
+
|
|
5708
|
+
.cds--chat-btn--quick-action:active {
|
|
5709
|
+
border-color: transparent;
|
|
5710
|
+
background: var(--cds-chat-button-active, rgba(141, 141, 141, 0.5));
|
|
5711
|
+
color: var(--cds-chat-button-text-hover, #0043ce);
|
|
5676
5712
|
}
|
|
5677
5713
|
|
|
5678
5714
|
.cds--chat-btn--quick-action.cds--btn--ghost:focus {
|
|
@@ -5695,12 +5731,13 @@ a.cds--overflow-menu-options__btn::before {
|
|
|
5695
5731
|
.cds--chat-btn--quick-action--selected[disabled],
|
|
5696
5732
|
.cds--chat-btn--quick-action--selected[disabled]:hover {
|
|
5697
5733
|
border-color: transparent;
|
|
5698
|
-
background: var(--cds-
|
|
5699
|
-
color: var(--cds-text-
|
|
5734
|
+
background: var(--cds-chat-button-selected, rgba(141, 141, 141, 0.2));
|
|
5735
|
+
color: var(--cds-chat-button-text-selected, #525252);
|
|
5700
5736
|
}
|
|
5701
5737
|
|
|
5702
|
-
.cds--chat-btn--quick-action--selected:hover
|
|
5703
|
-
|
|
5738
|
+
.cds--chat-btn--quick-action.cds--chat-btn--quick-action--selected:not([disabled]):hover,
|
|
5739
|
+
.cds--chat-btn--quick-action.cds--chat-btn--quick-action--selected:not([disabled]):active {
|
|
5740
|
+
color: var(--cds-chat-button-text-selected, #525252);
|
|
5704
5741
|
}
|
|
5705
5742
|
|
|
5706
5743
|
.cds--chat-btn.cds--skeleton {
|
|
@@ -6091,6 +6128,13 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
6091
6128
|
.cds--checkbox-label::after {
|
|
6092
6129
|
box-sizing: border-box;
|
|
6093
6130
|
}
|
|
6131
|
+
@media print {
|
|
6132
|
+
.cds--checkbox-label::before,
|
|
6133
|
+
.cds--checkbox-label::after {
|
|
6134
|
+
-webkit-print-color-adjust: exact;
|
|
6135
|
+
print-color-adjust: exact;
|
|
6136
|
+
}
|
|
6137
|
+
}
|
|
6094
6138
|
|
|
6095
6139
|
.cds--checkbox-label::before {
|
|
6096
6140
|
position: absolute;
|
|
@@ -6708,7 +6752,6 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
6708
6752
|
}
|
|
6709
6753
|
|
|
6710
6754
|
.cds--snippet--multi .cds--snippet-container pre {
|
|
6711
|
-
padding-block-end: 1.5rem;
|
|
6712
6755
|
padding-inline-end: 2.5rem;
|
|
6713
6756
|
}
|
|
6714
6757
|
|
|
@@ -7690,17 +7733,18 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
7690
7733
|
--cds-layout-size-height-xs: 1.125rem;
|
|
7691
7734
|
--cds-layout-size-height-sm: 1.125rem;
|
|
7692
7735
|
--cds-layout-size-height-md: 1.5rem;
|
|
7693
|
-
--cds-layout-size-height-
|
|
7736
|
+
--cds-layout-size-height-lg: 2rem;
|
|
7737
|
+
--cds-layout-size-height-local: clamp(max(var(--cds-layout-size-height-min), var(--cds-layout-size-height-sm)), var(--cds-layout-size-height, var(--cds-layout-size-height-md)), min(var(--cds-layout-size-height-max), var(--cds-layout-size-height-lg)));
|
|
7694
7738
|
font-size: var(--cds-label-01-font-size, 0.75rem);
|
|
7695
7739
|
font-weight: var(--cds-label-01-font-weight, 400);
|
|
7696
7740
|
line-height: var(--cds-label-01-line-height, 1.33333);
|
|
7697
7741
|
letter-spacing: var(--cds-label-01-letter-spacing, 0.32px);
|
|
7698
7742
|
background-color: var(--cds-tag-background-gray, #e0e0e0);
|
|
7699
|
-
color: var(--cds-tag-color-gray, #
|
|
7743
|
+
color: var(--cds-tag-color-gray, #161616);
|
|
7700
7744
|
display: inline-flex;
|
|
7701
7745
|
align-items: center;
|
|
7702
7746
|
justify-content: center;
|
|
7703
|
-
border-radius:
|
|
7747
|
+
border-radius: 1rem;
|
|
7704
7748
|
margin: 0.25rem;
|
|
7705
7749
|
cursor: default;
|
|
7706
7750
|
max-inline-size: 100%;
|
|
@@ -7719,19 +7763,113 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
7719
7763
|
.cds--layout--size-md .cds--tag {
|
|
7720
7764
|
--cds-layout-size-height: var(--cds-layout-size-height-md);
|
|
7721
7765
|
}
|
|
7722
|
-
.cds--
|
|
7766
|
+
.cds--layout--size-lg .cds--tag {
|
|
7767
|
+
--cds-layout-size-height: var(--cds-layout-size-height-lg);
|
|
7768
|
+
}
|
|
7769
|
+
.cds--tag.cds--tag--operational {
|
|
7770
|
+
border: 1px solid var(--cds-tag-background-gray, #e0e0e0);
|
|
7771
|
+
}
|
|
7772
|
+
.cds--tag.cds--tag--operational:hover {
|
|
7773
|
+
background-color: var(--cds-tag-hover-gray, #d1d1d1);
|
|
7774
|
+
}
|
|
7723
7775
|
.cds--tag .cds--tag__close-icon:hover {
|
|
7724
7776
|
background-color: var(--cds-tag-hover-gray, #d1d1d1);
|
|
7725
7777
|
}
|
|
7778
|
+
.cds--tag.cds--tag--lg {
|
|
7779
|
+
padding-inline-start: 0.75rem;
|
|
7780
|
+
}
|
|
7781
|
+
.cds--tag:has(.cds--tag__custom-icon) {
|
|
7782
|
+
padding-inline-start: 0.25rem;
|
|
7783
|
+
}
|
|
7784
|
+
.cds--tag.cds--tag--lg:not(.cds--tag--filter) {
|
|
7785
|
+
padding-inline: 0.75rem;
|
|
7786
|
+
}
|
|
7787
|
+
.cds--tag.cds--tag--lg:has(.cds--tag__custom-icon) {
|
|
7788
|
+
padding-inline-start: 0.5rem;
|
|
7789
|
+
}
|
|
7726
7790
|
.cds--tag:not(:first-child) {
|
|
7727
7791
|
margin-inline-start: 0;
|
|
7728
7792
|
}
|
|
7729
7793
|
|
|
7794
|
+
.cds--tag__label {
|
|
7795
|
+
overflow: hidden;
|
|
7796
|
+
max-inline-size: 100%;
|
|
7797
|
+
text-overflow: ellipsis;
|
|
7798
|
+
white-space: nowrap;
|
|
7799
|
+
}
|
|
7800
|
+
|
|
7801
|
+
.cds--tag--interactive:focus {
|
|
7802
|
+
box-shadow: inset 0 0 0 1px var(--cds-focus, #0f62fe);
|
|
7803
|
+
outline: none;
|
|
7804
|
+
}
|
|
7805
|
+
|
|
7806
|
+
.cds--tag--interactive:hover {
|
|
7807
|
+
cursor: pointer;
|
|
7808
|
+
}
|
|
7809
|
+
|
|
7810
|
+
.cds--tag--filter {
|
|
7811
|
+
cursor: pointer;
|
|
7812
|
+
padding-block-end: 0;
|
|
7813
|
+
padding-block-start: 0;
|
|
7814
|
+
padding-inline-end: 0;
|
|
7815
|
+
}
|
|
7816
|
+
.cds--tag--filter:hover {
|
|
7817
|
+
outline: none;
|
|
7818
|
+
}
|
|
7819
|
+
|
|
7820
|
+
.cds--interactive--tag-children {
|
|
7821
|
+
display: inline-flex;
|
|
7822
|
+
place-items: center;
|
|
7823
|
+
}
|
|
7824
|
+
|
|
7825
|
+
.cds--tag--selectable {
|
|
7826
|
+
border: 1px solid var(--cds-border-inverse, #161616);
|
|
7827
|
+
background-color: var(--cds-layer);
|
|
7828
|
+
color: var(--cds-text-primary, #161616);
|
|
7829
|
+
cursor: pointer;
|
|
7830
|
+
}
|
|
7831
|
+
.cds--tag--selectable:hover {
|
|
7832
|
+
background-color: var(--cds-layer-hover);
|
|
7833
|
+
outline: none;
|
|
7834
|
+
}
|
|
7835
|
+
.cds--tag--selectable:focus {
|
|
7836
|
+
outline: 2px solid var(--cds-focus, #0f62fe);
|
|
7837
|
+
outline-offset: 1px;
|
|
7838
|
+
}
|
|
7839
|
+
|
|
7840
|
+
.cds--tag--selectable-selected {
|
|
7841
|
+
background-color: var(--cds-layer-selected-inverse, #161616);
|
|
7842
|
+
color: var(--cds-text-inverse, #ffffff);
|
|
7843
|
+
}
|
|
7844
|
+
.cds--tag--selectable-selected:hover {
|
|
7845
|
+
background-color: var(--cds-layer-selected-inverse, #161616);
|
|
7846
|
+
}
|
|
7847
|
+
|
|
7848
|
+
.cds--tag--operational {
|
|
7849
|
+
border: 1px solid var(--cds-tag-border-gray, #a8a8a8);
|
|
7850
|
+
background-color: var(--cds-tag-background-gray, #e0e0e0);
|
|
7851
|
+
color: var(--cds-tag-color-gray, #161616);
|
|
7852
|
+
cursor: pointer;
|
|
7853
|
+
}
|
|
7854
|
+
.cds--tag--operational:hover {
|
|
7855
|
+
background-color: var(--cds-tag-hover-gray, #d1d1d1);
|
|
7856
|
+
outline: none;
|
|
7857
|
+
}
|
|
7858
|
+
.cds--tag--operational:focus {
|
|
7859
|
+
outline: 2px solid var(--cds-focus, #0f62fe);
|
|
7860
|
+
outline-offset: 1px;
|
|
7861
|
+
}
|
|
7862
|
+
|
|
7730
7863
|
.cds--tag--red {
|
|
7731
7864
|
background-color: var(--cds-tag-background-red, #ffd7d9);
|
|
7732
7865
|
color: var(--cds-tag-color-red, #750e13);
|
|
7733
7866
|
}
|
|
7734
|
-
.cds--tag--red.cds--tag--
|
|
7867
|
+
.cds--tag--red.cds--tag--operational {
|
|
7868
|
+
border: 1px solid var(--cds-tag-border-red, #ff8389);
|
|
7869
|
+
}
|
|
7870
|
+
.cds--tag--red.cds--tag--operational:hover {
|
|
7871
|
+
background-color: var(--cds-tag-hover-red, #ffc2c5);
|
|
7872
|
+
}
|
|
7735
7873
|
.cds--tag--red .cds--tag__close-icon:hover {
|
|
7736
7874
|
background-color: var(--cds-tag-hover-red, #ffc2c5);
|
|
7737
7875
|
}
|
|
@@ -7740,7 +7878,12 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
7740
7878
|
background-color: var(--cds-tag-background-magenta, #ffd6e8);
|
|
7741
7879
|
color: var(--cds-tag-color-magenta, #740937);
|
|
7742
7880
|
}
|
|
7743
|
-
.cds--tag--magenta.cds--tag--
|
|
7881
|
+
.cds--tag--magenta.cds--tag--operational {
|
|
7882
|
+
border: 1px solid var(--cds-tag-border-magenta, #ff7eb6);
|
|
7883
|
+
}
|
|
7884
|
+
.cds--tag--magenta.cds--tag--operational:hover {
|
|
7885
|
+
background-color: var(--cds-tag-hover-magenta, #ffbdda);
|
|
7886
|
+
}
|
|
7744
7887
|
.cds--tag--magenta .cds--tag__close-icon:hover {
|
|
7745
7888
|
background-color: var(--cds-tag-hover-magenta, #ffbdda);
|
|
7746
7889
|
}
|
|
@@ -7749,7 +7892,12 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
7749
7892
|
background-color: var(--cds-tag-background-purple, #e8daff);
|
|
7750
7893
|
color: var(--cds-tag-color-purple, #491d8b);
|
|
7751
7894
|
}
|
|
7752
|
-
.cds--tag--purple.cds--tag--
|
|
7895
|
+
.cds--tag--purple.cds--tag--operational {
|
|
7896
|
+
border: 1px solid var(--cds-tag-border-purple, #be95ff);
|
|
7897
|
+
}
|
|
7898
|
+
.cds--tag--purple.cds--tag--operational:hover {
|
|
7899
|
+
background-color: var(--cds-tag-hover-purple, #dcc7ff);
|
|
7900
|
+
}
|
|
7753
7901
|
.cds--tag--purple .cds--tag__close-icon:hover {
|
|
7754
7902
|
background-color: var(--cds-tag-hover-purple, #dcc7ff);
|
|
7755
7903
|
}
|
|
@@ -7758,7 +7906,12 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
7758
7906
|
background-color: var(--cds-tag-background-blue, #d0e2ff);
|
|
7759
7907
|
color: var(--cds-tag-color-blue, #002d9c);
|
|
7760
7908
|
}
|
|
7761
|
-
.cds--tag--blue.cds--tag--
|
|
7909
|
+
.cds--tag--blue.cds--tag--operational {
|
|
7910
|
+
border: 1px solid var(--cds-tag-border-blue, #78a9ff);
|
|
7911
|
+
}
|
|
7912
|
+
.cds--tag--blue.cds--tag--operational:hover {
|
|
7913
|
+
background-color: var(--cds-tag-hover-blue, #b8d3ff);
|
|
7914
|
+
}
|
|
7762
7915
|
.cds--tag--blue .cds--tag__close-icon:hover {
|
|
7763
7916
|
background-color: var(--cds-tag-hover-blue, #b8d3ff);
|
|
7764
7917
|
}
|
|
@@ -7767,7 +7920,12 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
7767
7920
|
background-color: var(--cds-tag-background-cyan, #bae6ff);
|
|
7768
7921
|
color: var(--cds-tag-color-cyan, #003a6d);
|
|
7769
7922
|
}
|
|
7770
|
-
.cds--tag--cyan.cds--tag--
|
|
7923
|
+
.cds--tag--cyan.cds--tag--operational {
|
|
7924
|
+
border: 1px solid var(--cds-tag-border-cyan, #33b1ff);
|
|
7925
|
+
}
|
|
7926
|
+
.cds--tag--cyan.cds--tag--operational:hover {
|
|
7927
|
+
background-color: var(--cds-tag-hover-cyan, #99daff);
|
|
7928
|
+
}
|
|
7771
7929
|
.cds--tag--cyan .cds--tag__close-icon:hover {
|
|
7772
7930
|
background-color: var(--cds-tag-hover-cyan, #99daff);
|
|
7773
7931
|
}
|
|
@@ -7776,7 +7934,12 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
7776
7934
|
background-color: var(--cds-tag-background-teal, #9ef0f0);
|
|
7777
7935
|
color: var(--cds-tag-color-teal, #004144);
|
|
7778
7936
|
}
|
|
7779
|
-
.cds--tag--teal.cds--tag--
|
|
7937
|
+
.cds--tag--teal.cds--tag--operational {
|
|
7938
|
+
border: 1px solid var(--cds-tag-border-teal, #08bdba);
|
|
7939
|
+
}
|
|
7940
|
+
.cds--tag--teal.cds--tag--operational:hover {
|
|
7941
|
+
background-color: var(--cds-tag-hover-teal, #57e5e5);
|
|
7942
|
+
}
|
|
7780
7943
|
.cds--tag--teal .cds--tag__close-icon:hover {
|
|
7781
7944
|
background-color: var(--cds-tag-hover-teal, #57e5e5);
|
|
7782
7945
|
}
|
|
@@ -7785,54 +7948,85 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
7785
7948
|
background-color: var(--cds-tag-background-green, #a7f0ba);
|
|
7786
7949
|
color: var(--cds-tag-color-green, #044317);
|
|
7787
7950
|
}
|
|
7788
|
-
.cds--tag--green.cds--tag--
|
|
7951
|
+
.cds--tag--green.cds--tag--operational {
|
|
7952
|
+
border: 1px solid var(--cds-tag-border-green, #42be65);
|
|
7953
|
+
}
|
|
7954
|
+
.cds--tag--green.cds--tag--operational:hover {
|
|
7955
|
+
background-color: var(--cds-tag-hover-green, #74e792);
|
|
7956
|
+
}
|
|
7789
7957
|
.cds--tag--green .cds--tag__close-icon:hover {
|
|
7790
7958
|
background-color: var(--cds-tag-hover-green, #74e792);
|
|
7791
7959
|
}
|
|
7792
7960
|
|
|
7793
7961
|
.cds--tag--gray {
|
|
7794
7962
|
background-color: var(--cds-tag-background-gray, #e0e0e0);
|
|
7795
|
-
color: var(--cds-tag-color-gray, #
|
|
7963
|
+
color: var(--cds-tag-color-gray, #161616);
|
|
7964
|
+
}
|
|
7965
|
+
.cds--tag--gray.cds--tag--operational {
|
|
7966
|
+
border: 1px solid var(--cds-tag-border-gray, #a8a8a8);
|
|
7967
|
+
}
|
|
7968
|
+
.cds--tag--gray.cds--tag--operational:hover {
|
|
7969
|
+
background-color: var(--cds-tag-hover-gray, #d1d1d1);
|
|
7796
7970
|
}
|
|
7797
|
-
.cds--tag--gray.cds--tag--interactive:hover,
|
|
7798
7971
|
.cds--tag--gray .cds--tag__close-icon:hover {
|
|
7799
7972
|
background-color: var(--cds-tag-hover-gray, #d1d1d1);
|
|
7800
7973
|
}
|
|
7801
7974
|
|
|
7802
7975
|
.cds--tag--cool-gray {
|
|
7803
7976
|
background-color: var(--cds-tag-background-cool-gray, #dde1e6);
|
|
7804
|
-
color: var(--cds-tag-color-cool-gray, #
|
|
7977
|
+
color: var(--cds-tag-color-cool-gray, #121619);
|
|
7978
|
+
}
|
|
7979
|
+
.cds--tag--cool-gray.cds--tag--operational {
|
|
7980
|
+
border: 1px solid var(--cds-tag-border-cool-gray, #a2a9b0);
|
|
7981
|
+
}
|
|
7982
|
+
.cds--tag--cool-gray.cds--tag--operational:hover {
|
|
7983
|
+
background-color: var(--cds-tag-hover-cool-gray, #cdd3da);
|
|
7805
7984
|
}
|
|
7806
|
-
.cds--tag--cool-gray.cds--tag--interactive:hover,
|
|
7807
7985
|
.cds--tag--cool-gray .cds--tag__close-icon:hover {
|
|
7808
7986
|
background-color: var(--cds-tag-hover-cool-gray, #cdd3da);
|
|
7809
7987
|
}
|
|
7810
7988
|
|
|
7811
7989
|
.cds--tag--warm-gray {
|
|
7812
7990
|
background-color: var(--cds-tag-background-warm-gray, #e5e0df);
|
|
7813
|
-
color: var(--cds-tag-color-warm-gray, #
|
|
7991
|
+
color: var(--cds-tag-color-warm-gray, #171414);
|
|
7992
|
+
}
|
|
7993
|
+
.cds--tag--warm-gray.cds--tag--operational {
|
|
7994
|
+
border: 1px solid var(--cds-tag-border-warm-gray, #ada8a8);
|
|
7995
|
+
}
|
|
7996
|
+
.cds--tag--warm-gray.cds--tag--operational:hover {
|
|
7997
|
+
background-color: var(--cds-tag-hover-warm-gray, #d8d0cf);
|
|
7814
7998
|
}
|
|
7815
|
-
.cds--tag--warm-gray.cds--tag--interactive:hover,
|
|
7816
7999
|
.cds--tag--warm-gray .cds--tag__close-icon:hover {
|
|
7817
8000
|
background-color: var(--cds-tag-hover-warm-gray, #d8d0cf);
|
|
7818
8001
|
}
|
|
7819
8002
|
|
|
7820
|
-
.cds--tag--high-contrast {
|
|
8003
|
+
.cds--tag--high-contrast:not(.cds--tag--operational) {
|
|
7821
8004
|
background-color: var(--cds-background-inverse, #393939);
|
|
7822
8005
|
color: var(--cds-text-inverse, #ffffff);
|
|
7823
8006
|
}
|
|
7824
|
-
.cds--tag--high-contrast.cds--tag--
|
|
7825
|
-
|
|
8007
|
+
.cds--tag--high-contrast:not(.cds--tag--operational).cds--tag--operational {
|
|
8008
|
+
border: 1px solid var(--cds-background-inverse, #393939);
|
|
8009
|
+
}
|
|
8010
|
+
.cds--tag--high-contrast:not(.cds--tag--operational).cds--tag--operational:hover {
|
|
8011
|
+
background-color: var(--cds-background-inverse-hover, #474747);
|
|
8012
|
+
}
|
|
8013
|
+
.cds--tag--high-contrast:not(.cds--tag--operational) .cds--tag__close-icon:hover {
|
|
7826
8014
|
background-color: var(--cds-background-inverse-hover, #474747);
|
|
7827
8015
|
}
|
|
7828
8016
|
|
|
7829
|
-
.cds--tag--outline {
|
|
8017
|
+
.cds--tag--outline:not(.cds--tag--operational) {
|
|
7830
8018
|
background-color: var(--cds-background, #ffffff);
|
|
7831
8019
|
color: var(--cds-text-primary, #161616);
|
|
7832
|
-
|
|
8020
|
+
outline: 1px solid var(--cds-background-inverse, #393939);
|
|
8021
|
+
outline-offset: -1px;
|
|
7833
8022
|
}
|
|
7834
|
-
.cds--tag--outline.cds--tag--
|
|
7835
|
-
|
|
8023
|
+
.cds--tag--outline:not(.cds--tag--operational).cds--tag--operational {
|
|
8024
|
+
border: 1px solid var(--cds-background, #ffffff);
|
|
8025
|
+
}
|
|
8026
|
+
.cds--tag--outline:not(.cds--tag--operational).cds--tag--operational:hover {
|
|
8027
|
+
background-color: var(--cds-layer-hover);
|
|
8028
|
+
}
|
|
8029
|
+
.cds--tag--outline:not(.cds--tag--operational) .cds--tag__close-icon:hover {
|
|
7836
8030
|
background-color: var(--cds-layer-hover);
|
|
7837
8031
|
}
|
|
7838
8032
|
|
|
@@ -7843,11 +8037,18 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
7843
8037
|
color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
|
|
7844
8038
|
box-shadow: none;
|
|
7845
8039
|
}
|
|
7846
|
-
.cds--tag--disabled.cds--tag--
|
|
8040
|
+
.cds--tag--disabled.cds--tag--operational,
|
|
8041
|
+
.cds--tag--filter.cds--tag--disabled.cds--tag--operational,
|
|
8042
|
+
.cds--tag--interactive.cds--tag--disabled.cds--tag--operational {
|
|
8043
|
+
border: 1px solid var(--cds-layer);
|
|
8044
|
+
}
|
|
8045
|
+
.cds--tag--disabled.cds--tag--operational:hover,
|
|
8046
|
+
.cds--tag--filter.cds--tag--disabled.cds--tag--operational:hover,
|
|
8047
|
+
.cds--tag--interactive.cds--tag--disabled.cds--tag--operational:hover {
|
|
8048
|
+
background-color: var(--cds-layer);
|
|
8049
|
+
}
|
|
7847
8050
|
.cds--tag--disabled .cds--tag__close-icon:hover,
|
|
7848
|
-
.cds--tag--filter.cds--tag--disabled.cds--tag--interactive:hover,
|
|
7849
8051
|
.cds--tag--filter.cds--tag--disabled .cds--tag__close-icon:hover,
|
|
7850
|
-
.cds--tag--interactive.cds--tag--disabled.cds--tag--interactive:hover,
|
|
7851
8052
|
.cds--tag--interactive.cds--tag--disabled .cds--tag__close-icon:hover {
|
|
7852
8053
|
background-color: var(--cds-layer);
|
|
7853
8054
|
}
|
|
@@ -7857,30 +8058,16 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
7857
8058
|
cursor: not-allowed;
|
|
7858
8059
|
}
|
|
7859
8060
|
|
|
7860
|
-
.cds--
|
|
7861
|
-
|
|
7862
|
-
|
|
7863
|
-
|
|
7864
|
-
|
|
7865
|
-
}
|
|
7866
|
-
|
|
7867
|
-
.cds--tag--interactive:focus {
|
|
7868
|
-
box-shadow: inset 0 0 0 1px var(--cds-focus, #0f62fe);
|
|
7869
|
-
outline: none;
|
|
7870
|
-
}
|
|
7871
|
-
|
|
7872
|
-
.cds--tag--interactive:hover {
|
|
7873
|
-
cursor: pointer;
|
|
7874
|
-
}
|
|
7875
|
-
|
|
7876
|
-
.cds--tag--filter {
|
|
7877
|
-
cursor: pointer;
|
|
7878
|
-
padding-block-end: 0;
|
|
7879
|
-
padding-block-start: 0;
|
|
7880
|
-
padding-inline-end: 0;
|
|
8061
|
+
.cds--tag--selectable.cds--tag--disabled,
|
|
8062
|
+
.cds--tag--operational.cds--tag--disabled {
|
|
8063
|
+
border: 1px solid var(--cds-border-disabled, #c6c6c6);
|
|
8064
|
+
background-color: var(--cds-layer);
|
|
8065
|
+
color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
|
|
7881
8066
|
}
|
|
7882
|
-
.cds--tag--
|
|
7883
|
-
|
|
8067
|
+
.cds--tag--selectable.cds--tag--disabled:hover,
|
|
8068
|
+
.cds--tag--operational.cds--tag--disabled:hover {
|
|
8069
|
+
background-color: var(--cds-layer);
|
|
8070
|
+
cursor: not-allowed;
|
|
7884
8071
|
}
|
|
7885
8072
|
|
|
7886
8073
|
.cds--tag--interactive {
|
|
@@ -7927,6 +8114,7 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
7927
8114
|
}
|
|
7928
8115
|
|
|
7929
8116
|
.cds--tag__close-icon:focus {
|
|
8117
|
+
z-index: 99999;
|
|
7930
8118
|
border-radius: 50%;
|
|
7931
8119
|
box-shadow: inset 0 0 0 1px var(--cds-focus, #0f62fe);
|
|
7932
8120
|
outline: none;
|
|
@@ -7983,7 +8171,12 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
7983
8171
|
animation: none;
|
|
7984
8172
|
}
|
|
7985
8173
|
}
|
|
7986
|
-
.cds--tag.cds--skeleton.cds--tag--
|
|
8174
|
+
.cds--tag.cds--skeleton.cds--tag--operational {
|
|
8175
|
+
border: 1px solid var(--cds-skeleton-background, #e8e8e8);
|
|
8176
|
+
}
|
|
8177
|
+
.cds--tag.cds--skeleton.cds--tag--operational:hover {
|
|
8178
|
+
background-color: var(--cds-skeleton-background, #e8e8e8);
|
|
8179
|
+
}
|
|
7987
8180
|
.cds--tag.cds--skeleton .cds--tag__close-icon:hover {
|
|
7988
8181
|
background-color: var(--cds-skeleton-background, #e8e8e8);
|
|
7989
8182
|
}
|
|
@@ -8325,17 +8518,17 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
8325
8518
|
}
|
|
8326
8519
|
|
|
8327
8520
|
.cds--list-box__field .cds--text-input {
|
|
8328
|
-
padding-inline-end:
|
|
8521
|
+
padding-inline-end: 5rem;
|
|
8329
8522
|
}
|
|
8330
8523
|
|
|
8331
8524
|
.cds--list-box[data-invalid] .cds--list-box__field .cds--text-input,
|
|
8332
8525
|
.cds--list-box--warning .cds--list-box__field .cds--text-input {
|
|
8333
|
-
padding-inline-end: 6.
|
|
8526
|
+
padding-inline-end: 6.5625rem;
|
|
8334
8527
|
}
|
|
8335
8528
|
|
|
8336
8529
|
.cds--list-box[data-invalid] .cds--list-box__field .cds--text-input + .cds--list-box__invalid-icon,
|
|
8337
8530
|
.cds--list-box--warning .cds--list-box__field .cds--text-input + .cds--list-box__invalid-icon {
|
|
8338
|
-
inset-inline-end:
|
|
8531
|
+
inset-inline-end: 5.125rem;
|
|
8339
8532
|
}
|
|
8340
8533
|
|
|
8341
8534
|
.cds--list-box__field .cds--text-input--empty {
|
|
@@ -8439,7 +8632,7 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
8439
8632
|
inline-size: 1.5rem;
|
|
8440
8633
|
inset-block-start: 50%;
|
|
8441
8634
|
/* to preserve .5rem space between icons according to spec top/transform used to center the combobox clear selection icon in IE11 */
|
|
8442
|
-
inset-inline-end: 2.
|
|
8635
|
+
inset-inline-end: 2.8125rem;
|
|
8443
8636
|
transform: translateY(-50%);
|
|
8444
8637
|
transition: background-color 70ms cubic-bezier(0.2, 0, 0.38, 0.9);
|
|
8445
8638
|
-webkit-user-select: none;
|
|
@@ -8519,7 +8712,12 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
8519
8712
|
background-color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
|
|
8520
8713
|
color: var(--cds-layer);
|
|
8521
8714
|
}
|
|
8522
|
-
.cds--list-box--disabled .cds--list-box__selection--multi.cds--tag--
|
|
8715
|
+
.cds--list-box--disabled .cds--list-box__selection--multi.cds--tag--operational {
|
|
8716
|
+
border: 1px solid var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
|
|
8717
|
+
}
|
|
8718
|
+
.cds--list-box--disabled .cds--list-box__selection--multi.cds--tag--operational:hover {
|
|
8719
|
+
background-color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
|
|
8720
|
+
}
|
|
8523
8721
|
.cds--list-box--disabled .cds--list-box__selection--multi .cds--tag__close-icon:hover {
|
|
8524
8722
|
background-color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
|
|
8525
8723
|
}
|
|
@@ -8864,10 +9062,30 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
8864
9062
|
.cds--list-box__wrapper--slug .cds--slug {
|
|
8865
9063
|
position: absolute;
|
|
8866
9064
|
inset-block-start: 50%;
|
|
8867
|
-
inset-inline-end: 2.5rem;
|
|
9065
|
+
inset-inline-end: calc(2.5rem + 9px);
|
|
9066
|
+
margin-block-start: 0.03125rem;
|
|
8868
9067
|
transform: translateY(-50%);
|
|
8869
9068
|
}
|
|
8870
9069
|
|
|
9070
|
+
.cds--list-box__wrapper--slug .cds--slug::after,
|
|
9071
|
+
.cds--list-box__wrapper--slug .cds--slug::before {
|
|
9072
|
+
position: absolute;
|
|
9073
|
+
background-color: var(--cds-border-subtle-01, #c6c6c6);
|
|
9074
|
+
block-size: 1rem;
|
|
9075
|
+
content: "";
|
|
9076
|
+
inline-size: 0.0625rem;
|
|
9077
|
+
}
|
|
9078
|
+
|
|
9079
|
+
.cds--list-box__wrapper--slug .cds--slug::before {
|
|
9080
|
+
display: none;
|
|
9081
|
+
inset-inline-start: -0.5625rem;
|
|
9082
|
+
}
|
|
9083
|
+
|
|
9084
|
+
.cds--list-box__wrapper--slug .cds--slug::after {
|
|
9085
|
+
display: block;
|
|
9086
|
+
inset-inline-end: -0.5625rem;
|
|
9087
|
+
}
|
|
9088
|
+
|
|
8871
9089
|
.cds--list-box__wrapper--slug .cds--list-box:not(:has(.cds--slug--revert)) {
|
|
8872
9090
|
background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
|
|
8873
9091
|
border-block-end-color: var(--cds-ai-border-strong, #4589ff);
|
|
@@ -8895,21 +9113,28 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
8895
9113
|
|
|
8896
9114
|
.cds--list-box__wrapper--slug .cds--list-box--invalid[data-invalid] .cds--text-input:not(.cds--text-input--empty),
|
|
8897
9115
|
.cds--list-box__wrapper--slug .cds--list-box--warning .cds--text-input:not(.cds--text-input--empty) {
|
|
8898
|
-
padding-inline-end:
|
|
9116
|
+
padding-inline-end: 8.8125rem;
|
|
8899
9117
|
}
|
|
8900
9118
|
|
|
8901
|
-
.cds--list-box__wrapper--slug .cds--list-box--invalid .cds--
|
|
8902
|
-
.cds--list-box__wrapper--slug .cds--list-box--
|
|
8903
|
-
|
|
9119
|
+
.cds--list-box__wrapper--slug .cds--list-box--invalid[data-invalid] .cds--text-input--empty + .cds--list-box__invalid-icon,
|
|
9120
|
+
.cds--list-box__wrapper--slug .cds--list-box--invalid[data-invalid] .cds--list-box__invalid-icon,
|
|
9121
|
+
.cds--list-box__wrapper--slug .cds--list-box--warning .cds--list-box__invalid-icon.cds--list-box__invalid-icon--warning {
|
|
9122
|
+
inset-inline-end: 5.1875rem;
|
|
8904
9123
|
}
|
|
8905
9124
|
|
|
8906
|
-
.cds--list-box__wrapper--slug .cds--list-
|
|
8907
|
-
|
|
9125
|
+
.cds--list-box__wrapper--slug .cds--list-box--invalid[data-invalid] .cds--slug::before,
|
|
9126
|
+
.cds--list-box__wrapper--slug .cds--list-box--warning .cds--slug::before {
|
|
9127
|
+
display: block;
|
|
8908
9128
|
}
|
|
8909
9129
|
|
|
8910
|
-
.cds--list-box__wrapper--slug .cds--list-
|
|
9130
|
+
.cds--list-box__wrapper--slug .cds--list-box__field:has(.cds--list-box__selection) ~ .cds--slug,
|
|
8911
9131
|
.cds--list-box__wrapper--slug .cds--list-box--warning .cds--list-box__field:has(.cds--list-box__selection) ~ .cds--slug {
|
|
8912
|
-
inset-inline-end:
|
|
9132
|
+
inset-inline-end: calc(4rem + 18px);
|
|
9133
|
+
}
|
|
9134
|
+
|
|
9135
|
+
.cds--list-box__wrapper--slug .cds--list-box--invalid .cds--list-box__field:has(.cds--list-box__selection) .cds--list-box__invalid-icon,
|
|
9136
|
+
.cds--list-box__wrapper--slug .cds--list-box--warning .cds--list-box__field:has(.cds--list-box__selection) .cds--list-box__invalid-icon {
|
|
9137
|
+
inset-inline-end: 7.25rem;
|
|
8913
9138
|
}
|
|
8914
9139
|
|
|
8915
9140
|
@media screen and (-ms-high-contrast: active), (forced-colors: active) {
|
|
@@ -8937,6 +9162,33 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
8937
9162
|
}
|
|
8938
9163
|
}
|
|
8939
9164
|
|
|
9165
|
+
.cds--list-box__field:has(.cds--list-box__menu-icon) .cds--list-box__selection::after {
|
|
9166
|
+
position: absolute;
|
|
9167
|
+
background-color: var(--cds-border-subtle-01, #c6c6c6);
|
|
9168
|
+
block-size: 1rem;
|
|
9169
|
+
content: "";
|
|
9170
|
+
inline-size: 0.0625rem;
|
|
9171
|
+
margin-inline-start: 2.0625rem;
|
|
9172
|
+
}
|
|
9173
|
+
|
|
9174
|
+
.cds--list-box--warning .cds--list-box__field:has(.cds--list-box__menu-icon) .cds--list-box__selection::before,
|
|
9175
|
+
.cds--list-box--invalid[data-invalid] .cds--list-box__field:has(.cds--list-box__menu-icon) .cds--list-box__selection::before {
|
|
9176
|
+
position: absolute;
|
|
9177
|
+
background-color: var(--cds-border-subtle-01, #c6c6c6);
|
|
9178
|
+
block-size: 1rem;
|
|
9179
|
+
content: "";
|
|
9180
|
+
inline-size: 0.0625rem;
|
|
9181
|
+
margin-inline-end: 2.0625rem;
|
|
9182
|
+
}
|
|
9183
|
+
|
|
9184
|
+
.cds--list-box__wrapper--slug:has(.cds--multi-select) .cds--list-box__menu-icon {
|
|
9185
|
+
inset-inline-end: calc(0.75rem - 4px);
|
|
9186
|
+
}
|
|
9187
|
+
|
|
9188
|
+
.cds--list-box__wrapper--slug:has(.cds--dropdown) .cds--list-box__menu-icon {
|
|
9189
|
+
inset-inline-end: calc(0.75rem - 4px);
|
|
9190
|
+
}
|
|
9191
|
+
|
|
8940
9192
|
.cds--combo-box:hover {
|
|
8941
9193
|
background-color: var(--cds-field);
|
|
8942
9194
|
}
|
|
@@ -9873,6 +10125,12 @@ fieldset[disabled] .cds--form__helper-text {
|
|
|
9873
10125
|
background-color: ButtonText;
|
|
9874
10126
|
}
|
|
9875
10127
|
}
|
|
10128
|
+
@media print {
|
|
10129
|
+
.cds--radio-button:checked + .cds--radio-button__label .cds--radio-button__appearance::before {
|
|
10130
|
+
-webkit-print-color-adjust: exact;
|
|
10131
|
+
print-color-adjust: exact;
|
|
10132
|
+
}
|
|
10133
|
+
}
|
|
9876
10134
|
|
|
9877
10135
|
.cds--radio-button:disabled + .cds--radio-button__label {
|
|
9878
10136
|
color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
|
|
@@ -10788,12 +11046,14 @@ tr.cds--expandable-row--hover + .cds--expandable-row[data-child-row]:hover,
|
|
|
10788
11046
|
tr.cds--expandable-row--hover.cds--data-table--slug-row,
|
|
10789
11047
|
tr.cds--data-table--selected.cds--parent-row.cds--expandable-row--hover.cds--data-table--slug-row {
|
|
10790
11048
|
background: linear-gradient(to right, var(--cds-ai-aura-hover-start, rgba(69, 137, 255, 0.4)) 0%, 15%, var(--cds-ai-aura-hover-end, rgba(255, 255, 255, 0)) 50%), var(--cds-ai-aura-hover-background, #edf5ff);
|
|
11049
|
+
background-attachment: fixed;
|
|
10791
11050
|
}
|
|
10792
11051
|
|
|
10793
11052
|
tr.cds--parent-row.cds--data-table--selected.cds--data-table--slug-row,
|
|
10794
11053
|
.cds--data-table--selected.cds--data-table--slug-row,
|
|
10795
11054
|
tr.cds--data-table--selected.cds--data-table--slug-row + .cds--expandable-row {
|
|
10796
11055
|
background: linear-gradient(to right, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 50%), var(--cds-layer-selected);
|
|
11056
|
+
background-attachment: fixed;
|
|
10797
11057
|
}
|
|
10798
11058
|
|
|
10799
11059
|
tr.cds--data-table--slug-row.cds--data-table--selected td,
|
|
@@ -14778,6 +15038,28 @@ button.cds--dropdown-text:focus {
|
|
|
14778
15038
|
padding-inline-end: 6rem;
|
|
14779
15039
|
}
|
|
14780
15040
|
|
|
15041
|
+
.cds--list-box__wrapper--fluid .cds--list-box__selection {
|
|
15042
|
+
inset-inline-end: 2.5625rem;
|
|
15043
|
+
}
|
|
15044
|
+
|
|
15045
|
+
.cds--list-box__wrapper--fluid .cds--list-box--warning .cds--list-box__field:has(.cds--list-box__menu-icon) .cds--list-box__selection::before,
|
|
15046
|
+
.cds--list-box__wrapper--fluid .cds--list-box--invalid[data-invalid] .cds--list-box__field:has(.cds--list-box__menu-icon) .cds--list-box__selection::before {
|
|
15047
|
+
position: absolute;
|
|
15048
|
+
background-color: transparent;
|
|
15049
|
+
block-size: 1rem;
|
|
15050
|
+
content: "";
|
|
15051
|
+
inline-size: 0.0625rem;
|
|
15052
|
+
margin-inline-end: 2.0625rem;
|
|
15053
|
+
}
|
|
15054
|
+
|
|
15055
|
+
.cds--list-box__wrapper--fluid:has(.cds--multi-select) .cds--list-box__menu-icon {
|
|
15056
|
+
inset-inline-end: 0.75rem;
|
|
15057
|
+
}
|
|
15058
|
+
|
|
15059
|
+
.cds--list-box__wrapper--fluid:has(.cds--dropdown) .cds--list-box__menu-icon {
|
|
15060
|
+
inset-inline-end: 0.75rem;
|
|
15061
|
+
}
|
|
15062
|
+
|
|
14781
15063
|
.cds--list-box__wrapper--fluid .cds--combo-box .cds--list-box__field {
|
|
14782
15064
|
overflow: visible;
|
|
14783
15065
|
padding: 0;
|
|
@@ -15951,6 +16233,7 @@ button.cds--dropdown-text:focus {
|
|
|
15951
16233
|
}
|
|
15952
16234
|
|
|
15953
16235
|
.cds--search--fluid .cds--search-magnifier-icon {
|
|
16236
|
+
color: var(--cds-icon-primary, #161616);
|
|
15954
16237
|
inset: auto 1rem 0.8125rem auto;
|
|
15955
16238
|
transform: none;
|
|
15956
16239
|
}
|
|
@@ -15963,16 +16246,6 @@ button.cds--dropdown-text:focus {
|
|
|
15963
16246
|
transition: background-color 70ms cubic-bezier(0.2, 0, 0.38, 0.9);
|
|
15964
16247
|
}
|
|
15965
16248
|
|
|
15966
|
-
.cds--search--fluid .cds--search-close::before {
|
|
15967
|
-
position: absolute;
|
|
15968
|
-
display: block;
|
|
15969
|
-
background: var(--cds-border-subtle);
|
|
15970
|
-
block-size: 1rem;
|
|
15971
|
-
content: "";
|
|
15972
|
-
inline-size: 0.0625rem;
|
|
15973
|
-
inset: auto -0.0625rem 0.875rem auto;
|
|
15974
|
-
}
|
|
15975
|
-
|
|
15976
16249
|
.cds--search--fluid .cds--search-input:focus ~ .cds--search-close:hover {
|
|
15977
16250
|
outline: none;
|
|
15978
16251
|
}
|
|
@@ -17758,7 +18031,8 @@ optgroup.cds--select-optgroup:disabled,
|
|
|
17758
18031
|
}
|
|
17759
18032
|
|
|
17760
18033
|
.cds--body--with-modal-open .cds--modal .cds--tooltip,
|
|
17761
|
-
.cds--body--with-modal-open .cds--modal .cds--overflow-menu-options
|
|
18034
|
+
.cds--body--with-modal-open .cds--modal .cds--overflow-menu-options,
|
|
18035
|
+
.cds--body--with-modal-open .cds--overflow-menu-options {
|
|
17762
18036
|
z-index: 9000;
|
|
17763
18037
|
}
|
|
17764
18038
|
|
|
@@ -20210,14 +20484,14 @@ span.cds--pagination__text.cds--pagination__items-count {
|
|
|
20210
20484
|
.cds--skeleton__placeholder--ai,
|
|
20211
20485
|
.cds--skeleton__icon--ai {
|
|
20212
20486
|
overflow: hidden;
|
|
20213
|
-
background: var(--cds-ai-skeleton-background, #
|
|
20487
|
+
background: var(--cds-ai-skeleton-background, #d0e2ff);
|
|
20214
20488
|
}
|
|
20215
20489
|
|
|
20216
20490
|
.cds--skeleton__text--ai::before,
|
|
20217
20491
|
.cds--skeleton__placeholder--ai::before,
|
|
20218
20492
|
.cds--skeleton__icon--ai::before {
|
|
20219
20493
|
animation: 1250ms ease-in-out ai-skeleton-animation infinite;
|
|
20220
|
-
background: linear-gradient(to right, rgba(
|
|
20494
|
+
background: linear-gradient(to right, rgba(69, 137, 255, 0) 0%, rgba(69, 137, 255, 0.5) 50%, rgba(69, 137, 255, 0) 100%);
|
|
20221
20495
|
}
|
|
20222
20496
|
|
|
20223
20497
|
.cds--skeleton__placeholder--ai::before,
|
|
@@ -20729,6 +21003,7 @@ span.cds--pagination__text.cds--pagination__items-count {
|
|
|
20729
21003
|
--cds-button-focus-color: var(--cds-focus-inverse, #ffffff);
|
|
20730
21004
|
--cds-link-text-color: var(--cds-link-inverse, #78a9ff);
|
|
20731
21005
|
--cds-link-hover-text-color: var(--cds-link-inverse, #78a9ff);
|
|
21006
|
+
--cds-link-visited-text-color: var(--cds-link-inverse, #78a9ff);
|
|
20732
21007
|
--cds-link-focus-text-color: var(--cds-focus-inverse, #ffffff);
|
|
20733
21008
|
font-size: var(--cds-body-01-font-size, 0.875rem);
|
|
20734
21009
|
font-weight: var(--cds-body-01-font-weight, 400);
|
|
@@ -21031,7 +21306,7 @@ span.cds--pagination__text.cds--pagination__items-count {
|
|
|
21031
21306
|
background: linear-gradient(to top, var(--cds-background, var(--cds-background, #ffffff)) 0%, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-background, var(--cds-background, #ffffff)), var(--cds-background, var(--cds-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, #78a9ff), var(--cds-ai-border-end, #d0e2ff)) border-box, linear-gradient(to top, var(--cds-background, var(--cds-background, #ffffff)), var(--cds-background, var(--cds-background, #ffffff))) border-box;
|
|
21032
21307
|
border: 1px solid transparent;
|
|
21033
21308
|
border-radius: 0.5rem;
|
|
21034
|
-
box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)), -40px 30px 100px -25px var(--cds-
|
|
21309
|
+
box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)), -40px 30px 100px -25px var(--cds-ai-popover-shadow-outer-01, rgba(0, 67, 206, 0.25)), -60px 80px 60px -45px var(--cds-ai-popover-shadow-outer-02, rgba(0, 0, 0, 0.1));
|
|
21035
21310
|
color: var(--cds-text-primary, #161616);
|
|
21036
21311
|
min-inline-size: 17.5rem;
|
|
21037
21312
|
}
|
|
@@ -21095,7 +21370,7 @@ span.cds--pagination__text.cds--pagination__items-count {
|
|
|
21095
21370
|
.cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--top,
|
|
21096
21371
|
.cds--popover--top-right,
|
|
21097
21372
|
.cds--popover--top-left) > .cds--popover > .cds--popover-caret::after {
|
|
21098
|
-
background: var(--cds-
|
|
21373
|
+
background: var(--cds-ai-popover-caret-bottom-background, #d5e5ff);
|
|
21099
21374
|
block-size: 0.125rem;
|
|
21100
21375
|
border-end-end-radius: 50%;
|
|
21101
21376
|
border-end-start-radius: 50%;
|
|
@@ -21167,8 +21442,8 @@ span.cds--pagination__text.cds--pagination__items-count {
|
|
|
21167
21442
|
.cds--popover--top,
|
|
21168
21443
|
.cds--popover--top-right,
|
|
21169
21444
|
.cds--popover--top-left) > .cds--popover > .cds--popover-caret::before {
|
|
21170
|
-
border-color: var(--cds-
|
|
21171
|
-
background: var(--cds-
|
|
21445
|
+
border-color: var(--cds-ai-popover-caret-bottom, #d0e2ff);
|
|
21446
|
+
background: var(--cds-ai-popover-caret-bottom-background, #d5e5ff);
|
|
21172
21447
|
}
|
|
21173
21448
|
|
|
21174
21449
|
.cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--left-bottom,
|
|
@@ -21176,12 +21451,12 @@ span.cds--pagination__text.cds--pagination__items-count {
|
|
|
21176
21451
|
.cds--popover--top,
|
|
21177
21452
|
.cds--popover--top-right,
|
|
21178
21453
|
.cds--popover--top-left) > .cds--popover:has(.cds--slug-content--with-actions) > .cds--popover-caret::before {
|
|
21179
|
-
background: var(--cds-
|
|
21454
|
+
background: var(--cds-ai-popover-caret-bottom-background-actions, #dae5f8);
|
|
21180
21455
|
}
|
|
21181
21456
|
|
|
21182
21457
|
.cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--left,
|
|
21183
21458
|
.cds--popover--right) > .cds--popover > .cds--popover-caret::before {
|
|
21184
|
-
border-color: var(--cds-
|
|
21459
|
+
border-color: var(--cds-ai-popover-caret-center, #a7c7ff);
|
|
21185
21460
|
}
|
|
21186
21461
|
|
|
21187
21462
|
.cds--slug.cds--slug--enabled .cds--toggletip-content {
|
|
@@ -22195,8 +22470,8 @@ span.cds--pagination__text.cds--pagination__items-count {
|
|
|
22195
22470
|
block-size: 1rem;
|
|
22196
22471
|
inset-block-start: var(--cds-layout-density-padding-inline-local);
|
|
22197
22472
|
inset-inline-end: var(--cds-layout-density-padding-inline-local);
|
|
22198
|
-
opacity: 0;
|
|
22199
22473
|
transition: 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
|
|
22474
|
+
opacity: 0;
|
|
22200
22475
|
}
|
|
22201
22476
|
.cds--tile__checkmark svg {
|
|
22202
22477
|
border-radius: 50%;
|