@govbr-ds/core/dist/components/accordion/examples/accordion-single-negative.html

Padrão Digital de Governo

<div class="br-accordion" id="accordion3" single="single" negative="negative">
  <div class="item">
    <button class="header" type="button" aria-controls="ids23"><span class="icon"><i class="fas fa-angle-down" aria-hidden="true"></i></span><span class="title">Assuntos</span></button>
  </div>
  <div class="content" id="ids23">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  </div>
  <div class="item">
    <button class="header" type="button" aria-controls="ids24"><span class="icon"><i class="fas fa-angle-down" aria-hidden="true"></i></span><span class="title">Serviços</span></button>
  </div>
  <div class="content" id="ids24">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  </div>
  <div class="item">
    <button class="header" type="button" aria-controls="ids25"><span class="icon"><i class="fas fa-angle-down" aria-hidden="true"></i></span><span class="title">Canais de atendimento</span></button>
  </div>
  <div class="content" id="ids25">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  </div>
  <div class="item">
    <button class="header" type="button" aria-controls="ids26"><span class="icon"><i class="fas fa-angle-down" aria-hidden="true"></i></span><span class="title">Galeria de aplicativos</span></button>
  </div>
  <div class="content" id="ids26">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  </div>
  <div class="item">
    <button class="header" type="button" aria-controls="ids27"><span class="icon"><i class="fas fa-angle-down" aria-hidden="true"></i></span><span class="title">Centrais de conteúdo</span></button>
  </div>
  <div class="content" id="ids27">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  </div>
  <div class="item">
    <button class="header" type="button" aria-controls="ids28"><span class="icon"><i class="fas fa-angle-down" aria-hidden="true"></i></span><span class="title">Navegação</span></button>
  </div>
  <div class="content" id="ids28">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  </div>
  <div class="item">
    <button class="header" type="button" aria-controls="ids29"><span class="icon"><i class="fas fa-angle-down" aria-hidden="true"></i></span><span class="title">Planalto</span></button>
  </div>
  <div class="content" id="ids29">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  </div>
</div>