@jobber/components 6.38.0 → 6.38.1

package/dist/styles.css

@@ -3718,29 +3718,40 @@ a._7BLGtYNuJOU-.zgRx3ehZ2z8-:hover {
 }
 
 .-lyJkOGbceo- {
-  --glimmer-background: rgba(var(--color-black--rgb) 5%);
+  --glimmer-background: var(--color-surface--reverse);
+  --glimmer-background-opacity: 7.5%;
+  --glimmer-shine-opacity: 75%;
   --glimmer-shine: rgba(var(--color-white--rgb), var(--glimmer-shine-opacity));
-  --glimmer-shine-opacity: 80%;
   --duration-base: calc(var(--timing-slowest) * 4); /* 2s */
   --duration-fast: calc(var(--duration-base) / 2); /* 1s */
-
+  position: relative;
   width: 100%;
   height: 100%;
   border-radius: 8px;
   border-radius: var(--radius-base);
-  background-color: rgba(0 0 0 5%);
-  background-color: rgba(0, 0, 0 5%);
+  overflow: hidden;
+}
+
+.-lyJkOGbceo-::before,
+.-lyJkOGbceo-::after {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+
+.-lyJkOGbceo-::before {
   background-color: var(--glimmer-background);
+  opacity: var(--glimmer-background-opacity);
+}
+
+.-lyJkOGbceo-::after {
   background-image: linear-gradient(
     90deg,
     transparent 0px,
-    rgba(255, 255, 255, 0.8) 32px,
-    transparent 64px
-  );
-  background-image: linear-gradient(
-    90deg,
-    transparent 0px,
-    rgba(255, 255, 255, 80%) 32px,
+    var(--glimmer-shine) 32px,
     transparent 64px
   );
   background-image: linear-gradient(
@@ -3754,21 +3765,20 @@ a._7BLGtYNuJOU-.zgRx3ehZ2z8-:hover {
   background-size: var(--space-extravagant) 100%;
   -webkit-animation: -lyJkOGbceo- 2s infinite linear;
           animation: -lyJkOGbceo- 2s infinite linear;
-}@supports (color: rgb(0 0 0 / 0.5)) and (color: hsl(0 0% 0% / 0.5)) {.-lyJkOGbceo- {
-  --glimmer-background: rgba(var(--color-black--rgb), 5%);
-}
 }
 
+[data-theme="dark"] .-lyJkOGbceo-,
 .NH-8hViLjFA- {
-  --glimmer-background: rgba(var(--color-white--rgb) 10%);
-  --glimmer-shine-opacity: 25%;
+  --glimmer-shine-opacity: 20%;
 }
 
-@supports (color: rgb(0 0 0 / 0.5)) and (color: hsl(0 0% 0% / 0.5)) {
-
 .NH-8hViLjFA- {
-  --glimmer-background: rgba(var(--color-white--rgb), 10%);
+  --glimmer-background: var(--color-surface);
 }
+
+[data-theme="dark"] .NH-8hViLjFA- {
+  --glimmer-shine-opacity: 75%;
+  --glimmer-background-opacity: 7.5%;
 }
 
 @-webkit-keyframes -lyJkOGbceo- {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components",
-  "version": "6.38.0",
+  "version": "6.38.1",
   "license": "MIT",
   "type": "module",
   "main": "dist/index.cjs",
@@ -534,5 +534,5 @@
     "> 1%",
     "IE 10"
   ],
-  "gitHead": "7b92ab57d6362f47efa5972e3c2ef76dd9c1160a"
+  "gitHead": "cd210ddc581fd9756b50a3d73b5c4432e1585546"
 }