Мне удалось воспроизвести эту проблему. Похоже, это ошибка в R2.
Если компилятору передан опция :rtl, он прогоняет CSS через R2, и тот выполняет магические преобразования для RTL.
Это работает отлично, но по какой-то причине мы, кажется, попадаем в пограничный случай, когда R2 возвращает искажённый CSS. Мы используем паттерн для создания эффекта плавного появления (fade) для мобильных навигационных меню, и он выглядит так.
Это не единственное место, где мы его используем; это просто пример.
Кажется, этот паттерн слишком сложен для R2. Мы вызываем функцию RGBA и передаём ей CSS-переменную, а также добавляем стоп-точки (stops).
Когда этот код проходит через R2, он возвращает что-то вроде этого.
Когда эта опция отключена (даже в локальной сборке с RTL), мы получаем следующее:
![]()
Искажённый CSS сбивает компилятор с толку, и он сворачивает любой CSS, идущий после этого правила, в бесполезный код, который никогда не применяется.
Таким образом, несколько таблиц стилей после этой никогда не загружаются на мобильных устройствах в режиме RTL. Одна из них — таблица стилей карточки пользователя.
Я попробовал упростить этот паттерн, убрав стоп-точки, и, кажется, это сработало. То есть мы переходим от этого:
background: linear-gradient(
to right,
rgba(var(--secondary-rgb), 0) 0%,
rgba(var(--secondary-rgb), 1) 100%
);
к этому:
background: linear-gradient(
to right,
rgba(var(--secondary-rgb), 0),
rgba(var(--secondary-rgb), 1)
);
Это не вызовет никаких визуальных изменений, так как эти стоп-точки являются значениями по умолчанию, но проблема будет решена.
Я отправил PR, чтобы обновить этот паттерн во всех местах его использования здесь.
Спасибо за сообщение об этой проблеме @nildarar ![]()
