- commit
- d6d2b699b9f432b4eb73529a844ef688b15757ac
- parent
- 4f394448178e0b4b5d800d7a71133ddb1016cc7c
- Author
- Tobias Bengfort <tobias.bengfort@gmx.net>
- Date
- 2016-04-01 13:57
make default colorspace configurable
Diffstat
| M | sass/color.scss | 39 | +++++++++++++++++++++------------------ |
1 files changed, 21 insertions, 18 deletions
diff --git a/sass/color.scss b/sass/color.scss
@@ -12,6 +12,9 @@ 12 12 /// @group color 13 13 //// 14 14 -1 15 /// @type string -1 16 $planifolia-colorspace: 'lab' !default; -1 17 15 18 @function _planifolia-perc($x) { 16 19 @return if(unit($x) == '%', $x / 100%, $x); 17 20 } @@ -171,7 +174,7 @@ 171 174 /// @require pow 172 175 /// @require sqrt 173 176 /// @require atan2174 -1 @function _planifolia-to-lch($color, $colorspace: 'lab') {-1 177 @function _planifolia-to-lch($color, $colorspace: $planifolia-colorspace) { 175 178 @if $colorspace == 'lab' { 176 179 $xyz: _planifolia-to-xyz($color); 177 180 $lab: _planifolia-xyz-to-lab($xyz); @@ -202,7 +205,7 @@ 202 205 /// @require pow 203 206 /// @require sin 204 207 /// @require cos205 -1 @function lch($lightness, $chroma, $hue, $colorspace: 'lab') {-1 208 @function lch($lightness, $chroma, $hue, $colorspace: $planifolia-colorspace) { 206 209 @if $colorspace == 'lab' { 207 210 $lab: _planifolia-lch-to-lab(($lightness, $chroma, $hue)); 208 211 $xyz: _planifolia-lab-to-xyz($lab); @@ -226,7 +229,7 @@ 226 229 /// @param {number} $alpha 227 230 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl' 228 231 /// @return {color}229 -1 @function lcha($lightness, $chroma, $hue, $alpha, $colorspace: 'lab') {-1 232 @function lcha($lightness, $chroma, $hue, $alpha, $colorspace: $planifolia-colorspace) { 230 233 @return rgba(lch($lightness, $chroma, $hue, $colorspace), $alpha); 231 234 } 232 235 @@ -234,7 +237,7 @@ 234 237 /// @param {color} $color 235 238 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl' 236 239 /// @return {number}237 -1 @function pf-lightness($color, $colorspace: 'lab') {-1 240 @function pf-lightness($color, $colorspace: $planifolia-colorspace) { 238 241 @return nth(_planifolia-to-lch($color, $colorspace), 1); 239 242 } 240 243 @@ -242,7 +245,7 @@ 242 245 /// @param {color} $color 243 246 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl' 244 247 /// @return {number}245 -1 @function pf-chroma($color, $colorspace: 'lab') {-1 248 @function pf-chroma($color, $colorspace: $planifolia-colorspace) { 246 249 @return nth(_planifolia-to-lch($color, $colorspace), 2); 247 250 } 248 251 @@ -250,7 +253,7 @@ 250 253 /// @param {color} $color 251 254 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl' 252 255 /// @return {angle}253 -1 @function pf-hue($color, $colorspace: 'lab') {-1 256 @function pf-hue($color, $colorspace: $planifolia-colorspace) { 254 257 @return nth(_planifolia-to-lch($color, $colorspace), 3); 255 258 } 256 259 @@ -261,7 +264,7 @@ 261 264 /// @param {angle} $hue [0] 262 265 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl' 263 266 /// @return {color}264 -1 @function pf-adjust-color($color, $lightness: 0, $chroma: 0, $hue: 0, $colorspace: 'lab') {-1 267 @function pf-adjust-color($color, $lightness: 0, $chroma: 0, $hue: 0, $colorspace: $planifolia-colorspace) { 265 268 $lch: _planifolia-to-lch($color, $colorspace); 266 269 267 270 $l: nth($lch, 1) + $lightness; @@ -278,7 +281,7 @@ 278 281 /// @param {angle} $hue [null] 279 282 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl' 280 283 /// @return {color}281 -1 @function pf-change-color($color, $lightness: null, $chroma: null, $hue: null, $colorspace: 'lab') {-1 284 @function pf-change-color($color, $lightness: null, $chroma: null, $hue: null, $colorspace: $planifolia-colorspace) { 282 285 $lch: _planifolia-to-lch($color, $colorspace); 283 286 284 287 $l: if($lightness == null, nth($lch, 1), $lightness); @@ -292,7 +295,7 @@ 292 295 /// @param {number} $angle 293 296 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl' 294 297 /// @return {color}295 -1 @function pf-adjust-hue($color, $angle, $colorspace: 'lab') {-1 298 @function pf-adjust-hue($color, $angle, $colorspace: $planifolia-colorspace) { 296 299 @return pf-adjust-color($color, $hue: $angle, $colorspace: $colorspace); 297 300 } 298 301 @@ -300,7 +303,7 @@ 300 303 /// @param {number} $amount 301 304 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl' 302 305 /// @return {color}303 -1 @function pf-lighten($color, $amount, $colorspace: 'lab') {-1 306 @function pf-lighten($color, $amount, $colorspace: $planifolia-colorspace) { 304 307 @return pf-adjust-color($color, $lightness: $amount, $colorspace: $colorspace); 305 308 } 306 309 @@ -308,7 +311,7 @@ 308 311 /// @param {number} $amount 309 312 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl' 310 313 /// @return {color}311 -1 @function pf-darken($color, $amount, $colorspace: 'lab') {-1 314 @function pf-darken($color, $amount, $colorspace: $planifolia-colorspace) { 312 315 @return pf-adjust-color($color, $lightness: -$amount, $colorspace: $colorspace); 313 316 } 314 317 @@ -316,7 +319,7 @@ 316 319 /// @param {number} $weight 317 320 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl' 318 321 /// @return {color}319 -1 @function pf-tint($color, $weight, $colorspace: 'lab') {-1 322 @function pf-tint($color, $weight, $colorspace: $planifolia-colorspace) { 320 323 @return pf-mix(white, $color, $weight, $colorspace); 321 324 } 322 325 @@ -324,7 +327,7 @@ 324 327 /// @param {number} $weight 325 328 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl' 326 329 /// @return {color}327 -1 @function pf-shade($color, $weight, $colorspace: 'lab') {-1 330 @function pf-shade($color, $weight, $colorspace: $planifolia-colorspace) { 328 331 @return pf-mix(black, $color, $weight, $colorspace); 329 332 } 330 333 @@ -332,7 +335,7 @@ 332 335 /// @param {number} $amount 333 336 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl' 334 337 /// @return {color}335 -1 @function pf-saturate($color, $amount, $colorspace: 'lab') {-1 338 @function pf-saturate($color, $amount, $colorspace: $planifolia-colorspace) { 336 339 @return pf-adjust-color($color, $chroma: $amount, $colorspace: $colorspace); 337 340 } 338 341 @@ -340,7 +343,7 @@ 340 343 /// @param {number} $amount 341 344 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl' 342 345 /// @return {color}343 -1 @function pf-desaturate($color, $amount, $colorspace: 'lab') {-1 346 @function pf-desaturate($color, $amount, $colorspace: $planifolia-colorspace) { 344 347 @return pf-adjust-color($color, $chroma: -$amount, $colorspace: $colorspace); 345 348 } 346 349 @@ -348,7 +351,7 @@ 348 351 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl' 349 352 /// @return {color} 350 353 /// @require pi351 -1 @function pf-complement($color, $colorspace: 'lab') {-1 354 @function pf-complement($color, $colorspace: $planifolia-colorspace) { 352 355 @return pf-adjust-hue($color, pi() * 1rad, $colorspace); 353 356 } 354 357 @@ -356,7 +359,7 @@ 356 359 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl' 357 360 /// @return {color} 358 361 /// @require pi359 -1 @function pf-grayscale($color, $colorspace: 'lab') {-1 362 @function pf-grayscale($color, $colorspace: $planifolia-colorspace) { 360 363 @return pf-change-color($color, $chroma: 0, $colorspace: $colorspace); 361 364 } 362 365 @@ -407,7 +410,7 @@ 407 410 /// @param {number} $weight [50%] 408 411 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl' 409 412 /// @return {color}410 -1 @function pf-mix($color1, $color2, $weight: 50%, $colorspace: 'lab') {-1 413 @function pf-mix($color1, $color2, $weight: 50%, $colorspace: $planifolia-colorspace) { 411 414 $lch1: _planifolia-to-lch($color1, $colorspace); 412 415 $lch2: _planifolia-to-lch($color2, $colorspace); 413 416