diff --git a/src/components/tab_switcher/tab_switcher.jsx b/src/components/tab_switcher/tab_switcher.jsx index 02a0b47c0..0c627356f 100644 --- a/src/components/tab_switcher/tab_switcher.jsx +++ b/src/components/tab_switcher/tab_switcher.jsx @@ -31,11 +31,6 @@ export default { type: Boolean, default: false }, - sideTabBar: { - required: false, - type: Boolean, - default: false - }, bodyScrollLock: { required: false, type: Boolean, @@ -157,26 +152,21 @@ export default { return (
- { - this.sideTabBar - ?

{props.label}

- : '' - } {renderSlot}
) }) return ( -
+
{tabs}
.contents { - flex: 1 1 auto; - } - - > .tabs { - flex: 0 0 auto; - overflow: hidden auto; - flex-direction: column; - - &::after, - &::before { - flex-shrink: 0; - flex-basis: 0.5em; - content: ""; - border-right: 1px solid; - border-right-color: var(--border); - } - - &::after { - flex-grow: 1; - } - - &::before { - flex-grow: 0; - } - - .tab-wrapper { - min-width: 10em; - display: flex; - flex-direction: column; - - @media all and (width <= 800px) { - min-width: 4em; - } - - &:not(.active)::after { - top: 0; - right: 0; - bottom: 0; - border-right: 1px solid; - border-right-color: var(--border); - } - - &::before { - flex: 0 0 6px; - content: ""; - border-right: 1px solid; - border-right-color: var(--border); - } - - &:last-child .tab { - margin-bottom: 0; - } - } - - .tab { - flex: 1; - box-sizing: content-box; - max-width: 9em; - min-width: 1px; - border-top-right-radius: 0; - border-bottom-right-radius: 0; - padding-left: 1em; - padding-right: calc(1em + 200px); - margin-right: -200px; - margin-left: 1em; - - &:not(.active) { - margin-top: 0; - margin-left: 1.5em; - } - - @media all and (width <= 800px) { - padding-left: 0.25em; - padding-right: calc(0.25em + 200px); - margin-right: calc(0.25em - 200px); - margin-left: 0.25em; - - &:not(.active) { - margin-top: 0; - margin-left: 0.5em; - } - - .text { - display: none; - } - } - } - } - } - .contents { flex: 1 0 auto; min-height: 0;