marciobarrios

// For Glory with ♥

$names: green, carrot, blue;
$colors: #2ecc71, #2ecc71, #3498db;
$tints: 20, 60, 80;
$shades: 20, 40, 60;

@function shade($color, $amount: 50%) {
  @if $color == transparent { $color: rgba(white, 0); }
  @return mix($color, black, $amount);

marciobarrios

/* Testing how to put a pseudo-element behind its parent */
div {
	width: 5em;
	height: 5em;
	background: red;
	margin: 5em auto;
}

div:before {
	content: "";

marciobarrios

.item:before,
.item:after {
    content: " ";
    display: table;
}
.item:after {
    clear: both;
}
  .item-media {
    float: left;

marciobarrios

var htmlDecode = function(value){
  return $('<div/>').html(value).text();
}

marciobarrios

/* Some JS tips: http://www.html5rocks.com/en/mobile/fullscreen/ */

/* Inertia scrolling
   More info: http://css-tricks.com/snippets/css/momentum-scrolling-on-ios-overflow-elements */
.whatever {
  -webkit-overflow-scrolling: touch;
}

/* Remove flick effect when using delegated events
   More info: http://stackoverflow.com/questions/17173723/how-to-solve-flicker-on-ipad-when-event-delegation-is-used */

marciobarrios

var iOS = /(iPad|iPhone|iPod)/g.test( navigator.userAgent );

marciobarrios

git log --color --graph --pretty=format:'%Cred%h%Creset -%C(yellow)%d%Creset %s %Cgreen(%cr) %C(bold blue)<%an>%Creset' --abbrev-commit

# To create a git alias (git lg) paste this in the terminal:

git config --global alias.lg "log --color --graph --pretty=format:'%Cred%h%Creset -%C(yellow)%d%Creset %s %Cgreen(%cr) %C(bold blue)<%an>%Creset' --abbrev-commit"

marciobarrios

@mixin breakpoint($point) {
  @if $point == large {
    @media (min-width: 64.375em) { @content; }
  }
  @else if $point == medium {
    @media (min-width: 50em) { @content; }
  }
  @else if $point == small {
    @media (min-width: 37.5em)  { @content; }
  }

marciobarrios

@mixin image-2x($image, $width, $height) {
  @media (min--moz-device-pixel-ratio: 1.3),
         (-o-min-device-pixel-ratio: 2.6/2),
         (-webkit-min-device-pixel-ratio: 1.3),
         (min-device-pixel-ratio: 1.3),
         (min-resolution: 1.3dppx) {
    /* on retina, use image that's scaled by 2 */
    background-image: url($image);
    background-size: $width $height;
  }

marciobarrios

/**
 * Spinner adjustments, original by Gloria Langreo (http://dabblet.com/gist/6163594)
 */

* { margin: 0; padding: 0; }
body { background-color: #434343; text-align:center; padding: 2em; }

.spinner { display: inline-block; margin-left: -2px; }
.spinner li {
	display: inline-block;