text_featured_media.ui_patterns.yml

text_featured_media:
  label: "Text with Featured media"
  description: "Shows a rich text with a title and a featured media on the right, if any."
  variants:
    left_simple:
      label: 'Left simple'
      description: 'Text on the left, simple call to action. This is the default behaviour.'
    right_simple:
      label: 'Right simple'
      description: 'Text on the right, simple call to action.'
    left_featured:
      label: 'Left featured'
      description: 'Text on the left, featured call to action'
    right_featured:
      label: 'Right featured'
      description: 'Text on the right, featured call to action'
  fields:
    title:
      type: "text"
      label: "Heading"
      description: "The heading, displayed on the top."
      preview: "Text with Featured media"
    text_title:
      type: "text"
      label: "Title"
      description: "The title, displayed above text and media."
      preview: "Lorem ipsum"
    image:
      type: "ImageValueObject"
      label: "Image"
      description: "Featured image. Either this or the video need to be provided. If both are provided the image will take preference."
      preview:
        src: "https://picsum.photos/1000/500"
        alt: "Alternative text for featured item image"
    video:
      type: "text"
      label: "Video"
      description: "Embedded video as a renderable iframe (for example by using the 'html_tag' render element). Either this or the image need to be provided. If both are provided the image will take preference."
      preview: ""
    animation:
      type: "array"
      label: "Animation"
      description: "Animation: uses the media container parameters as defined by the ECL to render a video."
      preview:
        poster: "https://inno-ecl.s3.amazonaws.com/media/examples/example-image.jpg"
        sources:
          - src: "https://inno-ecl.s3.amazonaws.com/media/videos/big_buck_bunny.mp4"
            src_type: "video/mp4"
        tracks:
          - src: "captions/bunny-en.vtt"
            kind: "captions"
            src_lang: "en"
            label: "English"
    caption:
      type: "text"
      label: "Caption"
      description: "Description of the featured media."
      preview: "Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit."
    text:
      type: "text"
      label: "Full text"
      description: "The full rich text."
      preview:
        '#markup': "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Non enim iam stirpis bonum quaeret, sed animalis. Ego vero volo in virtute vim esse quam maximam; <b>A mene tu?</b> Quid, quod res alia tota est? Duo Reges: constructio interrete.</p>"
    video_ratio:
      type: "text"
      label: "Video aspect ratio"
      description: "Aspect ratio used to display videos in media container. Allowed values: 16:9, 4:3, 3:2, 1:1. Defaults to 16:9 if in invalid value is passed. This will not have any effects when used with images."
      preview: "16:9"
    link:
      type: "array"
      label: "Link"
      description: "Call to action link with icon"
      preview:
        label: "View all"
        path: "#"
    highlighted:
      type: "boolean"
      label: "Highlighted"
      description: "Whether the item is highlighted or not."
      preview: true
    expandable:
      type: "array"
      label: "Expandable"
      description: "Optional expandable text block with extra information about the media item. The block cannot be rendered without actual text and the id must be unique on the page."
      preview:
        id: ""
        hidden: true
        label_expanded: "Expanded"
        label_collapsed: "Collapsed"
        content:
          '#markup': "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Non enim iam stirpis bonum quaeret, sed animalis. Ego vero volo in virtute vim esse quam maximam; <b>A mene tu?</b> Quid, quod res alia tota est? Duo Reges: constructio interrete.</p>"