Skip to content

Instantly share code, notes, and snippets.

@nimbupani
nimbupani / draw-svg.js
Created June 7, 2011 20:33 — forked from johan/draw-svg.js
Draw an SVG bit by bit
var steps = 0 // steps drawn on the current element, so far
, info = document.getElementById('next_step')
, svgs = [].slice.call(document.getElementsByTagName('svg'))
, svg, walker, current;
function lexSVGPath(d) {
function command(seg) {
var cmd = seg.match(/[a-z]/i), arg, cnt;
if (cmd) {
cmd = cmd[0]; // which subcommand
@nimbupani
nimbupani / style.css
Created August 25, 2011 17:21
Style for whatwg blog
/*
Theme Name: org.whatwg.awesome
Theme URI: http://www.whatwg.org/
Description: Super awesome WHATWG blog theme.
Version: 5.0
Author: Ben (with modifications by Anne, Divya)
Author URI: http://projectcerbera.com/
*/
/*
@nimbupani
nimbupani / HTML language
Created November 22, 2011 17:00 — forked from kornelski/HTML language
TextMate HTML language tweaked to support unquoted attributes
{ scopeName = 'text.html.basic';
firstLineMatch = '<!DOCTYPE|doctype<(?i:html)|<\?(?i:php)';
fileTypes = ( 'html', 'htm', 'shtml', 'xhtml', 'phtml', 'php', 'inc', 'tmpl', 'tpl', 'ctp' );
foldingStartMarker = '(?x)
(<(?i:head|body|table|thead|tbody|tfoot|tr|div|select|fieldset|style|script|ul|ol|li|form|dl|section|article|header|footer|nav|aside)\b.*?>
|<!--(?!.*--\s*>)
|^<!--\ \#tminclude\ (?>.*?-->)$
|<\?(?:php)?.*\b(if|for(each)?|while)\b.+:
|\{\{?(if|foreach|capture|literal|foreach|php|section|strip)
|\{\s*($|\?>\s*$|//|/\*(.*\*/\s*$|(?!.*?\*/)))
@nimbupani
nimbupani / archives.html
Created December 2, 2011 02:15
Octopress archives with pagination
<div class="blog-archives">
{% for post in paginator.posts %}
{% assign content = post.content %}
{% capture this_year %}{{ post.date | date: "%Y" }}{% endcapture %}
{% unless year == this_year %}
{% assign year = this_year %}
<h2>{{ year }}</h2>
{% endunless %}
<article>
{% include archive_post.html %}
@nimbupani
nimbupani / cat.js
Created December 5, 2011 00:54 — forked from padolsey/cat.js
Improving Jeremy Keith's CAT news example from http://24ways.org/2011/conditional-loading-for-responsive-designs
var cat = {};
/**
* cat.NewsBox
* Retrieves news from Google
*/
cat.NewsBox = (function(){
function NewsBox(searchTerm, injectFn) {
this.searchTerm = searchTerm;
(function() { console.log('hello'); })();
@nimbupani
nimbupani / sample-template
Created January 4, 2012 02:40
Sample format for the new Silent Feature for Sass
// Scss @extend as of now
.small {
font-size: 0.9em;
}
footer,
article > footer {
@extend .small;
@nimbupani
nimbupani / color-overlay.scss
Created February 18, 2012 05:02
Sass Snippets
// Use @include colorize('image.png', red, 0.5)
@mixin colorize($image, $color, $opacity) {
background: $color;
$color: transparentize($color, 1 - $opacity);
background: -webkit-linear-gradient(left, $color, $color), url($image);
background: -moz-linear-gradient(left, $color, $color), url($image);
background: -ms-linear-gradient(left, $color, $color), url($image);
background: -o-linear-gradient(left, $color, $color), url($image);
}
@nimbupani
nimbupani / color-overlay.scss
Created February 18, 2012 16:45
Fake color overlay on an image with gradients
// Use @include colorize('image.png', red, 0.5)
@mixin colorize($image, $color, $opacity) {
background: $color;
$color: transparentize($color, 1 - $opacity);
background: -webkit-linear-gradient(left, $color, $color), url($image);
background: -moz-linear-gradient(left, $color, $color), url($image);
background: -ms-linear-gradient(left, $color, $color), url($image);
background: -o-linear-gradient(left, $color, $color), url($image);
}
@nimbupani
nimbupani / prefixed.css
Created March 7, 2012 18:38
Trying some ideas for prefix solution
h1 {
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
border-radius: 10px;
}
body {
background-image: -webkit-gradient(linear, #000, #fff), url('image.png');