scss: prevent max-width media queries to include the threshold value

[maxlath]

to avoid having both rules below and above the threshold to apply at the same time.

max-width and min-width are inclusive comparators (<= and >=), there is unforunately no strict comparators (< and >). An other work around would be with the not operator, but that makes queries more verbose and less readeable See https://stackoverflow.com/questions/48601618/strict-inequality-in-css-media-queries

PR extracted from #353, see previous discussion https://github.com/inventaire/inventaire-client/pull/353#pullrequestreview-1196531252

[maxlath]

There ARE actually strict comparators since Media Queries Level 4, and as the updated stylelint highlighted with lint errors.

In 9ccaa16a0, I replaced the prefix notation by context notation, and introduced the convention to only use 2 operators: >= and < so that no threshold value can be shared between 2 media queries.