amazeui/widget/tabs/src/tabs.one.less

Sleek, intuitive, and powerful front-end framework for faster and easier web development.

/**
  * Tabs Theme: one
  */

.am-tabs-one {
  @tabs-bg: @white;
  @tabs-nav-color: @one-primary;
  @tabs-nav-active-color: @white;
  @tabs-nav-active-bg: @one-primary;

  @tabs-border-color: @one-primary;

  @tabs-border-radius: @global-radius;

  background: @tabs-bg;

  .am-tabs-nav {
    height: 36px;
    background-color: @tabs-bg;
    font-size: 14px;
    border-radius: @tabs-border-radius;


    a {
      line-height: 34px;
      color: @tabs-nav-color;
    }

    li {
      border: 1px solid @tabs-border-color;

      &:first-child {
        .border-left-radius(@tabs-border-radius)
      }

      &:last-child {
        .border-right-radius(@tabs-border-radius)
      }

      + li {
        border-left: none;
      }
    }

    .am-active {
      a {
        background-color: @tabs-nav-active-bg;
        color: @tabs-nav-active-color;
      }
    }
  }

  .am-tabs-bd {
    border: none;
  }

  .am-tab-panel {
    padding: 15px 5px 20px;
  }

  .hook-am-tabs-one;
}

.hook-am-tabs-one() {}