Sass и округление чисел. Это можно настроить? - PullRequest
Новая
       38

Sass и округление чисел. Это можно настроить?

8 голосов
/ 06 октября 2011

Могу ли я изменить способ, которым Sass будет обрабатывать десятичные разряды? Я видел, как несколько человек говорили, что Sass будет динамически выполнять вычисления (target / parent) * 100, необходимые для адаптивных макетов, и выводить результат во время компиляции. У него даже есть процентная функция, которая по существу будет принимать два значения и делать это.

Увы, Сасс даст мне только 3 знака после запятой. До этого момента я понимал, что в некоторых случаях это может быть недостаточной степенью точности для всех браузеров для правильного отображения макета без каких-либо сбоев.

Может кто-нибудь помочь мне разобраться в этом?

EDIT

решаемая. Если кому-то еще это интересно, мне удалось выполнить то, что я хотел, в number.rb Сасса, изменив значение @precision. Это изменяет способ вывода всех чисел с плавающей запятой.

Ответы [ 3 ]

14 голосов
/ 31 июля 2012

Если вы используете Compass, вы можете легко указать точность в файле вашего проекта (config.rb) без взлома ядра: 

Sass::Script::Number.precision = 8

Для получения дополнительной информации см. Документация Sass

5 голосов
/ 07 ноября 2011

Его также можно настроить с помощью --precision в командной строке, см. SASS Changelog, версия 3.1.8 .

Следует также добавить, что если вы хотите редактировать @precision в numbers.rb напрямую, вы можете найти numbers.rb (по крайней мере, в OS X), здесь: 

/usr/lib/ruby/user-gems/1.8/gems/sass-3.1.10/lib/sass/script

1.8 и 3.1.10, конечно, должны быть заменены вашими (желательно последними) номерами версий.

0 голосов
/ 07 октября 2016

Сначала установите точность по умолчанию на максимальную точность, необходимую для вашего проекта.

Затем используйте функцию, подобную приведенной ниже (которая основана на этой функции от Takeru Suzuki ), чтобы настроить количество десятичных знаков на уровне отдельных свойств.

Код: 

@function decimal-round ($number, $digits: 0, $mode: round) {
    $n: 1;
    // $number must be a number
    @if type-of($number) != number {
        @warn '#{ $number } is not a number.';
        @return $number;
    }
    // $digits must be a unitless number
    @if type-of($digits) != number {
        @warn '#{ $digits } is not a number.';
        @return $number;
    } @else if not unitless($digits) {
        @warn '#{ $digits } has a unit.';
        @return $number;
    }
    @if $digits > 0 {
        @for $i from 1 through $digits {
            $n: $n * 10;
        }
    }
    @if $mode == round {
        @return round($number * $n) / $n;
    } @else if $mode == ceil {
        @return ceil($number * $n) / $n;
    } @else if $mode == floor {
        @return floor($number * $n) / $n;
    } @else {
        @warn '#{ $mode } is undefined keyword.';
        @return $number;
    }
}

Выход: 

decimal-round(0.333)    => 0
decimal-round(0.333, 1) => 0.3
decimal-round(0.333, 2) => 0.33
decimal-round(0.666)    => 1
decimal-round(0.666, 1) => 0.7
decimal-round(0.666, 2) => 0.67
...