@itwin/itwinui-css 1.0.0-dev.9 → 1.1.0

package/css/anchor.css

@@ -2,67 +2,4 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-.iui-anchor{
-  color:var(--iui-color-foreground-primary);
-  -webkit-tap-highlight-color:hsl(var(--iui-color-foreground-primary-hsl)/var(--iui-opacity-6));
-  border-radius:var(--iui-border-radius-1);
-  cursor:pointer;
-  text-decoration:none;
-}
-.iui-anchor:focus-visible{
-  outline:1px solid var(--iui-color-foreground-primary);
-  outline-offset:1px;
-}
-@supports not selector(*:focus-visible){
-  .iui-anchor:focus{
-    outline:1px solid var(--iui-color-foreground-primary);
-    outline-offset:1px;
-  }
-}
-.iui-anchor:hover{
-  color:var(--iui-color-foreground-primary-hover);
-}
-.iui-anchor:hover{
-  text-decoration:underline;
-}
-@media (prefers-contrast: more){
-  .iui-anchor{
-    text-decoration:underline;
-  }
-  .iui-anchor:hover{
-    text-decoration:none;
-  }
-}
-.iui-theme-light .iui-anchor, .iui-theme-dark .iui-anchor{
-  text-decoration:none;
-}
-.iui-theme-light .iui-anchor:hover, .iui-theme-dark .iui-anchor:hover{
-  text-decoration:underline;
-}
-
-.iui-theme-light-hc .iui-anchor, .iui-theme-dark-hc .iui-anchor{
-  text-decoration:underline;
-}
-.iui-theme-light-hc .iui-anchor:hover, .iui-theme-dark-hc .iui-anchor:hover{
-  text-decoration:none;
-}
-
-.iui-anchor-external{
-  --_iui-anchor-external-svg:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='m16 0v5.4l-1.9-2-8.4 8.4-1.5-1.5 8.3-8.4-1.9-1.9m5.4 16v-9h-1v8h-14v-14h8v-1h-9v16z' /></svg>");
-}
-.iui-anchor-external::after{
-  content:"";
-  display:inline-block;
-  width:1.5ch;
-  height:1.5ch;
-  margin-left:0.5ch;
-  vertical-align:-0.1ch;
-  background-color:currentColor;
-  -webkit-mask:var(--_iui-anchor-external-svg);
-          mask:var(--_iui-anchor-external-svg);
-}
-@media (forced-colors: active){
-  .iui-anchor-external::after{
-    background-color:LinkText;
-  }
-}
+.iui-anchor{color:var(--iui-color-text-accent);-webkit-tap-highlight-color:hsl(var(--iui-color-accent-hsl)/var(--iui-opacity-6));border-radius:var(--iui-border-radius-1);cursor:pointer;text-decoration:none}.iui-anchor:focus-visible{outline:1px solid var(--iui-color-text-accent);outline-offset:1px}@supports not selector(*:focus-visible){.iui-anchor:focus{outline:1px solid var(--iui-color-text-accent);outline-offset:1px}}.iui-anchor:hover{color:var(--iui-color-text-accent-hover);text-decoration:underline}@media (prefers-contrast:more){.iui-anchor{text-decoration:underline}.iui-anchor:hover{text-decoration:none}}[data-iui-contrast=high] .iui-anchor{text-decoration:underline}[data-iui-contrast=high] .iui-anchor:hover{text-decoration:none}.iui-anchor-external{--_iui-anchor-external-svg:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='m16 0v5.4l-1.9-2-8.4 8.4-1.5-1.5 8.3-8.4-1.9-1.9m5.4 16v-9h-1v8h-14v-14h8v-1h-9v16z' /></svg>")}.iui-anchor-external:after{content:"";width:1.5ch;height:1.5ch;vertical-align:-.1ch;-webkit-mask:var(--_iui-anchor-external-svg);mask:var(--_iui-anchor-external-svg);background-color:currentColor;margin-left:.5ch;display:inline-block}@media (forced-colors:active){.iui-anchor-external:after{background-color:LinkText}}

package/css/avatar.css

@@ -2,225 +2,4 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-.iui-avatar{
-  margin:0;
-  padding:0;
-  border:none;
-  vertical-align:baseline;
-  display:inline-flex;
-  align-items:center;
-  justify-content:center;
-  position:relative;
-  margin:0;
-  -webkit-user-select:none;
-     -moz-user-select:none;
-      -ms-user-select:none;
-          user-select:none;
-}
-.iui-avatar > .iui-stroke{
-  display:block;
-  position:absolute;
-  left:0;
-  top:0;
-  width:100%;
-  height:100%;
-  margin:0;
-  border-radius:50%;
-  box-shadow:inset 0 0 0 var(--iui-size-3xs) var(--iui-color-background-transparent-hover);
-}
-.iui-avatar > .iui-initials{
-  display:flex;
-  justify-content:center;
-  align-items:center;
-  position:absolute;
-  left:0;
-  top:0;
-  width:100%;
-  height:100%;
-  margin:0;
-  border-radius:50%;
-  font-style:normal;
-  font-weight:var(--iui-font-weight-semibold);
-  text-align:center;
-  text-decoration:none;
-  text-transform:uppercase;
-  background-color:#b1c856;
-  overflow:hidden;
-  color:var(--iui-color-foreground-accessory);
-}
-.iui-avatar > .iui-icon{
-  display:inline-flex;
-  width:50%;
-  height:50%;
-  position:absolute;
-  fill:var(--iui-color-foreground-accessory);
-}
-.iui-avatar > img{
-  display:block;
-  position:absolute;
-  -o-object-fit:cover;
-     object-fit:cover;
-  left:0;
-  top:0;
-  width:100%;
-  height:100%;
-  border-width:0;
-  border-radius:50%;
-  background-color:var(--iui-color-background-1);
-}
-.iui-avatar > .iui-status{
-  box-sizing:content-box;
-  display:flex;
-  align-items:center;
-  justify-content:center;
-  position:absolute;
-  right:calc(0px - var(--iui-size-3xs));
-  bottom:calc(0px - var(--iui-size-3xs));
-  width:25%;
-  height:25%;
-  border-radius:50%;
-  border:var(--iui-size-3xs) solid var(--iui-color-background-1);
-  background-color:var(--iui-color-background-5);
-}
-.iui-avatar > .iui-status::after{
-  content:"";
-  width:var(--_iui-avatar-status-size, var(--iui-size-xs));
-  height:var(--_iui-avatar-status-size, var(--iui-size-xs));
-}
-.iui-avatar > .iui-status.iui-online{
-  background-color:var(--iui-color-background-positive);
-}
-.iui-avatar > .iui-status.iui-online::after{
-  -webkit-mask:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M6,14L0,8l2-2l4,4l8-8l2,2L6,14z' /></svg>");
-          mask:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M6,14L0,8l2-2l4,4l8-8l2,2L6,14z' /></svg>");
-  background-color:var(--iui-color-foreground-accessory);
-}
-.iui-avatar > .iui-status.iui-away{
-  background-color:var(--iui-color-background-warning);
-}
-.iui-avatar > .iui-status.iui-away::after{
-  -webkit-mask:url("data:image/svg+xml,<svg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'><path d='m13.445 12.832-6.445-4.297v-7.535h2v6.465l5.555 3.703z' /></svg>");
-          mask:url("data:image/svg+xml,<svg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'><path d='m13.445 12.832-6.445-4.297v-7.535h2v6.465l5.555 3.703z' /></svg>");
-  background-color:var(--iui-color-foreground-accessory);
-}
-.iui-avatar > .iui-status.iui-busy{
-  background-color:var(--iui-color-background-negative);
-}
-.iui-avatar > .iui-status.iui-busy::after{
-  -webkit-mask:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><rect x='2' y='7' width='12' height='2'></rect></svg>");
-          mask:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><rect x='2' y='7' width='12' height='2'></rect></svg>");
-  background-color:var(--iui-color-foreground-accessory);
-}
-.iui-avatar > .iui-status.iui-offline{
-  background-color:var(--iui-color-background-1);
-  box-shadow:inset 0 0 0 1px var(--iui-color-foreground-3);
-}
-.iui-avatar > .iui-status.iui-offline::after{
-  -webkit-mask:url("data:image/svg+xml,<svg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'><path d='m12.5 2-4.5 4.5-4.5-4.5-1.5 1.5 4.5 4.5-4.5 4.5 1.5 1.5 4.5-4.5 4.5 4.5 1.5-1.5-4.5-4.5 4.5-4.5z' /></svg>");
-          mask:url("data:image/svg+xml,<svg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'><path d='m12.5 2-4.5 4.5-4.5-4.5-1.5 1.5 4.5 4.5-4.5 4.5 1.5 1.5 4.5-4.5 4.5 4.5 1.5-1.5-4.5-4.5 4.5-4.5z' /></svg>");
-  background-color:var(--iui-color-foreground-4);
-}
-.iui-avatar.iui-avatar-count > .iui-initials{
-  background-color:var(--iui-color-background-3);
-  color:var(--iui-color-foreground-4);
-}
-.iui-avatar.iui-avatar-count:focus{
-  outline:none;
-}
-.iui-avatar.iui-avatar-count:focus > .iui-stroke{
-  box-shadow:var(--iui-focus-box-shadow);
-}
-.iui-avatar.iui-avatar-count:focus-visible{
-  outline:none;
-}
-.iui-avatar.iui-avatar-count:focus:not(:focus-visible) > .iui-stroke{
-  box-shadow:inset 0 0 0 var(--iui-size-3xs) var(--iui-color-background-transparent-hover);
-}
-.iui-avatar.iui-avatar{
-  width:var(--iui-size-xl);
-  height:var(--iui-size-xl);
-  --_iui-avatar-status-size:calc(var(--iui-size-2xs) * 1.5);
-}
-.iui-avatar.iui-avatar > .iui-initials{
-  line-height:var(--iui-size-xl);
-  font-size:var(--iui-font-size-2);
-}
-.iui-avatar.iui-small{
-  width:calc(1.5 * var(--iui-size-m));
-  height:calc(1.5 * var(--iui-size-m));
-  --_iui-avatar-status-size:var(--iui-size-2xs);
-}
-.iui-avatar.iui-small > .iui-initials{
-  line-height:calc(1.5 * var(--iui-size-m));
-  font-size:var(--iui-font-size-0);
-}
-.iui-avatar.iui-large{
-  width:calc(3 * var(--iui-size-m));
-  height:calc(3 * var(--iui-size-m));
-  --_iui-avatar-status-size:var(--iui-size-xs);
-}
-.iui-avatar.iui-large > .iui-initials{
-  line-height:calc(3 * var(--iui-size-m));
-  font-size:var(--iui-font-size-3);
-}
-.iui-avatar.iui-x-large{
-  width:var(--iui-size-2xl);
-  height:var(--iui-size-2xl);
-  --_iui-avatar-status-size:var(--iui-size-s);
-}
-.iui-avatar.iui-x-large > .iui-initials{
-  line-height:var(--iui-size-2xl);
-  font-size:var(--iui-font-size-4);
-}
-
-.iui-avatar-list{
-  display:inline-flex;
-  flex-wrap:wrap;
-}
-.iui-avatar-list .iui-avatar:not(:first-child){
-  margin-left:var(--iui-size-2xs);
-}
-.iui-avatar-list .iui-avatar:not(:first-child).iui-small{
-  margin-left:var(--iui-size-3xs);
-}
-.iui-avatar-list .iui-avatar:not(:first-child).iui-large{
-  margin-left:var(--iui-size-xs);
-}
-.iui-avatar-list .iui-avatar:not(:first-child).iui-x-large{
-  margin-left:var(--iui-size-s);
-}
-.iui-avatar-list.iui-stacked .iui-avatar:not(:first-child){
-  margin-left:calc(0px - var(--iui-size-2xs));
-}
-.iui-avatar-list.iui-stacked .iui-avatar:not(:first-child) .iui-initials{
-  box-shadow:0 0 0 var(--iui-size-2xs) var(--iui-color-background-1);
-}
-.iui-avatar-list.iui-stacked .iui-avatar:not(:first-child).iui-small{
-  margin-left:calc(0px - var(--iui-size-3xs));
-}
-.iui-avatar-list.iui-stacked .iui-avatar:not(:first-child).iui-small .iui-initials{
-  box-shadow:0 0 0 var(--iui-size-3xs) var(--iui-color-background-1);
-}
-.iui-avatar-list.iui-stacked .iui-avatar:not(:first-child).iui-large{
-  margin-left:calc(0px - var(--iui-size-xs));
-}
-.iui-avatar-list.iui-stacked .iui-avatar:not(:first-child).iui-x-large{
-  margin-left:calc(0px - var(--iui-size-s));
-}
-@media (prefers-reduced-motion: no-preference){
-  .iui-avatar-list.iui-stacked.iui-animated .iui-avatar{
-    transition:margin-left var(--iui-duration-2) ease-out;
-  }
-}
-.iui-avatar-list.iui-stacked.iui-animated:hover .iui-avatar:not(:first-child){
-  margin-left:var(--iui-size-2xs);
-}
-.iui-avatar-list.iui-stacked.iui-animated:hover .iui-avatar:not(:first-child).iui-small{
-  margin-left:var(--iui-size-3xs);
-}
-.iui-avatar-list.iui-stacked.iui-animated:hover .iui-avatar:not(:first-child).iui-large{
-  margin-left:var(--iui-size-xs);
-}
-.iui-avatar-list.iui-stacked.iui-animated:hover .iui-avatar:not(:first-child).iui-x-large{
-  margin-left:var(--iui-size-s);
-}
+.iui-avatar{vertical-align:baseline;-webkit-user-select:none;user-select:none;width:var(--_iui-avatar-size);height:var(--_iui-avatar-size);--_iui-avatar-size:var(--iui-size-xl);--_iui-avatar-font-size:var(--iui-font-size-2);--_iui-avatar-status-size:calc(var(--iui-size-2xs)*1.5);border:none;justify-content:center;align-items:center;margin:0;padding:0;display:inline-flex;position:relative}.iui-avatar>.iui-stroke{width:100%;height:100%;box-shadow:inset 0 0 0 var(--iui-size-3xs)hsl(var(--iui-color-foreground-hsl)/var(--iui-opacity-5));border-radius:50%;margin:0;display:block;position:absolute;top:0;left:0}.iui-avatar>.iui-initials{width:100%;height:100%;font-style:normal;font-weight:var(--iui-font-weight-semibold);text-align:center;text-transform:uppercase;color:var(--iui-color-white);line-height:var(--_iui-avatar-size);font-size:var(--_iui-avatar-font-size);background-color:#b1c856;border-radius:50%;justify-content:center;align-items:center;margin:0;text-decoration:none;display:flex;position:absolute;top:0;left:0;overflow:hidden}.iui-avatar>.iui-icon{width:50%;height:50%;fill:var(--iui-color-white);display:inline-flex;position:absolute}.iui-avatar>img{object-fit:cover;width:100%;height:100%;background-color:var(--iui-color-background);border-width:0;border-radius:50%;display:block;position:absolute;top:0;left:0}.iui-avatar>.iui-status{box-sizing:content-box;right:calc(0px - var(--iui-size-3xs));bottom:calc(0px - var(--iui-size-3xs));width:25%;height:25%;border:var(--iui-size-3xs)solid var(--iui-color-background);background-color:var(--iui-color-border);border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute}.iui-avatar>.iui-status:after{content:"";width:var(--_iui-avatar-status-size,var(--iui-size-xs));height:var(--_iui-avatar-status-size,var(--iui-size-xs))}.iui-avatar>.iui-status.iui-online{background-color:var(--iui-color-background-positive)}.iui-avatar>.iui-status.iui-online:after{background-color:var(--iui-color-white);-webkit-mask:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M6,14L0,8l2-2l4,4l8-8l2,2L6,14z' /></svg>");mask:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M6,14L0,8l2-2l4,4l8-8l2,2L6,14z' /></svg>")}.iui-avatar>.iui-status.iui-away{background-color:var(--iui-color-background-warning)}.iui-avatar>.iui-status.iui-away:after{background-color:var(--iui-color-white);-webkit-mask:url("data:image/svg+xml,<svg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'><path d='m13.445 12.832-6.445-4.297v-7.535h2v6.465l5.555 3.703z' /></svg>");mask:url("data:image/svg+xml,<svg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'><path d='m13.445 12.832-6.445-4.297v-7.535h2v6.465l5.555 3.703z' /></svg>")}.iui-avatar>.iui-status.iui-busy{background-color:var(--iui-color-background-negative)}.iui-avatar>.iui-status.iui-busy:after{background-color:var(--iui-color-white);-webkit-mask:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><rect x='2' y='7' width='12' height='2'></rect></svg>");mask:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><rect x='2' y='7' width='12' height='2'></rect></svg>")}.iui-avatar>.iui-status.iui-offline{background-color:var(--iui-color-background);box-shadow:inset 0 0 0 1px var(--iui-color-text-muted)}.iui-avatar>.iui-status.iui-offline:after{background-color:var(--iui-color-icon-muted);-webkit-mask:url("data:image/svg+xml,<svg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'><path d='m12.5 2-4.5 4.5-4.5-4.5-1.5 1.5 4.5 4.5-4.5 4.5 1.5 1.5 4.5-4.5 4.5 4.5 1.5-1.5-4.5-4.5 4.5-4.5z' /></svg>");mask:url("data:image/svg+xml,<svg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'><path d='m12.5 2-4.5 4.5-4.5-4.5-1.5 1.5 4.5 4.5-4.5 4.5 1.5 1.5 4.5-4.5 4.5 4.5 1.5-1.5-4.5-4.5 4.5-4.5z' /></svg>")}.iui-avatar.iui-avatar-count>.iui-initials{background-color:var(--iui-color-background);color:var(--iui-color-text-muted)}.iui-avatar.iui-avatar-count>.iui-stroke{box-shadow:inset 0 0 0 var(--iui-size-3xs)var(--iui-color-border)}.iui-avatar.iui-avatar-count:focus{outline:none}.iui-avatar.iui-avatar-count:focus>.iui-stroke{box-shadow:var(--iui-focus-box-shadow)}.iui-avatar.iui-avatar-count:focus-visible{outline:none}.iui-avatar.iui-avatar-count:focus:not(:focus-visible)>.iui-stroke{box-shadow:inset 0 0 0 var(--iui-size-3xs)var(--iui-color-background-transparent-hover)}.iui-avatar:where(.iui-small){--_iui-avatar-size:calc(1.5*var(--iui-size-m));--_iui-avatar-font-size:var(--iui-font-size-0);--_iui-avatar-status-size:var(--iui-size-2xs)}.iui-avatar:where(.iui-large){--_iui-avatar-size:calc(3*var(--iui-size-m));--_iui-avatar-font-size:var(--iui-font-size-3);--_iui-avatar-status-size:var(--iui-size-xs)}.iui-avatar:where(.iui-x-large){--_iui-avatar-size:var(--iui-size-2xl);--_iui-avatar-font-size:var(--iui-font-size-4);--_iui-avatar-status-size:var(--iui-size-s)}.iui-avatar-list{flex-wrap:wrap;display:inline-flex}.iui-avatar-list .iui-avatar:not(:first-child){margin-left:var(--iui-size-2xs)}.iui-avatar-list .iui-avatar:not(:first-child).iui-small{margin-left:var(--iui-size-3xs)}.iui-avatar-list .iui-avatar:not(:first-child).iui-large{margin-left:var(--iui-size-xs)}.iui-avatar-list .iui-avatar:not(:first-child).iui-x-large{margin-left:var(--iui-size-s)}.iui-avatar-list.iui-stacked .iui-avatar:not(:first-child){margin-left:calc(0px - var(--iui-size-2xs))}.iui-avatar-list.iui-stacked .iui-avatar:not(:first-child) .iui-initials{box-shadow:0 0 0 var(--iui-size-2xs)var(--iui-color-background)}.iui-avatar-list.iui-stacked .iui-avatar:not(:first-child).iui-small{margin-left:calc(0px - var(--iui-size-3xs))}.iui-avatar-list.iui-stacked .iui-avatar:not(:first-child).iui-small .iui-initials{box-shadow:0 0 0 var(--iui-size-3xs)var(--iui-color-background)}.iui-avatar-list.iui-stacked .iui-avatar:not(:first-child).iui-large{margin-left:calc(0px - var(--iui-size-xs))}.iui-avatar-list.iui-stacked .iui-avatar:not(:first-child).iui-x-large{margin-left:calc(0px - var(--iui-size-s))}@media (prefers-reduced-motion:no-preference){.iui-avatar-list.iui-stacked.iui-animated .iui-avatar{transition:margin-left var(--iui-duration-2)ease-out}}.iui-avatar-list.iui-stacked.iui-animated:hover .iui-avatar:not(:first-child){margin-left:var(--iui-size-2xs)}.iui-avatar-list.iui-stacked.iui-animated:hover .iui-avatar:not(:first-child).iui-small{margin-left:var(--iui-size-3xs)}.iui-avatar-list.iui-stacked.iui-animated:hover .iui-avatar:not(:first-child).iui-large{margin-left:var(--iui-size-xs)}.iui-avatar-list.iui-stacked.iui-animated:hover .iui-avatar:not(:first-child).iui-x-large{margin-left:var(--iui-size-s)}

package/css/backdrop.css

@@ -2,25 +2,4 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-.iui-backdrop{
-  z-index:998;
-  isolation:isolate;
-  position:absolute;
-  top:0;
-  left:0;
-  width:100%;
-  height:100%;
-  background-color:rgba(0, 0, 0, var(--iui-opacity-4));
-  transition:visibility var(--iui-duration-0) linear, opacity var(--iui-duration-1) ease-out;
-  transition-delay:var(--iui-duration-1), var(--iui-duration-0);
-}
-.iui-backdrop:not(.iui-backdrop-visible){
-  visibility:hidden;
-  opacity:0;
-}
-.iui-backdrop.iui-backdrop-visible{
-  transition-delay:var(--iui-duration-0);
-}
-.iui-backdrop.iui-backdrop-fixed{
-  position:fixed;
-}
+.iui-backdrop{z-index:998;isolation:isolate;width:100%;height:100%;background-color:rgba(0,0,0,var(--iui-opacity-4));transition:visibility var(--iui-duration-0)linear,opacity var(--iui-duration-1)ease-out;transition-delay:var(--iui-duration-1),var(--iui-duration-0);position:absolute;top:0;left:0}.iui-backdrop:not(.iui-backdrop-visible){visibility:hidden;opacity:0}.iui-backdrop.iui-backdrop-visible{transition-delay:var(--iui-duration-0)}.iui-backdrop.iui-backdrop-fixed{position:fixed}

package/css/badge.css

@@ -2,28 +2,4 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-.iui-badge{
-  --iui-badge-background-color:hsl(210, 10%, 80%);
-  --_iui-badge-text-color:hsl(0 0% 0% / 0.6);
-  margin:0;
-  padding:0;
-  border:none;
-  vertical-align:baseline;
-  display:inline-block;
-  font-size:var(--iui-font-size-0);
-  padding:0 calc(var(--iui-size-2xs) * 1.5);
-  margin:calc(var(--iui-size-s) * 0.5) 0;
-  border-radius:var(--iui-border-radius-1);
-  background-color:var(--iui-badge-background-color);
-  color:var(--_iui-badge-text-color);
-  text-transform:uppercase;
-  -webkit-user-select:none;
-     -moz-user-select:none;
-      -ms-user-select:none;
-          user-select:none;
-  max-width:calc(20ch + var(--iui-size-2xs) * 1.5 * 2);
-  white-space:nowrap;
-  overflow:hidden;
-  text-overflow:ellipsis;
-  font-weight:var(--iui-font-weight-semibold);
-}
+.iui-badge{--iui-badge-background-color:#c7ccd1;--_iui-badge-text-color:#0009;vertical-align:baseline;font-size:var(--iui-font-size-0);padding:0;padding:0 calc(var(--iui-size-2xs)*1.5);margin:0;margin:calc(var(--iui-size-s)*.5)0;border-radius:var(--iui-border-radius-1);background-color:var(--iui-badge-background-color);color:var(--_iui-badge-text-color);text-transform:uppercase;-webkit-user-select:none;user-select:none;max-width:calc(20ch + var(--iui-size-2xs)*1.5*2);white-space:nowrap;text-overflow:ellipsis;font-weight:var(--iui-font-weight-semibold);border:none;display:inline-block;overflow:hidden}

package/css/blockquote.css

@@ -2,25 +2,4 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-.iui-blockquote{
-  margin:0;
-  padding:0;
-  border:none;
-  vertical-align:baseline;
-  display:block;
-  position:relative;
-  padding:var(--iui-size-s) var(--iui-size-m);
-  margin:var(--iui-size-s) 0;
-  text-align:justify;
-  box-shadow:var(--iui-shadow-1);
-  border-radius:var(--iui-border-radius-1);
-  background-color:var(--iui-color-background-1);
-  border-left:var(--iui-size-xs) solid var(--iui-color-foreground-primary);
-}
-.iui-blockquote > footer{
-  text-align:right;
-  color:var(--iui-color-foreground-4);
-}
-.iui-blockquote > footer > cite{
-  font-style:normal;
-}
+.iui-blockquote{vertical-align:baseline;--iui-surface-background-color:var(--iui-color-background);--iui-surface-border-color:var(--iui-color-border-subtle);--iui-surface-border-radius:var(--iui-border-radius-1);--iui-surface-elevation:var(--iui-shadow-1);background-color:var(--iui-surface-background-color);border:none;border:1px solid var(--iui-surface-border-color);border-radius:var(--iui-surface-border-radius);box-shadow:var(--iui-surface-elevation);color:var(--iui-color-text);padding:0;padding:var(--iui-size-s)var(--iui-size-m);margin:0;margin:var(--iui-size-s)0;text-align:justify;border-left:var(--iui-size-xs)solid var(--iui-color-border);display:block;position:relative}.iui-blockquote>footer{text-align:right;color:var(--iui-color-text-muted)}.iui-blockquote>footer>cite{font-style:normal}