Saltar al contenido

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

Línea de tiempo

La línea de tiempo muestra una lista de eventos en orden cronológico.

Nota: Este componente no está documentado en las pautas de Material Design, pero Material-UI lo soporta.

Línea de tiempo básica

Una línea de tiempo básica que muestra una lista de eventos.

  • Eat
  • Code
  • Sleep

Línea de tiempo alineada a la derecha

La línea de tiempo puede posicionarse en el lado derecho de los eventos.

  • Eat
  • Code
  • Sleep
  • Repeat

Línea de tiempo alternativa

La línea de tiempo puede mostrar los eventos en los lados alternos.

  • Eat
  • Code
  • Sleep
  • Repeat

Color

El TimelineDot puede aparecer en diferentes colores.

  • Eat
  • Code
  • Sleep
  • Repeat

Delineada

  • Eat
  • Code
  • Sleep
  • Repeat

Contenido opuesto

La línea de tiempo puede mostrar contenido en lados opuestos.

  • 09:30 am

    Eat

  • 10:00 am

    Code

  • 12:00 am

    Sleep

  • 9:00 am

    Repeat

Línea de tiempo personalizada

He aquí un ejemplo de personalización del componente. You can learn more about this in the overrides documentation page.

  • 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!