amazeui/widget/slider/src/slider.a5.less

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

/**
  * Slider Theme: a5
  */

.am-slider-a5 {
  @control-nav-bg-color: rgba(0,0,0,0.5);
  @control-nav-hover-bg-color: rgba(0,0,0,0.7);
  @control-nav-active-bg-color: @global-primary;

  box-shadow: 0 1px 4px rgba(0,0,0,.2);
  .am-viewport {
    max-height: 2000px;
    transition: all 1s ease;

    .loading & {
      max-height: 300px;
    }
  }

  /* Control Nav */
  .am-control-nav {
    width: 100%;
    position: absolute;
    text-align: center;
    height: 6px;
    display: table;
    bottom: 0;
    font-size: 0;
    line-height: 0;
    li {
      display: table-cell;
      a {
        width: 100%;
        height: 6px;
        display: block;
        background-color: @control-nav-bg-color;
        cursor: pointer;
        text-indent: -9999px;

        &:hover {
          background-color: @control-nav-hover-bg-color;
        }

        &.am-active {
          background-color: @control-nav-active-bg-color;
          cursor: default;
        }
      }
    }
  }

  .am-direction-nav,
  .am-pauseplay {
    display: none;
  }

  .hook-am-slider-a5;
}

.hook-am-slider-a5() {}