SaraSoueidan

/**
 * Mixin scrollbar
 */
@mixin scrollbar($size, $primary, $secondary: lighten($primary, 25%)) {
  ::-webkit-scrollbar {
		width:  $size;
		height: $size;
	}

	::-webkit-scrollbar-thumb {

SaraSoueidan

@function makelongshadow($color) {
  $val: 0px 0px $color;
  @for $i from 1 through 200 {
    $val: #{$val}, #{$i}px #{$i}px #{$color};
  }
  @return $val;
}
/*usage*/
@mixin longshadow($color) {
  text-shadow: makelongshadow($color);

SaraSoueidan

/*
 * Minimal classList shim for IE 9
 * By Devon Govett
 * MIT LICENSE
 */


if (!("classList" in document.documentElement) && Object.defineProperty && typeof HTMLElement !== 'undefined') {
    Object.defineProperty(HTMLElement.prototype, 'classList', {
        get: function() {

SaraSoueidan

/**
 * Cross Browser helper to addEventListener.
 *
 * @param {HTMLElement} obj The Element to attach event to.
 * @param {string} evt The event that will trigger the binded function.
 * @param {function(event)} fnc The function to bind to the element. 
 * @return {boolean} true if it was successfuly binded.
 */
var cb_addEventListener = function(obj, evt, fnc) {
    // W3C model

SaraSoueidan

function whichTransitionEvent(){
    var t;
    var el = document.createElement('fakeelement');
    var transitions = {
      'transition':'transitionend',
      'MSTransition':'msTransitionEnd',
      'MozTransition':'transitionend',
      'WebkitTransition':'webkitTransitionEnd'
    }

SaraSoueidan

//addEventListener polyfill 1.0 / Eirik Backer / MIT Licence
(function(win, doc){
	if(win.addEventListener)return;		//No need to polyfill

	function docHijack(p){var old = doc[p];doc[p] = function(v){return addListen(old(v))}}
	function addEvent(on, fn, self){
		return (self = this).attachEvent('on' + on, function(e){
			var e = e || win.event;
			e.preventDefault  = e.preventDefault  || function(){e.returnValue = false}
			e.stopPropagation = e.stopPropagation || function(){e.cancelBubble = true}

SaraSoueidan

/**
 * Loading animation like the one seen on http://www.freeger.com/projects/contextad/ with CSS
 * Caveat: Not DRY. The content needs to be repeated in a data- attribute (or directly in the CSS).
 */

body {
	background: #ccc51c;
	min-height: 100%;
}

SaraSoueidan

::-webkit-input-placeholder { /* WebKit browsers */
    color:    rgba(white, .2);
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    rgba(white, .2);
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    rgba(white, .2);
}
:-ms-input-placeholder { /* Internet Explorer 10+ */

SaraSoueidan

<div id="lines" class="btn"></div>

SaraSoueidan

.accesiblyhidden {
    position: absolute;
    width: 1px; /* Setting this to 0 make it invisible for VoiceOver */
    height: 1px; /* Setting this to 0 make it invisible for VoiceOver */
    padding: 0;
    margin: -1px;
    border: 0;
    clip: rect(0 0 0 0);
    overflow: hidden;
}