You're Invited:Meet the Socket Team at BlackHat and DEF CON in Las Vegas, Aug 7-8.RSVP
Socket
Socket
Sign inDemoInstall

@ecl/twig-component-banner

Package Overview
Dependencies
3
Maintainers
6
Versions
31
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

@ecl/twig-component-banner

ECL Banner


Version published
Weekly downloads
658
increased by26.3%
Maintainers
6
Created
Weekly downloads
 

Changelog

Source

4.4.0

:rocket: New Feature
  • #3471 feat(flags): Adding new non members flags - FRONT-4498 (@planctus)
  • #3465 feat(banner): new options and video - FRONT-4488 (@emeryro)
:warning: Markup Changes
  • #3486 feat(mega-menu): Adding aria-describedby in info link - FRONT-4520 (@planctus)
  • #3487 feat(mega-menu): Aria-describedby on featured column title - FRONT-4522 (@planctus)
  • #3484 feat(mega-menu): Aria-label on view all link - FONT-4516 (@planctus)
  • #3483 feat(mega-menu): Removing unneded aria-label - FRONT-4521 (@planctus)
  • #3482 feat(mega-menu): Supporting aria-labels for nested lists - FRONT-4515 (@planctus)
  • #3421 feat(form): update style of all form elements - FRONT-4432 (@emeryro)
  • #3372 feat(menu): add aria-current - FRONT-4405 (@emeryro)
  • #3465 feat(banner): new options and video - FRONT-4488 (@emeryro)
  • #3462 feat(search-form): Removing aria label, adding support for extra classes for the button and the input - FRONT-4479 (@planctus)
:warning: Data Changes
  • #3489 feat(social-media-follow): add position right - FRONT-4505 (@emeryro)
  • #3480 feat(pagination): update EU display - FRONT-4509 (@emeryro)
  • #3484 feat(mega-menu): Aria-label on view all link - FONT-4516 (@planctus)
  • #3483 feat(mega-menu): Removing unneded aria-label - FRONT-4521 (@planctus)
  • #3482 feat(mega-menu): Supporting aria-labels for nested lists - FRONT-4515 (@planctus)
  • #3431 feat(modal): update styles - FRONT-4453 (@emeryro)
  • #3465 feat(banner): new options and video - FRONT-4488 (@emeryro)
:nail_care: Enhancement
  • #3486 feat(mega-menu): Adding aria-describedby in info link - FRONT-4520 (@planctus)
  • #3489 feat(social-media-follow): add position right - FRONT-4505 (@emeryro)
  • #3490 feat(mega-menu): Making the hamburger a button with javascript - FRONT-4519 (@planctus)
  • #3480 feat(pagination): update EU display - FRONT-4509 (@emeryro)
  • #3488 feat(mega-menu): Not moving the focus when opening the menu - FRONT-4518 (@planctus)
  • #3485 feat(mega-menu): Handling focus on Esc - FRONT-4517 (@planctus)
  • #3481 docs(website): update color page - FRONT-4506 (@emeryro)
  • #3487 feat(mega-menu): Aria-describedby on featured column title - FRONT-4522 (@planctus)
  • #3484 feat(mega-menu): Aria-label on view all link - FONT-4516 (@planctus)
  • #3474 feat(button): setting height, using same values for padding in default and hover - FRONT-4499 (@planctus)
  • #3483 feat(mega-menu): Removing unneded aria-label - FRONT-4521 (@planctus)
  • #3482 feat(mega-menu): Supporting aria-labels for nested lists - FRONT-4515 (@planctus)
  • #3478 fix(file-upload): Button only taking the needed space - FRONT-4493 (@planctus)
  • #3477 feat(input): Using outline for focus style - FRONT-4504 (@planctus)
  • #3431 feat(modal): update styles - FRONT-4453 (@emeryro)
  • #3353 feat(media container): disable Youtube shortcuts - FRONT-4363 (@emeryro)
  • #3449 feat(tabs): EU styles - FRONT-4451 (@planctus)
  • #3473 feat(inpage-nav): improve mobile keyboard navigation - FRONT-4501 (@emeryro)
  • #3475 feat(video): homogenize track name - FRONT-4503 (@emeryro)
  • #3456 feat(twig): cleanup and update parameters - FRONT-4438 (@emeryro)
  • #3421 feat(form): update style of all form elements - FRONT-4432 (@emeryro)
  • #3450 feat(mega-menu): New info in mobile, mobile scroll, limiting element's height - FRONT-4447 (@planctus)
  • #3372 feat(menu): add aria-current - FRONT-4405 (@emeryro)
  • #3448 feat(list with illustration fact and figures): update styles - FRONT-4468 (@emeryro)
  • #3462 feat(search-form): Removing aria label, adding support for extra classes for the button and the input - FRONT-4479 (@planctus)
:house: Internal
Committers: 2

Readme

Source

ECL Banner

npm package: @ecl/twig-component-banner

npm install --save @ecl/twig-component-banner

Parameters

  • "size" (string) (default: 'm') Size of the banner (can be 's', 'm', 'l')
  • "font_size" (string) (default: 'm') Size of the title and description (can be 'm', 'l')
  • "font_color" (string) (default: 'dark') Color of the title and description (can be 'dark', 'light')
  • "box_background" (string) (default: 'light') Color of the box background (can be 'dark', 'light', 'none')
  • "title" (string or Link) (default: '') Title of banner
  • "picture" (object) (default: {}): Image for the banner, following ECL Picture structure
  • "video" (object) (default: {}): Video for the banner
    • "poster" (string) (default: ''): Image to be used as the video placeholder
    • "sources" (array) (default: []): format: [ { "src" (string) (default: ''), "type" (string) (default: ''), }, ... ],
    • "tracks" (array) (default: []): format: [ { "src" (string) (default: ''), "kind" (string) (default: ''), "src_lang" (string) (default: ''), "label" (string) (default: ''), }, ... ],
  • "sr_play" (string) (default: '') screen reader label for the play button
  • "sr_pause" (string) (default: '') screen reader label for the pause button
  • "credit" (string) (default: '') Credit for the image
  • "description" (string) (default: '') Description of banner
  • "horizontal" (string) (default: 'left') Horizontal box alignment (can be 'left', 'center', 'right')
  • "vertical" (string) (default: 'center') Vertical box alignment (can be 'top', 'center', 'bottom')
  • "full_width" (bools) (default: false) Extends the banner to whole viewport when used inside the grid
  • "link" (object) (default: predefined structure) predefined structure for the Link component
  • "icon_path" (string) (default: '') Path to the icons file
  • "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'

Example:

{% include '@ecl/banner/banner.html.twig' with {  
  title: {
    link: {
      label: 'Lorem ipsum dolor sit amet consectetuer adipiscin',
      path: '#example',
    },
  },
  description:
    'Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.',
  picture: {
    img: {
      src: 'url/path-to-image',
      alt: 'alternative text',
    },
  },
  credit: '© Copyright',
} %}

Keywords

FAQs

Package last updated on 16 Jul 2024

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc