@apliteni/apliteni-ui 0.58.1 → 0.58.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apliteni/apliteni-ui",
-  "version": "0.58.1",
+  "version": "0.58.2",
   "workspaces": [
     "react"
   ],

package/src/styles/dropdown.css

@@ -164,7 +164,7 @@
 .ui-dropdown__tick { margin-left: auto; flex: none; display: none; color: var(--accent); }
 .ui-dropdown__tick svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 2.4; }
 .ui-dropdown__item.is-selected .ui-dropdown__tick { display: inline-flex; } /* motion: still — a mark inside a row whose highlight already transitions; picking it closes the panel, which fades out over --dur-med */
-.ui-dropdown__item.is-selected .ui-dropdown__label { color: var(--accent); }
+.ui-dropdown__item.is-selected .ui-dropdown__label { color: var(--text); }
 
 /* When a row has both a badge and a tick, keep the badge from eating the margin */
 .ui-dropdown__badge + .ui-dropdown__tick { margin-left: 8px; }
@@ -174,20 +174,17 @@
   /* rank: chip */
   font-size: var(--text-xs);
   font-weight: var(--weight-semibold);
-  padding: 2px 7px;
+  padding: 3px 9px;
   border-radius: var(--radius-pill);
   margin-left: auto;
   flex: none;
   color: var(--text);
-  /* A chip is the top step. why: docs/specification.md#elevation */
-  background: var(--surface); /* ring-gap: inherit — decorative or text-only surface has no nested focus target. */
+  background: color-mix(in srgb, var(--muted) 12%, transparent); /* ring-gap: inherit — decorative or text-only surface has no nested focus target. */
 }
 .ui-dropdown__badge.is-live { color: var(--chip-success-ink); background: var(--chip-success-fill); /* ring-gap: inherit — decorative or text-only surface has no nested focus target. */ }
-/* The accent counter keeps the badge's flat surface and changes only the ink — the shape
-   src/styles/nav.css:158 `.ui-nav__item.is-active .ui-nav__badge.is-accent` already holds.
-   The accent wash goes on a base surface, never a raised one, and #295 made this panel a
-   raised one. why: docs/specification.md#elevation */
-.ui-dropdown__badge.is-accent { color: var(--accent); background: var(--surface); /* ring-gap: inherit — decorative or text-only surface has no nested focus target. */ }
+:root[data-theme="light"] .ui-dropdown__badge:not(.is-live) {
+  background: color-mix(in srgb, var(--muted) 15%, transparent); /* ring-gap: inherit — decorative or text-only surface has no nested focus target. */
+}
 
 /* Disabled + danger rows */
 .ui-dropdown__item.is-disabled { /* muted-ink: state — unavailable control */ color: var(--disabled-ink); cursor: not-allowed; pointer-events: none; }
@@ -291,4 +288,7 @@
 .ui-dropdown__none-title { font-size: calc(var(--text-sm) - 0.5px); font-weight: 600; color: var(--strong); }
 .ui-dropdown__none-hint { font-size: var(--text-xs); color: var(--text); line-height: 1.35; }
 
-.ui-dropdown__badge.is-state { /* muted-ink: state — off, unset, disabled or archived badge */ color: var(--muted); }
+.ui-dropdown__badge.is-state {
+  /* muted-ink: state — off, unset, disabled or archived badge */
+  color: var(--muted);
+}