linkmore-design/lib/lm-tabs/style/index-pure.less

🌈 🚀lm组件库。🚀

@import '../../style/themes/index';

.lm_custom_tabs {
  .lm_custom_tabs_header {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: @border-radius-base;
    background: @tabs-card-head-background;
    height: @tabs-card-height;
    box-sizing: border-box;
    cursor: pointer;
    position: relative;

    .tabs {
      background-color: @body-background;
      box-shadow: rgb(0 0 0 / 15%) 0px 2px 4px;
      position: absolute;
      height: calc(100% - 8px);
      left: 0;
      transition: all cubic-bezier(0.38, 0, 0.24, 1) 0.24s;
      border-radius: @border-radius-base;
    }

    .item {
      margin: 4px;
      padding: 4px 8px;
      font-size: @font-size-base;
      box-sizing: border-box;
      transition: all cubic-bezier(0.38, 0, 0.24, 1) 0.24s;
      border-radius: @border-radius-base;
      color: @text-color-new;
      position: relative;
      word-break: keep-all;
      display: flex;
      align-items: center;
      white-space: nowrap;

      &.active {
        color: @tabs-card-active-color;
      }
    }
  }
}