UNPKG

@ebay/skin

Version:

Skin - CSS modules that represent the brand eBay

51 lines (45 loc) 1.18 kB
.chip { align-items: center; background-color: var(--color-background-tertiary); border-radius: var(--spacing-400); color: var(--color-foreground-primary); display: inline-flex; font-size: var(--font-size-default); gap: 2px; justify-content: space-between; max-width: 296px; min-height: var(--spacing-250); min-width: 32px; padding: 0 var(--spacing-150); } .chip__text { overflow: hidden; padding: var(--spacing-75) 0; text-overflow: ellipsis; white-space: nowrap; } button.chip__button { background-color: initial; border: none; border-radius: 50px; box-sizing: border-box; flex-shrink: 0; height: var(--spacing-300); line-height: 0; margin-inline-end: -8px; padding: 0; width: var(--spacing-300); } button.chip__button:focus-visible { background-color: var(--state-layer-focus); outline-color: var(--color-state-focus-stroke); outline-offset: -2px; outline-style: solid; outline-width: 2px; } button.chip__button:hover { background-color: var(--state-layer-hover); } button.chip__button > svg { fill: var(--color-foreground-on-primary); }