Skip to content

Instantly share code, notes, and snippets.

@koycarraway
koycarraway / dabblet.css
Created March 26, 2012 22:21
The first commented line is your dabblet’s title
/**
* The first commented line is your dabblet’s title
*/
background: #f06;
background: linear-gradient(45deg, #f06, yellow);
min-height: 100%;
@koycarraway
koycarraway / gist:2583836
Created May 3, 2012 06:43 — forked from boucher/gist:1750368
Stripe sample checkout form
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>Stripe Sample Form</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.8.1/jquery.validate.min.js"></script>
<script type="text/javascript" src="https://js.stripe.com/v1/"></script>
<script type="text/javascript">
@koycarraway
koycarraway / Asset.js
Created January 11, 2013 14:46
Center Google Map (v3) during browser resize
var center;
function calculateCenter() {
center = map.getCenter();
}
google.maps.event.addDomListener(map, 'idle', function() {
calculateCenter();
});
google.maps.event.addDomListener(window, 'resize', function() {
map.setCenter(center);
});
@koycarraway
koycarraway / bg_animate_element.css
Created January 11, 2013 14:52
Background Animate Element
.foo {
background: url('../path/to/image.jpg');
background-color: #e6eff2;
@include animate(animate-bg, 18s, 0, linear, both);
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
@koycarraway
koycarraway / gist:4634067
Last active December 11, 2015 17:19
Favicons
<link rel="apple-touch-icon" href="<?php echo get_template_directory_uri(); ?>/images/touch_icons/touchicon.png">
<link rel="icon" href="<?php echo get_template_directory_uri(); ?>/favicon.png">
<!--[if IE]><link rel="shortcut icon" href="<?php echo get_template_directory_uri(); ?>/favicon.ico"><![endif]-->
<!-- or, set /favicon.ico for IE10 win -->
<meta name="msapplication-TileColor" content="#D83434">
<meta name="msapplication-TileImage" content="<?php echo get_template_directory_uri(); ?>/images/touch_icons/tileicon.png">
@koycarraway
koycarraway / _vars-social-colors.scss
Last active April 7, 2020 05:34
Sass color variables for popular brands and social media.
// Social Colors
// ====================================================================
$facebook_color : hsla(222, 47%, 40%, 1); // #365397
$twitter_color : hsla(198, 100%, 47%, 1); // #00a9f1
$linkedin_color : hsla(203, 100%, 35%, 1); // #006db3
$apple_color : hsla(0, 0%, 45%, 1); // #737373
$google_color : hsla(217, 89%, 61%, 1); // #4285f4
$google_plus_color : hsla(8, 74%, 53%, 1); // #e0452c
@koycarraway
koycarraway / bg-cover-mixin.scss
Created July 12, 2013 02:57
Sass Mixin for background-size: cover property. Includes IE support.
// $bg-img-path: '../path/to/image.jpg'
// $bg-options: options are css background properties (ex. no-repeat center center)
@mixin bg-cover($bg-img-path, $bg-options) {
background: url($bg-img-path) $bg-options;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='#{$bg-img-path}', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='#{$bg-img-path}', sizingMethod='scale')";
@koycarraway
koycarraway / gist:10934164
Created April 16, 2014 21:19
Link Underline
a {
background-image: -webkit-gradient(linear,left top,left bottom,from(transparent),to(#ddd));
background-image: -webkit-linear-gradient(top,transparent 50%,#ddd 50%);
background-image: linear-gradient(to bottom,transparent 50%,#ddd 50%);
background-image: none;
color: red;
background-repeat: repeat-x;
-webkit-background-size: 2px 2px;
background-size: 2px 2px;
background-position: 0 90%;
function throttle( fn, time ) {
var t = 0;
return function() {
var args = arguments, ctx = this;
clearTimeout(t);
t = setTimeout( function() {
fn.apply( ctx, args );
}, time );
};
@koycarraway
koycarraway / osx-font-rendering.scss
Last active August 29, 2015 14:04
Font rendering on OS X
// Mixin
@mixin font-smoothing($value: on) {
@if $value == on {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
@else {
-webkit-font-smoothing: subpixel-antialiased;
-moz-osx-font-smoothing: auto;