Estilos

Componentes

Formularios

Organismos

Lista informativa

Las listas informativas organizan piezas simples de información en forma vertical. Se utilizan cuando sus elementos no transmiten un orden secuencial específico.

Estamos actualizando todas las fichas de los componentes. Para conocer más sobre los lineamientos de uso del componente podés visitar la documentación en Obelisco v.1.

Con viñeta

Este es el subtítulo de una lista general

  • Este es el contenido de un ítem de una lista general.
  • Este es el contenido de un ítem de una lista general.
  • Este es el contenido de un ítem de una lista general.
  • Este es el contenido de un ítem de una lista general.
  • Este es el contenido de un ítem de una lista general.
  • Este es el contenido de un ítem de una lista general.
  • Este es el contenido de un ítem de una lista general.

  <div class="list-informative">
    <h3 class="list-informative-subtitle">
      Este es el subtítulo de una lista general
    </h3>
    <ul class="list-informative-bullet">
      <li>Este es el contenido de un ítem de una lista general.</li>
      <li>Este es el contenido de un ítem de una lista general.</li>
      <li>Este es el contenido de un ítem de una lista general.</li>
      <li>Este es el contenido de un ítem de una lista general.</li>
      <li>Este es el contenido de un ítem de una lista general.</li>
      <li>Este es el contenido de un ítem de una lista general.</li>
      <li>Este es el contenido de un ítem de una lista general.</li>
    </ul>
  </div>

Con check

Este es el subtítulo de una lista de requisitos

  • Este es el contenido de un ítem de una lista de requisitos.
  • Este es el contenido de un ítem de una lista de requisitos.
  • Este es el contenido de un ítem de una lista de requisitos.
  • Este es el contenido de un ítem de una lista de requisitos.
  • Este es el contenido de un ítem de una lista de requisitos.
  • Este es el contenido de un ítem de una lista de requisitos.
  • Este es el contenido de un ítem de una lista de requisitos.

  <div class="list-informative">
    <h3 class="list-informative-subtitle">
      Este es el subtítulo de una lista de requisitos
    </h3>
    <ul class="list-informative-check">
      <li>Este es el contenido de un ítem de una lista de requisitos.</li>
      <li>Este es el contenido de un ítem de una lista de requisitos.</li>
      <li>Este es el contenido de un ítem de una lista de requisitos.</li>
      <li>Este es el contenido de un ítem de una lista de requisitos.</li>
      <li>Este es el contenido de un ítem de una lista de requisitos.</li>
      <li>Este es el contenido de un ítem de una lista de requisitos.</li>
      <li>Este es el contenido de un ítem de una lista de requisitos.</li>
    </ul>
  </div>

Variantes

Navegación de pie de página