Skip to content

Instantly share code, notes, and snippets.

View bjankord's full-sized avatar
🎵
Chillin'

Brett Jankord bjankord

🎵
Chillin'
View GitHub Profile
@tylersticka
tylersticka / chrome-webfont-fix.js
Last active August 29, 2015 13:57
Quick and dirty fix for Chrome 32/33 webfont issue.
/**
* Chrome 32/33 webfont issue fix.
* Requires jQuery.
* More info: http://blog.cloudfour.com/chrome-webfont-issues/
*/
(function($, window){
// only proceed if this is Chrome
if (window.navigator.userAgent.indexOf('Chrome') === -1) return;
// only proceed if the version is 32 or greater
@lhid
lhid / Every-Module-Ever-Scaffold-.markdown
Last active August 29, 2015 14:03
A Pen by Dave Rupert.
@adactio
adactio / datalist.html
Created January 9, 2011 17:24
Progressive enhancement with datalist
<!DOCTYPE html>
<title>Datalist test</title>
<meta charset="utf-8">
<form>
<label for="source">How did you hear about us?</label>
<datalist id="sources">
<select name="source">
<option>please choose...</option>
<option value="television">Television</option>
<option value="radio">Radio</option>
@m90
m90 / matchMedia version
Created April 24, 2012 15:50
modernizr media query testing and hair pulling
window.matchMedia = window.matchMedia || (function(doc, undefined){
var bool,
docElem = doc.documentElement,
refNode = docElem.firstElementChild || docElem.firstChild,
// fakeBody required for <FF4 when executed in <head>
fakeBody = doc.createElement('body'),
div = doc.createElement('div');
div.id = 'mq-test-1';
@elwinschmitz
elwinschmitz / define-breakpoints-once.html
Created April 25, 2012 08:24
Define media-query breakpoints only once
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Single point of breakpoint-definition</title>
<style>
/*
Baseline:
*/
@boriskaiser
boriskaiser / gist:3908158
Created October 17, 2012 21:02
Easy retina-ready images using SCSS + Compass
@mixin background-2x($background, $file: 'png'){
$image: #{$background+"."+$file};
$image2x: #{$background+"2x."+$file};
background: image-url($image) no-repeat;
@media (min--moz-device-pixel-ratio: 1.3),
(-o-min-device-pixel-ratio: 2.6/2),
(-webkit-min-device-pixel-ratio: 1.3),
(min-device-pixel-ratio: 1.3),
(min-resolution: 1.3dppx){
anonymous
anonymous / gist:4355633
Created December 21, 2012 20:37
@mixin respond-to($media) {
if $media == medium-screens {
@media only screen and (min-width: $breakMedium + 1) { @content; }
}
@else if $media == wide-screens {
@media only screen and (min-width: $breakLarge + 1) { @content; }
html.lt-ie9 & { // Using Paul Irish's conditional comments for IE8 and below
@content;
}
}
@micahgodbolt
micahgodbolt / SassMeister-input.scss
Created June 24, 2013 16:08
Another stab at Filament Group's Element Query challenge.
// ---
// Sass (v3.2.9)
// ---
@mixin respond-to($queries...) {
$length: length($queries);
@for $i from 1 through $length{
@if $i % 2 == 1 {
@media screen and (min-width: nth($queries, $i)) {
@JohnAlbin
JohnAlbin / _init.scss
Last active December 26, 2015 18:09
Handing IE8 and lower with Breakpoint + compass/support
// Initialize the Sass variables and partials used in this project.
// Set the legacy IE support variables. We override the default values set by
// the compass/support partial, but let styles-ie8.scss override these values.
$legacy-support-for-ie6 : false !default;
$legacy-support-for-ie7 : false !default; // Note the use of !default.
$legacy-support-for-ie8 : false !default;
// Partials to be shared with all .scss files.
@cahnory
cahnory / _split.scss
Created December 4, 2013 10:41
Split rule by selectors
@mixin split($selectors...) {
@each $selector in $selectors {
#{$selector} {
@content;
}
}
}