@fundamental-styles/theming-preview 0.22.1-rc.0 → 0.23.0-rc.1

package/fundamental-styles.css

@@ -1,6 +1,6 @@
 @charset "UTF-8";
 /*!
- * Fundamental Library Styles v0.22.1-rc.0
+ * Fundamental Library Styles v0.23.0-rc.1
  * Copyright (c) 2022 SAP SE or an SAP affiliate company.
  * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)
  */
@@ -4110,6 +4110,9 @@
   outline-style: dotted;
   outline-style: var(--sapContent_FocusStyle,dotted)
 }
+.fd-avatar[tabindex="0"] {
+  cursor: pointer
+}
 .fd-avatar__zoom-icon [class*=sap-icon],
 .fd-avatar__zoom-icon[class*=sap-icon] {
   color: inherit;
@@ -4496,6 +4499,9 @@
   outline-style: dotted;
   outline-style: var(--sapContent_FocusStyle,dotted)
 }
+.fd-avatar[tabindex="0"] {
+  cursor: pointer
+}
 .fd-avatar__zoom-icon [class*=sap-icon],
 .fd-avatar__zoom-icon[class*=sap-icon] {
   color: inherit;
@@ -12379,12 +12385,23 @@ fd-carousel:focus {
   padding: 0;
   margin: 0;
   border: 0;
+  margin-left: -1rem;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
-  -webkit-box-pack: center;
-  -ms-flex-pack: center;
-  justify-content: center
+  -webkit-box-pack: start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  margin-top: -1rem
 }
 .fd-fixed-card-layout__card-layout::after,
 .fd-fixed-card-layout__card-layout::before {
@@ -12392,45 +12409,310 @@ fd-carousel:focus {
   box-sizing: inherit;
   font-size: inherit
 }
-.fd-fixed-card-layout__card-layout-column {
-  font-size: .875rem;
-  font-size: var(--sapFontSize,.875rem);
-  line-height: 1.4;
-  line-height: var(--sapContent_LineHeight,1.4);
-  color: #32363a;
-  color: var(--sapTextColor,#32363a);
-  font-family: "72","72full",Arial,Helvetica,sans-serif;
-  font-family: var(--sapFontFamily, "72", "72full", Arial, Helvetica, sans-serif);
-  font-weight: 400;
-  -webkit-box-sizing: border-box;
-  box-sizing: border-box;
-  padding: 0;
-  margin: 0;
-  border: 0;
-  -webkit-box-flex: 1;
-  -ms-flex: 1;
-  flex: 1;
-  margin-right: 1rem
+.fd-fixed-card-layout__card-layout[dir=rtl],
+[dir=rtl] .fd-fixed-card-layout__card-layout {
+  margin-right: -1rem;
+  margin-left: 0
 }
-.fd-fixed-card-layout__card-layout-column::after,
-.fd-fixed-card-layout__card-layout-column::before {
-  -webkit-box-sizing: inherit;
-  box-sizing: inherit;
-  font-size: inherit
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-2 .fd-fixed-card-layout__card {
+  width: 50%
 }
-.fd-fixed-card-layout__card-layout-column:last-child {
-  margin-right: 0
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-2 .fd-fixed-card-layout__card:nth-of-type(2n) {
+  -webkit-box-ordinal-group: 3;
+  -ms-flex-order: 2;
+  order: 2
 }
-.fd-fixed-card-layout__card-layout-column:last-child[dir=rtl],
-[dir=rtl] .fd-fixed-card-layout__card-layout-column:last-child {
-  margin-left: 0
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-2 .fd-fixed-card-layout__card:nth-of-type(2n+1) {
+  -webkit-box-ordinal-group: 2;
+  -ms-flex-order: 1;
+  order: 1
 }
-.fd-fixed-card-layout__card-layout-column[dir=rtl],
-[dir=rtl] .fd-fixed-card-layout__card-layout-column {
-  margin-left: 1rem;
-  margin-right: 0
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-3 .fd-fixed-card-layout__card {
+  width: 33.3333333333%
 }
-.fd-fixed-card-layout__card {
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-3 .fd-fixed-card-layout__card:nth-of-type(3n) {
+  -webkit-box-ordinal-group: 4;
+  -ms-flex-order: 3;
+  order: 3
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-3 .fd-fixed-card-layout__card:nth-of-type(3n+1) {
+  -webkit-box-ordinal-group: 2;
+  -ms-flex-order: 1;
+  order: 1
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-3 .fd-fixed-card-layout__card:nth-of-type(3n+2) {
+  -webkit-box-ordinal-group: 3;
+  -ms-flex-order: 2;
+  order: 2
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-4 .fd-fixed-card-layout__card {
+  width: 25%
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-4 .fd-fixed-card-layout__card:nth-of-type(4n) {
+  -webkit-box-ordinal-group: 5;
+  -ms-flex-order: 4;
+  order: 4
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-4 .fd-fixed-card-layout__card:nth-of-type(4n+1) {
+  -webkit-box-ordinal-group: 2;
+  -ms-flex-order: 1;
+  order: 1
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-4 .fd-fixed-card-layout__card:nth-of-type(4n+2) {
+  -webkit-box-ordinal-group: 3;
+  -ms-flex-order: 2;
+  order: 2
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-4 .fd-fixed-card-layout__card:nth-of-type(4n+3) {
+  -webkit-box-ordinal-group: 4;
+  -ms-flex-order: 3;
+  order: 3
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-5 .fd-fixed-card-layout__card {
+  width: 20%
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-5 .fd-fixed-card-layout__card:nth-of-type(5n) {
+  -webkit-box-ordinal-group: 6;
+  -ms-flex-order: 5;
+  order: 5
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-5 .fd-fixed-card-layout__card:nth-of-type(5n+1) {
+  -webkit-box-ordinal-group: 2;
+  -ms-flex-order: 1;
+  order: 1
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-5 .fd-fixed-card-layout__card:nth-of-type(5n+2) {
+  -webkit-box-ordinal-group: 3;
+  -ms-flex-order: 2;
+  order: 2
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-5 .fd-fixed-card-layout__card:nth-of-type(5n+3) {
+  -webkit-box-ordinal-group: 4;
+  -ms-flex-order: 3;
+  order: 3
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-5 .fd-fixed-card-layout__card:nth-of-type(5n+4) {
+  -webkit-box-ordinal-group: 5;
+  -ms-flex-order: 4;
+  order: 4
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-6 .fd-fixed-card-layout__card {
+  width: 16.6666666667%
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-6 .fd-fixed-card-layout__card:nth-of-type(6n) {
+  -webkit-box-ordinal-group: 7;
+  -ms-flex-order: 6;
+  order: 6
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-6 .fd-fixed-card-layout__card:nth-of-type(6n+1) {
+  -webkit-box-ordinal-group: 2;
+  -ms-flex-order: 1;
+  order: 1
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-6 .fd-fixed-card-layout__card:nth-of-type(6n+2) {
+  -webkit-box-ordinal-group: 3;
+  -ms-flex-order: 2;
+  order: 2
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-6 .fd-fixed-card-layout__card:nth-of-type(6n+3) {
+  -webkit-box-ordinal-group: 4;
+  -ms-flex-order: 3;
+  order: 3
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-6 .fd-fixed-card-layout__card:nth-of-type(6n+4) {
+  -webkit-box-ordinal-group: 5;
+  -ms-flex-order: 4;
+  order: 4
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-6 .fd-fixed-card-layout__card:nth-of-type(6n+5) {
+  -webkit-box-ordinal-group: 6;
+  -ms-flex-order: 5;
+  order: 5
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-7 .fd-fixed-card-layout__card {
+  width: 14.2857142857%
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-7 .fd-fixed-card-layout__card:nth-of-type(7n) {
+  -webkit-box-ordinal-group: 8;
+  -ms-flex-order: 7;
+  order: 7
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-7 .fd-fixed-card-layout__card:nth-of-type(7n+1) {
+  -webkit-box-ordinal-group: 2;
+  -ms-flex-order: 1;
+  order: 1
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-7 .fd-fixed-card-layout__card:nth-of-type(7n+2) {
+  -webkit-box-ordinal-group: 3;
+  -ms-flex-order: 2;
+  order: 2
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-7 .fd-fixed-card-layout__card:nth-of-type(7n+3) {
+  -webkit-box-ordinal-group: 4;
+  -ms-flex-order: 3;
+  order: 3
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-7 .fd-fixed-card-layout__card:nth-of-type(7n+4) {
+  -webkit-box-ordinal-group: 5;
+  -ms-flex-order: 4;
+  order: 4
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-7 .fd-fixed-card-layout__card:nth-of-type(7n+5) {
+  -webkit-box-ordinal-group: 6;
+  -ms-flex-order: 5;
+  order: 5
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-7 .fd-fixed-card-layout__card:nth-of-type(7n+6) {
+  -webkit-box-ordinal-group: 7;
+  -ms-flex-order: 6;
+  order: 6
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-8 .fd-fixed-card-layout__card {
+  width: 12.5%
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-8 .fd-fixed-card-layout__card:nth-of-type(8n) {
+  -webkit-box-ordinal-group: 9;
+  -ms-flex-order: 8;
+  order: 8
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-8 .fd-fixed-card-layout__card:nth-of-type(8n+1) {
+  -webkit-box-ordinal-group: 2;
+  -ms-flex-order: 1;
+  order: 1
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-8 .fd-fixed-card-layout__card:nth-of-type(8n+2) {
+  -webkit-box-ordinal-group: 3;
+  -ms-flex-order: 2;
+  order: 2
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-8 .fd-fixed-card-layout__card:nth-of-type(8n+3) {
+  -webkit-box-ordinal-group: 4;
+  -ms-flex-order: 3;
+  order: 3
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-8 .fd-fixed-card-layout__card:nth-of-type(8n+4) {
+  -webkit-box-ordinal-group: 5;
+  -ms-flex-order: 4;
+  order: 4
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-8 .fd-fixed-card-layout__card:nth-of-type(8n+5) {
+  -webkit-box-ordinal-group: 6;
+  -ms-flex-order: 5;
+  order: 5
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-8 .fd-fixed-card-layout__card:nth-of-type(8n+6) {
+  -webkit-box-ordinal-group: 7;
+  -ms-flex-order: 6;
+  order: 6
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-8 .fd-fixed-card-layout__card:nth-of-type(8n+7) {
+  -webkit-box-ordinal-group: 8;
+  -ms-flex-order: 7;
+  order: 7
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card {
+  width: 11.1111111111%
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card:nth-of-type(9n) {
+  -webkit-box-ordinal-group: 10;
+  -ms-flex-order: 9;
+  order: 9
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card:nth-of-type(9n+1) {
+  -webkit-box-ordinal-group: 2;
+  -ms-flex-order: 1;
+  order: 1
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card:nth-of-type(9n+2) {
+  -webkit-box-ordinal-group: 3;
+  -ms-flex-order: 2;
+  order: 2
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card:nth-of-type(9n+3) {
+  -webkit-box-ordinal-group: 4;
+  -ms-flex-order: 3;
+  order: 3
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card:nth-of-type(9n+4) {
+  -webkit-box-ordinal-group: 5;
+  -ms-flex-order: 4;
+  order: 4
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card:nth-of-type(9n+5) {
+  -webkit-box-ordinal-group: 6;
+  -ms-flex-order: 5;
+  order: 5
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card:nth-of-type(9n+6) {
+  -webkit-box-ordinal-group: 7;
+  -ms-flex-order: 6;
+  order: 6
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card:nth-of-type(9n+7) {
+  -webkit-box-ordinal-group: 8;
+  -ms-flex-order: 7;
+  order: 7
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-9 .fd-fixed-card-layout__card:nth-of-type(9n+8) {
+  -webkit-box-ordinal-group: 9;
+  -ms-flex-order: 8;
+  order: 8
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card {
+  width: 10%
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n) {
+  -webkit-box-ordinal-group: 11;
+  -ms-flex-order: 10;
+  order: 10
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n+1) {
+  -webkit-box-ordinal-group: 2;
+  -ms-flex-order: 1;
+  order: 1
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n+2) {
+  -webkit-box-ordinal-group: 3;
+  -ms-flex-order: 2;
+  order: 2
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n+3) {
+  -webkit-box-ordinal-group: 4;
+  -ms-flex-order: 3;
+  order: 3
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n+4) {
+  -webkit-box-ordinal-group: 5;
+  -ms-flex-order: 4;
+  order: 4
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n+5) {
+  -webkit-box-ordinal-group: 6;
+  -ms-flex-order: 5;
+  order: 5
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n+6) {
+  -webkit-box-ordinal-group: 7;
+  -ms-flex-order: 6;
+  order: 6
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n+7) {
+  -webkit-box-ordinal-group: 8;
+  -ms-flex-order: 7;
+  order: 7
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n+8) {
+  -webkit-box-ordinal-group: 9;
+  -ms-flex-order: 8;
+  order: 8
+}
+.fd-fixed-card-layout__card-layout.fd-fixed-card-layout__card-layout--columns-10 .fd-fixed-card-layout__card:nth-of-type(10n+9) {
+  -webkit-box-ordinal-group: 10;
+  -ms-flex-order: 9;
+  order: 9
+}
+.fd-fixed-card-layout__card,
+.fd-fixed-card-layout__card-placeholder {
   font-size: .875rem;
   font-size: var(--sapFontSize,.875rem);
   line-height: 1.4;
@@ -12445,19 +12727,44 @@ fd-carousel:focus {
   padding: 0;
   margin: 0;
   border: 0;
-  margin-bottom: 1rem;
-  min-width: 20rem
+  min-width: 20rem;
+  min-height: .0625rem
 }
+.fd-fixed-card-layout__card-placeholder::after,
+.fd-fixed-card-layout__card-placeholder::before,
 .fd-fixed-card-layout__card::after,
 .fd-fixed-card-layout__card::before {
   -webkit-box-sizing: inherit;
   box-sizing: inherit;
   font-size: inherit
 }
-.fd-fixed-card-layout__card:last-child {
-  margin-bottom: 0
+.fd-fixed-card-layout__card {
+  padding-left: 1rem;
+  -webkit-box-ordinal-group: 2;
+  -ms-flex-order: 1;
+  order: 1;
+  padding-top: 1rem
+}
+.fd-fixed-card-layout__card[dir=rtl],
+[dir=rtl] .fd-fixed-card-layout__card {
+  padding-right: 1rem;
+  padding-left: 0
+}
+.fd-fixed-card-layout__card--single {
+  -ms-flex-preferred-size: 100%;
+  flex-basis: 100%
+}
+.fd-fixed-card-layout__card:empty {
+  padding-top: 0
 }
 .fd-fixed-card-layout__card-placeholder {
+  opacity: .3;
+  border: .125rem dashed #0854a0;
+  border: .125rem dashed var(--sapContent_DragAndDropActiveColor,#0854a0);
+  cursor: -webkit-grabbing;
+  cursor: grabbing
+}
+.fd-fixed-card-layout__card-preview {
   font-size: .875rem;
   font-size: var(--sapFontSize,.875rem);
   line-height: 1.4;
@@ -12472,20 +12779,21 @@ fd-carousel:focus {
   padding: 0;
   margin: 0;
   border: 0;
-  opacity: .3;
-  border: .125rem dashed #0854a0;
-  border: .125rem dashed var(--sapContent_DragAndDropActiveColor,#0854a0);
-  cursor: -webkit-grabbing;
-  cursor: grabbing;
-  margin-bottom: 1rem
+  box-sizing: border-box;
+  border-radius: .25rem;
+  border-radius: var(--sapElement_BorderCornerRadius,.25rem);
+  -webkit-box-shadow: 0 0 0 .0625rem rgba(0,0,0,.42),0 .625rem 1.875rem 0 rgba(0,0,0,.3);
+  -webkit-box-shadow: var(--sapContent_Shadow2,0 0 0 .0625rem rgba(0,0,0,.42),0 .625rem 1.875rem 0 rgba(0,0,0,.3));
+  box-shadow: 0 0 0 .0625rem rgba(0,0,0,.42),0 .625rem 1.875rem 0 rgba(0,0,0,.3);
+  box-shadow: var(--sapContent_Shadow2,0 0 0 .0625rem rgba(0,0,0,.42),0 .625rem 1.875rem 0 rgba(0,0,0,.3))
 }
-.fd-fixed-card-layout__card-placeholder::after,
-.fd-fixed-card-layout__card-placeholder::before {
+.fd-fixed-card-layout__card-preview::after,
+.fd-fixed-card-layout__card-preview::before {
   -webkit-box-sizing: inherit;
   box-sizing: inherit;
   font-size: inherit
 }
-.fd-fixed-card-layout__card-preview {
+.fd-fixed-card-layout__clearfix {
   font-size: .875rem;
   font-size: var(--sapFontSize,.875rem);
   line-height: 1.4;
@@ -12500,16 +12808,12 @@ fd-carousel:focus {
   padding: 0;
   margin: 0;
   border: 0;
-  box-sizing: border-box;
-  border-radius: .25rem;
-  border-radius: var(--sapElement_BorderCornerRadius,.25rem);
-  -webkit-box-shadow: 0 0 0 .0625rem rgba(0,0,0,.42),0 .625rem 1.875rem 0 rgba(0,0,0,.3);
-  -webkit-box-shadow: var(--sapContent_Shadow2,0 0 0 .0625rem rgba(0,0,0,.42),0 .625rem 1.875rem 0 rgba(0,0,0,.3));
-  box-shadow: 0 0 0 .0625rem rgba(0,0,0,.42),0 .625rem 1.875rem 0 rgba(0,0,0,.3);
-  box-shadow: var(--sapContent_Shadow2,0 0 0 .0625rem rgba(0,0,0,.42),0 .625rem 1.875rem 0 rgba(0,0,0,.3))
+  width: 0;
+  -ms-flex-preferred-size: 100%;
+  flex-basis: 100%
 }
-.fd-fixed-card-layout__card-preview::after,
-.fd-fixed-card-layout__card-preview::before {
+.fd-fixed-card-layout__clearfix::after,
+.fd-fixed-card-layout__clearfix::before {
   -webkit-box-sizing: inherit;
   box-sizing: inherit;
   font-size: inherit
@@ -24962,8 +25266,9 @@ fd-carousel:focus {
   border-width: var(--fdMessageStrip_Border_Width,.0625rem);
   border-style: solid;
   border-color: #6a6d70;
-  border-color: var(--sapNeutralBorderColor,#6a6d70);
+  border-color: var(--fdMessageStrip_Border_Color_Neutral,var(--sapNeutralBorderColor,#6a6d70));
   border-radius: .25rem;
+  border-radius: var(--fdMessageStrip_Border_Radius,var(--sapElement_BorderCornerRadius,.25rem));
   padding: .4375rem 1rem;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -25073,12 +25378,12 @@ fd-carousel:focus {
   background-color: #fef7f1;
   background-color: var(--sapWarningBackground,#fef7f1);
   border-color: #df6e0c;
-  border-color: var(--sapWarningBorderColor,#df6e0c)
+  border-color: var(--fdMessageStrip_Border_Color_Warning,var(--sapWarningBorderColor,#df6e0c))
 }
 .fd-message-strip--warning::after,
 .fd-message-strip--warning::before {
   color: #df6e0c;
-  color: var(--sapWarningBorderColor,#df6e0c)
+  color: var(--fdMessageStrip_Icon_Color_Warning,var(--sapCriticalElementColor,#df6e0c))
 }
 .fd-message-strip--warning::before {
   font-family: SAP-icons;
@@ -25110,12 +25415,12 @@ fd-carousel:focus {
   background-color: #ffebeb;
   background-color: var(--sapErrorBackground,#ffebeb);
   border-color: #b00;
-  border-color: var(--sapErrorBorderColor,#b00)
+  border-color: var(--fdMessageStrip_Border_Color_Error,var(--sapErrorBorderColor,#b00))
 }
 .fd-message-strip--error::after,
 .fd-message-strip--error::before {
   color: #b00;
-  color: var(--sapErrorBorderColor,#b00)
+  color: var(--fdMessageStrip_Icon_Color_Error,var(--sapNegativeElementColor,#b00))
 }
 .fd-message-strip--error::before {
   font-family: SAP-icons;
@@ -25143,12 +25448,12 @@ fd-carousel:focus {
   background-color: #f1fdf6;
   background-color: var(--sapSuccessBackground,#f1fdf6);
   border-color: #107e3e;
-  border-color: var(--sapSuccessBorderColor,#107e3e)
+  border-color: var(--fdMessageStrip_Border_Color_Success,var(--sapSuccessBorderColor,#107e3e))
 }
 .fd-message-strip--success::after,
 .fd-message-strip--success::before {
   color: #107e3e;
-  color: var(--sapSuccessBorderColor,#107e3e)
+  color: var(--fdMessageStrip_Icon_Color_Success,var(--sapPositiveElementColor,#107e3e))
 }
 .fd-message-strip--success::before {
   font-family: SAP-icons;
@@ -25175,13 +25480,13 @@ fd-carousel:focus {
 .fd-message-strip--information {
   background-color: #f5faff;
   background-color: var(--sapInformationBackground,#f5faff);
-  border-color: #0a6ed1;
-  border-color: var(--sapInformationBorderColor,#0a6ed1)
+  border-color: var(--sapInformativeBorderColor);
+  border-color: var(--fdMessageStrip_Border_Color_Informative,var(--sapInformativeBorderColor))
 }
 .fd-message-strip--information::after,
 .fd-message-strip--information::before {
   color: #0a6ed1;
-  color: var(--sapInformationBorderColor,#0a6ed1)
+  color: var(--fdMessageStrip_Icon_Color_Information,var(--sapInformativeElementColor,#0a6ed1))
 }
 .fd-message-strip--information::before {
   font-family: SAP-icons;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@fundamental-styles/theming-preview",
-    "version": "0.22.1-rc.0",
+    "version": "0.23.0-rc.1",
     "license": "Apache-2.0",
     "homepage": "https://sap.github.io/fundamental-styles/",
     "description": "Fundamental Library Styles - Theming Package Preview",
@@ -9,7 +9,7 @@
       "url": "https://github.com/SAP/fundamental-styles"
     },
     "dependencies": {
-        "fundamental-styles": "0.22.1-rc.0"
+        "fundamental-styles": "0.23.0-rc.1"
     }
   }