Skip to content

Instantly share code, notes, and snippets.

@jhough10
jhough10 / SassMeister-input.scss
Created August 5, 2015 21:28
Generated by SassMeister.com.
// ----
// libsass (v3.2.5)
// ----
$media-breakpoints: (
phone: 480px,
tablet: 760px,
desktop: 1200px
);
@jhough10
jhough10 / SassMeister-input.scss
Created August 5, 2015 21:27
Generated by SassMeister.com.
// ----
// libsass (v3.2.5)
// ----
$sprites:
facebook "16px 16px",
twitter "32px 32px",
instagram "48px 48px"
;

OS X Screencast to animated GIF

This gist shows how to create a GIF screencast using only free OS X tools: QuickTime, ffmpeg, and gifsicle.

Screencapture GIF

Instructions

To capture the video (filesize: 19MB), using the free "QuickTime Player" application:

Multiple SSH Keys settings for different github account

create different public key

create different ssh key according the article Mac Set-Up Git

$ ssh-keygen -t rsa -C "your_email@youremail.com"
// ----
// Sass (v3.3.7)
// Compass (v1.0.0.alpha.18)
// ----
=e($name)
@at-root &_#{$name}
@content
=m($name)
@at-root &-#{$name}
@jhough10
jhough10 / centurion-grid-60x40.html
Created January 15, 2014 06:51
Centurion Grid example of 60% and 40% page design. (For those that want more space.)
<div class="grid-60">
<h1>Subheading</h1>
<p>Content that appears after a heading.</p>
<h2>Subheading</h2>
<p>Description about the subheading with a link to the page.</p>
</div>
<div class="grid-40">
<img src="http://placehold.it/350x200" class="responsive" alt="description of image" />
@jhough10
jhough10 / centurion-grid-75x25.html
Created January 15, 2014 06:50
Centurion Grid example of 75% and 25% page design.
<div class="grid-75">
<h1>Subheading</h1>
<p>Content that appears after a heading.</p>
<h2>Subheading</h2>
<p>Description about the subheading with a link to the page.</p>
</div>
<div class="grid-25">
<img src="http://placehold.it/350x200" class="responsive" alt="description of image" />
@jhough10
jhough10 / centurion-grid-50x50-ping-pong.html
Created January 15, 2014 06:48
Centurion Grid Sample - 50% x 50% grid elements. Useful for creating a ping pong effect of image, text, text image.
<div class="grid-50">
<img src="http://placehold.it/450x300" class="responsive" alt="description of image" />
</div>
<div class="grid-50">
<h2>Subheading</h2>
<p>Description about the subheading with a link to the page</p>
</div>
<!-- clear the line -->
<div class="clear"></div>
@jhough10
jhough10 / centurion-grid-3x33.html
Created January 15, 2014 06:46
Centurion Grid Sample - 3 x 33% grid elements.
<div class="grid-33">
<img src="http://placehold.it/300x150" alt="description of image" />
<h2>Subheading</h2>
<p>Description about the subheading with a link to the page</p>
</div>
<div class="grid-33">
<img src="http://placehold.it/300x150" alt="description of image" />
<h2>Subheading</h2>
<p>Description about the subheading with a link to the page</p>
</div>