Footer JS-based responsiveness on pages without the sidebar is unnecessary

[obulat]

Current Situation

The footer layout needs to account for the sidebar width (if any) to make its layout responsive. This is achieved by using the JS-based responsiveness. However, this is not necessary on pages that do not have a sidebar, and lead to a layout shifts on the homepage.

Suggested Improvement

Audit the footer layout responsiveness, and only add it on the search layout with the sidebar.

Benefit

Improved performance and less layout shifting.

Additional context

[dhruvkb]

@obulat instead of JS-based responsiveness on pages with a sidebar and regular media queries in pages without a sidebar, i think using container queries consistently in both scenarios would be the better approach.

[obulat]

I agree, @dhruvkb. This looks like a good guide on implementing container queries while also supporting older browsers: https://web.dev/blog/how-to-use-container-queries-now
We'll need to create a solution that works with Tailwind

[dhruvkb]

Tailwind supports container queries with an official plugin. I hadn't considered that older browsers will need workarounds, thanks for the guide! Based on Can I use, it seems like the feature is supported for ~93% of users.