formir/src/less/themes/default/components/accordion.less

Pure CSS / HTML Framework

.accordion-label-active() {
  background: @tab-nav-active-background;
  border: @tab-nav-active-border;
  color: @tab-nav-active-color;
  box-shadow: @tab-nav-active-shadow;
  .@{accordion-arrow} {
    .accordion-arrow-up;
  }
}

.accordion-arrow-down() {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid currentColor;
}

.accordion-arrow-up() {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 5px solid currentColor;
  border-top: 0 none;
}


.@{accordion} {
  > label, .@{accordion-label} {
    display: block;
    line-height: 2.5 * @body-font-size;
    padding: 0 1.1em;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    cursor: pointer;
    background: #ccc;
    color: inherit;
    text-decoration: none;
    position: relative;
    .@{accordion-arrow} {
      width: 0; 
      height: 0; 
      color: inherit;
      position: absolute;
      right: 1.1em;
      top: 0;
      bottom: 0;
      margin: auto;
    }
  }
}