Skip to content

Instantly share code, notes, and snippets.

View chriscoyier's full-sized avatar

Chris Coyier chriscoyier

View GitHub Profile
@chriseppstein
chriseppstein / 0_usage.scss
Created February 29, 2012 19:29
This is code that runs using Sass 3.2 prerelease and something like this will be in compass soon.
@include keyframes(appear-and-roundify) {
0% { opacity: 0; @include border-radius(2px); }
100% { opacity: 1; @include border-radius(10px); }
}
@jcroft
jcroft / layout.sass
Created March 1, 2012 04:51
How easy responsive design can be with Sass
#content-wrapper
+container
#about
// Default (smallest screens)
+column(100%)
background-color: #ccc
// Respond to other screen widths
@lessallan
lessallan / friendshiptest
Created March 24, 2012 00:28
@AllanBranch's Friendship Test
Each line below is worth a different point amount.
3 points = We've had a short phone call.
7 points = We've met in person, briefly.
12 points = We've met in person and shared a meal or had over an hour long discussion.
12 points = You've asked me about my family or wished me happy birthday, in person, phone or email.
100 points = We've shared a hotel room.
1 points = We've talked via a social network.
2 points = We've exchanged a few emails.
100 points = I've farted in front of you.
@tetsuok
tetsuok / answer_pic.go
Created April 2, 2012 02:40
An answer of the exercise: Slices on a tour of Go
package main
import "code.google.com/p/go-tour/pic"
func Pic(dx, dy int) [][]uint8 {
// Allocate two-dimensioanl array.
a := make([][]uint8, dy)
for i := 0; i < dy; i++ {
a[i] = make([]uint8, dx)
}
@simonsmith
simonsmith / lesscss-centre
Created April 13, 2012 13:45
Centre elements on both axis - LESSified version of http://goo.gl/UN80L
.center-container {
text-align: center;
&:before {
content: '';
display: inline-block;
height: 100%;
vertical-align: middle;
margin-right: -0.25em;
}
@0i0
0i0 / tomorrow-night.css
Created July 12, 2012 01:27
Code mirror tomorrow night theme
.CodeMirror-scroll {
height: 100%;
min-height:300px;
}
.cm-s-tomorrow-night{
font-family:'Menlo', 'Consolas', "Vera Mono", monospace;
font-size:12px;
}
.cm-s-tomorrow-night { background: none; color: hsl(140,2%,77%); }
@stryju
stryju / _normalize.scss
Created August 16, 2012 09:57
custom normalize
/*! normalize.css v1.0.0 | MIT License | git.io/normalize */
/*
* usage:
* @import "normalize";
*
* // this will print out ALL selectors
* @include normalize();
*
* // this will print out minimal set (*) -- you can see the list of "excluded" tags below
@tkadlec
tkadlec / gist:3645415
Created September 5, 2012 21:44
"View Desktop Layout" link for responsive sites
<html>
<head>
<title>Mobile First "View Desktop" Link</title>
<meta id="vp" name="viewport" content="width=device-width" />
<style type="text/css">
body{
font-family: Helvetica, sans-serif;
}
#toggle{
text-decoration: underline;
@KuraFire
KuraFire / rgbaa.scss
Created September 13, 2012 21:18
More dynamic, oldIE-compatible SCSS function for rgba
@function rgbaa($args...) {
// rgbaa(#FFF, .5)
@if length($args) == 2 {
$hex: nth($args, 1);
$alpha: nth($args, 2);
@if $oldIE == 1 {
@return rgb(red($hex), green($hex), blue($hex));
} @else {
@return rgba(red($hex), green($hex), blue($hex), $alpha);
@scottjehl
scottjehl / Vectron.txt
Created September 17, 2012 18:48
Vectron
/'
//
. //
|\//7
/' " \
. . .
| ( \
| '._ '
/ \'-'
____[\`---'/]____