Menu Uno designsysteem 5.3.4

Timeline

Een tijdlijn kan gebruikt worden om acties op verschillende tijdsmomenten in beeld te brengen. Via links in de tijdlijn kan er naar de acties genavigeerd worden.

Let op: de datum is een header. Welke dat moet zijn is afhankelijk van waar in de hierarchie je zit. In dit geval komt het direct na een <h2> ('Timeline') en is het een <h3>.

In de list__item-heading dien je gebruik te maken van de volgende tags:
- voor datums: <time>21 augustus 2019</time>
- voor dikgedrukte tekst: <strong>Titel</strong>

Tijdlijn start & eind indicatie

Standaard start (en stopt) een tijdlijn met een lijn. Om deze te laten beginnen en/of eindigen met een bullet kan de timeline--no-start of timeline--no-end modifier gebruikt worden.

Compacte tijdlijn

Een compacte tijdlijn wordt gebruikt om de status van een actie weer te geven. Een compacte tijdlijn is niet interactief.

  • Gegevens verzamelen
  • Ondertekening
  • In behandeling
  • Uitsluitsel

Grote tijdlijn

  • Terugmeldingen 2e voorlopige foto 2015 mbo vavo beschikbaar

    De terugmelding bekostigingsgrondslagen en de individuele terugmelding mbo en vavo van de tweede voorlopige foto van 1 oktober 2015 zij geplaatst.

    Lees meer

  • Conferentie doorontwikkeling BRON

    Lees meer

Themakleuren

De timeline bullets zijn standaard grijs van kleur maar kan een modifier class bevatten met een gewenste themakleur.
Gebruik één van de volgende kleuren:
list--timeline-violet list--timeline-roze list--timeline-rood list--timeline-robijnrood list--timeline-paars list--timeline-oranje list--timeline-mosgroen list--timeline-mintgroen list--timeline-lichtblauw list--timeline-hemelblauw list--timeline-donkerblauw list--timeline-groen list--timeline-geel list--timeline-donkergroen list--timeline-donkergeel list--timeline-donkerbruin list--timeline-bruin

Benodigde stylesheets

  • /uno/components/list/list-timeline.css