This gist shows how to create a GIF screencast using only free OS X tools: QuickTime, ffmpeg, and gifsicle.
To capture the video (filesize: 19MB), using the free "QuickTime Player" application:
// ---- | |
// libsass (v3.2.5) | |
// ---- | |
$media-breakpoints: ( | |
phone: 480px, | |
tablet: 760px, | |
desktop: 1200px | |
); | |
// ---- | |
// libsass (v3.2.5) | |
// ---- | |
$sprites: | |
facebook "16px 16px", | |
twitter "32px 32px", | |
instagram "48px 48px" | |
; |
create different ssh key according the article Mac Set-Up Git
$ ssh-keygen -t rsa -C "[email protected]"
// ---- | |
// Sass (v3.3.7) | |
// Compass (v1.0.0.alpha.18) | |
// ---- | |
=e($name) | |
@at-root &_#{$name} | |
@content | |
=m($name) | |
@at-root &-#{$name} |
<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" /> |
<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" /> |
<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> |
<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> |