GWT GSS светлее () и темнее ()

Я пытался использовать lighten() и darken() в GSS (версия gwt 2.8 и материал rc4) примерно так:

@def MAIN_COLOR #64b5f6;
@def LIGHTER_COLOR lighter(MAIN_COLOR, 0.5);

.lighter {
color: LIGHTER_COLOR;
}

но результат

.lighter {
color: lighter(#64b5f6,0.5)
}

я не могу найти ни одного примера использования этих функций. https://github.com/google/closure-stylesheets

я ожидал, что эти работают как в SASS

$primary-color: #64b5f6;
$darken: darken($primary-color, 7%);
$lighten: lighten($primary-color, 20%);

Благодарю.

1 ответ

Я не могу воспроизвести ваше точное поведение, но мне удалось получить рабочий пример и нашел следующее:

  • Имя функции lighten
  • Функция осветления принимает целое число от 0 до 100 в качестве величины для осветления. Это задокументировано прямо в коде на GitHub.

Я попытался изменить ваш пример следующим образом, и он работает нормально:

@def MAIN_COLOR #64b5f6;
@def LIGHTER_COLOR lighten(MAIN_COLOR, 5);

.lighter {
color: LIGHTER_COLOR;
}

Это оценивается с использованием последней версии таблиц стилей закрытия (прямо сейчас, v1.4.0), чтобы стать следующим:

.lighter{color:#7cc1f7}

Я ожидаю, что это процентное увеличение яркости - это метод, который я использую в своем собственном цветовом программном обеспечении, и, как правило, это то же самое, что и другие функции подсветки / затемнения CSS-препроцессора, поэтому вам, возможно, придется поиграть, чтобы получить именно тот оттенок, который вы ищете. за.

Я надеюсь, что это работает для вас.

Другие вопросы по тегам