added rss feed in footer
[theme-danix.xyz.git] / assets / sass / bourbon / bourbon / library / _modular-scale.scss
CommitLineData
2d3ca553 1@charset "UTF-8";
2
3/// Increments up or down a defined scale and returns an adjusted value. This
4/// helps establish consistent measurements and spacial relationships throughout
5/// your project. We provide a list of commonly used scales as
6/// [pre-defined variables][scales].
7///
8/// [scales]: https://github.com/thoughtbot/bourbon/blob/master/core/bourbon/helpers/_scales.scss
9///
10/// @argument {number (unitless)} $increment
11/// How many steps to increment up or down the scale.
12///
13/// @argument {number (with unit) | list} $value [1em]
14/// The base value the scale starts at. Can also be set globally using the
15/// `modular-scale-base` key in the Bourbon settings.
16///
17/// @argument {number (unitless)} $ratio [1.25]
18/// The ratio the scale is built on. Can also be set globally using the
19/// `modular-scale-ratio` key in the Bourbon settings.
20///
21/// @return {number (with unit)}
22///
23/// @example scss
24/// .element {
25/// font-size: modular-scale(2);
26/// }
27///
28/// // CSS Output
29/// .element {
30/// font-size: 1.5625em;
31/// }
32///
33/// @example scss
34/// .element {
35/// margin-right: modular-scale(3, 2em);
36/// }
37///
38/// // CSS Output
39/// .element {
40/// margin-right: 3.90625em;
41/// }
42///
43/// @example scss
44/// .element {
45/// font-size: modular-scale(3, 1em 1.6em, $major-seventh);
46/// }
47///
48/// // CSS Output
49/// .element {
50/// font-size: 3em;
51/// }
52///
53/// @example scss
54/// // Globally change the base ratio
55/// $bourbon: (
56/// "modular-scale-ratio": 1.2,
57/// );
58///
59/// .element {
60/// font-size: modular-scale(3);
61/// }
62///
63/// // CSS Output
64/// .element {
65/// font-size: 1.728em;
66/// }
67///
68/// @require {function} _fetch-bourbon-setting
69
70@function modular-scale(
71 $increment,
72 $value: _fetch-bourbon-setting("modular-scale-base"),
73 $ratio: _fetch-bourbon-setting("modular-scale-ratio")
74) {
75 $v1: nth($value, 1);
76 $v2: nth($value, length($value));
77 $value: $v1;
78
79 // scale $v2 to just above $v1
80 @while $v2 > $v1 {
81 $v2: ($v2 / $ratio); // will be off-by-1
82 }
83 @while $v2 < $v1 {
84 $v2: ($v2 * $ratio); // will fix off-by-1
85 }
86
87 // check AFTER scaling $v2 to prevent double-counting corner-case
88 $double-stranded: $v2 > $v1;
89
90 @if $increment > 0 {
91 @for $i from 1 through $increment {
92 @if $double-stranded and ($v1 * $ratio) > $v2 {
93 $value: $v2;
94 $v2: ($v2 * $ratio);
95 } @else {
96 $v1: ($v1 * $ratio);
97 $value: $v1;
98 }
99 }
100 }
101
102 @if $increment < 0 {
103 // adjust $v2 to just below $v1
104 @if $double-stranded {
105 $v2: ($v2 / $ratio);
106 }
107
108 @for $i from $increment through -1 {
109 @if $double-stranded and ($v1 / $ratio) < $v2 {
110 $value: $v2;
111 $v2: ($v2 / $ratio);
112 } @else {
113 $v1: ($v1 / $ratio);
114 $value: $v1;
115 }
116 }
117 }
118
119 @return $value;
120}