@varlet/ui/es/tab/tab.css

A Vue3 component library based on Material Design 2 and 3, supporting mobile and desktop.

:root { --tab-padding: 12px; --tab-active-color: var(--color-primary); --tab-inactive-color: #646566; --tab-disabled-color: var(--color-text-disabled); --tab-font-size: var(--font-size-md); --tab-font-weight: 400; --tab-active-font-size: var(--font-size-md); --tab-active-font-weight: 400;}.var-tab { display: flex; justify-content: center; align-items: center; flex: 1 0 auto; padding: 0 var(--tab-padding); font-size: var(--tab-font-size); font-weight: var(--tab-font-weight); cursor: pointer; user-select: none; -webkit-tap-highlight-color: transparent;}.var-tab--active { color: var(--tab-active-color); font-size: var(--tab-active-font-size); font-weight: var(--tab-active-font-weight);}.var-tab--inactive { color: var(--tab-inactive-color);}.var-tab--disabled { color: var(--tab-disabled-color); cursor: not-allowed;}.var-tab--horizontal { flex-direction: row;}.var-tab--vertical { flex-direction: column;}