asvny

/**
 * follows a path on the given data to retrieve a value
 *
 * @example
 * var data = { foo : { bar : "abc" } };
 * followPath(data, "foo.bar"); // "abc"
 * 
 * @param  {Object} data the object to get a value from
 * @param  {String} path a path to a value on the data object
 * @return the value of following the path on the data object

asvny

Function.prototype._curry = function (f=this) {
  return (...args) => args.length < f.length
    ? f._curry(args.reduce((g, arg) => g.bind(null, arg), f)) 
    : f.apply(null, args);
};

asvny

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout. This is also called reflow or layout thrashing, and is common performance bottleneck.

Element

Box metrics

• elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
• elem.clientLeft, elem.clientTop, elem.clientWidth, elem.clientHeight
• elem.getClientRects(), elem.getBoundingClientRect()

asvny

exessiveSpring = "spring(200, 15, -3)"
gentleSpring = "spring(40, 5, 0)"
swingSpring = "spring(120, 15, 0)"
smoothSpring = "spring(100, 20, 0)"
superSlowSpring = "spring(30, 20, 0)"
slowSpring = "spring(100, 15, -3)"
snapSpring = "spring(200, 20, 0)"
tightSpring = "spring(300, 25, 0)"
straightSpring = "spring(500, 40, 0)"

asvny

// ----
// libsass (v3.2.5)
// ----

$themes: (
  theme1: theme-light,
  theme2: theme-dark
);

@function setStyle($map, $object, $style) {

asvny

// ----
// libsass (v3.2.5)
// ----

$breakpoints: (
    small: 320px,
    medium: 600px,
    large: 768px
);
 

asvny

// ----
// libsass (v3.2.5)
// ----

$buttons: (
  error: (#d82d2d, #666),
  success: (#52bf4a, #fff),
  warning: (#c23435, #fff)
);
 

asvny

// ----
// libsass (v3.2.5)
// ----

$card_morph: (
  trans1:  200ms transform ease-in-out,
  trans2: 400ms background ease-in,
  trans3: 600ms color linear
);

asvny

//SCSS

$pages: ('home', 'about', 'products', 'contact'); 
$selector: ();

@each $item in $pages {
  $selector: append($selector, unquote('.#{$item} .nav-#{$item}'), 'comma');
}

#{$selector} {

asvny

@mixin gradientBorder($leftColor,$rightColor,$borderWidth)
{
   -webkit-appearance:none;
  border:none;
  background-image:linear-gradient(to right,$leftColor,$rightColor),linear-gradient(to right,$leftColor,$rightColor);
  outline:none;
  border-left:$borderWidth solid $leftColor;
  border-right:$borderWidth solid $rightColor;
  background-repeat:no-repeat;
  background-size:100% $borderWidth;