Sha256: 71c9daf69cf7d09cf00f5c9f4ed463de0569977091c221f813d5e097733dd4cc

Contents?: true

Size: 1.05 KB

Versions: 66

Compression:

Stored size: 1.05 KB

Contents

@function modular-scale($value, $increment, $ratio) {
  @if $increment > 0 {
    @for $i from 1 through $increment {
      $value: ($value * $ratio);
    }
  }

  @if $increment < 0 {
    $increment: abs($increment);
    @for $i from 1 through $increment {
      $value: ($value / $ratio);
    }
  }

  @return $value;
}

//  div {
//                     Increment Up GR with positive value
//   font-size:        modular-scale(14px,   1, 1.618); // returns: 22.652px
//
//                     Increment Down GR with negative value
//   font-size:        modular-scale(14px,  -1, 1.618); // returns: 8.653px
//
//                     Can be used with ceil(round up) or floor(round down)
//   font-size: floor( modular-scale(14px, 1, 1.618) ); // returns: 22px
//   font-size:  ceil( modular-scale(14px, 1, 1.618) ); // returns: 23px
//  }
//
// modularscale.com

@function golden-ratio($value, $increment) {
  @return modular-scale($value, $increment, 1.618)
}

//  div {
//    font-size: golden-ratio(14px, 1); // returns: 22.652px
//  }
//
// goldenratiocalculator.com

Version data entries

66 entries across 66 versions & 9 rubygems

Version Path
bourbon-3.1.5 app/assets/stylesheets/functions/_modular-scale.scss
bourbon-compass-3.1.4 stylesheets/bourbon/functions/_modular-scale.scss
bourbon-3.1.4 app/assets/stylesheets/functions/_modular-scale.scss
bourbon-compass-3.1.3 stylesheets/bourbon/functions/_modular-scale.scss
bourbon-3.1.3 app/assets/stylesheets/functions/_modular-scale.scss
bourbon-3.1.2.1 app/assets/stylesheets/functions/_modular-scale.scss
bourbon-compass-3.1.1 stylesheets/bourbon/functions/_modular-scale.scss
bourbon-3.1.1 app/assets/stylesheets/functions/_modular-scale.scss
bourbon-compass-3.1.0 stylesheets/bourbon/functions/_modular-scale.scss
bourbon-3.1.0 app/assets/stylesheets/functions/_modular-scale.scss
bourbon-compass-3.0.1 stylesheets/bourbon/functions/_modular-scale.scss
bourbon-3.0.1 app/assets/stylesheets/functions/_modular-scale.scss
bourbon-3.0.0 app/assets/stylesheets/functions/_modular-scale.scss
bourbon-compass-2.1.3 stylesheets/bourbon/functions/_modular-scale.scss
bourbon-2.1.3 app/assets/stylesheets/functions/_modular-scale.scss
bourbon-compass-2.1.2 stylesheets/bourbon/functions/_modular-scale.scss
bourbon-2.1.2 app/assets/stylesheets/functions/_modular-scale.scss
bourbon-compass-2.1.1.0 stylesheets/bourbon/functions/_modular-scale.scss
bourbon-2.1.1 app/assets/stylesheets/functions/_modular-scale.scss
bourbon-2.1.0 app/assets/stylesheets/functions/_modular-scale.scss