mirror of
https://github.com/zulip/zulip.git
synced 2026-07-03 21:10:12 +08:00
c1675913a2
Ever since we started bundling the app with webpack, there’s been less and less overlap between our ‘static’ directory (files belonging to the frontend app) and Django’s interpretation of the ‘static’ directory (files served directly to the web). Split the app out to its own ‘web’ directory outside of ‘static’, and remove all the custom collectstatic --ignore rules. This makes it much clearer what’s actually being served to the web, and what’s being bundled by webpack. It also shrinks the release tarball by 3%. Signed-off-by: Anders Kaseorg <[email protected]>
56 lines
1.8 KiB
JavaScript
56 lines
1.8 KiB
JavaScript
import $ from "jquery";
|
|
|
|
import {user_settings} from "./user_settings";
|
|
|
|
// A few of our width properties in Zulip depend on the width of the
|
|
// browser scrollbar that is generated at the far right side of the
|
|
// page, which unfortunately varies depending on the browser and
|
|
// cannot be detected directly using CSS. As a result, we adjust a
|
|
// number of element widths based on the value detected here.
|
|
//
|
|
// From https://stackoverflow.com/questions/13382516/getting-scroll-bar-width-using-javascript
|
|
function getScrollbarWidth() {
|
|
const outer = document.createElement("div");
|
|
outer.style.visibility = "hidden";
|
|
outer.style.width = "100px";
|
|
outer.style.msOverflowStyle = "scrollbar"; // needed for WinJS apps
|
|
|
|
document.body.append(outer);
|
|
|
|
const widthNoScroll = outer.offsetWidth;
|
|
// force scrollbars
|
|
outer.style.overflow = "scroll";
|
|
|
|
// add inner div
|
|
const inner = document.createElement("div");
|
|
inner.style.width = "100%";
|
|
outer.append(inner);
|
|
|
|
const widthWithScroll = inner.offsetWidth;
|
|
|
|
// remove divs
|
|
outer.remove();
|
|
|
|
return widthNoScroll - widthWithScroll;
|
|
}
|
|
|
|
let sbWidth;
|
|
|
|
export function initialize() {
|
|
// Workaround for browsers with fixed scrollbars
|
|
sbWidth = getScrollbarWidth();
|
|
if (sbWidth > 0) {
|
|
// Reduce width of screen-wide parent containers, whose width doesn't vary with scrollbar width, by scrollbar width.
|
|
$("#navbar-container .header, #compose").css("width", `calc(100% - ${sbWidth}px)`);
|
|
}
|
|
set_layout_width();
|
|
}
|
|
|
|
export function set_layout_width() {
|
|
if (user_settings.fluid_layout_width) {
|
|
$(".header-main, .app .app-main, #compose-container").css("max-width", "inherit");
|
|
} else {
|
|
$(".header-main, .app .app-main, #compose-container").css("max-width", "1400px");
|
|
}
|
|
}
|