@fundamental-styles/theming-preview 0.23.1-rc.0 → 0.23.1-rc.3

package/fundamental-styles.css

@@ -1,6 +1,6 @@
 @charset "UTF-8";
 /*!
- * Fundamental Library Styles v0.23.1-rc.0
+ * Fundamental Library Styles v0.23.1-rc.3
  * 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)
  */
@@ -5988,7 +5988,9 @@
 .fd-button:hover {
   color: var(--sapButton_Hover_TextColor);
   border-color: var(--sapButton_Hover_BorderColor);
-  background-color: var(--sapButton_Hover_Background)
+  background-color: var(--sapButton_Hover_Background);
+  -webkit-box-shadow: var(--sapContent_Interaction_Shadow);
+  box-shadow: var(--sapContent_Interaction_Shadow)
 }
 .fd-button.is-hover.fd-button--toggled,
 .fd-button:hover.fd-button--toggled {
@@ -29272,7 +29274,6 @@ places the element far left of the screen. so it is not visible.
   background: var(--sapGroup_ContentBackground);
   opacity: 1;
   visibility: visible;
-  left: var(--sapGroup_BorderWidth);
   top: calc(100% + .5rem);
   -webkit-transition: all 125ms;
   transition: all 125ms;
@@ -29285,18 +29286,10 @@ places the element far left of the screen. so it is not visible.
   box-sizing: inherit;
   font-size: inherit
 }
-.fd-popover__body[dir=rtl],
-[dir=rtl] .fd-popover__body {
-  left: auto;
-  right: var(--sapGroup_BorderWidth)
-}
-.fd-popover__body[dir=rtl]::before,
-[dir=rtl] .fd-popover__body::before {
-  right: .65rem
-}
-.fd-popover__body[dir=rtl]::after,
-[dir=rtl] .fd-popover__body::after {
-  right: .65rem
+.fd-popover__body::after,
+.fd-popover__body::before {
+  content: "";
+  position: absolute
 }
 .fd-popover__body::before {
   height: 0;
@@ -29306,10 +29299,7 @@ places the element far left of the screen. so it is not visible.
   border-bottom-color: var(--sapGroup_ContentBackground);
   border-left-color: transparent;
   border-right-color: transparent;
-  content: "";
-  position: absolute;
-  top: calc(-.5rem + 1px);
-  left: .65rem;
+  top: -.4375rem;
   z-index: 1002
 }
 .fd-popover__body::after {
@@ -29320,10 +29310,7 @@ places the element far left of the screen. so it is not visible.
   border-bottom-color: var(--sapContent_ForegroundBorderColor);
   border-left-color: transparent;
   border-right-color: transparent;
-  content: "";
-  position: absolute;
   top: -.5rem;
-  left: .65rem;
   z-index: 1001
 }
 .fd-popover__body > :not(.fd-popover__wrapper) {
@@ -29345,25 +29332,63 @@ places the element far left of the screen. so it is not visible.
   border-bottom-right-radius: var(--sapElement_BorderCornerRadius);
   border-bottom-left-radius: var(--sapElement_BorderCornerRadius)
 }
+.fd-popover__body--compact.fd-popover__body--left::after,
+.fd-popover__body--compact.fd-popover__body--left::before,
+.fd-popover__body--compact.fd-popover__body::after,
+.fd-popover__body--compact.fd-popover__body::before {
+  left: .5rem
+}
+.fd-popover__body--compact.fd-popover__body--left[dir=rtl]::after,
+.fd-popover__body--compact.fd-popover__body--left[dir=rtl]::before,
+.fd-popover__body--compact.fd-popover__body[dir=rtl]::after,
+.fd-popover__body--compact.fd-popover__body[dir=rtl]::before,
+[dir=rtl] .fd-popover__body--compact.fd-popover__body--left::after,
+[dir=rtl] .fd-popover__body--compact.fd-popover__body--left::before,
+[dir=rtl] .fd-popover__body--compact.fd-popover__body::after,
+[dir=rtl] .fd-popover__body--compact.fd-popover__body::before {
+  left: auto;
+  right: .5rem
+}
+.fd-popover__body--compact.fd-popover__body--right::after,
+.fd-popover__body--compact.fd-popover__body--right::before {
+  left: auto;
+  right: .5rem
+}
+.fd-popover__body--compact.fd-popover__body--right[dir=rtl]::after,
+.fd-popover__body--compact.fd-popover__body--right[dir=rtl]::before,
+[dir=rtl] .fd-popover__body--compact.fd-popover__body--right::after,
+[dir=rtl] .fd-popover__body--compact.fd-popover__body--right::before {
+  left: .5rem;
+  right: auto
+}
+.fd-popover__body,
 .fd-popover__body--left {
   left: var(--sapGroup_BorderWidth);
   right: auto
 }
 .fd-popover__body--left[dir=rtl],
+.fd-popover__body[dir=rtl],
+[dir=rtl] .fd-popover__body,
 [dir=rtl] .fd-popover__body--left {
   right: var(--sapGroup_BorderWidth);
   left: auto
 }
+.fd-popover__body--left::after,
+.fd-popover__body--left::before,
+.fd-popover__body::after,
+.fd-popover__body::before {
+  left: .625rem
+}
 .fd-popover__body--left[dir=rtl]::after,
 .fd-popover__body--left[dir=rtl]::before,
+.fd-popover__body[dir=rtl]::after,
+.fd-popover__body[dir=rtl]::before,
 [dir=rtl] .fd-popover__body--left::after,
-[dir=rtl] .fd-popover__body--left::before {
-  right: .65rem;
-  left: unset
-}
-.fd-popover__body--left::after,
-.fd-popover__body--left::before {
-  left: .65rem
+[dir=rtl] .fd-popover__body--left::before,
+[dir=rtl] .fd-popover__body::after,
+[dir=rtl] .fd-popover__body::before {
+  left: auto;
+  right: .625rem
 }
 .fd-popover__body--right {
   right: var(--sapGroup_BorderWidth);
@@ -29374,17 +29399,17 @@ places the element far left of the screen. so it is not visible.
   left: var(--sapGroup_BorderWidth);
   right: auto
 }
+.fd-popover__body--right::after,
+.fd-popover__body--right::before {
+  left: auto;
+  right: .625rem
+}
 .fd-popover__body--right[dir=rtl]::after,
 .fd-popover__body--right[dir=rtl]::before,
 [dir=rtl] .fd-popover__body--right::after,
 [dir=rtl] .fd-popover__body--right::before {
-  left: .65rem;
-  right: unset
-}
-.fd-popover__body--right::after,
-.fd-popover__body--right::before {
-  left: auto;
-  right: .65rem
+  left: .625rem;
+  right: auto
 }
 .fd-popover__body--no-arrow {
   -webkit-box-shadow: var(--sapContent_Shadow1);
@@ -29396,24 +29421,6 @@ places the element far left of the screen. so it is not visible.
 .fd-popover__body--no-arrow::before {
   display: none
 }
-.fd-popover__body--no-arrow.fd-popover__body--left {
-  left: var(--sapGroup_BorderWidth);
-  right: auto
-}
-.fd-popover__body--no-arrow.fd-popover__body--left[dir=rtl],
-[dir=rtl] .fd-popover__body--no-arrow.fd-popover__body--left {
-  right: var(--sapGroup_BorderWidth);
-  left: auto
-}
-.fd-popover__body--no-arrow.fd-popover__body--right {
-  right: var(--sapGroup_BorderWidth);
-  left: auto
-}
-.fd-popover__body--no-arrow.fd-popover__body--right[dir=rtl],
-[dir=rtl] .fd-popover__body--no-arrow.fd-popover__body--right {
-  left: var(--sapGroup_BorderWidth);
-  right: auto
-}
 .fd-popover__body--dropdown {
   display: -ms-grid;
   -ms-grid-columns: max-content;
@@ -29540,7 +29547,7 @@ places the element far left of the screen. so it is not visible.
   border-top-color: var(--sapContent_ForegroundBorderColor)
 }
 .fd-popover__popper .fd-popover__arrow--bottom::after {
-  bottom: 1px;
+  bottom: .0625rem;
   border-width: .5rem .5rem 0 .5rem;
   border-top-color: var(--sapGroup_ContentBackground)
 }
@@ -29550,7 +29557,7 @@ places the element far left of the screen. so it is not visible.
   border-bottom-color: var(--sapContent_ForegroundBorderColor)
 }
 .fd-popover__popper .fd-popover__arrow--top::after {
-  top: 1px;
+  top: .0625rem;
   border-width: 0 .5rem .5rem .5rem;
   border-bottom-color: var(--sapGroup_ContentBackground)
 }
@@ -29560,7 +29567,7 @@ places the element far left of the screen. so it is not visible.
   border-left-color: var(--sapContent_ForegroundBorderColor)
 }
 .fd-popover__popper .fd-popover__arrow--end::after {
-  right: 1px;
+  right: .0625rem;
   border-width: .5rem 0 .5rem .5rem;
   border-left-color: var(--sapGroup_ContentBackground)
 }
@@ -29570,12 +29577,12 @@ places the element far left of the screen. so it is not visible.
   border-right-color: var(--sapContent_ForegroundBorderColor)
 }
 .fd-popover__popper .fd-popover__arrow--start::after {
-  left: 1px;
+  left: .0625rem;
   border-width: .5rem .5rem .5rem 0;
   border-right-color: var(--sapGroup_ContentBackground)
 }
 .fd-popover__popper .fd-popover__arrow-x--start {
-  left: .65rem
+  left: .625rem
 }
 .fd-popover__popper .fd-popover__arrow-x--center {
   left: 50%;
@@ -29583,10 +29590,10 @@ places the element far left of the screen. so it is not visible.
   transform: translateX(-50%)
 }
 .fd-popover__popper .fd-popover__arrow-x--end {
-  right: .65rem
+  right: .625rem
 }
 .fd-popover__popper .fd-popover__arrow-y--top {
-  top: .65rem
+  top: .625rem
 }
 .fd-popover__popper .fd-popover__arrow-y--center {
   top: 50%;
@@ -29594,7 +29601,19 @@ places the element far left of the screen. so it is not visible.
   transform: translateY(-50%)
 }
 .fd-popover__popper .fd-popover__arrow-y--bottom {
-  bottom: .65rem
+  bottom: .625rem
+}
+.fd-popover__popper--compact .fd-popover__arrow-x--start {
+  left: .5rem
+}
+.fd-popover__popper--compact .fd-popover__arrow-x--end {
+  right: .5rem
+}
+.fd-popover__popper--compact .fd-popover__arrow-y--top {
+  top: .5rem
+}
+.fd-popover__popper--compact .fd-popover__arrow-y--bottom {
+  bottom: .5rem
 }
 .fd-popover__inline-help {
   padding: .75rem;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@fundamental-styles/theming-preview",
-    "version": "0.23.1-rc.0",
+    "version": "0.23.1-rc.3",
     "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.23.1-rc.0"
+        "fundamental-styles": "0.23.1-rc.3"
     }
   }