fix(cxl-ui): fix mobile layout issues in course pages

[github-actions[bot]]

size-limit report 📦

Path	Size
packages/cxl-ui/pkg/dist-web/cxl-ui.js	69.68 KB (-0.05% 🔽)
packages/cxl-ui/pkg/dist-web/cxl-ui-jwplayer.js	11.89 KB (0%)
packages/cxl-ui/pkg/dist-web/cxl-ui-playbooks.js	28.83 KB (-0.12% 🔽)
packages/cxl-ui/pkg/dist-web/vendor.js	140.5 KB (0%)
packages/cxl-ui/pkg/dist-web/cxl-ui-jwplayer.js, packages/cxl-ui/pkg/dist-web/cxl-ui-playbooks.js, packages/cxl-ui/pkg/dist-web/cxl-ui.js, packages/cxl-ui/pkg/dist-web/manifest.js, packages/cxl-ui/pkg/dist-web/unresolved.js, packages/cxl-ui/pkg/dist-web/vendor.js	252.05 KB (-0.03% 🔽)

[freudFlintstone]

Task linked: CU-86aykudx5 Deployment of new component

[anoblet]

This looks good! It seems you have a better idea of the issue and could have it solved quicker. Should we revert this commit? https://github.com/conversionxl/aybolit/commit/73a306b4358fb4b5bf6922a826c0a4a22f24c3c8

[freudFlintstone]

This looks good! It seems you have a better idea of the issue and could have it solved quicker. Should we revert this commit? 73a306b

@anoblet I definitely wish I had understood the issue faster. But this is not a proper fix, it's just a workaround, since we still don't know what's causing the overflow.

Do not revert the other commit. It fixes a real issue that would have the same effect. The reason I thought it was the only cause is that it fixed it in local development.

[pawelkmpt]

@anoblet I tested the code on live, fixed one issue @freudFlintstone introduced (missing card styles due the removal of @import clause).

I also deleted b5a9f3893cd75f89778092d148ff316f656336e3 with overflow: hidden for cxl-app-layout as it's just hiding an issue, not solving it and also can cause problems in other places.

This code is live on blog and institute.

[anoblet]

This seems to fix https://cxl.com/webinars. On Institute pages we still have a horizontal scroll which I can't seem to find in inspector.