@carbon/ibm-products 1.54.2 → 1.55.1
Sign up to get free protection for your applications and to get access to all the features.
- package/css/index-full-carbon.css +1312 -108
- package/css/index-full-carbon.css.map +1 -1
- package/css/index-full-carbon.min.css +3 -3
- package/css/index-full-carbon.min.css.map +1 -1
- package/css/index-without-carbon.css +1200 -1
- package/css/index-without-carbon.css.map +1 -1
- package/css/index-without-carbon.min.css +2 -2
- package/css/index-without-carbon.min.css.map +1 -1
- package/css/index.css +1310 -106
- package/css/index.css.map +1 -1
- package/css/index.min.css +3 -3
- package/css/index.min.css.map +1 -1
- package/es/components/APIKeyModal/APIKeyModal.js +25 -21
- package/es/components/ActionBar/ActionBar.js +5 -5
- package/es/components/Carousel/Carousel.js +237 -0
- package/es/components/Carousel/CarouselItem.js +66 -0
- package/es/components/Carousel/index.js +9 -0
- package/es/components/Carousel/utils.js +98 -0
- package/es/components/CreateFullPage/CreateFullPage.js +4 -2
- package/es/components/CreateModal/CreateModal.js +2 -1
- package/es/components/CreateSidePanel/CreateSidePanel.js +6 -2
- package/es/components/CreateTearsheet/CreateTearsheet.js +3 -1
- package/es/components/CreateTearsheetNarrow/CreateTearsheetNarrow.js +6 -2
- package/es/components/Datagrid/Datagrid/DatagridHeaderRow.js +1 -1
- package/es/components/Datagrid/Datagrid/DatagridToolbar.js +3 -2
- package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/index.js +2 -1
- package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilterContext.js +13 -0
- package/es/components/Datagrid/index.js +2 -1
- package/es/components/Datagrid/useActionsColumn.js +13 -7
- package/es/components/Datagrid/useOnRowClick.js +20 -4
- package/es/components/Datagrid/useSortableColumns.js +27 -3
- package/es/components/Datagrid/utils/DatagridActions.js +6 -6
- package/es/components/Datagrid/utils/getArgTypes.js +4 -0
- package/es/components/EditSidePanel/EditSidePanel.js +7 -3
- package/es/components/FilterSummary/FilterSummary.js +7 -3
- package/es/components/Guidebanner/Guidebanner.js +229 -0
- package/es/components/Guidebanner/GuidebannerElement.js +71 -0
- package/es/components/Guidebanner/GuidebannerElementButton.js +76 -0
- package/es/components/Guidebanner/GuidebannerElementLink.js +56 -0
- package/es/components/Guidebanner/index.js +11 -0
- package/es/components/InlineTip/InlineTip.js +228 -0
- package/es/components/InlineTip/InlineTipButton.js +89 -0
- package/es/components/InlineTip/InlineTipLink.js +89 -0
- package/es/components/InlineTip/index.js +10 -0
- package/es/components/InlineTip/utils.js +36 -0
- package/es/components/SteppedAnimatedMedia/SteppedAnimatedMedia.js +164 -0
- package/es/components/SteppedAnimatedMedia/assets/index.js +4 -0
- package/es/components/SteppedAnimatedMedia/index.js +8 -0
- package/es/components/Tearsheet/TearsheetShell.js +2 -1
- package/es/components/index.js +4 -2
- package/es/global/js/hooks/useResizeObserver.js +1 -1
- package/es/global/js/package-settings.js +2 -0
- package/lib/components/APIKeyModal/APIKeyModal.js +25 -21
- package/lib/components/ActionBar/ActionBar.js +5 -5
- package/lib/components/Carousel/Carousel.js +238 -0
- package/lib/components/Carousel/CarouselItem.js +66 -0
- package/lib/components/Carousel/index.js +19 -0
- package/lib/components/Carousel/utils.js +108 -0
- package/lib/components/CreateFullPage/CreateFullPage.js +4 -2
- package/lib/components/CreateModal/CreateModal.js +2 -1
- package/lib/components/CreateSidePanel/CreateSidePanel.js +6 -2
- package/lib/components/CreateTearsheet/CreateTearsheet.js +3 -1
- package/lib/components/CreateTearsheetNarrow/CreateTearsheetNarrow.js +6 -2
- package/lib/components/Datagrid/Datagrid/DatagridHeaderRow.js +1 -1
- package/lib/components/Datagrid/Datagrid/DatagridToolbar.js +3 -2
- package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/index.js +8 -1
- package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilterContext.js +20 -0
- package/lib/components/Datagrid/index.js +8 -1
- package/lib/components/Datagrid/useActionsColumn.js +13 -7
- package/lib/components/Datagrid/useOnRowClick.js +20 -4
- package/lib/components/Datagrid/useSortableColumns.js +27 -3
- package/lib/components/Datagrid/utils/DatagridActions.js +6 -6
- package/lib/components/Datagrid/utils/getArgTypes.js +4 -0
- package/lib/components/EditSidePanel/EditSidePanel.js +7 -3
- package/lib/components/FilterSummary/FilterSummary.js +7 -3
- package/lib/components/Guidebanner/Guidebanner.js +229 -0
- package/lib/components/Guidebanner/GuidebannerElement.js +67 -0
- package/lib/components/Guidebanner/GuidebannerElementButton.js +71 -0
- package/lib/components/Guidebanner/GuidebannerElementLink.js +52 -0
- package/lib/components/Guidebanner/index.js +33 -0
- package/lib/components/InlineTip/InlineTip.js +228 -0
- package/lib/components/InlineTip/InlineTipButton.js +86 -0
- package/lib/components/InlineTip/InlineTipLink.js +86 -0
- package/lib/components/InlineTip/index.js +26 -0
- package/lib/components/InlineTip/utils.js +44 -0
- package/lib/components/SteppedAnimatedMedia/SteppedAnimatedMedia.js +165 -0
- package/lib/components/SteppedAnimatedMedia/assets/index.js +12 -0
- package/lib/components/SteppedAnimatedMedia/index.js +12 -0
- package/lib/components/Tearsheet/TearsheetShell.js +2 -1
- package/lib/components/index.js +21 -1
- package/lib/global/js/hooks/useResizeObserver.js +1 -1
- package/lib/global/js/package-settings.js +2 -0
- package/package.json +6 -5
- package/scss/components/Carousel/_carousel.scss +80 -0
- package/scss/components/Carousel/_index.scss +8 -0
- package/scss/components/Carousel/_storybook-styles.scss +10 -0
- package/scss/components/Datagrid/_storybook-styles.scss +5 -0
- package/scss/components/Datagrid/styles/_datagrid.scss +1 -1
- package/scss/components/Guidebanner/_guidebanner.scss +257 -0
- package/scss/components/Guidebanner/_index.scss +8 -0
- package/scss/components/Guidebanner/_storybook-styles.scss +20 -0
- package/scss/components/InlineTip/_index.scss +8 -0
- package/scss/components/InlineTip/_inline-tip.scss +231 -0
- package/scss/components/InlineTip/_storybook-styles.scss +21 -0
- package/scss/components/SteppedAnimatedMedia/_index.scss +8 -0
- package/scss/components/SteppedAnimatedMedia/_stepped-animated-media.scss +34 -0
- package/scss/components/SteppedAnimatedMedia/_storybook-styles.scss +12 -0
- package/scss/components/_index.scss +4 -0
@@ -7000,7 +7000,7 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
7000
7000
|
position: relative;
|
7001
7001
|
}
|
7002
7002
|
|
7003
|
-
.c4p--datagrid .bx--data-table--selected:not(.c4p--datagrid__active-row) ::before {
|
7003
|
+
.c4p--datagrid .bx--data-table--selected:not(.c4p--datagrid__active-row) :first-child:not(.bx--checkbox--inline)::before {
|
7004
7004
|
position: absolute;
|
7005
7005
|
top: 0;
|
7006
7006
|
left: 0;
|
@@ -8712,6 +8712,1049 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
8712
8712
|
animation: slide-in 150ms cubic-bezier(0, 0, 0.38, 0.9);
|
8713
8713
|
}
|
8714
8714
|
|
8715
|
+
.c4p--carousel {
|
8716
|
+
position: relative;
|
8717
|
+
}
|
8718
|
+
.c4p--carousel:focus {
|
8719
|
+
outline: none;
|
8720
|
+
}
|
8721
|
+
.c4p--carousel__elements-container {
|
8722
|
+
overflow-x: hidden;
|
8723
|
+
}
|
8724
|
+
.c4p--carousel__elements-container--scrolled, .c4p--carousel__elements-container--scroll-max {
|
8725
|
+
position: absolute;
|
8726
|
+
z-index: 1;
|
8727
|
+
top: 0;
|
8728
|
+
bottom: 0;
|
8729
|
+
width: var(--cds-spacing-07, 2rem);
|
8730
|
+
pointer-events: none;
|
8731
|
+
}
|
8732
|
+
.c4p--carousel__elements-container--scrolled {
|
8733
|
+
left: 0;
|
8734
|
+
}
|
8735
|
+
.c4p--carousel__elements-container--scroll-max {
|
8736
|
+
right: 0;
|
8737
|
+
}
|
8738
|
+
.c4p--carousel__elements {
|
8739
|
+
display: flex;
|
8740
|
+
-ms-overflow-style: none;
|
8741
|
+
overflow-x: scroll;
|
8742
|
+
overflow-y: hidden;
|
8743
|
+
scroll-behavior: smooth;
|
8744
|
+
scroll-snap-type: x mandatory;
|
8745
|
+
scrollbar-width: none;
|
8746
|
+
-webkit-touch-callout: none;
|
8747
|
+
-webkit-user-select: none;
|
8748
|
+
-khtml-user-select: none;
|
8749
|
+
-moz-user-select: none;
|
8750
|
+
-ms-user-select: none;
|
8751
|
+
user-select: none;
|
8752
|
+
}
|
8753
|
+
.c4p--carousel__elements::-webkit-scrollbar {
|
8754
|
+
display: none;
|
8755
|
+
}
|
8756
|
+
|
8757
|
+
/**
|
8758
|
+
* The Guidebanner specifically is theme-agnostic, and so we have to
|
8759
|
+
* use color tokens to keep the colors static instead of theme tokens
|
8760
|
+
* that will change depending on the selected theme.
|
8761
|
+
*
|
8762
|
+
* Because of this, we are triggering a *large* amount of linting errors.
|
8763
|
+
* So, we're adding 4 "disable" rules for the file instead of 50
|
8764
|
+
* individual rules.
|
8765
|
+
*/
|
8766
|
+
/* stylelint-disable carbon/layout-token-use */
|
8767
|
+
/* stylelint-disable carbon/motion-duration-use */
|
8768
|
+
/* stylelint-disable carbon/theme-token-use */
|
8769
|
+
/* stylelint-disable declaration-no-important */
|
8770
|
+
.c4p--guidebanner {
|
8771
|
+
position: relative;
|
8772
|
+
background: linear-gradient(90deg, #001d6c 0%, #6929c4 100%);
|
8773
|
+
background-color: #001d6c;
|
8774
|
+
}
|
8775
|
+
.c4p--guidebanner__icon-idea {
|
8776
|
+
position: absolute;
|
8777
|
+
top: var(--cds-spacing-05, 1rem);
|
8778
|
+
left: var(--cds-spacing-05, 1rem);
|
8779
|
+
}
|
8780
|
+
.c4p--guidebanner__icon-idea path {
|
8781
|
+
fill: #f4f4f4;
|
8782
|
+
}
|
8783
|
+
.c4p--guidebanner__title {
|
8784
|
+
font-size: var(--cds-productive-heading-02-font-size, 1rem);
|
8785
|
+
font-weight: var(--cds-productive-heading-02-font-weight, 600);
|
8786
|
+
line-height: var(--cds-productive-heading-02-line-height, 1.375);
|
8787
|
+
letter-spacing: var(--cds-productive-heading-02-letter-spacing, 0);
|
8788
|
+
padding: var(--cds-spacing-05, 1rem) 10.9375rem 0 3.25rem;
|
8789
|
+
color: #f4f4f4;
|
8790
|
+
}
|
8791
|
+
.c4p--guidebanner__close-button {
|
8792
|
+
--cds-interactive-01: #0f62fe;
|
8793
|
+
--cds-interactive-02: #6f6f6f;
|
8794
|
+
--cds-interactive-03: #ffffff;
|
8795
|
+
--cds-interactive-04: #4589ff;
|
8796
|
+
--cds-ui-background: #161616;
|
8797
|
+
--cds-ui-01: #262626;
|
8798
|
+
--cds-ui-02: #393939;
|
8799
|
+
--cds-ui-03: #393939;
|
8800
|
+
--cds-ui-04: #6f6f6f;
|
8801
|
+
--cds-ui-05: #f4f4f4;
|
8802
|
+
--cds-text-01: #f4f4f4;
|
8803
|
+
--cds-text-02: #c6c6c6;
|
8804
|
+
--cds-text-03: #6f6f6f;
|
8805
|
+
--cds-text-04: #ffffff;
|
8806
|
+
--cds-text-05: #8d8d8d;
|
8807
|
+
--cds-text-error: #ff8389;
|
8808
|
+
--cds-icon-01: #f4f4f4;
|
8809
|
+
--cds-icon-02: #c6c6c6;
|
8810
|
+
--cds-icon-03: #ffffff;
|
8811
|
+
--cds-link-01: #78a9ff;
|
8812
|
+
--cds-link-02: #a6c8ff;
|
8813
|
+
--cds-inverse-link: #0f62fe;
|
8814
|
+
--cds-field-01: #262626;
|
8815
|
+
--cds-field-02: #393939;
|
8816
|
+
--cds-inverse-01: #161616;
|
8817
|
+
--cds-inverse-02: #f4f4f4;
|
8818
|
+
--cds-support-01: #fa4d56;
|
8819
|
+
--cds-support-02: #42be65;
|
8820
|
+
--cds-support-03: #f1c21b;
|
8821
|
+
--cds-support-04: #4589ff;
|
8822
|
+
--cds-inverse-support-01: #da1e28;
|
8823
|
+
--cds-inverse-support-02: #24a148;
|
8824
|
+
--cds-inverse-support-03: #f1c21b;
|
8825
|
+
--cds-inverse-support-04: #0f62fe;
|
8826
|
+
--cds-overlay-01: rgba(0, 0, 0, 0.65);
|
8827
|
+
--cds-danger-01: #da1e28;
|
8828
|
+
--cds-danger-02: #fa4d56;
|
8829
|
+
--cds-focus: #ffffff;
|
8830
|
+
--cds-inverse-focus-ui: #0f62fe;
|
8831
|
+
--cds-hover-primary: #0353e9;
|
8832
|
+
--cds-active-primary: #002d9c;
|
8833
|
+
--cds-hover-primary-text: #a6c8ff;
|
8834
|
+
--cds-hover-secondary: #606060;
|
8835
|
+
--cds-active-secondary: #393939;
|
8836
|
+
--cds-hover-tertiary: #f4f4f4;
|
8837
|
+
--cds-active-tertiary: #c6c6c6;
|
8838
|
+
--cds-hover-ui: #353535;
|
8839
|
+
--cds-hover-light-ui: #4c4c4c;
|
8840
|
+
--cds-hover-selected-ui: #4c4c4c;
|
8841
|
+
--cds-active-ui: #525252;
|
8842
|
+
--cds-active-light-ui: #6f6f6f;
|
8843
|
+
--cds-selected-ui: #393939;
|
8844
|
+
--cds-selected-light-ui: #525252;
|
8845
|
+
--cds-inverse-hover-ui: #e5e5e5;
|
8846
|
+
--cds-hover-danger: #b81921;
|
8847
|
+
--cds-active-danger: #750e13;
|
8848
|
+
--cds-hover-row: #353535;
|
8849
|
+
--cds-visited-link: #be95ff;
|
8850
|
+
--cds-disabled-01: #262626;
|
8851
|
+
--cds-disabled-02: #525252;
|
8852
|
+
--cds-disabled-03: #8d8d8d;
|
8853
|
+
--cds-highlight: #002d9c;
|
8854
|
+
--cds-decorative-01: #525252;
|
8855
|
+
--cds-button-separator: #161616;
|
8856
|
+
--cds-skeleton-01: #353535;
|
8857
|
+
--cds-skeleton-02: #525252;
|
8858
|
+
--cds-background: #161616;
|
8859
|
+
--cds-layer: #262626;
|
8860
|
+
--cds-layer-accent: #393939;
|
8861
|
+
--cds-layer-accent-hover: #474747;
|
8862
|
+
--cds-layer-accent-active: #6f6f6f;
|
8863
|
+
--cds-field: #262626;
|
8864
|
+
--cds-background-inverse: #f4f4f4;
|
8865
|
+
--cds-background-brand: #0f62fe;
|
8866
|
+
--cds-interactive: #4589ff;
|
8867
|
+
--cds-border-subtle: #393939;
|
8868
|
+
--cds-border-strong: #6f6f6f;
|
8869
|
+
--cds-border-inverse: #f4f4f4;
|
8870
|
+
--cds-border-interactive: #4589ff;
|
8871
|
+
--cds-text-primary: #f4f4f4;
|
8872
|
+
--cds-text-secondary: #c6c6c6;
|
8873
|
+
--cds-text-placeholder: #6f6f6f;
|
8874
|
+
--cds-text-helper: #8d8d8d;
|
8875
|
+
--cds-text-on-color: #ffffff;
|
8876
|
+
--cds-text-inverse: #161616;
|
8877
|
+
--cds-link-primary: #78a9ff;
|
8878
|
+
--cds-link-secondary: #a6c8ff;
|
8879
|
+
--cds-link-visited: #be95ff;
|
8880
|
+
--cds-link-inverse: #0f62fe;
|
8881
|
+
--cds-icon-primary: #f4f4f4;
|
8882
|
+
--cds-icon-secondary: #c6c6c6;
|
8883
|
+
--cds-icon-on-color: #ffffff;
|
8884
|
+
--cds-icon-inverse: #161616;
|
8885
|
+
--cds-support-error: #fa4d56;
|
8886
|
+
--cds-support-success: #42be65;
|
8887
|
+
--cds-support-warning: #f1c21b;
|
8888
|
+
--cds-support-info: #4589ff;
|
8889
|
+
--cds-support-error-inverse: #da1e28;
|
8890
|
+
--cds-support-success-inverse: #24a148;
|
8891
|
+
--cds-support-warning-inverse: #f1c21b;
|
8892
|
+
--cds-support-info-inverse: #0f62fe;
|
8893
|
+
--cds-overlay: rgba(0, 0, 0, 0.65);
|
8894
|
+
--cds-toggle-off: #6f6f6f;
|
8895
|
+
--cds-shadow: rgba(0, 0, 0, 0.8);
|
8896
|
+
--cds-button-primary: #0f62fe;
|
8897
|
+
--cds-button-secondary: #6f6f6f;
|
8898
|
+
--cds-button-tertiary: #ffffff;
|
8899
|
+
--cds-button-danger-primary: #da1e28;
|
8900
|
+
--cds-button-danger-secondary: #fa4d56;
|
8901
|
+
--cds-background-active: #525252;
|
8902
|
+
--cds-layer-active: #525252;
|
8903
|
+
--cds-button-danger-active: #750e13;
|
8904
|
+
--cds-button-primary-active: #002d9c;
|
8905
|
+
--cds-button-secondary-active: #393939;
|
8906
|
+
--cds-button-tertiary-active: #c6c6c6;
|
8907
|
+
--cds-focus-inset: #161616;
|
8908
|
+
--cds-focus-inverse: #0f62fe;
|
8909
|
+
--cds-background-hover: #353535;
|
8910
|
+
--cds-layer-hover: #353535;
|
8911
|
+
--cds-field-hover: #353535;
|
8912
|
+
--cds-background-inverse-hover: #e5e5e5;
|
8913
|
+
--cds-link-primary-hover: #a6c8ff;
|
8914
|
+
--cds-button-danger-hover: #b81921;
|
8915
|
+
--cds-button-primary-hover: #0353e9;
|
8916
|
+
--cds-button-secondary-hover: #606060;
|
8917
|
+
--cds-button-tertiary-hover: #f4f4f4;
|
8918
|
+
--cds-background-selected: #393939;
|
8919
|
+
--cds-background-selected-hover: #4c4c4c;
|
8920
|
+
--cds-layer-selected: #393939;
|
8921
|
+
--cds-layer-selected-hover: #4c4c4c;
|
8922
|
+
--cds-layer-selected-inverse: #f4f4f4;
|
8923
|
+
--cds-border-subtle-selected: #525252;
|
8924
|
+
--cds-border-disabled: #262626;
|
8925
|
+
--cds-text-disabled: #525252;
|
8926
|
+
--cds-button-disabled: #525252;
|
8927
|
+
--cds-icon-disabled: #525252;
|
8928
|
+
--cds-text-on-color-disabled: #8d8d8d;
|
8929
|
+
--cds-icon-on-color-disabled: #8d8d8d;
|
8930
|
+
--cds-layer-selected-disabled: #8d8d8d;
|
8931
|
+
--cds-skeleton-background: #353535;
|
8932
|
+
--cds-skeleton-element: #525252;
|
8933
|
+
--cds-brand-01: #0f62fe;
|
8934
|
+
--cds-brand-02: #6f6f6f;
|
8935
|
+
--cds-brand-03: #ffffff;
|
8936
|
+
--cds-active-01: #525252;
|
8937
|
+
--cds-hover-field: #353535;
|
8938
|
+
--cds-danger: #da1e28;
|
8939
|
+
--cds-caption-01-font-size: 0.75rem;
|
8940
|
+
--cds-caption-01-font-weight: 400;
|
8941
|
+
--cds-caption-01-line-height: 1.33333;
|
8942
|
+
--cds-caption-01-letter-spacing: 0.32px;
|
8943
|
+
--cds-caption-02-font-size: 0.875rem;
|
8944
|
+
--cds-caption-02-font-weight: 400;
|
8945
|
+
--cds-caption-02-line-height: 1.28572;
|
8946
|
+
--cds-caption-02-letter-spacing: 0.32px;
|
8947
|
+
--cds-label-01-font-size: 0.75rem;
|
8948
|
+
--cds-label-01-font-weight: 400;
|
8949
|
+
--cds-label-01-line-height: 1.33333;
|
8950
|
+
--cds-label-01-letter-spacing: 0.32px;
|
8951
|
+
--cds-label-02-font-size: 0.875rem;
|
8952
|
+
--cds-label-02-font-weight: 400;
|
8953
|
+
--cds-label-02-line-height: 1.28572;
|
8954
|
+
--cds-label-02-letter-spacing: 0.16px;
|
8955
|
+
--cds-helper-text-01-font-size: 0.75rem;
|
8956
|
+
--cds-helper-text-01-line-height: 1.33333;
|
8957
|
+
--cds-helper-text-01-letter-spacing: 0.32px;
|
8958
|
+
--cds-helper-text-02-font-size: 0.875rem;
|
8959
|
+
--cds-helper-text-02-line-height: 1.28572;
|
8960
|
+
--cds-helper-text-02-letter-spacing: 0.16px;
|
8961
|
+
--cds-body-short-01-font-size: 0.875rem;
|
8962
|
+
--cds-body-short-01-font-weight: 400;
|
8963
|
+
--cds-body-short-01-line-height: 1.28572;
|
8964
|
+
--cds-body-short-01-letter-spacing: 0.16px;
|
8965
|
+
--cds-body-long-01-font-size: 0.875rem;
|
8966
|
+
--cds-body-long-01-font-weight: 400;
|
8967
|
+
--cds-body-long-01-line-height: 1.42857;
|
8968
|
+
--cds-body-long-01-letter-spacing: 0.16px;
|
8969
|
+
--cds-body-short-02-font-size: 1rem;
|
8970
|
+
--cds-body-short-02-font-weight: 400;
|
8971
|
+
--cds-body-short-02-line-height: 1.375;
|
8972
|
+
--cds-body-short-02-letter-spacing: 0;
|
8973
|
+
--cds-body-long-02-font-size: 1rem;
|
8974
|
+
--cds-body-long-02-font-weight: 400;
|
8975
|
+
--cds-body-long-02-line-height: 1.5;
|
8976
|
+
--cds-body-long-02-letter-spacing: 0;
|
8977
|
+
--cds-code-01-font-family: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace;
|
8978
|
+
--cds-code-01-font-size: 0.75rem;
|
8979
|
+
--cds-code-01-font-weight: 400;
|
8980
|
+
--cds-code-01-line-height: 1.33333;
|
8981
|
+
--cds-code-01-letter-spacing: 0.32px;
|
8982
|
+
--cds-code-02-font-family: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace;
|
8983
|
+
--cds-code-02-font-size: 0.875rem;
|
8984
|
+
--cds-code-02-font-weight: 400;
|
8985
|
+
--cds-code-02-line-height: 1.42857;
|
8986
|
+
--cds-code-02-letter-spacing: 0.32px;
|
8987
|
+
--cds-heading-01-font-size: 0.875rem;
|
8988
|
+
--cds-heading-01-font-weight: 600;
|
8989
|
+
--cds-heading-01-line-height: 1.42857;
|
8990
|
+
--cds-heading-01-letter-spacing: 0.16px;
|
8991
|
+
--cds-productive-heading-01-font-size: 0.875rem;
|
8992
|
+
--cds-productive-heading-01-font-weight: 600;
|
8993
|
+
--cds-productive-heading-01-line-height: 1.28572;
|
8994
|
+
--cds-productive-heading-01-letter-spacing: 0.16px;
|
8995
|
+
--cds-heading-02-font-size: 1rem;
|
8996
|
+
--cds-heading-02-font-weight: 600;
|
8997
|
+
--cds-heading-02-line-height: 1.5;
|
8998
|
+
--cds-heading-02-letter-spacing: 0;
|
8999
|
+
--cds-productive-heading-02-font-size: 1rem;
|
9000
|
+
--cds-productive-heading-02-font-weight: 600;
|
9001
|
+
--cds-productive-heading-02-line-height: 1.375;
|
9002
|
+
--cds-productive-heading-02-letter-spacing: 0;
|
9003
|
+
--cds-productive-heading-03-font-size: 1.25rem;
|
9004
|
+
--cds-productive-heading-03-font-weight: 400;
|
9005
|
+
--cds-productive-heading-03-line-height: 1.4;
|
9006
|
+
--cds-productive-heading-03-letter-spacing: 0;
|
9007
|
+
--cds-productive-heading-04-font-size: 1.75rem;
|
9008
|
+
--cds-productive-heading-04-font-weight: 400;
|
9009
|
+
--cds-productive-heading-04-line-height: 1.28572;
|
9010
|
+
--cds-productive-heading-04-letter-spacing: 0;
|
9011
|
+
--cds-productive-heading-05-font-size: 2rem;
|
9012
|
+
--cds-productive-heading-05-font-weight: 400;
|
9013
|
+
--cds-productive-heading-05-line-height: 1.25;
|
9014
|
+
--cds-productive-heading-05-letter-spacing: 0;
|
9015
|
+
--cds-productive-heading-06-font-size: 2.625rem;
|
9016
|
+
--cds-productive-heading-06-font-weight: 300;
|
9017
|
+
--cds-productive-heading-06-line-height: 1.199;
|
9018
|
+
--cds-productive-heading-06-letter-spacing: 0;
|
9019
|
+
--cds-productive-heading-07-font-size: 3.375rem;
|
9020
|
+
--cds-productive-heading-07-font-weight: 300;
|
9021
|
+
--cds-productive-heading-07-line-height: 1.199;
|
9022
|
+
--cds-productive-heading-07-letter-spacing: 0;
|
9023
|
+
--cds-expressive-heading-01-font-size: 0.875rem;
|
9024
|
+
--cds-expressive-heading-01-font-weight: 600;
|
9025
|
+
--cds-expressive-heading-01-line-height: 1.25;
|
9026
|
+
--cds-expressive-heading-01-letter-spacing: 0.16px;
|
9027
|
+
--cds-expressive-heading-02-font-size: 1rem;
|
9028
|
+
--cds-expressive-heading-02-font-weight: 600;
|
9029
|
+
--cds-expressive-heading-02-line-height: 1.5;
|
9030
|
+
--cds-expressive-heading-02-letter-spacing: 0;
|
9031
|
+
--cds-expressive-heading-03-font-size: 1.25rem;
|
9032
|
+
--cds-expressive-heading-03-font-weight: 400;
|
9033
|
+
--cds-expressive-heading-03-line-height: 1.4;
|
9034
|
+
--cds-expressive-heading-03-letter-spacing: 0;
|
9035
|
+
--cds-expressive-heading-04-font-size: 1.75rem;
|
9036
|
+
--cds-expressive-heading-04-font-weight: 400;
|
9037
|
+
--cds-expressive-heading-04-line-height: 1.28572;
|
9038
|
+
--cds-expressive-heading-04-letter-spacing: 0;
|
9039
|
+
--cds-expressive-heading-05-font-size: 2rem;
|
9040
|
+
--cds-expressive-heading-05-font-weight: 400;
|
9041
|
+
--cds-expressive-heading-05-line-height: 1.25;
|
9042
|
+
--cds-expressive-heading-05-letter-spacing: 0;
|
9043
|
+
--cds-expressive-heading-06-font-size: 2rem;
|
9044
|
+
--cds-expressive-heading-06-font-weight: 600;
|
9045
|
+
--cds-expressive-heading-06-line-height: 1.25;
|
9046
|
+
--cds-expressive-heading-06-letter-spacing: 0;
|
9047
|
+
--cds-expressive-paragraph-01-font-size: 1.5rem;
|
9048
|
+
--cds-expressive-paragraph-01-font-weight: 300;
|
9049
|
+
--cds-expressive-paragraph-01-line-height: 1.334;
|
9050
|
+
--cds-expressive-paragraph-01-letter-spacing: 0;
|
9051
|
+
--cds-quotation-01-font-family: 'IBM Plex Serif', 'Georgia', Times, serif;
|
9052
|
+
--cds-quotation-01-font-size: 1.25rem;
|
9053
|
+
--cds-quotation-01-font-weight: 400;
|
9054
|
+
--cds-quotation-01-line-height: 1.3;
|
9055
|
+
--cds-quotation-01-letter-spacing: 0;
|
9056
|
+
--cds-quotation-02-font-family: 'IBM Plex Serif', 'Georgia', Times, serif;
|
9057
|
+
--cds-quotation-02-font-size: 2rem;
|
9058
|
+
--cds-quotation-02-font-weight: 300;
|
9059
|
+
--cds-quotation-02-line-height: 1.25;
|
9060
|
+
--cds-quotation-02-letter-spacing: 0;
|
9061
|
+
--cds-display-01-font-size: 2.625rem;
|
9062
|
+
--cds-display-01-font-weight: 300;
|
9063
|
+
--cds-display-01-line-height: 1.19;
|
9064
|
+
--cds-display-01-letter-spacing: 0;
|
9065
|
+
--cds-display-02-font-size: 2.625rem;
|
9066
|
+
--cds-display-02-font-weight: 600;
|
9067
|
+
--cds-display-02-line-height: 1.19;
|
9068
|
+
--cds-display-02-letter-spacing: 0;
|
9069
|
+
--cds-display-03-font-size: 2.625rem;
|
9070
|
+
--cds-display-03-font-weight: 300;
|
9071
|
+
--cds-display-03-line-height: 1.19;
|
9072
|
+
--cds-display-03-letter-spacing: 0;
|
9073
|
+
--cds-display-04-font-size: 2.625rem;
|
9074
|
+
--cds-display-04-font-weight: 300;
|
9075
|
+
--cds-display-04-line-height: 1.19;
|
9076
|
+
--cds-display-04-letter-spacing: 0;
|
9077
|
+
--cds-legal-01-font-size: 0.75rem;
|
9078
|
+
--cds-legal-01-font-weight: 400;
|
9079
|
+
--cds-legal-01-line-height: 1.33333;
|
9080
|
+
--cds-legal-01-letter-spacing: 0.32px;
|
9081
|
+
--cds-legal-02-font-size: 0.875rem;
|
9082
|
+
--cds-legal-02-font-weight: 400;
|
9083
|
+
--cds-legal-02-line-height: 1.28572;
|
9084
|
+
--cds-legal-02-letter-spacing: 0.16px;
|
9085
|
+
--cds-body-compact-01-font-size: 0.875rem;
|
9086
|
+
--cds-body-compact-01-font-weight: 400;
|
9087
|
+
--cds-body-compact-01-line-height: 1.28572;
|
9088
|
+
--cds-body-compact-01-letter-spacing: 0.16px;
|
9089
|
+
--cds-body-compact-02-font-size: 1rem;
|
9090
|
+
--cds-body-compact-02-font-weight: 400;
|
9091
|
+
--cds-body-compact-02-line-height: 1.375;
|
9092
|
+
--cds-body-compact-02-letter-spacing: 0;
|
9093
|
+
--cds-body-01-font-size: 0.875rem;
|
9094
|
+
--cds-body-01-font-weight: 400;
|
9095
|
+
--cds-body-01-line-height: 1.42857;
|
9096
|
+
--cds-body-01-letter-spacing: 0.16px;
|
9097
|
+
--cds-body-02-font-size: 1rem;
|
9098
|
+
--cds-body-02-font-weight: 400;
|
9099
|
+
--cds-body-02-line-height: 1.5;
|
9100
|
+
--cds-body-02-letter-spacing: 0;
|
9101
|
+
--cds-heading-compact-01-font-size: 0.875rem;
|
9102
|
+
--cds-heading-compact-01-font-weight: 600;
|
9103
|
+
--cds-heading-compact-01-line-height: 1.28572;
|
9104
|
+
--cds-heading-compact-01-letter-spacing: 0.16px;
|
9105
|
+
--cds-heading-compact-02-font-size: 1rem;
|
9106
|
+
--cds-heading-compact-02-font-weight: 600;
|
9107
|
+
--cds-heading-compact-02-line-height: 1.375;
|
9108
|
+
--cds-heading-compact-02-letter-spacing: 0;
|
9109
|
+
--cds-heading-03-font-size: 1.25rem;
|
9110
|
+
--cds-heading-03-font-weight: 400;
|
9111
|
+
--cds-heading-03-line-height: 1.4;
|
9112
|
+
--cds-heading-03-letter-spacing: 0;
|
9113
|
+
--cds-heading-04-font-size: 1.75rem;
|
9114
|
+
--cds-heading-04-font-weight: 400;
|
9115
|
+
--cds-heading-04-line-height: 1.28572;
|
9116
|
+
--cds-heading-04-letter-spacing: 0;
|
9117
|
+
--cds-heading-05-font-size: 2rem;
|
9118
|
+
--cds-heading-05-font-weight: 400;
|
9119
|
+
--cds-heading-05-line-height: 1.25;
|
9120
|
+
--cds-heading-05-letter-spacing: 0;
|
9121
|
+
--cds-heading-06-font-size: 2.625rem;
|
9122
|
+
--cds-heading-06-font-weight: 300;
|
9123
|
+
--cds-heading-06-line-height: 1.199;
|
9124
|
+
--cds-heading-06-letter-spacing: 0;
|
9125
|
+
--cds-heading-07-font-size: 3.375rem;
|
9126
|
+
--cds-heading-07-font-weight: 300;
|
9127
|
+
--cds-heading-07-line-height: 1.199;
|
9128
|
+
--cds-heading-07-letter-spacing: 0;
|
9129
|
+
--cds-fluid-heading-03-font-size: 1.25rem;
|
9130
|
+
--cds-fluid-heading-03-font-weight: 400;
|
9131
|
+
--cds-fluid-heading-03-line-height: 1.4;
|
9132
|
+
--cds-fluid-heading-03-letter-spacing: 0;
|
9133
|
+
--cds-fluid-heading-04-font-size: 1.75rem;
|
9134
|
+
--cds-fluid-heading-04-font-weight: 400;
|
9135
|
+
--cds-fluid-heading-04-line-height: 1.28572;
|
9136
|
+
--cds-fluid-heading-04-letter-spacing: 0;
|
9137
|
+
--cds-fluid-heading-05-font-size: 2rem;
|
9138
|
+
--cds-fluid-heading-05-font-weight: 400;
|
9139
|
+
--cds-fluid-heading-05-line-height: 1.25;
|
9140
|
+
--cds-fluid-heading-05-letter-spacing: 0;
|
9141
|
+
--cds-fluid-heading-06-font-size: 2rem;
|
9142
|
+
--cds-fluid-heading-06-font-weight: 600;
|
9143
|
+
--cds-fluid-heading-06-line-height: 1.25;
|
9144
|
+
--cds-fluid-heading-06-letter-spacing: 0;
|
9145
|
+
--cds-fluid-paragraph-01-font-size: 1.5rem;
|
9146
|
+
--cds-fluid-paragraph-01-font-weight: 300;
|
9147
|
+
--cds-fluid-paragraph-01-line-height: 1.334;
|
9148
|
+
--cds-fluid-paragraph-01-letter-spacing: 0;
|
9149
|
+
--cds-fluid-quotation-01-font-family: 'IBM Plex Serif', 'Georgia', Times, serif;
|
9150
|
+
--cds-fluid-quotation-01-font-size: 1.25rem;
|
9151
|
+
--cds-fluid-quotation-01-font-weight: 400;
|
9152
|
+
--cds-fluid-quotation-01-line-height: 1.3;
|
9153
|
+
--cds-fluid-quotation-01-letter-spacing: 0;
|
9154
|
+
--cds-fluid-quotation-02-font-family: 'IBM Plex Serif', 'Georgia', Times, serif;
|
9155
|
+
--cds-fluid-quotation-02-font-size: 2rem;
|
9156
|
+
--cds-fluid-quotation-02-font-weight: 300;
|
9157
|
+
--cds-fluid-quotation-02-line-height: 1.25;
|
9158
|
+
--cds-fluid-quotation-02-letter-spacing: 0;
|
9159
|
+
--cds-fluid-display-01-font-size: 2.625rem;
|
9160
|
+
--cds-fluid-display-01-font-weight: 300;
|
9161
|
+
--cds-fluid-display-01-line-height: 1.19;
|
9162
|
+
--cds-fluid-display-01-letter-spacing: 0;
|
9163
|
+
--cds-fluid-display-02-font-size: 2.625rem;
|
9164
|
+
--cds-fluid-display-02-font-weight: 600;
|
9165
|
+
--cds-fluid-display-02-line-height: 1.19;
|
9166
|
+
--cds-fluid-display-02-letter-spacing: 0;
|
9167
|
+
--cds-fluid-display-03-font-size: 2.625rem;
|
9168
|
+
--cds-fluid-display-03-font-weight: 300;
|
9169
|
+
--cds-fluid-display-03-line-height: 1.19;
|
9170
|
+
--cds-fluid-display-03-letter-spacing: 0;
|
9171
|
+
--cds-fluid-display-04-font-size: 2.625rem;
|
9172
|
+
--cds-fluid-display-04-font-weight: 300;
|
9173
|
+
--cds-fluid-display-04-line-height: 1.19;
|
9174
|
+
--cds-fluid-display-04-letter-spacing: 0;
|
9175
|
+
--cds-spacing-01: 0.125rem;
|
9176
|
+
--cds-spacing-02: 0.25rem;
|
9177
|
+
--cds-spacing-03: 0.5rem;
|
9178
|
+
--cds-spacing-04: 0.75rem;
|
9179
|
+
--cds-spacing-05: 1rem;
|
9180
|
+
--cds-spacing-06: 1.5rem;
|
9181
|
+
--cds-spacing-07: 2rem;
|
9182
|
+
--cds-spacing-08: 2.5rem;
|
9183
|
+
--cds-spacing-09: 3rem;
|
9184
|
+
--cds-spacing-10: 4rem;
|
9185
|
+
--cds-spacing-11: 5rem;
|
9186
|
+
--cds-spacing-12: 6rem;
|
9187
|
+
--cds-spacing-13: 10rem;
|
9188
|
+
--cds-fluid-spacing-01: 0;
|
9189
|
+
--cds-fluid-spacing-02: 2vw;
|
9190
|
+
--cds-fluid-spacing-03: 5vw;
|
9191
|
+
--cds-fluid-spacing-04: 10vw;
|
9192
|
+
--cds-layout-01: 1rem;
|
9193
|
+
--cds-layout-02: 1.5rem;
|
9194
|
+
--cds-layout-03: 2rem;
|
9195
|
+
--cds-layout-04: 3rem;
|
9196
|
+
--cds-layout-05: 4rem;
|
9197
|
+
--cds-layout-06: 6rem;
|
9198
|
+
--cds-layout-07: 10rem;
|
9199
|
+
--cds-container-01: 1.5rem;
|
9200
|
+
--cds-container-02: 2rem;
|
9201
|
+
--cds-container-03: 2.5rem;
|
9202
|
+
--cds-container-04: 3rem;
|
9203
|
+
--cds-container-05: 4rem;
|
9204
|
+
--cds-size-xsmall: 1.5rem;
|
9205
|
+
--cds-size-small: 2rem;
|
9206
|
+
--cds-size-medium: 2.5rem;
|
9207
|
+
--cds-size-large: 3rem;
|
9208
|
+
--cds-size-xlarge: 4rem;
|
9209
|
+
--cds-size-2XLarge: 5rem;
|
9210
|
+
--cds-icon-size-01: 1rem;
|
9211
|
+
--cds-icon-size-02: 1.25rem;
|
9212
|
+
position: absolute !important;
|
9213
|
+
top: 0;
|
9214
|
+
right: 0;
|
9215
|
+
width: var(--cds-spacing-07, 2rem);
|
9216
|
+
height: var(--cds-spacing-07, 2rem);
|
9217
|
+
min-height: var(--cds-spacing-07, 2rem) !important;
|
9218
|
+
}
|
9219
|
+
.c4p--guidebanner__close-button:active, .c4p--guidebanner__close-button:hover {
|
9220
|
+
background-color: #7433e3 !important;
|
9221
|
+
}
|
9222
|
+
.c4p--guidebanner__close-button svg {
|
9223
|
+
margin-left: -0.25rem !important;
|
9224
|
+
}
|
9225
|
+
.c4p--guidebanner__close-button svg path {
|
9226
|
+
fill: #ffffff !important;
|
9227
|
+
}
|
9228
|
+
.c4p--guidebanner__carousel {
|
9229
|
+
padding: 0 0 var(--cds-spacing-05, 1rem) 0;
|
9230
|
+
color: #f4f4f4;
|
9231
|
+
}
|
9232
|
+
.c4p--guidebanner__collapsible-collapsed .c4p--guidebanner__carousel {
|
9233
|
+
margin-bottom: 0;
|
9234
|
+
}
|
9235
|
+
.c4p--guidebanner__carousel .c4p--carousel__item .c4p--guidebanner__element {
|
9236
|
+
display: flex;
|
9237
|
+
width: 25rem;
|
9238
|
+
max-height: 32rem;
|
9239
|
+
flex-flow: column;
|
9240
|
+
flex-shrink: 0;
|
9241
|
+
padding-left: 3.25rem;
|
9242
|
+
margin: var(--cds-spacing-05, 1rem) 0 0 0;
|
9243
|
+
opacity: 1;
|
9244
|
+
scroll-snap-align: start;
|
9245
|
+
transition: max-height 50ms cubic-bezier(0.2, 0, 1, 0.9), margin-top 50ms cubic-bezier(0.2, 0, 1, 0.9), opacity 300ms cubic-bezier(0.2, 0, 1, 0.9);
|
9246
|
+
}
|
9247
|
+
.c4p--guidebanner__collapsible-collapsed .c4p--guidebanner__carousel .c4p--carousel__item .c4p--guidebanner__element {
|
9248
|
+
max-height: var(--cds-spacing-03, 0.5rem);
|
9249
|
+
margin-top: 0;
|
9250
|
+
opacity: 0;
|
9251
|
+
}
|
9252
|
+
.c4p--guidebanner__carousel .c4p--carousel__item .c4p--guidebanner__element-title {
|
9253
|
+
font-size: var(--cds-productive-heading-01-font-size, 0.875rem);
|
9254
|
+
font-weight: var(--cds-productive-heading-01-font-weight, 600);
|
9255
|
+
line-height: var(--cds-productive-heading-01-line-height, 1.28572);
|
9256
|
+
letter-spacing: var(--cds-productive-heading-01-letter-spacing, 0.16px);
|
9257
|
+
margin: var(--cds-spacing-05, 1rem) 0 0 0;
|
9258
|
+
}
|
9259
|
+
.c4p--guidebanner__carousel .c4p--carousel__item .c4p--guidebanner__element-content {
|
9260
|
+
font-size: var(--cds-body-long-01-font-size, 0.875rem);
|
9261
|
+
font-weight: var(--cds-body-long-01-font-weight, 400);
|
9262
|
+
line-height: var(--cds-body-long-01-line-height, 1.42857);
|
9263
|
+
letter-spacing: var(--cds-body-long-01-letter-spacing, 0.16px);
|
9264
|
+
margin-bottom: var(--cds-spacing-05, 1rem);
|
9265
|
+
}
|
9266
|
+
.c4p--guidebanner__carousel .c4p--carousel__item .c4p--guidebanner__element-buttons .bx--btn--tertiary {
|
9267
|
+
border-color: #ffffff;
|
9268
|
+
color: #ffffff;
|
9269
|
+
}
|
9270
|
+
.c4p--guidebanner__carousel .c4p--carousel__item .c4p--guidebanner__element-buttons .bx--btn--tertiary:active, .c4p--guidebanner__carousel .c4p--carousel__item .c4p--guidebanner__element-buttons .bx--btn--tertiary:hover {
|
9271
|
+
border-color: #ffffff;
|
9272
|
+
background-color: #ffffff;
|
9273
|
+
color: #161616;
|
9274
|
+
}
|
9275
|
+
.c4p--guidebanner__carousel .c4p--carousel__item .c4p--guidebanner__element-buttons .bx--btn:not(.bx--btn--tertiary) {
|
9276
|
+
margin-left: calc(-1 * var(--cds-spacing-05, 1rem));
|
9277
|
+
color: #a6c8ff;
|
9278
|
+
}
|
9279
|
+
.c4p--guidebanner__carousel .c4p--carousel__item .c4p--guidebanner__element-buttons .bx--btn:not(.bx--btn--tertiary):active, .c4p--guidebanner__carousel .c4p--carousel__item .c4p--guidebanner__element-buttons .bx--btn:not(.bx--btn--tertiary):hover {
|
9280
|
+
background-color: #7f3ae7;
|
9281
|
+
color: #f4f4f4;
|
9282
|
+
}
|
9283
|
+
.c4p--guidebanner__carousel .c4p--carousel__item .c4p--guidebanner__element-buttons .c4p--guidebanner__element-link {
|
9284
|
+
color: #a6c8ff;
|
9285
|
+
}
|
9286
|
+
.c4p--guidebanner__carousel .c4p--carousel__item .c4p--guidebanner__element-buttons .c4p--guidebanner__element-link:visited {
|
9287
|
+
color: #a6c8ff;
|
9288
|
+
}
|
9289
|
+
.c4p--guidebanner__carousel .c4p--carousel__item .c4p--guidebanner__element-buttons .c4p--guidebanner__element-link:active, .c4p--guidebanner__carousel .c4p--carousel__item .c4p--guidebanner__element-buttons .c4p--guidebanner__element-link:hover {
|
9290
|
+
color: #d0e2ff;
|
9291
|
+
}
|
9292
|
+
.c4p--guidebanner__carousel .c4p--carousel__item:last-child .c4p--guidebanner__element {
|
9293
|
+
width: 28rem;
|
9294
|
+
padding-right: 3.25rem;
|
9295
|
+
}
|
9296
|
+
.c4p--guidebanner__navigation {
|
9297
|
+
display: flex;
|
9298
|
+
border-top: 0.0625rem solid #8a3ffc;
|
9299
|
+
}
|
9300
|
+
.c4p--guidebanner__collapsible-collapsed .c4p--guidebanner__navigation {
|
9301
|
+
border-top: none;
|
9302
|
+
}
|
9303
|
+
.c4p--guidebanner__navigation .c4p--guidebanner__toggle-button {
|
9304
|
+
margin-left: 2.125rem;
|
9305
|
+
color: #a6c8ff;
|
9306
|
+
}
|
9307
|
+
.c4p--guidebanner__navigation .c4p--guidebanner__toggle-button:active, .c4p--guidebanner__navigation .c4p--guidebanner__toggle-button:hover {
|
9308
|
+
background-color: #7433e3;
|
9309
|
+
color: #f4f4f4;
|
9310
|
+
}
|
9311
|
+
.c4p--guidebanner__navigation .c4p--guidebanner__back-button {
|
9312
|
+
margin-left: auto;
|
9313
|
+
}
|
9314
|
+
.c4p--guidebanner__navigation .c4p--guidebanner__back-button,
|
9315
|
+
.c4p--guidebanner__navigation .c4p--guidebanner__next-button {
|
9316
|
+
--cds-interactive-01: #0f62fe;
|
9317
|
+
--cds-interactive-02: #6f6f6f;
|
9318
|
+
--cds-interactive-03: #ffffff;
|
9319
|
+
--cds-interactive-04: #4589ff;
|
9320
|
+
--cds-ui-background: #161616;
|
9321
|
+
--cds-ui-01: #262626;
|
9322
|
+
--cds-ui-02: #393939;
|
9323
|
+
--cds-ui-03: #393939;
|
9324
|
+
--cds-ui-04: #6f6f6f;
|
9325
|
+
--cds-ui-05: #f4f4f4;
|
9326
|
+
--cds-text-01: #f4f4f4;
|
9327
|
+
--cds-text-02: #c6c6c6;
|
9328
|
+
--cds-text-03: #6f6f6f;
|
9329
|
+
--cds-text-04: #ffffff;
|
9330
|
+
--cds-text-05: #8d8d8d;
|
9331
|
+
--cds-text-error: #ff8389;
|
9332
|
+
--cds-icon-01: #f4f4f4;
|
9333
|
+
--cds-icon-02: #c6c6c6;
|
9334
|
+
--cds-icon-03: #ffffff;
|
9335
|
+
--cds-link-01: #78a9ff;
|
9336
|
+
--cds-link-02: #a6c8ff;
|
9337
|
+
--cds-inverse-link: #0f62fe;
|
9338
|
+
--cds-field-01: #262626;
|
9339
|
+
--cds-field-02: #393939;
|
9340
|
+
--cds-inverse-01: #161616;
|
9341
|
+
--cds-inverse-02: #f4f4f4;
|
9342
|
+
--cds-support-01: #fa4d56;
|
9343
|
+
--cds-support-02: #42be65;
|
9344
|
+
--cds-support-03: #f1c21b;
|
9345
|
+
--cds-support-04: #4589ff;
|
9346
|
+
--cds-inverse-support-01: #da1e28;
|
9347
|
+
--cds-inverse-support-02: #24a148;
|
9348
|
+
--cds-inverse-support-03: #f1c21b;
|
9349
|
+
--cds-inverse-support-04: #0f62fe;
|
9350
|
+
--cds-overlay-01: rgba(0, 0, 0, 0.65);
|
9351
|
+
--cds-danger-01: #da1e28;
|
9352
|
+
--cds-danger-02: #fa4d56;
|
9353
|
+
--cds-focus: #ffffff;
|
9354
|
+
--cds-inverse-focus-ui: #0f62fe;
|
9355
|
+
--cds-hover-primary: #0353e9;
|
9356
|
+
--cds-active-primary: #002d9c;
|
9357
|
+
--cds-hover-primary-text: #a6c8ff;
|
9358
|
+
--cds-hover-secondary: #606060;
|
9359
|
+
--cds-active-secondary: #393939;
|
9360
|
+
--cds-hover-tertiary: #f4f4f4;
|
9361
|
+
--cds-active-tertiary: #c6c6c6;
|
9362
|
+
--cds-hover-ui: #353535;
|
9363
|
+
--cds-hover-light-ui: #4c4c4c;
|
9364
|
+
--cds-hover-selected-ui: #4c4c4c;
|
9365
|
+
--cds-active-ui: #525252;
|
9366
|
+
--cds-active-light-ui: #6f6f6f;
|
9367
|
+
--cds-selected-ui: #393939;
|
9368
|
+
--cds-selected-light-ui: #525252;
|
9369
|
+
--cds-inverse-hover-ui: #e5e5e5;
|
9370
|
+
--cds-hover-danger: #b81921;
|
9371
|
+
--cds-active-danger: #750e13;
|
9372
|
+
--cds-hover-row: #353535;
|
9373
|
+
--cds-visited-link: #be95ff;
|
9374
|
+
--cds-disabled-01: #262626;
|
9375
|
+
--cds-disabled-02: #525252;
|
9376
|
+
--cds-disabled-03: #8d8d8d;
|
9377
|
+
--cds-highlight: #002d9c;
|
9378
|
+
--cds-decorative-01: #525252;
|
9379
|
+
--cds-button-separator: #161616;
|
9380
|
+
--cds-skeleton-01: #353535;
|
9381
|
+
--cds-skeleton-02: #525252;
|
9382
|
+
--cds-background: #161616;
|
9383
|
+
--cds-layer: #262626;
|
9384
|
+
--cds-layer-accent: #393939;
|
9385
|
+
--cds-layer-accent-hover: #474747;
|
9386
|
+
--cds-layer-accent-active: #6f6f6f;
|
9387
|
+
--cds-field: #262626;
|
9388
|
+
--cds-background-inverse: #f4f4f4;
|
9389
|
+
--cds-background-brand: #0f62fe;
|
9390
|
+
--cds-interactive: #4589ff;
|
9391
|
+
--cds-border-subtle: #393939;
|
9392
|
+
--cds-border-strong: #6f6f6f;
|
9393
|
+
--cds-border-inverse: #f4f4f4;
|
9394
|
+
--cds-border-interactive: #4589ff;
|
9395
|
+
--cds-text-primary: #f4f4f4;
|
9396
|
+
--cds-text-secondary: #c6c6c6;
|
9397
|
+
--cds-text-placeholder: #6f6f6f;
|
9398
|
+
--cds-text-helper: #8d8d8d;
|
9399
|
+
--cds-text-on-color: #ffffff;
|
9400
|
+
--cds-text-inverse: #161616;
|
9401
|
+
--cds-link-primary: #78a9ff;
|
9402
|
+
--cds-link-secondary: #a6c8ff;
|
9403
|
+
--cds-link-visited: #be95ff;
|
9404
|
+
--cds-link-inverse: #0f62fe;
|
9405
|
+
--cds-icon-primary: #f4f4f4;
|
9406
|
+
--cds-icon-secondary: #c6c6c6;
|
9407
|
+
--cds-icon-on-color: #ffffff;
|
9408
|
+
--cds-icon-inverse: #161616;
|
9409
|
+
--cds-support-error: #fa4d56;
|
9410
|
+
--cds-support-success: #42be65;
|
9411
|
+
--cds-support-warning: #f1c21b;
|
9412
|
+
--cds-support-info: #4589ff;
|
9413
|
+
--cds-support-error-inverse: #da1e28;
|
9414
|
+
--cds-support-success-inverse: #24a148;
|
9415
|
+
--cds-support-warning-inverse: #f1c21b;
|
9416
|
+
--cds-support-info-inverse: #0f62fe;
|
9417
|
+
--cds-overlay: rgba(0, 0, 0, 0.65);
|
9418
|
+
--cds-toggle-off: #6f6f6f;
|
9419
|
+
--cds-shadow: rgba(0, 0, 0, 0.8);
|
9420
|
+
--cds-button-primary: #0f62fe;
|
9421
|
+
--cds-button-secondary: #6f6f6f;
|
9422
|
+
--cds-button-tertiary: #ffffff;
|
9423
|
+
--cds-button-danger-primary: #da1e28;
|
9424
|
+
--cds-button-danger-secondary: #fa4d56;
|
9425
|
+
--cds-background-active: #525252;
|
9426
|
+
--cds-layer-active: #525252;
|
9427
|
+
--cds-button-danger-active: #750e13;
|
9428
|
+
--cds-button-primary-active: #002d9c;
|
9429
|
+
--cds-button-secondary-active: #393939;
|
9430
|
+
--cds-button-tertiary-active: #c6c6c6;
|
9431
|
+
--cds-focus-inset: #161616;
|
9432
|
+
--cds-focus-inverse: #0f62fe;
|
9433
|
+
--cds-background-hover: #353535;
|
9434
|
+
--cds-layer-hover: #353535;
|
9435
|
+
--cds-field-hover: #353535;
|
9436
|
+
--cds-background-inverse-hover: #e5e5e5;
|
9437
|
+
--cds-link-primary-hover: #a6c8ff;
|
9438
|
+
--cds-button-danger-hover: #b81921;
|
9439
|
+
--cds-button-primary-hover: #0353e9;
|
9440
|
+
--cds-button-secondary-hover: #606060;
|
9441
|
+
--cds-button-tertiary-hover: #f4f4f4;
|
9442
|
+
--cds-background-selected: #393939;
|
9443
|
+
--cds-background-selected-hover: #4c4c4c;
|
9444
|
+
--cds-layer-selected: #393939;
|
9445
|
+
--cds-layer-selected-hover: #4c4c4c;
|
9446
|
+
--cds-layer-selected-inverse: #f4f4f4;
|
9447
|
+
--cds-border-subtle-selected: #525252;
|
9448
|
+
--cds-border-disabled: #262626;
|
9449
|
+
--cds-text-disabled: #525252;
|
9450
|
+
--cds-button-disabled: #525252;
|
9451
|
+
--cds-icon-disabled: #525252;
|
9452
|
+
--cds-text-on-color-disabled: #8d8d8d;
|
9453
|
+
--cds-icon-on-color-disabled: #8d8d8d;
|
9454
|
+
--cds-layer-selected-disabled: #8d8d8d;
|
9455
|
+
--cds-skeleton-background: #353535;
|
9456
|
+
--cds-skeleton-element: #525252;
|
9457
|
+
--cds-brand-01: #0f62fe;
|
9458
|
+
--cds-brand-02: #6f6f6f;
|
9459
|
+
--cds-brand-03: #ffffff;
|
9460
|
+
--cds-active-01: #525252;
|
9461
|
+
--cds-hover-field: #353535;
|
9462
|
+
--cds-danger: #da1e28;
|
9463
|
+
--cds-caption-01-font-size: 0.75rem;
|
9464
|
+
--cds-caption-01-font-weight: 400;
|
9465
|
+
--cds-caption-01-line-height: 1.33333;
|
9466
|
+
--cds-caption-01-letter-spacing: 0.32px;
|
9467
|
+
--cds-caption-02-font-size: 0.875rem;
|
9468
|
+
--cds-caption-02-font-weight: 400;
|
9469
|
+
--cds-caption-02-line-height: 1.28572;
|
9470
|
+
--cds-caption-02-letter-spacing: 0.32px;
|
9471
|
+
--cds-label-01-font-size: 0.75rem;
|
9472
|
+
--cds-label-01-font-weight: 400;
|
9473
|
+
--cds-label-01-line-height: 1.33333;
|
9474
|
+
--cds-label-01-letter-spacing: 0.32px;
|
9475
|
+
--cds-label-02-font-size: 0.875rem;
|
9476
|
+
--cds-label-02-font-weight: 400;
|
9477
|
+
--cds-label-02-line-height: 1.28572;
|
9478
|
+
--cds-label-02-letter-spacing: 0.16px;
|
9479
|
+
--cds-helper-text-01-font-size: 0.75rem;
|
9480
|
+
--cds-helper-text-01-line-height: 1.33333;
|
9481
|
+
--cds-helper-text-01-letter-spacing: 0.32px;
|
9482
|
+
--cds-helper-text-02-font-size: 0.875rem;
|
9483
|
+
--cds-helper-text-02-line-height: 1.28572;
|
9484
|
+
--cds-helper-text-02-letter-spacing: 0.16px;
|
9485
|
+
--cds-body-short-01-font-size: 0.875rem;
|
9486
|
+
--cds-body-short-01-font-weight: 400;
|
9487
|
+
--cds-body-short-01-line-height: 1.28572;
|
9488
|
+
--cds-body-short-01-letter-spacing: 0.16px;
|
9489
|
+
--cds-body-long-01-font-size: 0.875rem;
|
9490
|
+
--cds-body-long-01-font-weight: 400;
|
9491
|
+
--cds-body-long-01-line-height: 1.42857;
|
9492
|
+
--cds-body-long-01-letter-spacing: 0.16px;
|
9493
|
+
--cds-body-short-02-font-size: 1rem;
|
9494
|
+
--cds-body-short-02-font-weight: 400;
|
9495
|
+
--cds-body-short-02-line-height: 1.375;
|
9496
|
+
--cds-body-short-02-letter-spacing: 0;
|
9497
|
+
--cds-body-long-02-font-size: 1rem;
|
9498
|
+
--cds-body-long-02-font-weight: 400;
|
9499
|
+
--cds-body-long-02-line-height: 1.5;
|
9500
|
+
--cds-body-long-02-letter-spacing: 0;
|
9501
|
+
--cds-code-01-font-family: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace;
|
9502
|
+
--cds-code-01-font-size: 0.75rem;
|
9503
|
+
--cds-code-01-font-weight: 400;
|
9504
|
+
--cds-code-01-line-height: 1.33333;
|
9505
|
+
--cds-code-01-letter-spacing: 0.32px;
|
9506
|
+
--cds-code-02-font-family: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace;
|
9507
|
+
--cds-code-02-font-size: 0.875rem;
|
9508
|
+
--cds-code-02-font-weight: 400;
|
9509
|
+
--cds-code-02-line-height: 1.42857;
|
9510
|
+
--cds-code-02-letter-spacing: 0.32px;
|
9511
|
+
--cds-heading-01-font-size: 0.875rem;
|
9512
|
+
--cds-heading-01-font-weight: 600;
|
9513
|
+
--cds-heading-01-line-height: 1.42857;
|
9514
|
+
--cds-heading-01-letter-spacing: 0.16px;
|
9515
|
+
--cds-productive-heading-01-font-size: 0.875rem;
|
9516
|
+
--cds-productive-heading-01-font-weight: 600;
|
9517
|
+
--cds-productive-heading-01-line-height: 1.28572;
|
9518
|
+
--cds-productive-heading-01-letter-spacing: 0.16px;
|
9519
|
+
--cds-heading-02-font-size: 1rem;
|
9520
|
+
--cds-heading-02-font-weight: 600;
|
9521
|
+
--cds-heading-02-line-height: 1.5;
|
9522
|
+
--cds-heading-02-letter-spacing: 0;
|
9523
|
+
--cds-productive-heading-02-font-size: 1rem;
|
9524
|
+
--cds-productive-heading-02-font-weight: 600;
|
9525
|
+
--cds-productive-heading-02-line-height: 1.375;
|
9526
|
+
--cds-productive-heading-02-letter-spacing: 0;
|
9527
|
+
--cds-productive-heading-03-font-size: 1.25rem;
|
9528
|
+
--cds-productive-heading-03-font-weight: 400;
|
9529
|
+
--cds-productive-heading-03-line-height: 1.4;
|
9530
|
+
--cds-productive-heading-03-letter-spacing: 0;
|
9531
|
+
--cds-productive-heading-04-font-size: 1.75rem;
|
9532
|
+
--cds-productive-heading-04-font-weight: 400;
|
9533
|
+
--cds-productive-heading-04-line-height: 1.28572;
|
9534
|
+
--cds-productive-heading-04-letter-spacing: 0;
|
9535
|
+
--cds-productive-heading-05-font-size: 2rem;
|
9536
|
+
--cds-productive-heading-05-font-weight: 400;
|
9537
|
+
--cds-productive-heading-05-line-height: 1.25;
|
9538
|
+
--cds-productive-heading-05-letter-spacing: 0;
|
9539
|
+
--cds-productive-heading-06-font-size: 2.625rem;
|
9540
|
+
--cds-productive-heading-06-font-weight: 300;
|
9541
|
+
--cds-productive-heading-06-line-height: 1.199;
|
9542
|
+
--cds-productive-heading-06-letter-spacing: 0;
|
9543
|
+
--cds-productive-heading-07-font-size: 3.375rem;
|
9544
|
+
--cds-productive-heading-07-font-weight: 300;
|
9545
|
+
--cds-productive-heading-07-line-height: 1.199;
|
9546
|
+
--cds-productive-heading-07-letter-spacing: 0;
|
9547
|
+
--cds-expressive-heading-01-font-size: 0.875rem;
|
9548
|
+
--cds-expressive-heading-01-font-weight: 600;
|
9549
|
+
--cds-expressive-heading-01-line-height: 1.25;
|
9550
|
+
--cds-expressive-heading-01-letter-spacing: 0.16px;
|
9551
|
+
--cds-expressive-heading-02-font-size: 1rem;
|
9552
|
+
--cds-expressive-heading-02-font-weight: 600;
|
9553
|
+
--cds-expressive-heading-02-line-height: 1.5;
|
9554
|
+
--cds-expressive-heading-02-letter-spacing: 0;
|
9555
|
+
--cds-expressive-heading-03-font-size: 1.25rem;
|
9556
|
+
--cds-expressive-heading-03-font-weight: 400;
|
9557
|
+
--cds-expressive-heading-03-line-height: 1.4;
|
9558
|
+
--cds-expressive-heading-03-letter-spacing: 0;
|
9559
|
+
--cds-expressive-heading-04-font-size: 1.75rem;
|
9560
|
+
--cds-expressive-heading-04-font-weight: 400;
|
9561
|
+
--cds-expressive-heading-04-line-height: 1.28572;
|
9562
|
+
--cds-expressive-heading-04-letter-spacing: 0;
|
9563
|
+
--cds-expressive-heading-05-font-size: 2rem;
|
9564
|
+
--cds-expressive-heading-05-font-weight: 400;
|
9565
|
+
--cds-expressive-heading-05-line-height: 1.25;
|
9566
|
+
--cds-expressive-heading-05-letter-spacing: 0;
|
9567
|
+
--cds-expressive-heading-06-font-size: 2rem;
|
9568
|
+
--cds-expressive-heading-06-font-weight: 600;
|
9569
|
+
--cds-expressive-heading-06-line-height: 1.25;
|
9570
|
+
--cds-expressive-heading-06-letter-spacing: 0;
|
9571
|
+
--cds-expressive-paragraph-01-font-size: 1.5rem;
|
9572
|
+
--cds-expressive-paragraph-01-font-weight: 300;
|
9573
|
+
--cds-expressive-paragraph-01-line-height: 1.334;
|
9574
|
+
--cds-expressive-paragraph-01-letter-spacing: 0;
|
9575
|
+
--cds-quotation-01-font-family: 'IBM Plex Serif', 'Georgia', Times, serif;
|
9576
|
+
--cds-quotation-01-font-size: 1.25rem;
|
9577
|
+
--cds-quotation-01-font-weight: 400;
|
9578
|
+
--cds-quotation-01-line-height: 1.3;
|
9579
|
+
--cds-quotation-01-letter-spacing: 0;
|
9580
|
+
--cds-quotation-02-font-family: 'IBM Plex Serif', 'Georgia', Times, serif;
|
9581
|
+
--cds-quotation-02-font-size: 2rem;
|
9582
|
+
--cds-quotation-02-font-weight: 300;
|
9583
|
+
--cds-quotation-02-line-height: 1.25;
|
9584
|
+
--cds-quotation-02-letter-spacing: 0;
|
9585
|
+
--cds-display-01-font-size: 2.625rem;
|
9586
|
+
--cds-display-01-font-weight: 300;
|
9587
|
+
--cds-display-01-line-height: 1.19;
|
9588
|
+
--cds-display-01-letter-spacing: 0;
|
9589
|
+
--cds-display-02-font-size: 2.625rem;
|
9590
|
+
--cds-display-02-font-weight: 600;
|
9591
|
+
--cds-display-02-line-height: 1.19;
|
9592
|
+
--cds-display-02-letter-spacing: 0;
|
9593
|
+
--cds-display-03-font-size: 2.625rem;
|
9594
|
+
--cds-display-03-font-weight: 300;
|
9595
|
+
--cds-display-03-line-height: 1.19;
|
9596
|
+
--cds-display-03-letter-spacing: 0;
|
9597
|
+
--cds-display-04-font-size: 2.625rem;
|
9598
|
+
--cds-display-04-font-weight: 300;
|
9599
|
+
--cds-display-04-line-height: 1.19;
|
9600
|
+
--cds-display-04-letter-spacing: 0;
|
9601
|
+
--cds-legal-01-font-size: 0.75rem;
|
9602
|
+
--cds-legal-01-font-weight: 400;
|
9603
|
+
--cds-legal-01-line-height: 1.33333;
|
9604
|
+
--cds-legal-01-letter-spacing: 0.32px;
|
9605
|
+
--cds-legal-02-font-size: 0.875rem;
|
9606
|
+
--cds-legal-02-font-weight: 400;
|
9607
|
+
--cds-legal-02-line-height: 1.28572;
|
9608
|
+
--cds-legal-02-letter-spacing: 0.16px;
|
9609
|
+
--cds-body-compact-01-font-size: 0.875rem;
|
9610
|
+
--cds-body-compact-01-font-weight: 400;
|
9611
|
+
--cds-body-compact-01-line-height: 1.28572;
|
9612
|
+
--cds-body-compact-01-letter-spacing: 0.16px;
|
9613
|
+
--cds-body-compact-02-font-size: 1rem;
|
9614
|
+
--cds-body-compact-02-font-weight: 400;
|
9615
|
+
--cds-body-compact-02-line-height: 1.375;
|
9616
|
+
--cds-body-compact-02-letter-spacing: 0;
|
9617
|
+
--cds-body-01-font-size: 0.875rem;
|
9618
|
+
--cds-body-01-font-weight: 400;
|
9619
|
+
--cds-body-01-line-height: 1.42857;
|
9620
|
+
--cds-body-01-letter-spacing: 0.16px;
|
9621
|
+
--cds-body-02-font-size: 1rem;
|
9622
|
+
--cds-body-02-font-weight: 400;
|
9623
|
+
--cds-body-02-line-height: 1.5;
|
9624
|
+
--cds-body-02-letter-spacing: 0;
|
9625
|
+
--cds-heading-compact-01-font-size: 0.875rem;
|
9626
|
+
--cds-heading-compact-01-font-weight: 600;
|
9627
|
+
--cds-heading-compact-01-line-height: 1.28572;
|
9628
|
+
--cds-heading-compact-01-letter-spacing: 0.16px;
|
9629
|
+
--cds-heading-compact-02-font-size: 1rem;
|
9630
|
+
--cds-heading-compact-02-font-weight: 600;
|
9631
|
+
--cds-heading-compact-02-line-height: 1.375;
|
9632
|
+
--cds-heading-compact-02-letter-spacing: 0;
|
9633
|
+
--cds-heading-03-font-size: 1.25rem;
|
9634
|
+
--cds-heading-03-font-weight: 400;
|
9635
|
+
--cds-heading-03-line-height: 1.4;
|
9636
|
+
--cds-heading-03-letter-spacing: 0;
|
9637
|
+
--cds-heading-04-font-size: 1.75rem;
|
9638
|
+
--cds-heading-04-font-weight: 400;
|
9639
|
+
--cds-heading-04-line-height: 1.28572;
|
9640
|
+
--cds-heading-04-letter-spacing: 0;
|
9641
|
+
--cds-heading-05-font-size: 2rem;
|
9642
|
+
--cds-heading-05-font-weight: 400;
|
9643
|
+
--cds-heading-05-line-height: 1.25;
|
9644
|
+
--cds-heading-05-letter-spacing: 0;
|
9645
|
+
--cds-heading-06-font-size: 2.625rem;
|
9646
|
+
--cds-heading-06-font-weight: 300;
|
9647
|
+
--cds-heading-06-line-height: 1.199;
|
9648
|
+
--cds-heading-06-letter-spacing: 0;
|
9649
|
+
--cds-heading-07-font-size: 3.375rem;
|
9650
|
+
--cds-heading-07-font-weight: 300;
|
9651
|
+
--cds-heading-07-line-height: 1.199;
|
9652
|
+
--cds-heading-07-letter-spacing: 0;
|
9653
|
+
--cds-fluid-heading-03-font-size: 1.25rem;
|
9654
|
+
--cds-fluid-heading-03-font-weight: 400;
|
9655
|
+
--cds-fluid-heading-03-line-height: 1.4;
|
9656
|
+
--cds-fluid-heading-03-letter-spacing: 0;
|
9657
|
+
--cds-fluid-heading-04-font-size: 1.75rem;
|
9658
|
+
--cds-fluid-heading-04-font-weight: 400;
|
9659
|
+
--cds-fluid-heading-04-line-height: 1.28572;
|
9660
|
+
--cds-fluid-heading-04-letter-spacing: 0;
|
9661
|
+
--cds-fluid-heading-05-font-size: 2rem;
|
9662
|
+
--cds-fluid-heading-05-font-weight: 400;
|
9663
|
+
--cds-fluid-heading-05-line-height: 1.25;
|
9664
|
+
--cds-fluid-heading-05-letter-spacing: 0;
|
9665
|
+
--cds-fluid-heading-06-font-size: 2rem;
|
9666
|
+
--cds-fluid-heading-06-font-weight: 600;
|
9667
|
+
--cds-fluid-heading-06-line-height: 1.25;
|
9668
|
+
--cds-fluid-heading-06-letter-spacing: 0;
|
9669
|
+
--cds-fluid-paragraph-01-font-size: 1.5rem;
|
9670
|
+
--cds-fluid-paragraph-01-font-weight: 300;
|
9671
|
+
--cds-fluid-paragraph-01-line-height: 1.334;
|
9672
|
+
--cds-fluid-paragraph-01-letter-spacing: 0;
|
9673
|
+
--cds-fluid-quotation-01-font-family: 'IBM Plex Serif', 'Georgia', Times, serif;
|
9674
|
+
--cds-fluid-quotation-01-font-size: 1.25rem;
|
9675
|
+
--cds-fluid-quotation-01-font-weight: 400;
|
9676
|
+
--cds-fluid-quotation-01-line-height: 1.3;
|
9677
|
+
--cds-fluid-quotation-01-letter-spacing: 0;
|
9678
|
+
--cds-fluid-quotation-02-font-family: 'IBM Plex Serif', 'Georgia', Times, serif;
|
9679
|
+
--cds-fluid-quotation-02-font-size: 2rem;
|
9680
|
+
--cds-fluid-quotation-02-font-weight: 300;
|
9681
|
+
--cds-fluid-quotation-02-line-height: 1.25;
|
9682
|
+
--cds-fluid-quotation-02-letter-spacing: 0;
|
9683
|
+
--cds-fluid-display-01-font-size: 2.625rem;
|
9684
|
+
--cds-fluid-display-01-font-weight: 300;
|
9685
|
+
--cds-fluid-display-01-line-height: 1.19;
|
9686
|
+
--cds-fluid-display-01-letter-spacing: 0;
|
9687
|
+
--cds-fluid-display-02-font-size: 2.625rem;
|
9688
|
+
--cds-fluid-display-02-font-weight: 600;
|
9689
|
+
--cds-fluid-display-02-line-height: 1.19;
|
9690
|
+
--cds-fluid-display-02-letter-spacing: 0;
|
9691
|
+
--cds-fluid-display-03-font-size: 2.625rem;
|
9692
|
+
--cds-fluid-display-03-font-weight: 300;
|
9693
|
+
--cds-fluid-display-03-line-height: 1.19;
|
9694
|
+
--cds-fluid-display-03-letter-spacing: 0;
|
9695
|
+
--cds-fluid-display-04-font-size: 2.625rem;
|
9696
|
+
--cds-fluid-display-04-font-weight: 300;
|
9697
|
+
--cds-fluid-display-04-line-height: 1.19;
|
9698
|
+
--cds-fluid-display-04-letter-spacing: 0;
|
9699
|
+
--cds-spacing-01: 0.125rem;
|
9700
|
+
--cds-spacing-02: 0.25rem;
|
9701
|
+
--cds-spacing-03: 0.5rem;
|
9702
|
+
--cds-spacing-04: 0.75rem;
|
9703
|
+
--cds-spacing-05: 1rem;
|
9704
|
+
--cds-spacing-06: 1.5rem;
|
9705
|
+
--cds-spacing-07: 2rem;
|
9706
|
+
--cds-spacing-08: 2.5rem;
|
9707
|
+
--cds-spacing-09: 3rem;
|
9708
|
+
--cds-spacing-10: 4rem;
|
9709
|
+
--cds-spacing-11: 5rem;
|
9710
|
+
--cds-spacing-12: 6rem;
|
9711
|
+
--cds-spacing-13: 10rem;
|
9712
|
+
--cds-fluid-spacing-01: 0;
|
9713
|
+
--cds-fluid-spacing-02: 2vw;
|
9714
|
+
--cds-fluid-spacing-03: 5vw;
|
9715
|
+
--cds-fluid-spacing-04: 10vw;
|
9716
|
+
--cds-layout-01: 1rem;
|
9717
|
+
--cds-layout-02: 1.5rem;
|
9718
|
+
--cds-layout-03: 2rem;
|
9719
|
+
--cds-layout-04: 3rem;
|
9720
|
+
--cds-layout-05: 4rem;
|
9721
|
+
--cds-layout-06: 6rem;
|
9722
|
+
--cds-layout-07: 10rem;
|
9723
|
+
--cds-container-01: 1.5rem;
|
9724
|
+
--cds-container-02: 2rem;
|
9725
|
+
--cds-container-03: 2.5rem;
|
9726
|
+
--cds-container-04: 3rem;
|
9727
|
+
--cds-container-05: 4rem;
|
9728
|
+
--cds-size-xsmall: 1.5rem;
|
9729
|
+
--cds-size-small: 2rem;
|
9730
|
+
--cds-size-medium: 2.5rem;
|
9731
|
+
--cds-size-large: 3rem;
|
9732
|
+
--cds-size-xlarge: 4rem;
|
9733
|
+
--cds-size-2XLarge: 5rem;
|
9734
|
+
--cds-icon-size-01: 1rem;
|
9735
|
+
--cds-icon-size-02: 1.25rem;
|
9736
|
+
}
|
9737
|
+
.c4p--guidebanner__collapsible-collapsed .c4p--guidebanner__navigation .c4p--guidebanner__back-button,
|
9738
|
+
.c4p--guidebanner__collapsible-collapsed .c4p--guidebanner__navigation .c4p--guidebanner__next-button {
|
9739
|
+
display: none !important;
|
9740
|
+
}
|
9741
|
+
.c4p--guidebanner__navigation .c4p--guidebanner__back-button:active, .c4p--guidebanner__navigation .c4p--guidebanner__back-button:hover,
|
9742
|
+
.c4p--guidebanner__navigation .c4p--guidebanner__next-button:active,
|
9743
|
+
.c4p--guidebanner__navigation .c4p--guidebanner__next-button:hover {
|
9744
|
+
background-color: #7433e3;
|
9745
|
+
}
|
9746
|
+
.c4p--guidebanner__navigation .c4p--guidebanner__back-button svg path,
|
9747
|
+
.c4p--guidebanner__navigation .c4p--guidebanner__next-button svg path {
|
9748
|
+
fill: #ffffff !important;
|
9749
|
+
}
|
9750
|
+
.c4p--guidebanner__navigation .c4p--guidebanner__back-button--disabled svg path,
|
9751
|
+
.c4p--guidebanner__navigation .c4p--guidebanner__next-button--disabled svg path {
|
9752
|
+
fill: #9b63ff !important;
|
9753
|
+
}
|
9754
|
+
.c4p--guidebanner__close-button::before, .c4p--guidebanner__back-button::before, .c4p--guidebanner__next-button::before {
|
9755
|
+
z-index: 6001 !important;
|
9756
|
+
}
|
9757
|
+
|
8715
9758
|
@keyframes fade {
|
8716
9759
|
0% {
|
8717
9760
|
opacity: 0;
|
@@ -10113,4 +11156,160 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
10113
11156
|
color: var(--cds-link-01, #0f62fe);
|
10114
11157
|
}
|
10115
11158
|
|
11159
|
+
/**
|
11160
|
+
* The InlineTip specifically is theme-agnostic, and so we have to
|
11161
|
+
* use color tokens to keep the colors static instead of theme tokens
|
11162
|
+
* that will change depending on the selected theme.
|
11163
|
+
*
|
11164
|
+
* We are triggering a *large* amount of linting errors.
|
11165
|
+
* So, we're adding 2 "disable" rules for the file instead of 25
|
11166
|
+
* individual rules.
|
11167
|
+
*/
|
11168
|
+
/* stylelint-disable declaration-no-important */
|
11169
|
+
/* stylelint-disable carbon/theme-token-use */
|
11170
|
+
.c4p--inline-tip {
|
11171
|
+
position: relative;
|
11172
|
+
display: flex;
|
11173
|
+
background: linear-gradient(90deg, #001d6c 0%, #6929c4 100%);
|
11174
|
+
}
|
11175
|
+
.c4p--inline-tip__wide {
|
11176
|
+
padding: var(--cds-spacing-05, 1rem) var(--cds-spacing-10, 4rem) var(--cds-spacing-05, 1rem) var(--cds-spacing-09, 3rem);
|
11177
|
+
}
|
11178
|
+
.c4p--inline-tip__wide.c4p--inline-tip__has-media {
|
11179
|
+
padding-right: var(--cds-spacing-09, 3rem);
|
11180
|
+
}
|
11181
|
+
.c4p--inline-tip__wide.c4p--inline-tip__has-media .c4p--inline-tip__media {
|
11182
|
+
padding-left: var(--cds-spacing-10, 4rem);
|
11183
|
+
}
|
11184
|
+
.c4p--inline-tip__wide.c4p--inline-tip__has-media .c4p--inline-tip__media img {
|
11185
|
+
display: block;
|
11186
|
+
height: 7.375rem;
|
11187
|
+
}
|
11188
|
+
.c4p--inline-tip__wide.c4p--inline-tip__has-media .c4p--inline-tip__media svg {
|
11189
|
+
width: calc(7.375rem * 2) !important;
|
11190
|
+
height: 7.375rem !important;
|
11191
|
+
}
|
11192
|
+
.c4p--inline-tip__narrow {
|
11193
|
+
flex-direction: column-reverse;
|
11194
|
+
/* stylelint-disable-next-line carbon/layout-token-use */
|
11195
|
+
padding: 3.25rem var(--cds-spacing-07, 2rem) var(--cds-spacing-05, 1rem) var(--cds-spacing-05, 1rem);
|
11196
|
+
}
|
11197
|
+
.c4p--inline-tip__narrow.c4p--inline-tip__has-media {
|
11198
|
+
padding-top: var(--cds-spacing-07, 2rem);
|
11199
|
+
padding-right: var(--cds-spacing-05, 1rem);
|
11200
|
+
}
|
11201
|
+
.c4p--inline-tip__narrow .c4p--inline-tip__media {
|
11202
|
+
padding-bottom: var(--cds-spacing-05, 1rem);
|
11203
|
+
}
|
11204
|
+
.c4p--inline-tip__narrow .c4p--inline-tip__media img {
|
11205
|
+
width: 100%;
|
11206
|
+
}
|
11207
|
+
.c4p--inline-tip__narrow .c4p--inline-tip__content {
|
11208
|
+
padding-right: var(--cds-spacing-05, 1rem);
|
11209
|
+
}
|
11210
|
+
.c4p--inline-tip__narrow .c4p--inline-tip__footer {
|
11211
|
+
justify-content: space-between;
|
11212
|
+
}
|
11213
|
+
.c4p--inline-tip__narrow .c4p--inline-tip__footer .c4p--inline-tip__close-btn {
|
11214
|
+
margin-right: calc(-1 * var(--cds-spacing-05, 1rem));
|
11215
|
+
}
|
11216
|
+
.c4p--inline-tip a {
|
11217
|
+
color: #a6c8ff;
|
11218
|
+
}
|
11219
|
+
.c4p--inline-tip a:visited, .c4p--inline-tip a:hover, .c4p--inline-tip a:visited:hover {
|
11220
|
+
color: #a6c8ff;
|
11221
|
+
}
|
11222
|
+
.c4p--inline-tip__title {
|
11223
|
+
font-size: var(--cds-productive-heading-01-font-size, 0.875rem);
|
11224
|
+
font-weight: var(--cds-productive-heading-01-font-weight, 600);
|
11225
|
+
line-height: var(--cds-productive-heading-01-line-height, 1.28572);
|
11226
|
+
letter-spacing: var(--cds-productive-heading-01-letter-spacing, 0.16px);
|
11227
|
+
color: #ffffff;
|
11228
|
+
}
|
11229
|
+
.c4p--inline-tip__body {
|
11230
|
+
font-size: var(--cds-body-short-01-font-size, 0.875rem);
|
11231
|
+
font-weight: var(--cds-body-short-01-font-weight, 400);
|
11232
|
+
line-height: var(--cds-body-short-01-line-height, 1.28572);
|
11233
|
+
letter-spacing: var(--cds-body-short-01-letter-spacing, 0.16px);
|
11234
|
+
color: #f4f4f4;
|
11235
|
+
}
|
11236
|
+
.c4p--inline-tip__body p {
|
11237
|
+
font-size: var(--cds-body-short-01-font-size, 0.875rem);
|
11238
|
+
font-weight: var(--cds-body-short-01-font-weight, 400);
|
11239
|
+
line-height: var(--cds-body-short-01-line-height, 1.28572);
|
11240
|
+
letter-spacing: var(--cds-body-short-01-letter-spacing, 0.16px);
|
11241
|
+
margin-bottom: var(--cds-spacing-03, 0.5rem);
|
11242
|
+
font-size: inherit;
|
11243
|
+
line-height: inherit;
|
11244
|
+
}
|
11245
|
+
.c4p--inline-tip__body p:last-of-type {
|
11246
|
+
margin-bottom: 0;
|
11247
|
+
}
|
11248
|
+
.c4p--inline-tip__body .c4p--inline-tip__secondary-btn {
|
11249
|
+
margin-top: var(--cds-spacing-03, 0.5rem);
|
11250
|
+
}
|
11251
|
+
.c4p--inline-tip__body .c4p--inline-tip__secondary-btn .c4p--inline-tip__button {
|
11252
|
+
margin-left: calc(-1 * var(--cds-spacing-05, 1rem));
|
11253
|
+
color: #a6c8ff;
|
11254
|
+
}
|
11255
|
+
.c4p--inline-tip__body .c4p--inline-tip__secondary-btn .c4p--inline-tip__button:active, .c4p--inline-tip__body .c4p--inline-tip__secondary-btn .c4p--inline-tip__button:hover {
|
11256
|
+
background-color: #7f3ae7;
|
11257
|
+
color: #f4f4f4;
|
11258
|
+
}
|
11259
|
+
.c4p--inline-tip__footer {
|
11260
|
+
display: flex;
|
11261
|
+
padding-top: var(--cds-spacing-05, 1rem);
|
11262
|
+
}
|
11263
|
+
.c4p--inline-tip__footer:empty {
|
11264
|
+
display: none;
|
11265
|
+
}
|
11266
|
+
.c4p--inline-tip__preview-text {
|
11267
|
+
display: -webkit-box;
|
11268
|
+
overflow: hidden;
|
11269
|
+
-webkit-box-orient: vertical;
|
11270
|
+
-webkit-line-clamp: 1;
|
11271
|
+
}
|
11272
|
+
.c4p--inline-tip__icon-idea {
|
11273
|
+
position: absolute;
|
11274
|
+
width: 1.25rem;
|
11275
|
+
color: #ffffff;
|
11276
|
+
inset: var(--cds-spacing-05, 1rem) 0 0 var(--cds-spacing-05, 1rem);
|
11277
|
+
}
|
11278
|
+
.c4p--inline-tip__close-icon {
|
11279
|
+
position: absolute !important;
|
11280
|
+
top: 0;
|
11281
|
+
right: 0;
|
11282
|
+
width: var(--cds-spacing-07, 2rem);
|
11283
|
+
height: var(--cds-spacing-07, 2rem);
|
11284
|
+
min-height: var(--cds-spacing-07, 2rem) !important;
|
11285
|
+
/* stylelint-disable-next-line carbon/layout-token-use */
|
11286
|
+
padding: 0 0 0 0.375rem !important;
|
11287
|
+
color: #ffffff;
|
11288
|
+
}
|
11289
|
+
.c4p--inline-tip__close-icon:active, .c4p--inline-tip__close-icon:hover {
|
11290
|
+
background-color: #7f3ae7 !important;
|
11291
|
+
color: var(--cds-text-01, #161616) !important;
|
11292
|
+
}
|
11293
|
+
.c4p--inline-tip__close-icon svg > path {
|
11294
|
+
margin: 0;
|
11295
|
+
fill: #ffffff !important;
|
11296
|
+
}
|
11297
|
+
.c4p--inline-tip__toggle-btn {
|
11298
|
+
border: none;
|
11299
|
+
margin: 0 var(--cds-spacing-05, 1rem) 0 calc(-1 * var(--cds-spacing-05, 1rem)) !important;
|
11300
|
+
color: #a6c8ff !important;
|
11301
|
+
}
|
11302
|
+
.c4p--inline-tip__toggle-btn:hover {
|
11303
|
+
background-color: #7c3dd6 !important;
|
11304
|
+
color: #f4f4f4 !important;
|
11305
|
+
}
|
11306
|
+
.c4p--inline-tip__close-btn {
|
11307
|
+
border: 0.0625rem solid #ffffff !important;
|
11308
|
+
color: #ffffff !important;
|
11309
|
+
}
|
11310
|
+
.c4p--inline-tip__close-btn:active, .c4p--inline-tip__close-btn:hover {
|
11311
|
+
background-color: #f4f4f4 !important;
|
11312
|
+
color: #161616 !important;
|
11313
|
+
}
|
11314
|
+
|
10116
11315
|
/*# sourceMappingURL=index-without-carbon.css.map */
|