2.39.0 • Published 4 years ago

@ecl-twig/ec-component-gallery v2.39.0

Weekly downloads
215
License
EUPL-1.1
Repository
github
Last release
4 years ago

ECL-Twig Gallery

npm package: @ecl-twig/ec-component-gallery

npm install --save @ecl-twig/ec-component-gallery

Parameters

  • "overlay" (object) (default: {})
    • "close" (object) (default: {}): object of type button
    • "previous" (object) (default: {}): object of type button
    • "next" (object) (default: {}): object of type button
    • "counter_separator" (string) (default: '')
    • "download" (object) (default: {}): object of type link
    • "share" (object) (default: {}): object of type link
  • "items" (array) (default: [])
    • "path" (string) (default: '')
    • "alt" (string) (default: '')
    • "description" (string) (default: '')
    • "meta" (string) (default: '')
    • "icon" (object) (default: {}): object of type icon
    • "image" (optional) (object) (default: {})
    • "video" (optional) (object) (default: {})
    • "embedded_video" (optional) (object) (default: {})
    • "share_path" (optional) (string) (default: '')
  • "footer" (object) (default: {}) Footer link
  • "view_all_label" (string) (default: '') Label of the view all button
  • "counter_label" (string) (default: '') Label of the counter
  • "selected_item_id" (int) (default: 0)
  • "extra_classes" (optional) (string) (default: '') Extra classes (space separated)
  • "extra_attributes" (optional) (array) (default: []) Extra attributes
    • "name" (string) Attribute name, eg. 'data-test'
    • "value" (string) Attribute value, eg: 'data-test-1'
  • "_compliance_" (boolean) (default: false) Activates debug

Example :

{% include '@ecl-twig/ec-component-gallery/ecl-gallery.html.twig' with {  
  view_all_label: 'View all', 
  counter_label: 'Media files in this gallery' , 
  items: [ 
    { 
      path: 'path/to/image.jpg', 
      alt: 'Image 1', 
      description: 
        'The EU in brief, institutions and bodies, countries, symbols, history, facts and figures', 
      meta: 'Copyright, Author, Licence for image 1', 
      share_href: '/share#example-image.jpg', 
    }, 
    { 
      path: 'path/to/image2.jpg', 
      alt: 'Image 2', 
      description: 'Living, working, travelling in the EU', 
      meta: 'Copyright, Author, Licence for image 2', 
      icon: { 
        path: 'path/to/icons.svg', 
        type: 'general', 
        name: 'audio', 
      }, 
      share_href: '/share#example-image2.jpg', 
    }, 
    ... 
  ], 
  footer: { 
    link: { 
      label: "Link to further media items", 
      path: "/example", 
      aria_label: "View all link aria-label value" 
    }, 
    icon: { 
      path: "/icons.svg", 
      type: "ui", 
      name: "external", 
      size: "s" 
    } 
  },
  overlay: { 
    close: { 
      variant: 'ghost', 
      label: 'Close', 
      icon: { 
        path: 'path/to/icons.svg', 
        type: 'ui', 
        name: 'close', 
        size: 's', 
      }, 
    }, 
    previous: { 
      variant: 'ghost', 
      label: 'Previous', 
      icon: { 
        path: 'path/to/icons.svg', 
        type: 'ui', 
        name: 'corner-arrow', 
        transform: 'rotate-270', 
        size: 'l', 
      }, 
      icon_position: 'before', 
    }, 
    next: { 
      variant: 'ghost', 
      label: 'Next', 
      icon: { 
        path: 'path/to/icons.svg', 
        type: 'ui', 
        name: 'corner-arrow', 
        transform: 'rotate-90', 
        size: 'l', 
      }, 
    }, 
    counter_separator: 'of', 
    download: { 
      label: 'Download', 
      icon: { 
        path: 'path/to/icons.svg', 
        type: 'ui', 
        name: 'download', 
        size: 'fluid', 
      }, 
    }, 
    share: { 
      label: 'Share', 
      icon: { 
        path: 'path/to/icons.svg', 
        type: 'general', 
        name: 'share', 
        size: 'fluid', 
      }, 
    }, 
  }, 
} %}
2.39.0

4 years ago

2.38.0

4 years ago

2.37.0

4 years ago

2.36.0

4 years ago

2.35.2

4 years ago

2.35.1

5 years ago

2.35.0

5 years ago

2.34.0

5 years ago

2.33.2

5 years ago

2.33.1

5 years ago

2.33.0

5 years ago

2.32.0

5 years ago

2.31.1

5 years ago

2.31.0

5 years ago

2.30.0

5 years ago

2.29.0

5 years ago

2.28.1

5 years ago

2.28.0

5 years ago

2.27.0

5 years ago

2.26.0

5 years ago

2.25.1

5 years ago

2.25.0

5 years ago

2.24.0

5 years ago

2.23.0

5 years ago

2.22.1

5 years ago

2.22.0

5 years ago

2.21.0

5 years ago

2.19.0

6 years ago

2.18.0

6 years ago

2.17.3

6 years ago

2.17.0

6 years ago

2.16.1

6 years ago

2.15.1

6 years ago

2.15.0

6 years ago

2.11.2

6 years ago

2.11.1

6 years ago

2.11.0

6 years ago

2.9.1

6 years ago

2.9.0

6 years ago

2.8.0

6 years ago

2.7.0

6 years ago

2.3.2

6 years ago

2.3.1

6 years ago

2.3.0

6 years ago