naive-ui/styles/Tab.scss

@import './mixins/mixins.scss';
@import './theme/default.scss';

@include b(tab) {
  width: 100%;
  height: 100%;
  .n-tab--label {
    display: flex;
    align-items: center;
    justify-items: flex-start;
    background-color: bisque;
    padding-bottom: 10px;
    .n-tab--label-item {
      padding: 2px 5px;
      border-right: 1px solid #cccccc;
    }
    .n-tab--label-item_active {
      color: aquamarine;
    }
  }
  .n-tab--slot {
    display: flex;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
}

@include b(tab-panel) {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  visibility: hidden;
  transition: transform 0.3s;
  &.n-tab-panel_active {
    visibility: visible;
  }
}