vuestic-ui
Version:
Vue 3 UI Framework
9 lines (8 loc) • 3.34 kB
JavaScript
import { _ as _sfc_main } from "./VaTabs.vue_vue_type_script_setup_true_lang.js";
import { _ as _export_sfc } from "../../../plugin-vue_export-helper.js";
const _style_0 = ':root,\n:host {\n --va-tabs-display: flex;\n --va-tabs-align-items-horizontal: center;\n --va-tabs-align-items-vertical: stretch;\n /* Container */\n --va-tabs-container-height: 2rem;\n --va-tabs-container-margin: 0 3px;\n /* Slider */\n --va-tabs-slider-width: 0.125rem;\n --va-tabs-slider-height: 0.125rem;\n --va-tabs-slider-transition: transform ease 0.3s;\n /* Slider Wrapper */\n --va-tabs-slider-wrapper-bottom: 0;\n --va-tabs-slider-wrapper-margin: 0;\n --va-tabs-slider-wrapper-z-index: 4000;\n --va-tabs-slider-wrapper-transition: 0.3s cubic-bezier(0.25, 0.8, 0.5, 1);\n}\n.va-tabs {\n display: var(--va-tabs-display);\n align-items: var(--va-tabs-align-items-horizontal);\n flex-direction: column;\n position: relative;\n font-family: var(--va-font-family);\n}\n.va-tabs__wrapper {\n overflow: hidden;\n contain: content;\n display: flex;\n flex: 1 1 auto;\n width: 100%;\n}\n.va-tabs .va-tabs__pagination {\n flex: 0 0 auto;\n}\n.va-tabs .va-tabs__container {\n overflow: hidden;\n flex: 1 1 auto;\n display: flex;\n height: var(--va-tabs-container-height);\n margin: var(--va-tabs-container-margin);\n white-space: nowrap;\n position: relative;\n}\n.va-tabs .va-tabs__container .va-tabs__tabs {\n height: 100%;\n}\n.va-tabs .va-tabs__container .va-tabs__tabs-items {\n display: flex;\n}\n.va-tabs .va-tabs__container--right {\n justify-content: flex-end;\n}\n.va-tabs .va-tabs__container--grow .va-tabs__tabs {\n display: flex;\n min-width: 100%;\n}\n.va-tabs .va-tabs__container--grow .va-tabs__tabs-items {\n width: 100%;\n}\n.va-tabs .va-tabs__container--grow .va-tab {\n flex: 1 0 auto;\n max-width: none;\n}\n.va-tabs .va-tabs__container--center {\n justify-content: center;\n}\n.va-tabs .va-tabs__container--disabled {\n cursor: default;\n opacity: 0.4;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n pointer-events: none;\n}\n.va-tabs--vertical {\n align-items: var(--va-tabs-align-items-vertical);\n flex-direction: row;\n}\n.va-tabs--vertical .va-tabs__wrapper {\n flex: 0 0 auto;\n width: unset;\n}\n.va-tabs--vertical .va-tabs__container {\n height: auto;\n}\n.va-tabs--vertical .va-tabs__container .va-tabs__tabs-items {\n flex-direction: column;\n}\n.va-tabs--vertical .va-tabs__container .va-tabs__tabs {\n position: relative;\n}\n.va-tabs--vertical .va-tab {\n display: flex;\n}\n.va-tabs--vertical .va-tab__content {\n flex: 0 0 auto;\n}\n.va-tabs--vertical .va-tabs__content {\n flex: 1 0 auto;\n}\n.va-tabs .va-tabs__slider-wrapper {\n bottom: var(--va-tabs-slider-wrapper-bottom);\n margin: var(--va-tabs-slider-wrapper-margin);\n position: absolute;\n z-index: var(--va-tabs-slider-wrapper-z-index);\n}\n.va-tabs .va-tabs__slider-wrapper .va-tabs__slider {\n width: var(--va-tabs-slider-width);\n height: var(--va-tabs-slider-height);\n}\n.va-tabs .va-button:focus-visible {\n outline: 2px solid var(--va-focus) !important;\n border-radius: "inherit";\n outline-offset: -2px;\n}';
const _VaTabs = /* @__PURE__ */ _export_sfc(_sfc_main, [["styles", [_style_0]]]);
export {
_VaTabs as _
};
//# sourceMappingURL=VaTabs.js.map