Skip to content

Instantly share code, notes, and snippets.

View nathos's full-sized avatar

Nathan Henderson nathos

View GitHub Profile
@nathos
nathos / semantic_twitter_boostrap_grid.sass
Created February 10, 2012 20:32
A start for semantic grids in Twitter Bootstrap
// clearly, still in progress...
$fluidLayout: true
$fluidLayout: false !default
// Semantic grid mixins
@mixin row($fluid: $fluidLayout)
@if $fluid == true
width: 100%
@nathos
nathos / sass-hash-mixin.sass
Last active May 10, 2017 09:10
Using lists like a hash in Sass
@mixin category-colors($after: false)
@each $category in $categories
@if $after == true
.cat-#{nth($category, 1)}:after
background-color: nth($category, 2)
@else
.cat-#{nth($category, 1)}
background-color: nth($category, 2)
@nathos
nathos / twitterbutton.sass
Last active September 26, 2015 18:17
Scalable twitter button
.twitterbutton
// change size to any (reasonable) percentage/px you want
// font-size: 200%
color: #4e839e
font-family: "Helvetica Neue", Arial, sans-serif
font-weight: 300
line-height: 1em
text-decoration: none !important
text-rendering: optimizeLegibility
padding: 0.5em 0.7em
@nathos
nathos / compass-flippy-mixin.sass
Last active October 23, 2017 22:21
Compass flippy - fun 3D flip animations with graceful fallback (using Modernizr) for unsupported browsers. The animation looks great in Safari, not quite as great in Chrome. See the demo at http://nathos.github.com/flippy/
@mixin flippy($speed: 0.5s, $perspective: 500, $bgcolor: #fff)
position: relative
@include perspective($perspective)
.front, .back
background-color: $bgcolor
@include transition(all $speed ease-in-out)
@include backface-visibility(hidden)
@include transform-style(preserve-3d)
height: 100%
width: 100%
@nathos
nathos / fancy-hover-mixin.sass
Last active September 25, 2015 17:47
Compass fancy-hover - snazzy-looking image replacement hovers with an animated opacity ramp. Now using Compass sprites so you don't have to do the dirty work! See the demo at http://nathos.github.com/fancy-hovers/
@mixin fancy-hover($sprite_dir, $off_state, $hover_state, $speed: 0.3s)
$sprites: sprite-map("#{$sprite_dir}/*.png")
$width: image-width(sprite_file($sprites, $off_state))
$height: image-height(sprite_file($sprites, $off_state))
@include hide-text
width: $width
height: $height
background: sprite($sprites, $off_state) no-repeat
display: block
position: relative
@nathos
nathos / lorem.rb
Created November 11, 2010 21:24
LoremHelper - a placeholder content generator for Webby
# LoremHelper - a placeholder content generator for Webby
# =======================================================
# based on Travis Dunn's Frank - lorem.rb:
# - https://github.com/blahed/frank/blob/master/lib/frank/lorem.rb
# - original license: https://github.com/blahed/frank/blob/master/LICENSE
#
# LoremHelper creates placeholder content for your Webby [http://webby.rubyforge.org/] projects.
# It's great for quickly prototyping/wireframing a site.
#
# USAGE:
@nathos
nathos / gist:531682
Created August 17, 2010 19:48
Sass/CSS source for Mac/Safari-style nav bar
// be sure to import the the border-radius and box-shadow mixins:
// @import "compass/css3/border-radius"
// @import "compass/css3/box-shadow"
#menu
:margin-bottom 15px
:font-family "Lucida Grande", Arial, sans-serif
:font-size 11px
:font-weight bold
:padding 4px 6px
@nathos
nathos / amznshortener.js
Created May 25, 2010 20:39
AmznShortener - Javascript bookmarket source for an Amazon.com short-link generator.
(function(){
var aff = 'nathos-20'; // replace 'nathos-20' with your Amazon affiliate ID, including the '-20'
if (!document.getElementById('ASIN')) {
alert('Can\'t find an Amazon product ID');
return;
}
var asin = document.getElementById('ASIN').value;
prompt(
'Here is the shortened affiliate link:',
'http://amzn.com/' + asin + '?tag=' + aff);
@nathos
nathos / interlink.rb
Created December 10, 2009 20:14 — forked from mattstevens/interlink.rb
Interlink - MediaWiki-style link generation for Webby
@nathos
nathos / amazon_url_stripper.rb
Created October 1, 2009 18:44
Amazon URL stripper
affiliate_id = "nathos-20"
ARGF.each do |f|
f = f.scan(/(?:http:\/\/(?:www\.){0,1}amazon\.com(?:\/.*){0,1}(?:\/dp\/|\/gp\/product\/))(.*?)(?:\/.*|$)/i)
shorturl = "http://www.amazon.com/dp/" + f.to_s + "/ref=nosim/" + affiliate_id
if shorturl == ("http://www.amazon.com/dp//ref=nosim/" + affiliate_id)
puts "Not a valid Amazon URL"
else
puts shorturl
end