@vanduo-oss/framework 1.4.2 → 1.4.3

package/dist/vanduo.css

@@ -1,4 +1,4 @@
-/*! Vanduo v1.4.2 | Built: 2026-05-23T19:59:36.731Z | git:adbe750 | development */
+/*! Vanduo v1.4.3 | Built: 2026-05-28T13:14:25.371Z | git:02ef7f6 | development */
 *, :before, :after {
   box-sizing: border-box;
 }
@@ -64179,695 +64179,6 @@ input.vd-doc-search-input {
   border-radius: var(--vd-spotlight-target-radius) !important;
 }
 
-:root {
-  --vd-music-player-padding-x: 1.3125rem;
-  --vd-music-player-padding-y: .8125rem;
-  --vd-music-player-padding-x-sm: .8125rem;
-  --vd-music-player-padding-y-sm: .5rem;
-  --vd-music-player-padding-x-lg: 2.125rem;
-  --vd-music-player-padding-y-lg: 1.3125rem;
-  --vd-music-player-gap: .8125rem;
-  --vd-music-player-btn-size: 2.125rem;
-  --vd-music-player-btn-size-sm: 1.625rem;
-  --vd-music-player-btn-size-lg: 2.625rem;
-  --vd-music-player-icon-size: 1.125rem;
-  --vd-music-player-volume-width: clamp(3.25rem, 16vw, 4.5rem);
-  --vd-music-player-volume-width-sm: 3rem;
-  --vd-music-player-volume-width-lg: 5.5rem;
-  --vd-music-player-border-radius: var(--vd-border-radius, .5rem);
-  --vd-music-player-border-width: 1px;
-  --vd-music-player-bg: var(--vd-bg-primary);
-  --vd-music-player-bg-secondary: var(--vd-bg-secondary);
-  --vd-music-player-border: var(--vd-border-color);
-  --vd-music-player-text: var(--vd-text-primary);
-  --vd-music-player-text-muted: var(--vd-text-muted);
-  --vd-music-player-accent: var(--vd-color-primary);
-  --vd-music-player-btn-hover-bg: var(--vd-bg-secondary);
-  --vd-music-player-btn-active-bg: var(--vd-color-primary-alpha-10, rgba(var(--vd-color-primary-rgb, 59,130,246), .1));
-  --vd-music-player-track-bg: var(--vd-border-color);
-  --vd-music-player-track-fill: var(--vd-color-primary);
-  --vd-music-player-playlist-hover: var(--vd-bg-secondary);
-  --vd-music-player-playlist-active-bg: var(--vd-color-primary-alpha-10, rgba(var(--vd-color-primary-rgb, 59,130,246), .1));
-  --vd-music-player-playlist-active-text: var(--vd-color-primary);
-  --vd-music-player-transition: .15s ease;
-  --vd-music-player-glass-bg: var(--vd-glass-bg-light, #ffffffb8);
-  --vd-music-player-glass-border: var(--vd-glass-border-light, #ffffff80);
-  --vd-music-player-glass-shadow: var(--vd-glass-shadow, 0 4px 24px #0000001f);
-  --vd-music-player-floating-shadow: 0 12px 40px #0000002e;
-  --vd-music-player-floating-z: 10050;
-  --vd-music-player-floating-offset: 1rem;
-  --vd-music-player-toolbar-gap: .375rem;
-  --vd-music-player-handle-size: 1.5rem;
-}
-
-[data-theme="dark"] {
-  --vd-music-player-bg: var(--vd-bg-primary);
-  --vd-music-player-bg-secondary: var(--vd-color-gray-800);
-  --vd-music-player-btn-hover-bg: var(--vd-color-gray-700);
-  --vd-music-player-playlist-hover: var(--vd-color-gray-700);
-  --vd-music-player-glass-bg: var(--vd-glass-bg-dark, #1e1e28b8);
-  --vd-music-player-glass-border: var(--vd-glass-border-dark, #ffffff24);
-}
-
-@media (prefers-color-scheme: dark) {
-  :root:not([data-theme]) {
-    --vd-music-player-bg: var(--vd-bg-primary);
-    --vd-music-player-bg-secondary: var(--vd-color-gray-800);
-    --vd-music-player-btn-hover-bg: var(--vd-color-gray-700);
-    --vd-music-player-playlist-hover: var(--vd-color-gray-700);
-    --vd-music-player-glass-bg: var(--vd-glass-bg-dark, #1e1e28b8);
-    --vd-music-player-glass-border: var(--vd-glass-border-dark, #ffffff24);
-  }
-}
-
-.vd-music-player {
-  background-color: var(--vd-music-player-bg);
-  border: var(--vd-music-player-border-width) solid var(--vd-music-player-border);
-  border-radius: var(--vd-music-player-border-radius);
-  padding: var(--vd-music-player-padding-y) var(--vd-music-player-padding-x);
-  box-sizing: border-box;
-  flex-direction: column;
-  gap: 0;
-  width: 100%;
-  min-width: 16rem;
-  max-width: 28rem;
-  display: flex;
-}
-
-.vd-music-player-info {
-  align-items: center;
-  gap: .625rem;
-  min-height: 1.5rem;
-  margin-bottom: .625rem;
-  display: flex;
-}
-
-.vd-music-player-icon {
-  color: var(--vd-music-player-accent);
-  flex-shrink: 0;
-  justify-content: center;
-  align-items: center;
-  width: 1rem;
-  height: 1rem;
-  display: flex;
-}
-
-.vd-music-player-track-name {
-  font-size: var(--vd-font-size-sm, .875rem);
-  color: var(--vd-music-player-text);
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  flex: 1;
-  min-width: 0;
-  overflow: hidden;
-}
-
-.vd-music-player-track-name.is-idle {
-  color: var(--vd-music-player-text-muted);
-  font-style: italic;
-}
-
-.vd-music-player-controls {
-  flex-wrap: wrap;
-  align-items: center;
-  gap: .375rem;
-  display: flex;
-}
-
-.vd-music-player-btn {
-  width: var(--vd-music-player-btn-size);
-  height: var(--vd-music-player-btn-size);
-  border-radius: var(--vd-music-player-border-radius);
-  color: var(--vd-music-player-text);
-  cursor: pointer;
-  transition: background-color var(--vd-music-player-transition),
-    color var(--vd-music-player-transition);
-  background: none;
-  border: none;
-  flex-shrink: 0;
-  justify-content: center;
-  align-items: center;
-  padding: 0;
-  display: inline-flex;
-}
-
-.vd-music-player-btn:hover:not(:disabled) {
-  background-color: var(--vd-music-player-btn-hover-bg);
-  color: var(--vd-music-player-accent);
-}
-
-.vd-music-player-btn:focus-visible {
-  outline: 2px solid var(--vd-music-player-accent);
-  outline-offset: 1px;
-}
-
-.vd-music-player-btn:disabled {
-  opacity: .38;
-  cursor: not-allowed;
-}
-
-.vd-music-player-btn.is-active {
-  color: var(--vd-music-player-accent);
-  background-color: var(--vd-music-player-btn-active-bg);
-}
-
-.vd-music-player-btn-play {
-  width: calc(var(--vd-music-player-btn-size) + .25rem);
-  height: calc(var(--vd-music-player-btn-size) + .25rem);
-}
-
-.vd-music-player-btn svg, .vd-music-player-btn i {
-  width: var(--vd-music-player-icon-size);
-  height: var(--vd-music-player-icon-size);
-  font-size: var(--vd-music-player-icon-size);
-  pointer-events: none;
-}
-
-.vd-music-player-spacer {
-  flex: 1.5rem;
-  min-width: 0;
-}
-
-.vd-music-player-volume {
-  flex: 0 auto;
-  align-items: center;
-  gap: .3125rem;
-  min-width: 0;
-  max-width: 100%;
-  display: flex;
-}
-
-.vd-music-player-volume-icon {
-  color: var(--vd-music-player-text-muted);
-  flex-shrink: 0;
-  align-items: center;
-  width: 1rem;
-  height: 1rem;
-  font-size: 1rem;
-  display: flex;
-}
-
-.vd-music-player-volume-slider {
-  -webkit-appearance: none;
-  appearance: none;
-  width: var(--vd-music-player-volume-width);
-  background: var(--vd-music-player-track-bg);
-  cursor: pointer;
-  flex: 0 1 var(--vd-music-player-volume-width);
-  border-radius: 9999px;
-  outline: none;
-  min-width: 3.25rem;
-  max-width: 100%;
-  height: 4px;
-}
-
-.vd-music-player-volume-slider:focus-visible {
-  outline: 2px solid var(--vd-music-player-accent);
-  outline-offset: 2px;
-}
-
-.vd-music-player-volume-slider::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  appearance: none;
-  background: var(--vd-music-player-accent);
-  cursor: pointer;
-  width: .75rem;
-  height: .75rem;
-  transition: transform var(--vd-music-player-transition);
-  border-radius: 50%;
-}
-
-.vd-music-player-volume-slider::-webkit-slider-thumb:hover {
-  transform: scale(1.2);
-}
-
-.vd-music-player-volume-slider::-moz-range-thumb {
-  background: var(--vd-music-player-accent);
-  cursor: pointer;
-  width: .75rem;
-  height: .75rem;
-  transition: transform var(--vd-music-player-transition);
-  border: none;
-  border-radius: 50%;
-}
-
-.vd-music-player-volume-slider::-moz-range-thumb:hover {
-  transform: scale(1.2);
-}
-
-.vd-music-player-volume-slider::-moz-range-progress {
-  background: var(--vd-music-player-track-fill);
-  border-radius: 9999px;
-}
-
-.vd-music-player-progress {
-  align-items: center;
-  gap: .5rem;
-  margin-top: .625rem;
-  display: none;
-}
-
-.vd-music-player.has-progress .vd-music-player-progress {
-  display: flex;
-}
-
-.vd-music-player-progress-bar {
-  -webkit-appearance: none;
-  appearance: none;
-  background: var(--vd-music-player-track-bg);
-  cursor: pointer;
-  border-radius: 9999px;
-  outline: none;
-  flex: 1;
-  height: 4px;
-}
-
-.vd-music-player-progress-bar:focus-visible {
-  outline: 2px solid var(--vd-music-player-accent);
-  outline-offset: 2px;
-}
-
-.vd-music-player-progress-bar::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  appearance: none;
-  background: var(--vd-music-player-accent);
-  cursor: pointer;
-  width: .75rem;
-  height: .75rem;
-  transition: transform var(--vd-music-player-transition);
-  border-radius: 50%;
-}
-
-.vd-music-player-progress-bar::-webkit-slider-thumb:hover {
-  transform: scale(1.2);
-}
-
-.vd-music-player-progress-bar::-moz-range-thumb {
-  background: var(--vd-music-player-accent);
-  cursor: pointer;
-  width: .75rem;
-  height: .75rem;
-  transition: transform var(--vd-music-player-transition);
-  border: none;
-  border-radius: 50%;
-}
-
-.vd-music-player-progress-bar::-moz-range-progress {
-  background: var(--vd-music-player-track-fill);
-  border-radius: 9999px;
-}
-
-.vd-music-player-time {
-  color: var(--vd-music-player-text-muted);
-  white-space: nowrap;
-  font-variant-numeric: tabular-nums;
-  text-align: right;
-  flex-shrink: 0;
-  min-width: 2.5rem;
-  font-size: .6875rem;
-}
-
-.vd-music-player-time:first-child {
-  text-align: left;
-}
-
-.vd-music-player-playlist {
-  border-top: var(--vd-music-player-border-width) solid var(--vd-music-player-border);
-  scrollbar-width: thin;
-  flex-direction: column;
-  max-height: 12rem;
-  margin-top: .625rem;
-  padding-top: .5rem;
-  display: none;
-  overflow-y: auto;
-}
-
-.vd-music-player.has-playlist .vd-music-player-playlist.is-open {
-  display: flex;
-}
-
-.vd-music-player-playlist-item {
-  border-radius: calc(var(--vd-music-player-border-radius) * .5);
-  cursor: pointer;
-  font-size: var(--vd-font-size-sm, .875rem);
-  color: var(--vd-music-player-text);
-  text-align: left;
-  width: 100%;
-  transition: background-color var(--vd-music-player-transition),
-    color var(--vd-music-player-transition);
-  background: none;
-  border: none;
-  align-items: center;
-  gap: .5rem;
-  padding: .375rem .5rem;
-  display: flex;
-}
-
-.vd-music-player-playlist-item:hover {
-  background-color: var(--vd-music-player-playlist-hover);
-}
-
-.vd-music-player-playlist-item:focus-visible {
-  outline: 2px solid var(--vd-music-player-accent);
-  outline-offset: 1px;
-}
-
-.vd-music-player-playlist-item.is-active {
-  background-color: var(--vd-music-player-playlist-active-bg);
-  color: var(--vd-music-player-playlist-active-text);
-  font-weight: var(--vd-font-weight-medium, 500);
-}
-
-.vd-music-player-playlist-num {
-  width: 1.25rem;
-  color: var(--vd-music-player-text-muted);
-  text-align: right;
-  font-variant-numeric: tabular-nums;
-  flex-shrink: 0;
-  font-size: .6875rem;
-}
-
-.vd-music-player-playlist-item.is-active .vd-music-player-playlist-num {
-  color: var(--vd-music-player-accent);
-}
-
-.vd-music-player-playlist-name {
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  flex: 1;
-  min-width: 0;
-  overflow: hidden;
-}
-
-.vd-music-player-compact {
-  flex-direction: row;
-  align-items: center;
-  gap: .5rem;
-  width: auto;
-  min-width: auto;
-  max-width: none;
-  padding: .5rem .8125rem;
-}
-
-.vd-music-player-compact .vd-music-player-info {
-  display: none;
-}
-
-.vd-music-player-compact .vd-music-player-controls {
-  gap: .125rem;
-}
-
-.vd-music-player-inline {
-  padding: .625rem var(--vd-music-player-padding-x);
-  flex-flow: wrap;
-  align-items: center;
-  gap: .625rem;
-  min-width: 0;
-  max-width: none;
-}
-
-.vd-music-player-inline .vd-music-player-info {
-  flex: 1;
-  min-width: 8rem;
-  margin-bottom: 0;
-}
-
-.vd-music-player-inline .vd-music-player-controls {
-  flex: auto;
-  justify-content: flex-end;
-  min-width: 0;
-}
-
-.vd-music-player-inline .vd-music-player-volume {
-  flex: 0 auto;
-}
-
-.vd-music-player-inline .vd-music-player-volume-slider {
-  flex-basis: clamp(4rem, 18vw, 5.5rem);
-  width: clamp(4rem, 18vw, 5.5rem);
-}
-
-.vd-music-player-inline .vd-music-player-progress {
-  flex-basis: 100%;
-  margin-top: .375rem;
-}
-
-.vd-music-player-sm {
-  padding: var(--vd-music-player-padding-y-sm) var(--vd-music-player-padding-x-sm);
-  font-size: var(--vd-font-size-sm, .875rem);
-}
-
-.vd-music-player-sm .vd-music-player-btn {
-  width: var(--vd-music-player-btn-size-sm);
-  height: var(--vd-music-player-btn-size-sm);
-}
-
-.vd-music-player-sm .vd-music-player-btn-play {
-  width: calc(var(--vd-music-player-btn-size-sm) + .125rem);
-  height: calc(var(--vd-music-player-btn-size-sm) + .125rem);
-}
-
-.vd-music-player-sm .vd-music-player-btn svg, .vd-music-player-sm .vd-music-player-btn i {
-  width: .9375rem;
-  height: .9375rem;
-  font-size: .9375rem;
-}
-
-.vd-music-player-sm .vd-music-player-volume-slider {
-  width: var(--vd-music-player-volume-width-sm);
-  min-width: var(--vd-music-player-volume-width-sm);
-  flex-basis: var(--vd-music-player-volume-width-sm);
-}
-
-.vd-music-player-lg {
-  padding: var(--vd-music-player-padding-y-lg) var(--vd-music-player-padding-x-lg);
-}
-
-.vd-music-player-lg .vd-music-player-btn {
-  width: var(--vd-music-player-btn-size-lg);
-  height: var(--vd-music-player-btn-size-lg);
-}
-
-.vd-music-player-lg .vd-music-player-btn-play {
-  width: calc(var(--vd-music-player-btn-size-lg) + .25rem);
-  height: calc(var(--vd-music-player-btn-size-lg) + .25rem);
-}
-
-.vd-music-player-lg .vd-music-player-btn svg, .vd-music-player-lg .vd-music-player-btn i {
-  width: 1.25rem;
-  height: 1.25rem;
-  font-size: 1.25rem;
-}
-
-.vd-music-player-lg .vd-music-player-volume-slider {
-  width: var(--vd-music-player-volume-width-lg);
-  flex-basis: var(--vd-music-player-volume-width-lg);
-  min-width: 4rem;
-}
-
-.vd-music-player-neutral {
-  --vd-music-player-accent: var(--vd-text-primary);
-  --vd-music-player-track-fill: var(--vd-text-primary);
-  --vd-music-player-playlist-active-text: var(--vd-text-primary);
-  --vd-music-player-playlist-active-bg: var(--vd-bg-secondary);
-  --vd-music-player-btn-active-bg: var(--vd-bg-secondary);
-}
-
-.vd-music-player-glass {
-  background: var(--vd-music-player-glass-bg);
-  border-color: var(--vd-music-player-glass-border);
-  box-shadow: var(--vd-music-player-glass-shadow);
-  -webkit-backdrop-filter: blur(var(--vd-glass-blur, 12px)) saturate(var(--vd-glass-saturate, 1.8));
-  isolation: isolate;
-  position: relative;
-  overflow: hidden;
-}
-
-.vd-music-player-glass:before {
-  content: "";
-  background: linear-gradient(to bottom,
-    rgba(255, 255, 255, var(--vd-glass-highlight-alpha, .12)) 0%,
-    #fff0 45%);
-  pointer-events: none;
-  z-index: 0;
-  border-radius: inherit;
-  position: absolute;
-  inset: 0;
-}
-
-.vd-music-player-glass:after {
-  content: "";
-  opacity: var(--vd-glass-noise-opacity, .12);
-  pointer-events: none;
-  z-index: 0;
-  border-radius: inherit;
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.15' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url('components/%23n')' opacity='0.25'/%3E%3C/svg%3E");
-  position: absolute;
-  inset: 0;
-}
-
-.vd-music-player-glass > * {
-  z-index: 1;
-  position: relative;
-}
-
-@supports not (backdrop-filter: blur(1px)) {
-  .vd-music-player-glass {
-    background: var(--vd-music-player-bg);
-  }
-
-  .vd-music-player-glass:before, .vd-music-player-glass:after {
-    display: none;
-  }
-}
-
-.vd-music-player.vd-music-player-floating {
-  z-index: var(--vd-music-player-floating-z);
-  max-width: min(28rem, calc(100vw - 2 * var(--vd-music-player-floating-offset)));
-  width: min(28rem, calc(100vw - 2 * var(--vd-music-player-floating-offset)));
-  box-shadow: var(--vd-music-player-floating-shadow);
-  transition: box-shadow var(--vd-music-player-transition),
-    transform var(--vd-music-player-transition);
-  margin: 0;
-  position: fixed;
-}
-
-.vd-music-player-floating.vd-music-player-floating-bottom-left, .vd-music-player-floating.vd-music-player-floating-bottom-right {
-  bottom: var(--vd-music-player-floating-offset);
-  top: auto;
-}
-
-.vd-music-player-floating.vd-music-player-floating-bottom-left {
-  left: var(--vd-music-player-floating-offset);
-  right: auto;
-}
-
-.vd-music-player-floating.vd-music-player-floating-bottom-right {
-  right: var(--vd-music-player-floating-offset);
-  left: auto;
-}
-
-.vd-music-player-floating:hover {
-  box-shadow: var(--vd-glass-float-shadow, 0 14px 42px #0003);
-}
-
-.vd-music-player-floating.is-position-custom {
-  top: var(--vd-music-player-floating-top, 1rem) !important;
-  left: var(--vd-music-player-floating-left, 1rem) !important;
-  bottom: auto !important;
-  right: auto !important;
-}
-
-.vd-music-player-toolbar {
-  align-items: center;
-  gap: var(--vd-music-player-toolbar-gap);
-  min-height: var(--vd-music-player-handle-size);
-  z-index: 2;
-  margin: -.25rem -.25rem .5rem;
-  display: flex;
-  position: relative;
-}
-
-.vd-music-player-drag-handle {
-  width: 2.25rem;
-  height: var(--vd-music-player-handle-size);
-  border-radius: var(--vd-music-player-border-radius);
-  color: var(--vd-music-player-text-muted);
-  cursor: grab;
-  touch-action: none;
-  background: none;
-  border: none;
-  flex-shrink: 0;
-  justify-content: center;
-  align-items: center;
-  padding: 0;
-  display: none;
-}
-
-.vd-music-player-drag-handle:active {
-  cursor: grabbing;
-}
-
-.vd-music-player-drag-handle .ph {
-  pointer-events: none;
-  font-size: 1.125rem;
-}
-
-.vd-music-player-detached.vd-music-player-draggable .vd-music-player-drag-handle {
-  display: inline-flex;
-}
-
-.vd-music-player-toolbar-spacer {
-  flex: auto;
-  min-width: .5rem;
-}
-
-.vd-music-player-btn-attach, .vd-music-player-btn-detach, .vd-music-player-btn-minimize {
-  flex-shrink: 0;
-}
-
-.vd-music-player.vd-music-player-detached .vd-music-player-btn-detach, .vd-music-player .vd-music-player-btn-attach {
-  display: none;
-}
-
-.vd-music-player.vd-music-player-detached .vd-music-player-btn-attach {
-  display: inline-flex;
-}
-
-.vd-music-player-minimized .vd-music-player-info, .vd-music-player-minimized .vd-music-player-progress, .vd-music-player-minimized .vd-music-player-playlist {
-  display: none !important;
-}
-
-.vd-music-player-minimized .vd-music-player-btn-shuffle, .vd-music-player-minimized .vd-music-player-btn-playlist {
-  display: none;
-}
-
-.vd-music-player-minimized {
-  min-width: auto;
-  max-width: min(22rem, 100vw);
-}
-
-@media (prefers-reduced-transparency: reduce) {
-  .vd-music-player-glass {
-    -webkit-backdrop-filter: none;
-    background: var(--vd-music-player-bg);
-    border-color: var(--vd-music-player-border);
-  }
-
-  .vd-music-player-glass:before, .vd-music-player-glass:after {
-    display: none;
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .vd-music-player-btn, .vd-music-player-volume-slider::-webkit-slider-thumb, .vd-music-player-volume-slider::-moz-range-thumb, .vd-music-player-progress-bar::-webkit-slider-thumb, .vd-music-player-progress-bar::-moz-range-thumb, .vd-music-player-playlist-item, .vd-music-player-floating {
-    transition: none;
-  }
-
-  .vd-music-player-floating:hover {
-    box-shadow: var(--vd-music-player-floating-shadow);
-  }
-}
-
-@media (width <= 640px) {
-  .vd-music-player {
-    min-width: 0;
-    max-width: none;
-  }
-
-  .vd-music-player-controls {
-    row-gap: .5rem;
-  }
-
-  .vd-music-player-spacer {
-    display: none;
-  }
-
-  .vd-music-player-volume {
-    margin-left: auto;
-  }
-}
-
 :root {
   --vd-parallax-speed-slow: .5;
   --vd-parallax-speed-medium: 1;