Menu icon Foundation
Change Accordion +/- Label

Is it possible to change the plus/minus labels on an accordion to something else like up/down arrows.? I am using Foundation 6.4.3

accordionlabel

Is it possible to change the plus/minus labels on an accordion to something else like up/down arrows.? I am using Foundation 6.4.3

Rafi Benkual 2 months ago

 Sure! You can locate the :after element on the .accordion-title class and change the content

George Benthien 2 months ago

I found that you need to change the :before element and not the :after element.  Here is the SCSS code to replace the +/- accordion toggle with up down triangles

.accordion-title
 {
  &:before {
    content: "\25BC";
  }
  .is-active > &:before {
    content: "\25B2";
  }
}