Skip to content

Instantly share code, notes, and snippets.

View sturobson's full-sized avatar
:atom:
coding things

Stuart Robson sturobson

:atom:
coding things
View GitHub Profile
// Create a simple top to bottom linear gradient with a background-color backup
// The first argument, $color will be output as background-color: $color
//
// This yields a gradient that is 5% brighter on the top and 5% darker on the bottom
//
// +gradient-bg(#777)
//
// This yeilds a gradient where the bright and dark colors are shifted 10% from the original color.
// If you don't specify a third argument it will assign this value for the darkness too, keeping the gradient even.
//
@burnto
burnto / _image_replace.scss
Created February 25, 2011 06:59
Image replacement scss mixin
// Image replacement scss mixin
@mixin image_replace($img, $width, $height, $x: 0, $y: 0) {
display: block;
background: image-url($img) no-repeat $x $y;
width: $width;
height: $height;
overflow: hidden;
text-indent: -9999em;
}
@benbalter
benbalter / conditionally-load-jquery.js
Created April 4, 2011 18:05
Conditionally Load jQuery
// Conditionally Load jQuery (javascript)
// Source: https://gist.github.com/gists/902090/
var init, maybeLoadJq;
init = function() {
jQuery(document).ready(function() {
alert('Your Code Here');
});
};
/*
* Property prefix hacks
*/
/* IE6 only - any combination of these characters */
_ - £ ¬ ¦
/* IE6/7 only - any combination of these characters */
@YannickFricke
YannickFricke / gist:1263050
Created October 4, 2011 22:34 — forked from flipflop/gist:1263020
Mobile Detection with Optional Zepto / jQuery include
<?php
$deviceClass = "";
$graduateLevelClass = "";
if (ereg('iPhone',$_SERVER['HTTP_USER_AGENT']) || ereg('iPod',$_SERVER['HTTP_USER_AGENT'])) {
$deviceClass = "ui-iphone";
} else if (ereg('iPad',$_SERVER['HTTP_USER_AGENT'])) {
$deviceClass = "ui-ipad";
} else if (ereg('Android',$_SERVER['HTTP_USER_AGENT']) && ereg('Mobile Safari',$_SERVER['HTTP_USER_AGENT'])) {
$deviceClass = "ui-android";
};
innerWidth / innerHeight tests @ http://sandbox.thewikies.com/orientation/
--------------------------------------------------------------------------------
Tested (14 devices, 28 browsers):
Droid 2 Global Android 2.2
iPhone 4 iOS5 (Safari, Opera Mini)
Motorola Atrix Android 2.3.4 (Stock browser, Dolphin, Skyfire, Opera Mini, Firefox)
Samsung Galaxy S9000 Android 2.3 (Webkit, Opera Mobile)
Samsung Galaxy Y Android 2.3.5
@Victa
Victa / _media-object.scss
Created January 18, 2012 09:45
OOCSS media object - SCSS mixin
@mixin media-object($margin:10px, $position: left, $formating-context: 'overflow', $media: '.media', $block: '.block') {
@include pie-clearfix; // or extend a .clearfix class
#{unquote($block)} {
@if $formating-context == 'overflow' {
overflow:hidden;
} @else {
display:table-cell;
width:10000px;
*width:auto;
*zoom:1;
@robbyrussell
robbyrussell / ohmyzsh-dropbox-sync.sh
Created February 8, 2012 15:20
Keep your @ohmyzsh ~/.zshrc in sync via dropbox
# Was asked how I keep my zshrc config sync'd between my computers with Dropbox
# Add a new directory in your Dropbox (or use an existing one)
mkdir -p ~/Dropbox/ohmyzsh
# move existing file to Dropbox
mv ~/.zshrc ~/Dropbox/ohmyzsh/zshrc
# symlink file back to your local directory
ln -s ~/Dropbox/ohmyzsh/zshrc ~/.zshrc
@jeffjewiss
jeffjewiss / input.scss
Created March 14, 2012 16:32 — forked from twe4ked/input.scss
FREE! Sass (SCSS) mixin for including retina images (useful when developing for iOS).
@mixin background-image-retina($file, $type, $width, $height) {
background-image: url($file + '.' + $type);
@media (-webkit-min-device-pixel-ratio: 2) {
& {
background-image: url($file + '@2x.' + $type);
-webkit-background-size: $width $height;
}
}
}
@corydorning
corydorning / Cross-Browser ::before and ::after pseudo-class polyfill
Last active February 18, 2022 00:24
Cross-Browser ::before and ::after pseudo-class polyfill
/* =============================================================================
CSS Declarations
========================================================================== */
/* ==|== The Standard Way =================================================== */
.foo::before {
/* ...css rules... */
}