⌘T | go to file |
⌘⌃P | go to project |
⌘R | go to methods |
⌃G | go to line |
⌘KB | toggle side bar |
⌘⇧P | command prompt |
/* ---------------------------------------------------------- */ | |
/* */ | |
/* A media query that captures: */ | |
/* */ | |
/* - Retina iOS devices */ | |
/* - Retina Macs running Safari */ | |
/* - High DPI Windows PCs running IE 8 and above */ | |
/* - Low DPI Windows PCs running IE, zoomed in */ | |
/* - Low DPI Windows PCs and Macs running Firefox, zoomed in */ | |
/* - Android hdpi devices and above */ |
Getting Ruby, SASS and DocPad working on Heroku involves two steps:
-
Ensuring all your plugins are the latest version. Open up your
package.json
and change all your docpad plugin dependency versions to2.x
and your docpad version to6.x
. Once done, runrm -Rf node_modules; npm install
to grab the latest versions of everything. -
Installing Ruby and SASS on Heroku. Copy over the
Gemfile
,Gemfile.lock
, and the.buildpacks
files from https://github.com/docpad/sass-heroku-test to your own website. Then runheroku config:add BUILDPACK_URL=https://github.com/ddollar/heroku-buildpack-multi.git
to tell heroku to use multiple buildpacks. Once done, deploy to heroku viagit push heroku master
and you may need to runheroku restart
as sometimes the initial deploy fails.
The following will minify your assets with grunt each time a generation write completes.
- Install Dependencies
// Sample grunt-jekyll grunt.js file | |
// https://github.com/dannygarcia/grunt-jekyll | |
/*global module:false*/ | |
module.exports = function(grunt) { | |
// Project configuration. | |
grunt.initConfig({ | |
jekyll: { |
$().ready(function() { | |
$('.entry-body img').each(function(){ | |
var $permalink = $(this).parents('.entry').find('.permalink').attr('href'); | |
$(this).wrap('<div class="pinme" style="' + $(this).attr('style') + '" />').after('<a href="http://pinterest.com/pin/create/button/?url=' + $permalink + '&media=' + $(this).attr('src') + '&description=' + $(this).attr('alt') + '" class="pin-it-button" count-layout="vertical">Pin It</a>'); | |
}); | |
$('.pinme').hover(function() { | |
$(this).children('iframe').css('display','block'); | |
}, function() { | |
$(this).children('iframe').css('display','none'); |
// $('img.photo',this).imagesLoaded(myFunction) | |
// execute a callback when all images have loaded. | |
// needed because .load() doesn't work on cached images | |
// Modified with a two-pass approach to changing image | |
// src. First, the proxy imagedata is set, which leads | |
// to the first callback being triggered, which resets | |
// imagedata to the original src, which fires the final, | |
// user defined callback. |