page_header.ui_patterns.yml

page_header:
  label: "Page header"
  description: "Default implementation of the page header, contains the page title, breadcrumbs and additional page details."
  fields:
    title:
      type: "text"
      label: "Title"
      description: "The title of the page."
      preview: "Business, Economy, Euro"
    thumbnail:
      type: "ImageValueObject"
      label: "Thumbnail"
      description: "Thumbnail displayed alongside the description."
      preview:
        src: "https://loremflickr.com/1000/500/arch"
        alt: "Alternative text for thumbnail"
    introduction:
      type: "text"
      label: "Introduction"
      description: "A small introduction of the page content."
      preview: "EU economy, finance and the euro, and practical information for EU businesses and entrepreneurs on product safety, environmental regulations, trade with non-EU countries and competition rules."
    metas:
      type: "array"
      label: "Metas"
      description: "A collection of page meta information."
      preview:
        - "News article"
        - "6 July 2015"
        - "Brussels"
    breadcrumb:
      type: "array"
      label: "Breadcrumb"
      description: "A list of links that represent the location of the current page in the website."
      preview:
        - href: "#"
          label: "European Commission"
        - href: "#"
          label: "Announcements"
        - href: "#"
          label: "About the European Commission"
        - href: "#"
          label: "Organisational structure"
        - href: "#"
          label: "How the Commission is organised"
        - href: "#"
          label: "News"
    background_image_url:
      type: "array"
      label: "Background image URL"
      description: "Background image URL, only displayed when the theme ECL branding is set to 'Core'."
      preview: "page-header-pattern-background-preview.jpeg"
    overlay:
      type: "text"
      label: "Overlay"
      description: "Optional overlay on top of background image (can be 'light', 'dark'). Only used on EC sites"
      preview: "dark"
    hide_title:
      type: "boolean"
      label: "Hide title"
      description: "Hide the h1 title, for screen reader only. Defaults to 'false'"
      preview: false