Skip to content

Commit

Permalink
fix(site header harmonised): Using ecl-buttons as in the other famili…
Browse files Browse the repository at this point in the history 
…es - FRONT-3503 (#2284)

Co-authored-by: Romain Emery <emery.romain@gmail.com>
  • Loading branch information
@planctus @emeryro
planctus and emeryro authored Dec 14, 2021
1 parent cace89b commit 4ec32b4
Show file tree
Hide file tree
Showing 3 changed files with 101 additions and 87 deletions.
36 changes: 18 additions & 18 deletions .../twig/components/site-header-harmonised/__snapshots__/site-header-harmonised.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ exports[`Site Header Harmonised Group 1 renders correctly 1`] = `
<a
aria-controls="login-box-id"
aria-expanded="false"
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__login-toggle"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__login-toggle"
data-ecl-login-toggle=""
href="/example"
>
Expand Down Expand Up @@ -82,7 +82,7 @@ exports[`Site Header Harmonised Group 1 renders correctly 1`] = `
<a
aria-controls="language-list-overlay"
aria-label="English"
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__language-selector"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__language-selector"
data-ecl-language-selector=""
href="/example"
>
Expand Down Expand Up @@ -112,7 +112,7 @@ exports[`Site Header Harmonised Group 1 renders correctly 1`] = `
<a
aria-controls="search-form-id"
aria-expanded="false"
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__search-toggle"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__search-toggle"
data-ecl-search-toggle="true"
href="/example"
>
Expand Down Expand Up @@ -1784,7 +1784,7 @@ exports[`Site Header Harmonised Group 1 renders correctly when logged in 1`] = `
<a
aria-controls="login-box-id"
aria-expanded="false"
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__login-toggle"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__login-toggle"
data-ecl-login-toggle=""
href="/example"
>
Expand Down Expand Up @@ -1832,7 +1832,7 @@ exports[`Site Header Harmonised Group 1 renders correctly when logged in 1`] = `
<a
aria-controls="language-list-overlay"
aria-label="English"
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__language-selector"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__language-selector"
data-ecl-language-selector=""
href="/example"
>
Expand Down Expand Up @@ -1862,7 +1862,7 @@ exports[`Site Header Harmonised Group 1 renders correctly when logged in 1`] = `
<a
aria-controls="search-form-id"
aria-expanded="false"
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__search-toggle"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__search-toggle"
data-ecl-search-toggle="true"
href="/example"
>
Expand Down Expand Up @@ -3536,7 +3536,7 @@ exports[`Site Header Harmonised Group 1 renders correctly with extra attributes
<a
aria-controls="login-box-id"
aria-expanded="false"
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__login-toggle"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__login-toggle"
data-ecl-login-toggle=""
href="/example"
>
Expand Down Expand Up @@ -3584,7 +3584,7 @@ exports[`Site Header Harmonised Group 1 renders correctly with extra attributes
<a
aria-controls="language-list-overlay"
aria-label="English"
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__language-selector"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__language-selector"
data-ecl-language-selector=""
href="/example"
>
Expand Down Expand Up @@ -3614,7 +3614,7 @@ exports[`Site Header Harmonised Group 1 renders correctly with extra attributes
<a
aria-controls="search-form-id"
aria-expanded="false"
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__search-toggle"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__search-toggle"
data-ecl-search-toggle="true"
href="/example"
>
Expand Down Expand Up @@ -5286,7 +5286,7 @@ exports[`Site Header Harmonised Group 1 renders correctly with extra class names
<a
aria-controls="login-box-id"
aria-expanded="false"
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__login-toggle"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__login-toggle"
data-ecl-login-toggle=""
href="/example"
>
Expand Down Expand Up @@ -5334,7 +5334,7 @@ exports[`Site Header Harmonised Group 1 renders correctly with extra class names
<a
aria-controls="language-list-overlay"
aria-label="English"
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__language-selector"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__language-selector"
data-ecl-language-selector=""
href="/example"
>
Expand Down Expand Up @@ -5364,7 +5364,7 @@ exports[`Site Header Harmonised Group 1 renders correctly with extra class names
<a
aria-controls="search-form-id"
aria-expanded="false"
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__search-toggle"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__search-toggle"
data-ecl-search-toggle="true"
href="/example"
>
Expand Down Expand Up @@ -7033,7 +7033,7 @@ exports[`Site Header Harmonised Group 2 renders correctly 1`] = `
<a
aria-controls="language-list-overlay"
aria-label="English"
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__language-selector"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__language-selector"
data-ecl-language-selector=""
href="/example"
>
Expand Down Expand Up @@ -7063,7 +7063,7 @@ exports[`Site Header Harmonised Group 2 renders correctly 1`] = `
<a
aria-controls="search-form-id"
aria-expanded="false"
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__search-toggle"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__search-toggle"
data-ecl-search-toggle="true"
href="/example"
>
Expand Down Expand Up @@ -8710,7 +8710,7 @@ exports[`Site Header Harmonised Group 2 renders correctly with extra attributes
<a
aria-controls="language-list-overlay"
aria-label="English"
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__language-selector"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__language-selector"
data-ecl-language-selector=""
href="/example"
>
Expand Down Expand Up @@ -8740,7 +8740,7 @@ exports[`Site Header Harmonised Group 2 renders correctly with extra attributes
<a
aria-controls="search-form-id"
aria-expanded="false"
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__search-toggle"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__search-toggle"
data-ecl-search-toggle="true"
href="/example"
>
Expand Down Expand Up @@ -10385,7 +10385,7 @@ exports[`Site Header Harmonised Group 2 renders correctly with extra class names
<a
aria-controls="language-list-overlay"
aria-label="English"
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__language-selector"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__language-selector"
data-ecl-language-selector=""
href="/example"
>
Expand Down Expand Up @@ -10415,7 +10415,7 @@ exports[`Site Header Harmonised Group 2 renders correctly with extra class names
<a
aria-controls="search-form-id"
aria-expanded="false"
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__search-toggle"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__search-toggle"
data-ecl-search-toggle="true"
href="/example"
>
Expand Down
57 changes: 29 additions & 28 deletions src/implementations/twig/components/site-header-harmonised/site-header-harmonised.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -235,7 +235,7 @@
<div class="ecl-site-header-harmonised__login-container">
{% if _logged %}
<a
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__login-toggle"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__login-toggle"
href="{{ _login_toggle.href_logged }}"
aria-controls="{{ _login_box.id }}"
data-ecl-login-toggle
Expand Down Expand Up @@ -272,31 +272,32 @@
link: {
label: _login_box.label,
path: _login_box.href,
type: "standalone"
},
type: 'standalone',
}
} only %}
</div>
{% else %}
<a
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__login-toggle"
href="{{ _login_box.href_not_logged }}"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__login-toggle"
href="{{ _login_toggle.href_not_logged }}"
>
{% include '@ecl/icon/icon.html.twig' with {
icon: {
path: _icon_file_path,
name: 'log-in',
size: 's'
},
extra_classes: 'ecl-site-header-harmonised__icon',
extra_classes: 'ecl-site-header-harmonised__icon',
} only %}
{{- login_toggle.label_not_logged -}}
</a>
{% endif %}
</div>
{% endif %}
{% if _language_selector is not empty %}
{# Language selector #}
<a
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__language-selector"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__language-selector"
href="{{ _language_selector.href }}"
data-ecl-language-selector
aria-label="{{ _language_selector.label }}"
Expand All @@ -305,40 +306,40 @@
{% endif %}
>
<span class="ecl-site-header-harmonised__language-icon">
{% include '@ecl/icon/icon.html.twig' with {
icon: {
path: _icon_file_path,
name: 'language',
size: 's'
},
extra_classes: 'ecl-site-header-harmonised__icon',
} only %}
{% include '@ecl/icon/icon.html.twig' with {
icon: {
path: _icon_file_path,
name: 'language',
size: 's'
},
extra_classes: 'ecl-site-header-harmonised__icon',
} only %}
<span class="ecl-site-header-harmonised__language-code">{{ _language_selector.code }}</span>
</span>
{{- _language_selector.label -}}
{{- _language_selector.label -}}
</a>
{% endif %}
{% if _search_form is defined %}
<div class="ecl-site-header-harmonised__search-container">
{% if _search_toggle is not empty %}
<a
class="ecl-link ecl-link--standalone ecl-site-header-harmonised__search-toggle"
class="ecl-button ecl-button--ghost ecl-site-header-harmonised__search-toggle"
href="{{ _search_toggle.href }}"
data-ecl-search-toggle="true"
aria-controls="search-form-id"
aria-expanded="false"
>
{%- include '@ecl/icon/icon.html.twig' with {
icon: {
name: 'search',
path: _icon_file_path,
size: 's',
extra_attributes: [
{ name: 'aria-hidden', value: true }
],
}
} only -%}
{{- _search_toggle.label -}}
{%- include '@ecl/icon/icon.html.twig' with {
icon: {
name: 'search',
path: _icon_file_path,
size: 's',
extra_attributes: [
{ name: 'aria-hidden', value: true }
],
}
} only -%}
{{- _search_toggle.label -}}
</a>
{% endif %}
{% include '@ecl/search-form/search-form.html.twig' with _search_form only %}
Expand Down
Loading

1 comment on commit 4ec32b4

@github-actions
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚀 Deployed on https://v3--europa-component-library.netlify.app

Please sign in to comment.