mirror of
https://github.com/zulip/zulip.git
synced 2025-11-06 23:13:25 +00:00
af401fe659
Ironically, I think this might've bee introduced by commit ca35321c02d5e79e4f9c439a662805c016a333ed, 'Fix "resizing window breaks in Firefox" issue'. Basically, when the window is 776px wide according to window.innerWidth, that's the width not including the scrollbar. However, in Chrome, the media query seems to ignore the width of the scrollbar, so from the CSS's perspective, the window is actually ~766px wide, so it goes into condensed mode. But the rest of our code doesn't, which causes the break. A bit more on this browser-specific difference at: http://www.456bereastreet.com/archive/201101/media_queries_viewport_width_scrollbars_and_webkit_browsers/ So the issue we have is, to match the CSS's behavior: * In Firefox, we should be listening to window.innerWidth * In Chrome, we should be listening to window.width We fix this hopefully once and for all by using window.matchMedia -- aka the exact same query that the CSS itself uses. As discussed in my last commit, this feature is unavailable in IE<10, so we provide a potentially more fragile fallback, i.e. what we did before this commit. (imported from commit d8e6425b81c90c8e0fdda28e7273988c9bfd67ec)