Skip to content

Instantly share code, notes, and snippets.

View clintfisher's full-sized avatar

Clint Fisher clintfisher

  • Los Angeles Times
  • Los Angeles
View GitHub Profile

Sass/Less Comparison

In this document I am using Sass's SCSS syntax. You can choose to use the indented syntax in sass, if you prefer it, it has no functional differences from the SCSS syntax.

For Less, I'm using the JavaScript version because this is what they suggest on the website. The ruby version may be different.

Variables

@bentruyman
bentruyman / Custom.css
Created August 22, 2011 19:35
Tomorrow Theme for Chrome Developer Tools
/**********************************************/
/*
/* Tomorrow Skin by Ben Truyman - 2011
/*
/* Based on Chris Kempson's Tomorrow Theme:
/* https://github.com/ChrisKempson/Tomorrow-Theme
/*
/* Inspired by Darcy Clarke's blog post:
/* http://darcyclarke.me/design/skin-your-chrome-inspector/
/*
@anthonyshort
anthonyshort / gist:1178298
Created August 29, 2011 12:31
Prefixing with Sass
@mixin border-radius($radius, $prefixes: -moz -webkit -o) {
@each $prefix in $prefixes {
#{$prefix}-border-radius:$radius;
}
border-radius:$radius;
}
#id {
@include border-radius(5px, -moz -webkit);
@lucasfais
lucasfais / gist:1207002
Created September 9, 2011 18:46
Sublime Text 2 - Useful Shortcuts

Sublime Text 2 – Useful Shortcuts (Mac OS X)

General

⌘T go to file
⌘⌃P go to project
⌘R go to methods
⌃G go to line
⌘KB toggle side bar
⌘⇧P command prompt
@peterwilsoncc
peterwilsoncc / gradient.less
Created September 21, 2011 02:04
conditional values in LESS CSS
.gradient(@start: #dddddd, @end: #ffffff, @background: 'set to start') {
//awful code - less can't access outer scope
@s: @start;
@b: @background;
background-color: ~`(this.b.toJS() == "'set to start'")?this.s.toJS():this.b.toJS()`;
background-image: -moz-linear-gradient(top, @start, @end);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, @start),color-stop(1, @end));
background-image: linear-gradient(top, @start, @end);
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorStr='%d', EndColorStr='%d')", @start, @end));
@peterwilsoncc
peterwilsoncc / 320up.less
Created November 29, 2011 23:53
“Mobile first” CSS and getting LESS to help with legacy IE
.320up(){
.three20 {
color: #fff;
}
} /* end 320up mixin */
/*
@scottkellum
scottkellum / normalized.html
Created December 6, 2011 14:58
pixel normalization
<!doctype html>
<html>
<head>
<!-- Encoding -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"></meta>
@rickharris
rickharris / _shared.scss
Created December 18, 2011 17:02
Media queries with IE support using Sass 3.2 features
// Using this structure, this file should be your canonical stylesheet where
// everything would be imported into, so that you can just `@import "shared";`
// in both your normal and IE stylesheets, only having to add libraries and
// such in one place.
// These styles are just a contrived example.
body {
font-size: 18px;
@include respond-to(desktops) {
color: blue;
@CristinaSolana
CristinaSolana / gist:1885435
Created February 22, 2012 14:56
Keeping a fork up to date

1. Clone your fork:

git clone git@github.com:YOUR-USERNAME/YOUR-FORKED-REPO.git

2. Add remote from original repository in your forked repository:

cd into/cloned/fork-repo
git remote add upstream git://github.com/ORIGINAL-DEV-USERNAME/REPO-YOU-FORKED-FROM.git
git fetch upstream
@jexchan
jexchan / multiple_ssh_setting.md
Created April 10, 2012 15:00
Multiple SSH keys for different github accounts

Multiple SSH Keys settings for different github account

create different public key

create different ssh key according the article Mac Set-Up Git

$ ssh-keygen -t rsa -C "your_email@youremail.com"