Skip to content

Commit

Permalink
EWPP-4085: Add mega menu variant to navigation menu pattern.
Browse files Browse the repository at this point in the history
  • Loading branch information
@22Alexandra
22Alexandra committed Apr 3, 2024
1 parent 2478bfd commit b9d3ecc
Show file tree
Hide file tree
Showing 12 changed files with 292 additions and 57 deletions.
2 changes: 1 addition & 1 deletion .drone.yml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ services:
pipeline:
ecl-build:
group: prepare
image: git.fpfis.tech.ec.europa.eu/fpfis/dependency_proxy/containers/node:21
image: git.fpfis.tech.ec.europa.eu/fpfis/dependency_proxy/containers/node:18.18.2
commands:
# To build the theme using a development version of ECL set its development branch in .env.dist
# and make sure that ECL_BUILD is set to "dev".
Expand Down
2 changes: 1 addition & 1 deletion docker-compose.yml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ services:
- '4444'
shm_size: 2g
node:
image: node:21
image: node:18.18.2
user: "node"
working_dir: /home/node/app
environment:
Expand Down
2 changes: 1 addition & 1 deletion modules/oe_theme_helper/templates/oe-theme-helper-site-navigation.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,4 +15,4 @@
close: close,
items: menu_items,
site_name: site_name,
}, 'vertical') }}
}, 'default') }}
99 changes: 50 additions & 49 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,56 +14,57 @@
"prepare": "patch-package"
},
"dependencies": {
"@ecl/builder": "4.0.2",
"@ecl/preset-ec": "4.0.2",
"@ecl/preset-eu": "4.0.2",
"@ecl/preset-reset": "4.0.2",
"@ecl/builder": "4.1.0",
"@ecl/preset-ec": "4.1.0",
"@ecl/preset-eu": "4.1.0",
"@ecl/preset-reset": "4.1.0",
"@ecl/stylelint-config": "0.2.1",
"@ecl/theme-ec": "4.0.2",
"@ecl/theme-eu": "4.0.2",
"@ecl/twig-component-accordion": "4.0.2",
"@ecl/twig-component-banner": "4.0.2",
"@ecl/twig-component-blockquote": "4.0.2",
"@ecl/twig-component-breadcrumb": "4.0.2",
"@ecl/twig-component-button": "4.0.2",
"@ecl/twig-component-card": "4.0.2",
"@ecl/twig-component-carousel": "4.0.2",
"@ecl/twig-component-content-item": "4.0.2",
"@ecl/twig-component-datepicker": "4.0.2",
"@ecl/twig-component-description-list": "4.0.2",
"@ecl/twig-component-expandable": "4.0.2",
"@ecl/twig-component-fact-figures": "4.0.2",
"@ecl/twig-component-featured-item": "4.0.2",
"@ecl/twig-component-file": "4.0.2",
"@ecl/twig-component-gallery": "4.0.2",
"@ecl/twig-component-icon": "4.0.2",
"@ecl/twig-component-inpage-navigation": "4.0.2",
"@ecl/twig-component-label": "4.0.2",
"@ecl/twig-component-link": "4.0.2",
"@ecl/twig-component-list-illustration": "4.0.2",
"@ecl/twig-component-media-container": "4.0.2",
"@ecl/twig-component-menu": "4.0.2",
"@ecl/twig-component-navigation-list": "4.0.2",
"@ecl/twig-component-news-ticker": "4.0.2",
"@ecl/twig-component-notification": "4.0.2",
"@ecl/twig-component-page-header": "4.0.2",
"@ecl/twig-component-pagination": "4.0.2",
"@ecl/twig-component-radio": "4.0.2",
"@ecl/twig-component-search-form": "4.0.2",
"@ecl/twig-component-select": "4.0.2",
"@ecl/twig-component-site-footer": "4.0.2",
"@ecl/twig-component-site-header": "4.0.2",
"@ecl/twig-component-skip-link": "4.0.2",
"@ecl/twig-component-social-media-follow": "4.0.2",
"@ecl/twig-component-social-media-share": "4.0.2",
"@ecl/twig-component-splash-page": "4.0.2",
"@ecl/twig-component-table": "4.0.2",
"@ecl/twig-component-tabs": "4.0.2",
"@ecl/twig-component-tag": "4.0.2",
"@ecl/twig-component-text-input": "4.0.2",
"@ecl/twig-component-timeline": "4.0.2",
"@ecl/vanilla-utility-background": "4.0.2",
"@ecl/vanilla-utility-border": "4.0.2",
"@ecl/theme-ec": "4.1.0",
"@ecl/theme-eu": "4.1.0",
"@ecl/twig-component-accordion": "4.1.0",
"@ecl/twig-component-banner": "4.1.0",
"@ecl/twig-component-blockquote": "4.1.0",
"@ecl/twig-component-breadcrumb": "4.1.0",
"@ecl/twig-component-button": "4.1.0",
"@ecl/twig-component-card": "4.1.0",
"@ecl/twig-component-carousel": "4.1.0",
"@ecl/twig-component-content-item": "4.1.0",
"@ecl/twig-component-datepicker": "4.1.0",
"@ecl/twig-component-description-list": "4.1.0",
"@ecl/twig-component-expandable": "4.1.0",
"@ecl/twig-component-fact-figures": "4.1.0",
"@ecl/twig-component-featured-item": "4.1.0",
"@ecl/twig-component-file": "4.1.0",
"@ecl/twig-component-gallery": "4.1.0",
"@ecl/twig-component-icon": "4.1.0",
"@ecl/twig-component-inpage-navigation": "4.1.0",
"@ecl/twig-component-label": "4.1.0",
"@ecl/twig-component-link": "4.1.0",
"@ecl/twig-component-list-illustration": "4.1.0",
"@ecl/twig-component-media-container": "4.1.0",
"@ecl/twig-component-mega-menu": "4.1.0",
"@ecl/twig-component-menu": "4.1.0",
"@ecl/twig-component-navigation-list": "4.1.0",
"@ecl/twig-component-news-ticker": "4.1.0",
"@ecl/twig-component-notification": "4.1.0",
"@ecl/twig-component-page-header": "4.1.0",
"@ecl/twig-component-pagination": "4.1.0",
"@ecl/twig-component-radio": "4.1.0",
"@ecl/twig-component-search-form": "4.1.0",
"@ecl/twig-component-select": "4.1.0",
"@ecl/twig-component-site-footer": "4.1.0",
"@ecl/twig-component-site-header": "4.1.0",
"@ecl/twig-component-skip-link": "4.1.0",
"@ecl/twig-component-social-media-follow": "4.1.0",
"@ecl/twig-component-social-media-share": "4.1.0",
"@ecl/twig-component-splash-page": "4.1.0",
"@ecl/twig-component-table": "4.1.0",
"@ecl/twig-component-tabs": "4.1.0",
"@ecl/twig-component-tag": "4.1.0",
"@ecl/twig-component-text-input": "4.1.0",
"@ecl/twig-component-timeline": "4.1.0",
"@ecl/vanilla-utility-background": "4.1.0",
"@ecl/vanilla-utility-border": "4.1.0",
"chokidar-cli": "3.0.0",
"grunt": "1.6.1",
"grunt-contrib-copy": "1.0.0",
Expand Down
0 ...+twig-component-content-block+4.0.2.patch → ...+twig-component-content-block+4.1.0.patch
View file
File renamed without changes.
0 patches/@ecl+twig-component-file+4.0.2.patch → patches/@ecl+twig-component-file+4.1.0.patch
View file
File renamed without changes.
0 patches/@ecl+twig-component-menu+4.0.2.patch → patches/@ecl+twig-component-menu+4.1.0.patch
View file
File renamed without changes.
0 ...cl+twig-component-site-footer+4.0.2.patch → ...cl+twig-component-site-footer+4.1.0.patch
View file
File renamed without changes.
0 patches/@ecl+twig-component-tabs+4.0.2.patch → patches/@ecl+twig-component-tabs+4.1.0.patch
View file
File renamed without changes.
2 changes: 1 addition & 1 deletion templates/navigation/menu--main.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,6 @@
label: 'Menu'|t,
close: close,
items: links,
variant: 'vertical',
variant: 'default',
}) }}
{% endif %}
83 changes: 79 additions & 4 deletions templates/patterns/navigation_menu/navigation_menu.ui_patterns.yml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,12 @@ navigation_menu:
label: "Navigation menu"
description: "Default implementation of the main navigation menu."
variants:
vertical:
label: "Vertical"
description: "Menu items will be arranged vertically, in 4 columns."
default:
label: "Default"
description: "Default variant uses the ECL menu component."
mega_menu:
label: "Mega menu"
description: "Mega menu variant uses the ECL Mega menu component."
fields:
label:
type: "text"
Expand Down Expand Up @@ -89,7 +92,36 @@ navigation_menu:
- name: "extra-attr2"
value: "extra value2"
is_current: TRUE
external: true
see_all: true
children:
- href: "#"
label: 'Granchild 2.1.1'
is_current: TRUE
- href: "#"
label: 'Granchild 2.1.2'
external: true
- href: "#"
label: 'Granchild 2.1.3'
- href: "#"
label: 'Granchild 2.1.4'
- href: "#"
label: 'Granchild 2.1.5'
external: true
featured:
title: "featured column 1"
content:
'#markup': "<article class=\"ecl-navigation-list__item\">\n <picture class=\"ecl-picture ecl-navigation-list__picture\"><img class=\"ecl-navigation-list__image\" src=\"https://inno-ecl.s3.amazonaws.com/media/examples/example-image.jpg\" alt=\"Alt text for the image\" /></picture>\n <div class=\"ecl-content-block ecl-navigation-list__content-block\" data-ecl-auto-init=\"ContentBlock\" data-ecl-content-block>\n <div class=\"ecl-content-block__title\" data-ecl-title-link><a href=\"/example#qspea\" class=\"ecl-link ecl-link--standalone\">Title 1</a></div>\n <div class=\"ecl-content-block__description\">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus gravida ipsum ut lorem cursus</div>\n </div>\n </article>"
items:
- href: "#"
label: "Featured link 2.1.1"
is_current: TRUE
- href: "#"
label: "Featured link 2.1.2"
- href: "#"
label: "Featured link 2.1.3"
- href: "#"
label: "Featured link 2.1.4"
external: true
- href: '#'
label: 'Application of EU law'
- href: '#'
Expand All @@ -113,9 +145,52 @@ navigation_menu:
- href: "#"
label: "Live, work, study"
external: true
children:
- href: '#'
label: 'Child 6.1'
see_all: false
children:
- href: "#"
label: 'Granchild 6.1.1'
is_current: TRUE
- href: "#"
label: 'Granchild 6.1.2'
external: true
- href: "#"
label: 'Granchild 6.1.3'
- href: "#"
label: 'Granchild 6.1.4'
- href: "#"
label: 'Granchild 6.1.5'
external: true
featured:
title: "featured column 2"
content:
'#markup': "<article class=\"ecl-navigation-list__item\">\n <picture class=\"ecl-picture ecl-navigation-list__picture\"><img class=\"ecl-navigation-list__image\" src=\"https://inno-ecl.s3.amazonaws.com/media/examples/example-image.jpg\" alt=\"Alt text for the image\" /></picture>\n <div class=\"ecl-content-block ecl-navigation-list__content-block\" data-ecl-auto-init=\"ContentBlock\" data-ecl-content-block>\n <div class=\"ecl-content-block__title\" data-ecl-title-link><a href=\"/example#qspea\" class=\"ecl-link ecl-link--standalone\">Title 2</a></div>\n <div class=\"ecl-content-block__description\">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus gravida ipsum ut lorem cursus</div>\n </div>\n </article>"
items:
- href: "#"
label: "Featured link 6.1.1"
is_current: TRUE
- href: "#"
label: "Featured link 6.1.2"
- href: "#"
label: "Featured link 6.1.3"
- href: "#"
label: "Featured link 6.1.4"
external: true
- href: '#'
label: 'Child 6.2'
- href: '#'
label: 'Child 6.3'
- href: '#'
label: 'Child 6.4'
- href: '#'
label: 'Child 6.5'
- href: "#"
label: "Visit a European Union institution"
- href: "#"
label: "Jobs & traineeships in EU institutions"
- href: "#"
label: "Participate, interact, vote"
container:
'#markup': "<article class=\"ecl-navigation-list__item\">\n <picture class=\"ecl-picture ecl-navigation-list__picture\"><img class=\"ecl-navigation-list__image\" src=\"https://inno-ecl.s3.amazonaws.com/media/examples/example-image.jpg\" alt=\"Alt text for the image\" /></picture>\n <div class=\"ecl-content-block ecl-navigation-list__content-block\" data-ecl-auto-init=\"ContentBlock\" data-ecl-content-block>\n <div class=\"ecl-content-block__title\" data-ecl-title-link><a href=\"/example#qspea\" class=\"ecl-link ecl-link--standalone\">Title 3</a></div>\n <div class=\"ecl-content-block__description\">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus gravida ipsum ut lorem cursus</div>\n </div>\n </article>"
Loading

0 comments on commit b9d3ecc

Please sign in to comment.