Skip to content

Instantly share code, notes, and snippets.

View pixelchar's full-sized avatar

Charlie Cathcart pixelchar

3 followers · 3 following
View GitHub Profile
@pixelchar
pixelchar / breadcrumb-nav.html
Created September 17, 2013 13:34
Accessible breadcrumb navigation markup
<nav aria-label="You are here">
<ol>
<li><a href="/">Home</a></li>
<li><a href="/category/">Category</a></li>
<li><a href="/category/sub-category/">Sub-Category</a></li>
<li>Current Page</li>
</ol>
</nav>
@pixelchar
pixelchar / lucida-console-stack.css
Created September 13, 2013 13:36
Lucida Console font stack
font-family: "Lucida Console", "Lucida Sans Typewriter", Monaco, "Bitstream Vera Sans Mono", monospace;
@pixelchar
pixelchar / rockwell-stack.css
Created September 13, 2013 13:35
Rockwell font stack
font-family: Rockwell, "Courier Bold", Courier, Georgia, Times, "Times New Roman", serif;
@pixelchar
pixelchar / georgia-stack.css
Created September 13, 2013 13:34
Georgia font stack
font-family: Georgia, Times, "Times New Roman", serif;
@pixelchar
pixelchar / garamond-stack.css
Created September 13, 2013 13:34
Garamond font stack
font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;
@pixelchar
pixelchar / helvetica-stack.css
Created September 13, 2013 13:33
Helvetica font stack
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
@pixelchar
pixelchar / futura-stack.css
Created September 13, 2013 13:32
Futura font stack
font-family: Futura, "Trebuchet MS", Arial, sans-serif;
@pixelchar
pixelchar / transition-mixin.scss
Last active December 22, 2015 23:59
Sass transition mixin to avoid writing vendor prefixes
@mixin transition(@string: all 0.3s ease-out) {
-webkit-transition: @string;
-moz-transition: @string;
-ms-transition: @string;
-o-transition: @string;
transition: @string;
}
@pixelchar
pixelchar / translate-mixin.scss
Last active December 22, 2015 23:59
Sass translate mixin to avoid writing vendor prefixes
@mixin translate (@x, @y) {
-webkit-transform: translate(@x, @y);
-moz-transform: translate(@x, @y);
-ms-transform: translate(@x, @y);
-o-transform: translate(@x, @y);
transform: translate(@x, @y);
}
@pixelchar
pixelchar / scale-mixin.scss
Last active December 22, 2015 23:59
Sass scale mixin to avoid writing vendor prefixes
@mixin scale(@factor) {
-webkit-transform: scale(@factor);
-moz-transform: scale(@factor);
-ms-transform: scale(@factor);
-o-transform: scale(@factor);
transform: scale(@factor);
}