aarongarciah

###Strip units

@function strip-unit($number) {
  @if type-of($number) == 'number' and not unitless($number) {
    @return $number / ($number * 0 + 1);
  }

  @return $number;
}

aarongarciah

###Fluid properties (via)

@mixin fp($property, $min, $max, $start: 320, $end: breakpoint('desktop'), $clip: true, $clipAtStart: true, $clipAtEnd: true) {
	$start: $start / ($start * 0 + 1);
	$end: $end / ($end * 0 + 1);
	$multiplier: ($max - $min) / ($end - $start) * 100;
	$adder: ($min * $end - $max * $start) / ($end - $start);
	$formula: calc(#{$multiplier + 0vw} + #{$adder + 0px});
	@if $clip and $clipAtStart {
		@media (max-width: #{$start + 0px}) {

aarongarciah

clearTimeout($.data(this, 'scrollTimer'));
$.data(this, 'scrollTimer', setTimeout(function() {
  // Do something
  console.log('Haven\'t scrolled in 250ms!');
}, 250));

aarongarciah

See what you’ve been working on today (tweet by @csswizardry)

git log --since="00:00:00" --no-merges --oneline --author=<you@email.com>

http://wesbos.com/git-hot-tips/

git add -p

Rather than git add everything or individual files, this -p will allow you to step through each change, or hunk, and decide if you’d like to commit it. This is really handy if you have made two different changes to the same file and want to commit them separately.

aarongarciah

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()

aarongarciah

/**
 * http://applemusic.tumblr.com/
 * https://jsfiddle.net/xq56dmrh/
 */

/** Ultra Light */
@font-face {
  font-family: "San Francisco";
  font-weight: 100;
  src: url("https://applesocial.s3.amazonaws.com/assets/styles/fonts/sanfrancisco/sanfranciscodisplay-ultralight-webfont.woff");

aarongarciah

Resources Flexbox

• W3C
• Using CSS flexible boxes
• A Complete Guide to Flexbox
• Flexbox cheatsheet
• Flexbox syntax for IE 10
• CSS Flexbox
• Flexplorer
• Flexyboxes

aarongarciah

/***** Selector though hack ******/
 
/* Only for IE6 and below */
* html div { color: gray }
 
 
/* Only for IE7 */
*:first-child+html div { color: gray } 
 
 

aarongarciah

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class MY_Config extends CI_Config {

    public function __construct()
    {
        $this->config =& get_config();

        // Set the base_url automatically if none was provided

aarongarciah

sudo ntpdate -u ntp.ubuntu.com