julienchazal

// the retina mixin. An example goes: .at2x(img/[email protected], 650px, 150px, top, left, no-repeat, scroll)
// Put the size that the image appears on a non-retina, e.g. if it's a 200px x 200px non-retina, that is the effective size. The @2x 400px x 400px is calculated automatically. The order to type it is width then height.
// A modification of the retina.js less mixin - https://github.com/imulus/retinajs


@highdpi: ~"(-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (min-resolution: 1.5dppx)";
.at2x(@path, @w: auto, @h: auto, @xpos: 0, @ypos: 0, @repeat: no-repeat, @attachment: scroll) {
  background-image: url(@path);
  background-position: @xpos @ypos;
  background-repeat: @repeat;

julienchazal

/* ========================================================================
 * Bootstrap: carousel.js v3.0.0
 * http://twbs.github.com/bootstrap/javascript.html#carousel
 * ========================================================================
 * Copyright 2012 Twitter, Inc.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *

julienchazal

// SOURCE : http://zerosixthree.se/vertical-align-anything-with-just-3-lines-of-css/

.vertical-align {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

julienchazal

/* ------------------------ */
/* LESS mixin for CSS arrow */
/* ------------------------ */

/* https://github.com/HugoGiraudel/LESS-Mixin-for-CSS-arrows

//Usage
 .arrow(size, color, direction, offset, border-size, border-color); 

Where

julienchazal

$('a[href^="#"]').on("click", function(){
    var the_id = $(this).attr("href");
    
    $('html, body').animate({
        scrollTop:$(the_id).offset().top
    }, 'slow');
    return false;
});

// si scroll dans un conteneur : 

julienchazal

@font-face {
    font-family: 'cicle_gorditagordita';
    src: url('fonts/Cicle_Gordita-webfont.eot');
    src: url('fonts/Cicle_Gordita-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Cicle_Gordita-webfont.woff') format('woff'),
         url('fonts/Cicle_Gordita-webfont.ttf') format('truetype'),
         url('fonts/Cicle_Gordita-webfont.svg#cicle_gorditagordita') format('svg');
    font-weight: normal;
    font-style: normal;

julienchazal

    /* jagged rotated font fix (filter for FF)*/
    -webkit-backface-visibility:hidden;
    outline: 1px solid transparent;
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");

julienchazal

Modernizr.load({
			  test: Modernizr.inputtypes && Modernizr.input.placeholder,
			  nope: 'scripts/polyfills/placeholders.jquery.min.js'
			});

julienchazal

$(this).find('.products_list').one("webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend", function() {
    // your code when the transition has finished
});

julienchazal

// iOs hack for clicking html tag or dynamically loaded elements 
    &.touch {
        cursor:pointer;
        // prevent android blue highlight on click
        -webkit-tap-highlight-color:  rgba(255, 255, 255, 0); 
    }