UNPKG

@synergy-design-system/components

Version:

This package provides the base of the Synergy Design System as native web components. It uses [lit](https://www.lit.dev) and parts of [shoelace](https://shoelace.style/). Synergy officially supports the latest two versions of all major browsers (as define

75 lines (63 loc) 1.71 kB
// src/components/tab/tab.styles.ts import { css } from "lit"; var tab_styles_default = css` /* stylelint-disable */ :host { display: inline-block; } .tab { display: inline-flex; align-items: center; font-family: var(--syn-font-sans); font-size: var(--syn-font-size-small); font-weight: var(--syn-font-weight-semibold); border-radius: var(--syn-border-radius-medium); color: var(--syn-color-neutral-600); padding: var(--syn-spacing-medium) var(--syn-spacing-large); white-space: nowrap; user-select: none; -webkit-user-select: none; cursor: pointer; transition: var(--transition-speed) box-shadow, var(--transition-speed) color; } .tab:hover:not(.tab--disabled) { color: var(--syn-color-primary-600); } :host(:focus) { outline: transparent; } :host(:focus-visible) { color: var(--syn-color-primary-600); outline: var(--syn-focus-ring); outline-offset: calc(-1 * var(--syn-focus-ring-width) - var(--syn-focus-ring-offset)); } .tab.tab--active:not(.tab--disabled) { color: var(--syn-color-primary-600); } .tab.tab--closable { padding-inline-end: var(--syn-spacing-small); } .tab.tab--disabled { opacity: 0.5; cursor: not-allowed; } .tab__close-button { font-size: var(--syn-font-size-small); margin-inline-start: var(--syn-spacing-small); } .tab__close-button::part(base) { padding: var(--syn-spacing-3x-small); } @media (forced-colors: active) { .tab.tab--active:not(.tab--disabled) { outline: solid 1px transparent; outline-offset: -3px; } } `; export { tab_styles_default }; //# sourceMappingURL=chunk.43YNZAWL.js.map