Standard component
HTML

<h1 class="govuk-heading-l">Events</h1>
<div class="dwp-timeline">
  <ol class="dwp-timeline__items">
    <li class="dwp-timeline__item">
      <p class="dwp-timeline__datetime">16 June 2024 at 1:00am</p>
      <h2 class="dwp-timeline__heading">Completed ‘DP224JP’ form received</h2>
      <p class="dwp-timeline__by-line">by System</p>
    </li>
    <li class="dwp-timeline__item">
      <p class="dwp-timeline__datetime">1 June 2024 at 7:14am</p>
      <h2 class="dwp-timeline__heading">Summary of report including recommendations, suppliers and costs sent to claimant</h2>
      <p class="dwp-timeline__by-line">by John Goldsmith</p>
    </li>
    <li class="dwp-timeline__item">
      <p class="dwp-timeline__datetime">15 May 2024 at 4:01pm</p>
      <h2 class="dwp-timeline__heading">Workplace assessment report</h2>
      <p class="dwp-timeline__by-line">by John Goldsmith</p>
      <a href="#" class="dwp-timeline__link">View details<span class="govuk-visually-hidden"> of the event on 15 May 2024 at 4:01pm</span></a>
    </li>
    <li class="dwp-timeline__item">
      <p class="dwp-timeline__datetime">26 April 2024 at 12:42pm</p>
      <h2 class="dwp-timeline__heading">Workplace assessment</h2>
      <p class="dwp-timeline__by-line">by John Goldsmith</p>
      <p class="dwp-timeline__content">Agreed with the claimant that a workplace assessment is required and confirmed assessor visit on 5 May 2024 at 9:45am – confirmation letter sent</p>
    </li>
    <li class="dwp-timeline__item">
      <p class="dwp-timeline__datetime">21 April 2024 at 1:12pm</p>
      <h2 class="dwp-timeline__heading">Update to: Health condition or disability</h2>
      <p class="dwp-timeline__by-line">by Jane Doe</p>
      <a href="#" class="dwp-timeline__link">View details<span class="govuk-visually-hidden"> of the event on 21 April 2024 at 1:12pm</span></a>
    </li>
    <li class="dwp-timeline__item">
      <p class="dwp-timeline__datetime">21 April 2024 at 10:15am</p>
      <h2 class="dwp-timeline__heading">Telephone call made</h2>
      <p class="dwp-timeline__by-line">by Jane Doe</p>
      <p class="dwp-timeline__content">A telephone call was made to the claimant requesting further information to support the claim</p>
      <a href="#" class="dwp-timeline__link">View details<span class="govuk-visually-hidden"> of the event on 21 April 2024 at 10:15am</span></a>
    </li>
    <li class="dwp-timeline__item">
      <p class="dwp-timeline__datetime">19 April 2024 at 10:58am</p>
      <h2 class="dwp-timeline__heading">Text message (SMS) sent</h2>
      <p class="dwp-timeline__by-line">by Jane Doe</p>
      <p class="dwp-timeline__content">SMS was sent to the claimant to inform them that we require further information and will be in contact on 21 April 2024</p>
    </li>
    <li class="dwp-timeline__item">
      <p class="dwp-timeline__datetime">16 April 2024 at 9:00am</p>
      <h2 class="dwp-timeline__heading">Health condition or disability </h2>
      <p class="dwp-timeline__by-line">by Jane Doe</p>
      <p class="dwp-timeline__content">Contact needed for more information</p>
    </li>
    <li class="dwp-timeline__item">
      <p class="dwp-timeline__datetime">28 March 2024 at 9:12am</p>
      <h2 class="dwp-timeline__heading">Check personal details and add National Insurance number task</h2>
      <p class="dwp-timeline__by-line">by Jane Doe</p>
    </li>
    <li class="dwp-timeline__item">
      <p class="dwp-timeline__datetime">12 March 2024 at 3:00pm</p>
      <h2 class="dwp-timeline__heading">Application received</h2>
    </li>
  </ol>
</div>
Cookies on the DWP Design System website

HTML
