cristianferrarig

Background Stretch

Legal Values:

target -> Is the container with css background or contain img child

type -> 'css', 'img'

@author Cristian Ferrari <cristianferrarig@gmail.com> || @energettico

cristianferrarig

Add a caret to any element.

You can set the size, color, position and alignment of caret and border color and border size.

Legal Values:

position -> 'top', 'rigth', 'bottom' and 'left' align -> 'start', 'middle' and 'end' (also suppor unit measures)

cristianferrarig

Sublime Text Packages

for admin packages use http://wbond.net/sublime_packages/package_control

Efficiency

---

Synced Side Bar

cristianferrarig

{

  // Theme and color scheme

  "theme": "predawn.sublime-theme",
  "color_scheme": "Packages/Predawn/predawn.tmTheme",
  "tabs_medium": true,

  "predawn_findreplace_small": false,
  "predawn_quick_panel_small": true,

cristianferrarig

Media Query Variables

@author Cristian Ferrari <cristianferrarig@gmail.com> || @energettico

Licensed under WTFPL.

SCSS usage:

// Usage

cristianferrarig

/* See http://mrdanadams.com/2012/pixel-ems-css-conversion-sass-mixin/ */

/* Default font size in pixels if not overridden. */
$baseFontSize: 16px;

/* Remove PX units to prevent sass errors
(inspired by https://gist.github.com/moyarich/3260638)
Ex: $base: remove-px($base);
*/
@function remove-px($target){

cristianferrarig

// extract to https://gist.github.com/moyarich/3260638

@function remove-unit($target){
  $one:1;
  @if not unitless($target){
    // Find out the unit of measurement being used
    @if     (unit($target) == "px"){ $one:1px; }
    @elseif (unit($target) == "em"){ $one:1em; }
    @elseif (unit($target) == "%" ){ $one:1%;  }
    // Dividing by the same unit forces sass to return a value with no unit

cristianferrarig

@media
only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5) {
  // Styles
}

cristianferrarig

// jQuery mode
if (window.devicePixelRatio > 1) {
  $('body').addClass('retina');
}
 
// Only javascript mode
if (window.devicePixelRatio > 1) {
  var elHtml = document.getElementsByTagName('html')[0];
  var atrClass = elHtml.getAttribute('class');
      atrClass = atrClass + ' retina';

cristianferrarig

var elHtml = document.getElementsByTagName('html')[0], initialClass = elHtml.getAttribute('class');
function deviceType() {
  var deviceType;
  if ("devicePixelRatio" in window && window.devicePixelRatio > 1) { deviceType = ' retina'; }
  else { deviceType = ' no-retina'; }
  return deviceType;
}
function deviceOrientation() {
  var deviceOrientation;
  if (Math.abs(window.orientation) === 90) { deviceOrientation = ' landscape'; }