Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix(site header harmonised): Using ecl-buttons as in the other families - FRONT-3503 #2284

Merged
merged 5 commits into from
Dec 14, 2021
Merged

fix(site header harmonised): Using ecl-buttons as in the other families - FRONT-3503 #2284

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
05869ac
fix(site-header-harmonised): Aligning link/buttons with the other fam…
planctus Dec 9, 2021
b0b2060
Merge branch 'v3-dev' of github.com:ec-europa/europa-component-librar…
planctus Dec 10, 2021
3d0d039
Merge branch 'v3-dev' of github.com:ec-europa/europa-component-librar…
planctus Dec 10, 2021
baad2eb
Merge branch 'front-3503-site=header-harmonised' of github.com:ec-eur…
planctus Dec 10, 2021
57e286d
Merge branch 'v3-dev' into front-3503-site=header-harmonised
emeryro Dec 14, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
36 changes: 18 additions & 18 deletions .../twig/components/site-header-harmonised/__snapshots__/site-header-harmonised.test.js.snap
View file
Open in desktop
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
Open in desktop
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