Contents

.accordion-title{
  @extend .heading;
  text-decoration: none;

  &:hover,
  &:active,
  &:visited,
  &:focus{
    color: $white;
  }

  .accordion-icon{
    width: 16px;
    height: 16px;
    display: block;
    float: right;
    color: $white;
  }
}

.accordion.secondary{
  background: none;

  a{
    font-size: $base-font-size;
  }

  .accordion-content a{
    font-size: $base-font-size;
  }

  .accordion-title{
    background: $white;
    color: $slate;

    &:hover{
      background: $stone;
    }
  }

  .top-level,
  .top-level:hover{
    background: darken($stone, 5%);
    color: $slate;
  }
}

.accordion{
  &__header{
    background: $brand-blue-light;
    overflow: auto;
    display: block;
  }

  &__heading{
    @extend .heading;
    @include small-10;
  }

  &__toggle{
    @include small-2;
    text-align: right;
    color: $white;
    padding-top: $base-padding*1.25;
  }
}

// Foundation sets a border-radius by default,
// and there doesn't seem to be an override in the settings file
.accordion-item:first-child > :first-child,
.accordion-item:first-child > :last-child,
:last-child:not(.is-active) > .accordion-title{
  border-radius: 0;
}

Version data entries

2 entries across 2 versions & 1 rubygems

Version	Path
ama_layout-4.1.0	app/assets/stylesheets/ama_layout/layout_components/accordions.scss
ama_layout-4.0.0	app/assets/stylesheets/ama_layout/layout_components/accordions.scss