Sass VS min(), max(), clamp(). Или как препроцессоры мешают новым возможностям CSS
Недавно у CSS появилась достаточная поддержка функций гибких размеров min(), max() и clamp(). Поддержка на данный момент составляет 85%, где 79% - полная поддержка, 6% - частичная.
Какие браузеры относятся к 6%? Сафари некоторых предыдущих версий. Для заказчиков сайтов 6% пользователей Сафари > 14% пользователей таких браузеров как IE или Opera Mini, у которых нету поддержки этих замечательных функций, поскольку яблочники в целом более платёжеспособны. Поэтому игнорировать эту проблему не стоит.
В чём заключается частичность поддержки и какие есть решения? В этих браузерах среди всех 3-ёх функций гибких размеров не работает clamp(), то есть работают только min() и max(). Это значит, что, записав max( MIN, min( VAL, MAX ) ), результат будет, что и clamp( MIN, VAL, MAX ).
Но что нас ожидает, если мы будем пользоваться Sass? Если мы будем применять функции min(), max(), то компилятор будет ругаться: "Internal Error: Incompatible units: 'vw' and 'px'", то есть эти единицы измерения - несовместимы. На clamp() такая беда не распространяется.
Какие есть решения? На недавно вышедшей статье на Хабре "О конфликтах Sass и сравнительно новых возможностей CSS" есть объяснения причины ошибки и вариант преодоления бага. Дело в том, что у Sass есть свои встроенные функции min() и max(), поэтому при просмотре .sass-кода компилятор расценивает min() и max() как свои, а не CSS-овские.
Решение есть, но с нюансом. Sass, будучи чувствительным к регистру, а CSS - нет, не воспримет записи, например Min() или Max(). То есть записав что-то наподобие Min(28px, 4.1vw ) и компилятор не наругает нас, и Нюанс заключается в том, что запись Max( MIN, Min( VAL, MAX ) ) скомпилируется, но в браузере работать не будет :(
Моя цель:
- использовать одновременно препроцессор Sass и
- функции гибких размеров
min()иmax(), - а, если понадобиться, то и запись
max( MIN, min( VAL, MAX ) )
Понимаю, что технология нова, многие на данный момент о ней не слышали, а те, кто слышали не обязательно попробовали, а те, кто попробовали - не обязательно попробовали в полной мере. Но это на данный момент, на лето 2020 года. Поэтому ответ готов услышать и через года.