@dialpad/dialtone 9.44.0 → 9.45.0

package/dist/css/dialtone.css

@@ -736,7 +736,7 @@ template {
 .d-badge {
   --badge-color-text: var(--dt-badge-color-foreground-default);
   --badge-color-background: var(--dt-badge-color-background-default);
-  --badge-color-outline: var(--dt-color-border-subtle);
+  --badge-color-outline: var(--dt-badge-color-border-default);
   --badge-radius: var(--dt-size-300);
   --badge-line-height: calc(var(--dt-size-500) + var(--dt-size-200));
   --badge-font-size: var(--dt-font-size-100);
@@ -787,13 +787,9 @@ template {
   --badge-color-background: var(--dt-badge-color-background-bulletin);
 }
 .d-badge--bulletin.d-badge--subtle {
-  --badge-color-text: hsl(var(--primary-color-h) var(--primary-color-s) calc(var(--primary-color-l) - 40%));
-  --badge-color-background: hsla(var(--primary-color-hsl) / 0.1);
-  --badge-color-outline: hsla(var(--primary-color-hsl) / 0.5);
-}
-.dialtone-theme-dark .d-badge--bulletin.d-badge--subtle {
-  --badge-color-text: var(--dt-color-foreground-primary);
-  --badge-color-background: hsla(var(--primary-color-hsl) / 0.6);
+  --badge-color-text: var(--dt-badge-color-foreground-bulletin-subtle);
+  --badge-color-background: var(--dt-badge-color-background-bulletin-subtle);
+  --badge-color-outline: var(--dt-badge-color-border-bulletin-subtle);
 }
 .d-badge--ai {
   --badge-color-text: var(--dt-badge-color-foreground-bulletin);
@@ -1362,6 +1358,7 @@ template {
   align-items: center;
   justify-content: center;
   box-sizing: border-box;
+  max-width: var(--dt-size-100-percent);
   padding: var(--dt-space-300) var(--dt-space-400);
   color: var(--chip-color-text);
   font-size: var(--dt-font-size-200);
@@ -1370,10 +1367,9 @@ template {
   background-color: var(--chip-color-background);
   border: none;
   border-radius: var(--chip-border-radius);
-  transition-timing-function: var(--ttf-in-out);
+  transition-timing-function: var(--ttf-out-quint);
   transition-duration: var(--td200);
   transition-property: background-color;
-  max-width: var(--dt-size-100-percent);
 }
 .d-chip__label:not(:only-child)::after {
   flex-shrink: 0;
@@ -1392,14 +1388,14 @@ template {
 .d-chip__label:is(button):hover,
 .d-chip__label:is([role='button']):hover,
 .d-chip__label:is([role='link']):hover {
-  --chip-color-background: var(--dt-color-black-300);
+  --chip-color-background: var(--dt-color-surface-bold-opaque);
   text-decoration: none;
 }
 .d-chip__label:is(a):active,
 .d-chip__label:is(button):active,
 .d-chip__label:is([role='button']):active,
 .d-chip__label:is([role='link']):active {
-  --chip-color-background: var(--dt-color-black-400);
+  --chip-color-background: var(--dt-color-surface-moderate-opaque);
 }
 .d-chip__label:is(a):focus-visible,
 .d-chip__label:is(button):focus-visible,
@@ -7587,7 +7583,7 @@ body {
 }
 /**
  * Do not edit directly
- * Generated on Fri, 07 Jun 2024 22:29:04 GMT
+ * Generated on Tue, 11 Jun 2024 10:09:14 GMT
  */
 
 .dialtone-theme-light {
@@ -8369,9 +8365,13 @@ body {
   --dt-badge-color-background-warning: #FFF4CC;
   --dt-badge-color-background-critical: #FFE5E6;
   --dt-badge-color-background-bulletin: #7C52FF;
+  --dt-badge-color-background-bulletin-subtle: hsl(255 100% 66.1% / 0.1);
   --dt-badge-color-background-ai: linear-gradient(135deg, #F9008E 10%, #7C52FF 90%);
   --dt-badge-color-foreground-default: #000000;
   --dt-badge-color-foreground-bulletin: #ffffff;
+  --dt-badge-color-foreground-bulletin-subtle: hsl(255 100% 26.4%);
+  --dt-badge-color-border-default: hsl(0 0% 0% / 0.1);
+  --dt-badge-color-border-bulletin-subtle: hsl(255 100% 66.1% / 0.5);
   --dt-checkbox-size-width: 1.6rem;
   --dt-checkbox-size-height: 1.6rem;
   --dt-checkbox-size-radius: 0.4rem;
@@ -8404,7 +8404,7 @@ body {
 
 /**
  * Do not edit directly
- * Generated on Fri, 07 Jun 2024 22:29:05 GMT
+ * Generated on Tue, 11 Jun 2024 10:09:14 GMT
  */
 
 .dialtone-theme-dark {
@@ -9306,9 +9306,13 @@ body {
   --dt-badge-color-background-warning: #815008;
   --dt-badge-color-background-critical: #5B0505;
   --dt-badge-color-background-bulletin: #7C52FF;
+  --dt-badge-color-background-bulletin-subtle: hsl(261 100% 74.7% / 0.6);
   --dt-badge-color-background-ai: linear-gradient(135deg, #F9008E 10%, #7C52FF 90%);
   --dt-badge-color-foreground-default: #E6E6E6;
   --dt-badge-color-foreground-bulletin: #ffffff;
+  --dt-badge-color-foreground-bulletin-subtle: hsl(0 0% 90.2%);
+  --dt-badge-color-border-default: hsl(0 0% 100% / 0.14);
+  --dt-badge-color-border-bulletin-subtle: hsl(261 100% 74.7% / 0.6);
   --dt-checkbox-size-width: 1.6rem;
   --dt-checkbox-size-height: 1.6rem;
   --dt-checkbox-size-radius: 0.4rem;
@@ -10836,43 +10840,43 @@ body {
   --fco: 0% !important;
 }
 
-.d-bco-100, .h\:d-bco-100:hover, .f\:d-bco-100:focus, .f\:d-bco-100:focus-within, .fv\:d-bco-100:focus-visible {
+.d-bco100, .h\:d-bco100:hover, .f\:d-bco100:focus, .f\:d-bco100:focus-within, .fv\:d-bco100:focus-visible {
   --bco: 100% !important;
 }
 
-.d-bco-99, .h\:d-bco-99:hover, .f\:d-bco-99:focus, .f\:d-bco-99:focus-within, .fv\:d-bco-99:focus-visible {
+.d-bco99, .h\:d-bco99:hover, .f\:d-bco99:focus, .f\:d-bco99:focus-within, .fv\:d-bco99:focus-visible {
   --bco: 99% !important;
 }
 
-.d-bco-95, .h\:d-bco-95:hover, .f\:d-bco-95:focus, .f\:d-bco-95:focus-within, .fv\:d-bco-95:focus-visible {
+.d-bco95, .h\:d-bco95:hover, .f\:d-bco95:focus, .f\:d-bco95:focus-within, .fv\:d-bco95:focus-visible {
   --bco: 95% !important;
 }
 
-.d-bco-90, .h\:d-bco-90:hover, .f\:d-bco-90:focus, .f\:d-bco-90:focus-within, .fv\:d-bco-90:focus-visible {
+.d-bco90, .h\:d-bco90:hover, .f\:d-bco90:focus, .f\:d-bco90:focus-within, .fv\:d-bco90:focus-visible {
   --bco: 90% !important;
 }
 
-.d-bco-85, .h\:d-bco-85:hover, .f\:d-bco-85:focus, .f\:d-bco-85:focus-within, .fv\:d-bco-85:focus-visible {
+.d-bco85, .h\:d-bco85:hover, .f\:d-bco85:focus, .f\:d-bco85:focus-within, .fv\:d-bco85:focus-visible {
   --bco: 85% !important;
 }
 
-.d-bco-75, .h\:d-bco-75:hover, .f\:d-bco-75:focus, .f\:d-bco-75:focus-within, .fv\:d-bco-75:focus-visible {
+.d-bco75, .h\:d-bco75:hover, .f\:d-bco75:focus, .f\:d-bco75:focus-within, .fv\:d-bco75:focus-visible {
   --bco: 75% !important;
 }
 
-.d-bco-50, .h\:d-bco-50:hover, .f\:d-bco-50:focus, .f\:d-bco-50:focus-within, .fv\:d-bco-50:focus-visible {
+.d-bco50, .h\:d-bco50:hover, .f\:d-bco50:focus, .f\:d-bco50:focus-within, .fv\:d-bco50:focus-visible {
   --bco: 50% !important;
 }
 
-.d-bco-25, .h\:d-bco-25:hover, .f\:d-bco-25:focus, .f\:d-bco-25:focus-within, .fv\:d-bco-25:focus-visible {
+.d-bco25, .h\:d-bco25:hover, .f\:d-bco25:focus, .f\:d-bco25:focus-within, .fv\:d-bco25:focus-visible {
   --bco: 25% !important;
 }
 
-.d-bco-10, .h\:d-bco-10:hover, .f\:d-bco-10:focus, .f\:d-bco-10:focus-within, .fv\:d-bco-10:focus-visible {
+.d-bco10, .h\:d-bco10:hover, .f\:d-bco10:focus, .f\:d-bco10:focus-within, .fv\:d-bco10:focus-visible {
   --bco: 10% !important;
 }
 
-.d-bco-0, .h\:d-bco-0:hover, .f\:d-bco-0:focus, .f\:d-bco-0:focus-within, .fv\:d-bco-0:focus-visible {
+.d-bco0, .h\:d-bco0:hover, .f\:d-bco0:focus, .f\:d-bco0:focus-within, .fv\:d-bco0:focus-visible {
   --bco: 0% !important;
 }