mirror of
https://github.com/zulip/zulip.git
synced 2025-10-31 03:53:50 +00:00
64b78ad992
On a high-DPI display or with a non-default zoom level, the browser viewport may have a width strictly between md_max = 767px and md_min = 768px. Use only the *_min bounds for consistency. This requires queries with strict inequalities to express upper bounds (width < md_min). Fortunately, that functionality is provided by range context queries. Unfortunately, those are not supported in all browsers. Fortunately, we can compile them away using postcss-media-minmax. Unfortunately, postcss-media-minmax currently subtracts 1px for strict inequalities anyway to work around a Safari rounding bug. Fortunately, 0.02px should be sufficient for that, so I submitted a PR: https://github.com/postcss/postcss-media-minmax/pull/28 Signed-off-by: Anders Kaseorg <anders@zulip.com>
18 lines
432 B
JavaScript
18 lines
432 B
JavaScript
"use strict";
|
|
|
|
const {media_breakpoints} = require("./static/js/css_variables.js");
|
|
|
|
module.exports = {
|
|
plugins: {
|
|
// Warning: despite appearances, order is significant
|
|
"postcss-nested": {},
|
|
"postcss-extend-rule": {},
|
|
"postcss-simple-vars": {
|
|
variables: media_breakpoints,
|
|
},
|
|
"postcss-calc": {},
|
|
"postcss-media-minmax": {},
|
|
autoprefixer: {},
|
|
},
|
|
};
|