Metadata block example

On a dark background without padding

By default the inverse option includes extra spacing around the component. This option removes this padding. Note that both the inverse and inverse_compress options must be supplied.

How it looks (preview)

• From: Ministry of Defence, Cabinet Office, Department for Business, Energy & Industrial Strategy, Foreign & Commonwealth Office and The Rt Hon William Hague
  Show 3 more
  Department for Environment, Food & Rural Affairs, Department for work and pensions, and Foreign and Commonwealth Office
• Published: 14 June 2014
• Last updated: 10 September 2015 — See all updates
• Applies to: England, Scotland, and Wales (see detailed guidance for Northern Ireland)

How to call this example

<%= render "govuk_publishing_components/components/metadata", {
  inverse: true,
  inverse_compress: true,
  from: [
    sanitize("<a href='/government/organisations/ministry-of-defence'>Ministry of Defence</a>"),
    sanitize("<a href='/government/organisations/cabinet-office'>Cabinet Office</a>"),
    sanitize("<a href=\"/government/organisations/department-for-business-energy-and-industrial-strategy\">Department for Business, Energy &amp; Industrial Strategy</a>"),
    sanitize("<a href=\"/government/organisations/foreign-commonwealth-office\">Foreign &amp; Commonwealth Office</a>"),
    sanitize("<a href=\"/government/people/william-hague\">The Rt Hon William Hague</a>"),
    sanitize("<a href=\"/government/organisations/department-for-environment-food-rural-affairs\">Department for Environment, Food &amp; Rural Affairs</a>"),
    sanitize("<a href=\"/government/organisations/department-for-work-pensions\">Department for work and pensions</a>"),
    sanitize("<a href=\"/government/organisations/foreign-commonwealth-office\">Foreign and Commonwealth Office</a>")
  ],
  first_published: "14 June 2014",
  last_updated: "10 September 2015",
  see_updates_link: true,
  other: {
    "Applies to": sanitize("England, Scotland, and Wales (see detailed guidance for <a href=\"http://www.dardni.gov.uk/news-dard-pa022-a-13-new-procedure-for\" rel=\"external\">Northern Ireland</a>)")
  }
} %>