@inkline/inkline/components/ITab/css/index.css

Inkline is the intuitive UI Components library that gives you a developer-friendly foundation for building high-quality, accessible, and customizable Vue.js 3 Design Systems.

/**
 * Tab
 */
.tabs .tab {
  position: relative;
  display: block;
  transition-property: var(--tabs--tab--transition-property, var(--tabs--transition-property, background-color, border-color, color));
  transition-duration: var(--tabs--tab--transition-duration, var(--tabs--transition-duration, var(--transition-duration)));
  transition-timing-function: var(--tabs--tab--transition-timing-function, var(--tabs--transition-timing-function, var(--transition-timing-function)));
  color: var(--tabs--tab--color, var(--tabs--color));
  background: var(--tabs--tab--background, var(--tabs--background));
  border-color: var(--tabs--tab--border-color, var(--tabs--tab--border-top-color, var(--tabs--border-top-color, var(--border-top-color))) var(--tabs--tab--border-right-color, var(--tabs--border-right-color, var(--border-right-color))) var(--tabs--tab--border-bottom-color, var(--tabs--border-bottom-color, var(--border-bottom-color))) var(--tabs--tab--border-left-color, var(--tabs--border-left-color, var(--border-left-color))));
  border-style: var(--tabs--tab--border-style, var(--tabs--tab--border-top-style, var(--tabs--border-top-style, var(--border-top-style))) var(--tabs--tab--border-right-style, var(--tabs--border-right-style, var(--border-right-style))) var(--tabs--tab--border-bottom-style, var(--tabs--border-bottom-style, var(--border-bottom-style))) var(--tabs--tab--border-left-style, var(--tabs--border-left-style, var(--border-left-style))));
  border-width: var(--tabs--tab--border-width, var(--tabs--tab--border-top-width, var(--tabs--border-top-width, var(--border-top-width))) var(--tabs--tab--border-right-width, var(--tabs--border-right-width, var(--border-right-width))) var(--tabs--tab--border-bottom-width, var(--tabs--border-bottom-width, var(--border-bottom-width))) var(--tabs--tab--border-left-width, var(--tabs--border-left-width, var(--border-left-width))));
  border-radius: var(--tabs--tab--border-radius, var(--tabs--border-radius, var(--tabs--tab--border-top-left-radius, var(--tabs--border-top-left-radius, var(--border-top-left-radius))) var(--tabs--tab--border-top-right-radius, var(--tabs--border-top-right-radius, var(--border-top-right-radius))) var(--tabs--tab--border-bottom-right-radius, var(--tabs--border-bottom-right-radius, var(--border-bottom-right-radius))) var(--tabs--tab--border-bottom-left-radius, var(--tabs--border-bottom-left-radius, var(--border-bottom-left-radius)))));
}
.tabs .tab > .tab-body {
  display: block;
  position: relative;
  font-size: var(--tabs--tab--font-size, var(--tabs--font-size, var(--font-size)));
  padding: var(--tabs--tab--padding, var(--tabs--tab--padding-top, var(--tabs--padding-top, var(--padding-top))) var(--tabs--tab--padding-right, var(--tabs--padding-right, var(--padding-right))) var(--tabs--tab--padding-bottom, var(--tabs--padding-bottom, var(--padding-bottom))) var(--tabs--tab--padding-left, var(--tabs--padding-left, var(--padding-left))));
}