Pular para o conteúdo

🎉 Material UI v5 is out! Head to the migration guide to get started.

Linha do tempo

A linha do tempo exibe uma lista de eventos em ordem cronológica.

Observação: Este componente não está documentado nas diretrizes do Material Design, mas o Material-UI o suporta.

Linha do tempo básica

Uma linha do tempo básica mostrando a lista de eventos.

  • Eat
  • Code
  • Sleep

Linha do tempo alinhada à direita

A linha do tempo pode ser posicionada no lado direito dos eventos.

  • Eat
  • Code
  • Sleep
  • Repeat

Linha do tempo alternada

A linha do tempo pode exibir os eventos alternando os lados.

  • Eat
  • Code
  • Sleep
  • Repeat

Cor

O TimelineDot pode aparecer em cores diferentes.

  • Eat
  • Code
  • Sleep
  • Repeat

Delineado

  • Eat
  • Code
  • Sleep
  • Repeat

Conteúdo oposto

A linha do tempo pode exibir conteúdo nos lados opostos.

  • 09:30 am

    Eat

  • 10:00 am

    Code

  • 12:00 am

    Sleep

  • 9:00 am

    Repeat

Linha do tempo customizada

Aqui está um exemplo de customização do componente. Você pode aprender mais sobre isso na página de documentação de sobrescritas.

  • 9:30 am

    Eat

    Because you need strength

  • 10:00 am

    Code

    Because it's awesome!

  • Sleep

    Because you need rest

  • Repeat

    Because this is the life you love!