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

Padrão Digital de Governo

<div class="br-accordion" id="accordion4-negative" single="single">
  <div class="item">
    <button class="header" type="button" aria-controls="idsn30"><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="idsn30">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="idsn31"><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="idsn31">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="idsn32"><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="idsn32">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="idsn33"><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="idsn33">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="idsn34"><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="idsn34">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="idsn35"><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="idsn35">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="idsn36"><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="idsn36">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  </div>
</div>