fix: collapse header when scroll in tablet or less

[lauramargar]

EMP-1185

Pull request template

Describe the purpose of the change, the specific changes done in detail, and the issue you have fixed.

Motivation and context

• Dependencies. If any, specify:
• Open issue. If applicable, link:

Type of change

• Bug fix (non-breaking change that fixes an issue)
• New feature (non-breaking change that adds functionality)
• Breaking change (fix or feature that causes existing functionality to not work as expected)
• Change requires a documentation update

What is the destination branch of this PR?

• Main
• Other. Specify:

How has this been tested?

Tests performed according to testing guidelines:

Checklist:

• My code follows the style guidelines of this project.
• I have performed a self-review on my own code.
• I have commented my code, particularly in hard-to-understand areas.
• I have made corresponding changes to the documentation.
• My changes generate no new warnings.
• I have added tests that prove my fix is effective or that my feature works.
• New and existing unit tests pass locally with my changes.

[jenkins-empathy]

PR #297 preview deployed in https://x.test.empathy.co/preview/297/index.html

[annacv]

Hi! We could move the "x-layout-item" class to the container <div> to keep the structure more similar to desktop, but up to you!

[lauramargar]

I have already tried to move the "x-layout-item" class to the <div>, but it makes the collapse not working properly. It collapses like in 2 steps instead of in 1.

[annacv]

🚀