Skip to content

Instantly share code, notes, and snippets.

View antsa's full-sized avatar

Antti Salonen antsa

  • Kisko Labs
  • Helsinki
View GitHub Profile
require 'sass'
module Sass::Script::Functions
def svg_circle(radius, color, circle_type)
img = if circle_type.value == "disc"
%Q{<circle cx="#{radius.value}" cy="#{radius.value}" r="#{radius.value}"
stroke-width="0" fill="#{color}"/>}
else
%Q{<circle cx="#{radius.value}" cy="#{radius.value}" r="#{radius.value}"
stroke="#{color}" stroke-width="1" fill="white"/>}
require "chunky_png"
require "base64"
module Sass::Script::Functions
def background_noise(kwargs = {})
opts = {}
Sass::Util.map_hash({
"intensity" => [0..1, "", :Number, Sass::Script::Number.new(0.5) ],
"opacity" => [0..1, "", :Number, Sass::Script::Number.new(0.08)],
"size" => [1..512, "px", :Number, Sass::Script::Number.new(200) ],
@idan
idan / _more.scss
Created June 6, 2011 08:40
More is Less
$less-column-width: 68px;
$less-gutter-width: 24px;
@function column-width($columns) {
@return ($less-column-width * $columns) + ($less-gutter-width * ($columns - 1));
}
@function grid-padding-px($columns) {
@if $columns == 10 {
@return 48px;
@arielsalminen
arielsalminen / triggerpoints.css
Created May 15, 2011 12:54
Triggerpoints for kiskolabs.com
/* 970px and under */
@media screen and (max-width: 970px) { ... }
/* 840px and under */
@media screen and (max-width: 840px) { ... }
/* 740px and under */
@media screen and (max-width: 740px) { ... }
/* 600px and under */
@media screen and (max-width: 600px) { ... }
/* 480px and under */
@media screen and (max-width: 480px) { ... }
@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
@neiled
neiled / hamlhtml5boilerplate.html.haml
Created November 25, 2010 23:20
My haml version of the html 5 boiler plate code
!!! 5
/[if lt IE 7] <html lang="en" class="no-js ie6">
/[if IE 7 ] <html lang="en" class="no-js ie7">
/[if IE 8 ] <html lang="en" class="no-js ie8">
/[if IE 9 ] <html lang="en" class="no-js ie9">
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
%head
%meta{:charset => "utf-8"}/
/
Always force latest IE rendering engine (even in intranet) &amp; Chrome Frame