Merge branch 'feature/build-script' into develop

.jshintrc

@@ -0,0 +1,20 @@
+{
+  "bitwise": true,
+  "browser": true,
+  "curly": true,
+  "eqeqeq": true,
+  "eqnull": true,
+  "es5": false,
+  "esnext": true,
+  "immed": true,
+  "jquery": true,
+  "latedef": true,
+  "newcap": true,
+  "noarg": true,
+  "node": true,
+  "strict": false,
+  "trailing": false,
+  "undef": true,
+  "multistr": true,
+  "expr": true
+}

Gruntfile.js

@@ -0,0 +1,110 @@
+'use strict';
+module.exports = function(grunt) {
+
+  grunt.initConfig({
+    jshint: {
+      options: {
+        jshintrc: '.jshintrc'
+      },
+      all: [
+        'Gruntfile.js',
+        'assets/js/*.js',
+        '!assets/js/plugins/*.js',
+        '!assets/js/scripts.min.js'
+      ]
+    },
+    recess: {
+      dist: {
+        options: {
+          compile: true,
+          compress: true
+        },
+        files: {
+          'assets/css/main.min.css': [
+            'assets/less/main.less'
+          ],
+          'assets/css/ie.min.css': [
+            'assets/less/ie.less'
+          ]
+        }
+      }
+    },
+    uglify: {
+      dist: {
+        files: {
+          'assets/js/scripts.min.js': [
+            'assets/js/plugins/*.js',
+            'assets/js/_*.js'
+          ]
+        }
+      }
+    },
+    imagemin: {
+      dist: {
+        options: {
+          optimizationLevel: 7,
+          progressive: true
+        },
+        files: [{
+          expand: true,
+          cwd: 'images/',
+          src: '{,*/}*.{png,jpg,jpeg}',
+          dest: 'images/'
+        }]
+      }
+    },
+    svgmin: {
+      dist: {
+        files: [{
+          expand: true,
+          cwd: 'images/',
+          src: '{,*/}*.svg',
+          dest: 'images/'
+        }]
+      }
+    },
+    watch: {
+      less: {
+        files: [
+          'assets/less/*.less',
+          'assets/less/bootstrap/*.less'
+        ],
+        tasks: ['recess']
+      },
+      js: {
+        files: [
+          '<%= jshint.all %>'
+        ],
+        tasks: ['jshint','uglify']
+      }
+    },
+    clean: {
+      dist: [
+        'assets/css/main.min.css',
+        'assets/js/scripts.min.js'
+      ]
+    }
+  });
+
+  // Load tasks
+  grunt.loadNpmTasks('grunt-contrib-clean');
+  grunt.loadNpmTasks('grunt-contrib-jshint');
+  grunt.loadNpmTasks('grunt-contrib-uglify');
+  grunt.loadNpmTasks('grunt-contrib-watch');
+  grunt.loadNpmTasks('grunt-recess');
+  grunt.loadNpmTasks('grunt-contrib-imagemin');
+  grunt.loadNpmTasks('grunt-svgmin');
+
+  // Register tasks
+  grunt.registerTask('default', [
+    'clean',
+    'recess',
+    'uglify',
+    'imagemin',
+    'svgmin'
+  ]);
+  grunt.registerTask('dev', [
+    'watch'
+  ]);
+
+};

README.md

@@ -142,7 +142,7 @@ Insert the following HTML in post or page content that you want a *table of cont
 ``` html
 <section id="table-of-contents" class="toc">
   <header>
-    <h3 class="delta">Contents</h3>
+    <h3>Contents</h3>
   </header>
 <div id="drawer" markdown="1">
 *  Auto generated table of contents

_config.yml

@@ -64,4 +64,4 @@ kramdown:
     coderay_css: class
 
 include: [".htaccess"]
-exclude: ["lib", "config.rb", "Capfile", "config", "log", "Rakefile", "Rakefile.rb", "tmp", "less", "minimal-mistakes.sublime-project", "minimal-mistakes.sublime-workspace"]
+exclude: ["lib", "config.rb", "Capfile", "config", "log", "Rakefile", "Rakefile.rb", "tmp", "less", "*.sublime-project", "*.sublime-workspace", "test", "spec", "Gruntfile.js", "package.json", "node_modules"]

_includes/head.html

@@ -38,10 +38,10 @@
 <!-- Google Webfonts -->
 <link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow:400,700|PT+Serif:400,700,400italic' rel='stylesheet' type='text/css'>
 <!-- For all browsers -->
-<link rel="stylesheet" href="{{ site.url }}/assets/css/main.css">
+<link rel="stylesheet" href="{{ site.url }}/assets/css/main.min.css">
 
 <!--[if (lt IE 9) & (!IEMobile)]>
-<link rel="stylesheet" href="{{ site.url }}/assets/css/ie.css">
+<link rel="stylesheet" href="{{ site.url }}/assets/css/ie.min.css">
 <![endif]-->
 
 <meta http-equiv="cleartype" content="on">

_includes/scripts.html

@@ -1,6 +1,6 @@
 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
 <script>window.jQuery || document.write('<script src="{{ site.url }}/assets/js/vendor/jquery-1.9.1.min.js"><\/script>')</script>
-<script src="{{ site.url }}/assets/js/main.min.js"></script>
+<script src="{{ site.url }}/assets/js/scripts.min.js"></script>
 {% if site.google_analytics %}
 <!-- Asynchronous Google Analytics snippet -->
 <script>

_posts/2011-03-10-sample-post.md

@@ -13,7 +13,7 @@ image:
 
 <section id="table-of-contents" class="toc">
   <header>
-    <h3 class="delta">Contents</h3>
+    <h3>Contents</h3>
   </header>
 <div id="drawer" markdown="1">
 *  Auto generated table of contents

assets/js/_main.js

@@ -0,0 +1,36 @@
+/*! Plugin options and other jQuery stuff */
+
+// FitVids options
+$(function() {
+	$("article").fitVids();
+});
+
+// Table of Contents toggle
+$(function() {
+  $(".toc h3").click(function () {
+    $("#drawer").toggleClass("hidden");
+  });
+});
+
+// Add lightbox class to all image links
+$("a[href$='.jpg'],a[href$='.png'],a[href$='.gif']").addClass("image-popup");
+
+// Magnific-Popup options
+$(document).ready(function() {
+  $('.image-popup').magnificPopup({
+    type: 'image',
+    tLoading: 'Loading image #%curr%...',
+    gallery: {
+      enabled: true,
+      navigateByImgClick: true,
+      preload: [0,1] // Will preload 0 - before current, and 1 after the current image
+    },
+    image: {
+      tError: '<a href="%url%">Image #%curr%</a> could not be loaded.',
+    },
+    removalDelay: 300, // Delay in milliseconds before popup is removed
+    // Class that is added to body when popup is open. 
+    // make it unique to apply your CSS animations just to this exact popup
+    mainClass: 'mfp-fade'
+  });
+});

assets/js/plugins/jquery.fitvids.js

@@ -1,9 +1,9 @@
 /*global jQuery */
-/*jshint multistr:true browser:true */
+/*jshint multistr:true, browser:true */
 /*!
 * FitVids 1.0
 *
-* Copyright 2011, Chris Coyier - http://css-tricks.com + Dave Rupert - http://daverupert.com
+* Copyright 2013, Chris Coyier - http://css-tricks.com + Dave Rupert - http://daverupert.com
 * Credit to Thierry Koblentz - http://www.alistapart.com/articles/creating-intrinsic-ratios-for-video/
 * Released under the WTFPL license - http://sam.zoy.org/wtfpl/
 *
@@ -19,29 +19,20 @@
       customSelector: null
     };
 
-    var div = document.createElement('div'),
-        ref = document.getElementsByTagName('base')[0] || document.getElementsByTagName('script')[0];
+    if(!document.getElementById('fit-vids-style')) {
 
-    div.className = 'fit-vids-style';
-    div.innerHTML = '&shy;<style>         \
-      .fluid-width-video-wrapper {        \
-         width: 100%;                     \
-         position: relative;              \
-         padding: 0;                      \
-      }                                   \
-                                          \
-      .fluid-width-video-wrapper iframe,  \
-      .fluid-width-video-wrapper object,  \
-      .fluid-width-video-wrapper embed {  \
-         position: absolute;              \
-         top: 0;                          \
-         left: 0;                         \
-         width: 100%;                     \
-         height: 100%;                    \
-      }                                   \
-    </style>';
+      var div = document.createElement('div'),
+          ref = document.getElementsByTagName('base')[0] || document.getElementsByTagName('script')[0],
+          cssStyles = '&shy;<style>.fluid-width-video-wrapper{width:100%;position:relative;padding:0;}.fluid-width-video-wrapper iframe,.fluid-width-video-wrapper object,.fluid-width-video-wrapper embed {position:absolute;top:0;left:0;width:100%;height:100%;}</style>';
 
-    ref.parentNode.insertBefore(div,ref);
+      div.className = 'fit-vids-style';
+      div.id = 'fit-vids-style';
+      div.style.display = 'none';
+      div.innerHTML = cssStyles;
+
+      ref.parentNode.insertBefore(div,ref);
+
+    }
 
     if ( options ) {
       $.extend( settings, options );
@@ -50,9 +41,9 @@
     return this.each(function(){
       var selectors = [
         "iframe[src*='player.vimeo.com']",
-        "iframe[src*='www.youtube.com']",
-        "iframe[src*='www.youtube-nocookie.com']",
-        "iframe[src*='www.kickstarter.com']",
+        "iframe[src*='youtube.com']",
+        "iframe[src*='youtube-nocookie.com']",
+        "iframe[src*='kickstarter.com'][src*='video.html']",
         "object",
         "embed"
       ];
@@ -62,6 +53,7 @@
       }
 
       var $allVideos = $(this).find(selectors.join(','));
+      $allVideos = $allVideos.not("object object"); // SwfObj conflict patch
 
       $allVideos.each(function(){
         var $this = $(this);
@@ -78,4 +70,5 @@
       });
     });
   };
-})( jQuery );
+// Works with either jQuery or Zepto
+})( window.jQuery || window.Zepto );

assets/js/plugins/jquery.magnific-popup.js

@@ -1,4 +1,4 @@
-/*! Magnific Popup - v0.8.9 - 2013-06-04
+/*! Magnific Popup - v0.9.3 - 2013-07-16
 * http://dimsemenov.com/plugins/magnific-popup/
 * Copyright (c) 2013 Dmitry Semenov; */
 ;(function($) {
@@ -15,6 +15,7 @@
  * Private static constants
  */
 var CLOSE_EVENT = 'Close',
+	BEFORE_CLOSE_EVENT = 'BeforeClose',
 	AFTER_CLOSE_EVENT = 'AfterClose',
 	BEFORE_APPEND_EVENT = 'BeforeAppend',
 	MARKUP_PARSE_EVENT = 'MarkupParse',
@@ -76,7 +77,7 @@ var _mfpOn = function(name, f) {
 		}
 	},
 	_setFocus = function() {
-		(mfp.st.focus ? mfp.content.find(mfp.st.focus).eq(0) : mfp.wrap).focus();
+		(mfp.st.focus ? mfp.content.find(mfp.st.focus).eq(0) : mfp.wrap).trigger('focus');
 	},
 	_getCloseBtn = function(type) {
 		if(type !== _currPopupType || !mfp.currTemplate.closeBtn) {
@@ -116,13 +117,33 @@ var _mfpOn = function(name, f) {
 			// if click is outside the content
 			if(  (target !== mfp.content[0] && !$.contains(mfp.content[0], target))  ) {
 				if(closeOnBg) {
-					return true;
+					// last check, if the clicked element is in DOM, (in case it's removed onclick)
+					if( $.contains(document, target) ) {
+						return true;
+					}
 				}
 			} else if(closeOnContent) {
 				return true;
 			}
 
 		}
+		return false;
+	},
+	// CSS transition detection, http://stackoverflow.com/questions/7264899/detect-css-transitions-using-javascript-and-without-modernizr
+	supportsTransitions = function() {
+		var s = document.createElement('p').style, // 's' for style. better to create an element if body yet to exist
+			v = ['ms','O','Moz','Webkit']; // 'v' for vendor
+
+		if( s['transition'] !== undefined ) {
+			return true; 
+		}
+			
+		while( v.length ) {
+			if( v.pop() + 'Transition' in s ) {
+				return true;
+			}
+		}
+				
 		return false;
 	};
 
@@ -146,6 +167,8 @@ MagnificPopup.prototype = {
 		mfp.isLowIE = mfp.isIE7 || mfp.isIE8;
 		mfp.isAndroid = (/android/gi).test(appVersion);
 		mfp.isIOS = (/iphone|ipad|ipod/gi).test(appVersion);
+		mfp.supportsTransition = supportsTransitions();
+
 		// We disable fixed positioned lightbox on devices that don't handle it nicely.
 		// If you know a better way of detecting this - let me know.
 		mfp.probablyMobile = (mfp.isAndroid || mfp.isIOS || /(Opera Mini)|Kindle|webOS|BlackBerry|(Opera Mobi)|(Windows Phone)|IEMobile/i.test(navigator.userAgent) );
@@ -193,7 +216,11 @@ MagnificPopup.prototype = {
 		
 		mfp.types = []; 
 		_wrapClasses = '';
-		mfp.ev = data.mainEl || _document;
+		if(data.mainEl && data.mainEl.length) {
+			mfp.ev = data.mainEl.eq(0);
+		} else {
+			mfp.ev = _document;
+		}
 
 		if(data.key) {
 			if(!mfp.popupsCache[data.key]) {
@@ -208,7 +235,13 @@ MagnificPopup.prototype = {
 
 		mfp.st = $.extend(true, {}, $.magnificPopup.defaults, data ); 
 		mfp.fixedContentPos = mfp.st.fixedContentPos === 'auto' ? !mfp.probablyMobile : mfp.st.fixedContentPos;
-		
+
+		if(mfp.st.modal) {
+			mfp.st.closeOnContentClick = false;
+			mfp.st.closeOnBgClick = false;
+			mfp.st.showCloseBtn = false;
+			mfp.st.enableEscapeKey = false;
+		}
 		
 
 		// Building markup
@@ -245,14 +278,16 @@ MagnificPopup.prototype = {
 		_mfpTrigger('BeforeOpen');
 
 
-		// Close button
-		if(!mfp.st.closeBtnInside) {
-			mfp.wrap.append( _getCloseBtn() );
-		} else {
-			_mfpOn(MARKUP_PARSE_EVENT, function(e, template, values, item) {
-				values.close_replaceWith = _getCloseBtn(item.type);
-			});
-			_wrapClasses += ' mfp-close-btn-in';
+		if(mfp.st.showCloseBtn) {
+			// Close button
+			if(!mfp.st.closeBtnInside) {
+				mfp.wrap.append( _getCloseBtn() );
+			} else {
+				_mfpOn(MARKUP_PARSE_EVENT, function(e, template, values, item) {
+					values.close_replaceWith = _getCloseBtn(item.type);
+				});
+				_wrapClasses += ' mfp-close-btn-in';
+			}
 		}
 
 		if(mfp.st.alignTop) {
@@ -282,12 +317,14 @@ MagnificPopup.prototype = {
 
 		
 
-		// Close on ESC key
-		_document.on('keyup' + EVENT_NS, function(e) {
-			if(e.keyCode === 27) {
-				mfp.close();
-			}
-		});
+		if(mfp.st.enableEscapeKey) {
+			// Close on ESC key
+			_document.on('keyup' + EVENT_NS, function(e) {
+				if(e.keyCode === 27) {
+					mfp.close();
+				}
+			});
+		}
 
 		_window.on('resize' + EVENT_NS, function() {
 			mfp.updateSize();
@@ -306,20 +343,20 @@ MagnificPopup.prototype = {
 		var windowHeight = mfp.wH = _window.height();
 
 		
-		var bodyStyles = {};
+		var windowStyles = {};
 
 		if( mfp.fixedContentPos ) {
             if(mfp._hasScrollBar(windowHeight)){
                 var s = mfp._getScrollbarSize();
                 if(s) {
-                    bodyStyles.paddingRight = s;
+                    windowStyles.paddingRight = s;
                 }
             }
         }
 
 		if(mfp.fixedContentPos) {
 			if(!mfp.isIE7) {
-				bodyStyles.overflow = 'hidden';
+				windowStyles.overflow = 'hidden';
 			} else {
 				// ie7 double-scroll bug
 				$('body, html').css('overflow', 'hidden');
@@ -343,7 +380,7 @@ MagnificPopup.prototype = {
 
 
 		// remove scrollbar, add padding e.t.c
-		_body.css(bodyStyles);
+		$('html').css(windowStyles);
 		
 		// add everything to DOM
 		mfp.bgOverlay.add(mfp.wrap).prependTo( document.body );
@@ -384,10 +421,11 @@ MagnificPopup.prototype = {
 	 */
 	close: function() {
 		if(!mfp.isOpen) return;
+		_mfpTrigger(BEFORE_CLOSE_EVENT);
 
 		mfp.isOpen = false;
 		// for CSS3 animation
-		if(mfp.st.removalDelay && !mfp.isLowIE)  {
+		if(mfp.st.removalDelay && !mfp.isLowIE && mfp.supportsTransition )  {
 			mfp._addClassToMFP(REMOVING_CLASS);
 			setTimeout(function() {
 				mfp._close();
@@ -416,13 +454,13 @@ MagnificPopup.prototype = {
 		mfp._removeClassFromMFP(classesToRemove);
 
 		if(mfp.fixedContentPos) {
-			var bodyStyles = {paddingRight: ''};
+			var windowStyles = {paddingRight: ''};
 			if(mfp.isIE7) {
 				$('body, html').css('overflow', '');
 			} else {
-				bodyStyles.overflow = '';
+				windowStyles.overflow = '';
 			}
-			_body.css(bodyStyles);
+			$('html').css(windowStyles);
 		}
 		
 		_document.off('keyup' + EVENT_NS + ' focusin' + EVENT_NS);
@@ -434,14 +472,15 @@ MagnificPopup.prototype = {
 		mfp.container.attr('class', 'mfp-container');
 
 		// remove close button from target element
-		if(!mfp.st.closeBtnInside || mfp.currTemplate[mfp.currItem.type] === true ) {
+		if(mfp.st.showCloseBtn &&
+		(!mfp.st.closeBtnInside || mfp.currTemplate[mfp.currItem.type] === true)) {
 			if(mfp.currTemplate.closeBtn)
 				mfp.currTemplate.closeBtn.detach();
 		}
 
 
 		if(mfp._lastFocusedEl) {
-			$(mfp._lastFocusedEl).focus(); // put tab focus back
+			$(mfp._lastFocusedEl).trigger('focus'); // put tab focus back
 		}
 		mfp.currItem = null;	
 		mfp.content = null;
@@ -539,7 +578,8 @@ MagnificPopup.prototype = {
 		mfp.content = newContent;
 		
 		if(newContent) {
-			if(mfp.st.closeBtnInside && mfp.currTemplate[type] === true) {
+			if(mfp.st.showCloseBtn && mfp.st.closeBtnInside &&
+				mfp.currTemplate[type] === true) {
 				// if there is no markup, we just append close button element inside
 				if(!mfp.content.find('.mfp-close').length) {
 					mfp.content.append(_getCloseBtn());
@@ -632,37 +672,41 @@ MagnificPopup.prototype = {
 	},
 	_openClick: function(e, el, options) {
 		var midClick = options.midClick !== undefined ? options.midClick : $.magnificPopup.defaults.midClick;
-		if( midClick || e.which !== 2 ) {
-			var disableOn = options.disableOn !== undefined ? options.disableOn : $.magnificPopup.defaults.disableOn;
 
-			if(disableOn) {
-				if($.isFunction(disableOn)) {
-					if( !disableOn.call(mfp) ) {
-						return true;
-					}
-				} else { // else it's number
-					if( _window.width() < disableOn ) {
-						return true;
-					}
-				}
-			}
-			
-			if(e.type) {
-				e.preventDefault();
 
-				// This will prevent popup from closing if element is inside and popup is already opened
-				if(mfp.isOpen) {
-					e.stopPropagation();
-				}
-			}
-				
-
-			options.el = $(e.mfpEl);
-			if(options.delegate) {
-				options.items = el.find(options.delegate);
-			}
-			mfp.open(options);
+		if(!midClick && ( e.which === 2 || e.ctrlKey || e.metaKey ) ) {
+			return;
 		}
+
+		var disableOn = options.disableOn !== undefined ? options.disableOn : $.magnificPopup.defaults.disableOn;
+
+		if(disableOn) {
+			if($.isFunction(disableOn)) {
+				if( !disableOn.call(mfp) ) {
+					return true;
+				}
+			} else { // else it's number
+				if( _window.width() < disableOn ) {
+					return true;
+				}
+			}
+		}
+		
+		if(e.type) {
+			e.preventDefault();
+
+			// This will prevent popup from closing if element is inside and popup is already opened
+			if(mfp.isOpen) {
+				e.stopPropagation();
+			}
+		}
+			
+
+		options.el = $(e.mfpEl);
+		if(options.delegate) {
+			options.items = el.find(options.delegate);
+		}
+		mfp.open(options);
 	},
 
 
@@ -692,7 +736,7 @@ MagnificPopup.prototype = {
 
 			mfp.preloader.html(text);
 
-			mfp.preloader.find('a').click(function(e) {
+			mfp.preloader.find('a').on('click', function(e) {
 				e.stopImmediatePropagation();
 			});
 
@@ -714,7 +758,7 @@ MagnificPopup.prototype = {
 		mfp.wrap.removeClass(cName);
 	},
 	_hasScrollBar: function(winHeight) {
-		return (  (mfp.isIE7 ? _document.height() : document.body.scrollHeight) > (winHeight || _window.height()) )
+		return (  (mfp.isIE7 ? _document.height() : document.body.scrollHeight) > (winHeight || _window.height()) );
 	},
 	_parseMarkup: function(template, values, item) {
 		var arr;
@@ -826,6 +870,12 @@ $.magnificPopup = {
 
 		closeBtnInside: true, 
 
+		showCloseBtn: true,
+
+		enableEscapeKey: true,
+
+		modal: false,
+
 		alignTop: false,
 	
 		removalDelay: 0,
@@ -1222,6 +1272,8 @@ $.magnificPopup.registerModule('image', {
 
 							item.hasSize = true;
 							item.loaded = true;
+
+							_mfpTrigger('ImageLoadComplete');
 							
 						}
 						else {
@@ -1265,6 +1317,9 @@ $.magnificPopup.registerModule('image', {
 				if(el.is('img')) {
 					item.img = item.img.clone();
 				}
+				if(item.img[0].naturalWidth > 0) {
+					item.hasSize = true;
+				}
 			}
 
 			mfp._parseMarkup(template, {
@@ -1305,6 +1360,193 @@ $.magnificPopup.registerModule('image', {
 
 /*>>image*/
 
+/*>>zoom*/
+var hasMozTransform,
+	getHasMozTransform = function() {
+		if(hasMozTransform === undefined) {
+			hasMozTransform = document.createElement('p').style.MozTransform !== undefined;
+		}
+		return hasMozTransform;		
+	};
+
+$.magnificPopup.registerModule('zoom', {
+
+	options: {
+		enabled: false,
+		easing: 'ease-in-out',
+		duration: 300,
+		opener: function(element) {
+			return element.is('img') ? element : element.find('img');
+		}
+	},
+
+	proto: {
+
+		initZoom: function() {
+			var zoomSt = mfp.st.zoom,
+				ns = '.zoom';
+				
+			if(!zoomSt.enabled || !mfp.supportsTransition) {
+				return;
+			}
+
+			var duration = zoomSt.duration,
+				getElToAnimate = function(image) {
+					var newImg = image.clone().removeAttr('style').removeAttr('class').addClass('mfp-animated-image'),
+						transition = 'all '+(zoomSt.duration/1000)+'s ' + zoomSt.easing,
+						cssObj = {
+							position: 'fixed',
+							zIndex: 9999,
+							left: 0,
+							top: 0,
+							'-webkit-backface-visibility': 'hidden'
+						},
+						t = 'transition';
+
+					cssObj['-webkit-'+t] = cssObj['-moz-'+t] = cssObj['-o-'+t] = cssObj[t] = transition;
+
+					newImg.css(cssObj);
+					return newImg;
+				},
+				showMainContent = function() {
+					mfp.content.css('visibility', 'visible');
+				},
+				openTimeout,
+				animatedImg;
+
+			_mfpOn('BuildControls'+ns, function() {
+				if(mfp._allowZoom()) {
+
+					clearTimeout(openTimeout);
+					mfp.content.css('visibility', 'hidden');
+
+					// Basically, all code below does is clones existing image, puts in on top of the current one and animated it
+					
+					image = mfp._getItemToZoom();
+
+					if(!image) {
+						showMainContent();
+						return;
+					}
+
+					animatedImg = getElToAnimate(image); 
+					
+					animatedImg.css( mfp._getOffset() );
+
+					mfp.wrap.append(animatedImg);
+
+					openTimeout = setTimeout(function() {
+						animatedImg.css( mfp._getOffset( true ) );
+						openTimeout = setTimeout(function() {
+
+							showMainContent();
+
+							setTimeout(function() {
+								animatedImg.remove();
+								image = animatedImg = null;
+								_mfpTrigger('ZoomAnimationEnded');
+							}, 16); // avoid blink when switching images 
+
+						}, duration); // this timeout equals animation duration
+
+					}, 16); // by adding this timeout we avoid short glitch at the beginning of animation
+
+
+					// Lots of timeouts...
+				}
+			});
+			_mfpOn(BEFORE_CLOSE_EVENT+ns, function() {
+				if(mfp._allowZoom()) {
+
+					clearTimeout(openTimeout);
+
+					mfp.st.removalDelay = duration;
+
+					if(!image) {
+						image = mfp._getItemToZoom();
+						if(!image) {
+							return;
+						}
+						animatedImg = getElToAnimate(image);
+					}
+					
+					
+					animatedImg.css( mfp._getOffset(true) );
+					mfp.wrap.append(animatedImg);
+					mfp.content.css('visibility', 'hidden');
+					
+					setTimeout(function() {
+						animatedImg.css( mfp._getOffset() );
+					}, 16);
+				}
+
+			});
+
+			_mfpOn(CLOSE_EVENT+ns, function() {
+				if(mfp._allowZoom()) {
+					showMainContent();
+					if(animatedImg) {
+						animatedImg.remove();
+					}
+				}	
+			});
+		},
+
+		_allowZoom: function() {
+			return mfp.currItem.type === 'image';
+		},
+
+		_getItemToZoom: function() {
+			if(mfp.currItem.hasSize) {
+				return mfp.currItem.img;
+			} else {
+				return false;
+			}
+		},
+
+		// Get element postion relative to viewport
+		_getOffset: function(isLarge) {
+			var el;
+			if(isLarge) {
+				el = mfp.currItem.img;
+			} else {
+				el = mfp.st.zoom.opener(mfp.currItem.el || mfp.currItem);
+			}
+
+			var offset = el.offset();
+			var paddingTop = parseInt(el.css('padding-top'),10);
+			var paddingBottom = parseInt(el.css('padding-bottom'),10);
+			offset.top -= ( $(window).scrollTop() - paddingTop );
+
+
+			/*
+			
+			Animating left + top + width/height looks glitchy in Firefox, but perfect in Chrome. And vice-versa.
+
+			 */
+			var obj = {
+				width: el.width(),
+				// fix Zepto height+padding issue
+				height: (_isJQ ? el.innerHeight() : el[0].offsetHeight) - paddingBottom - paddingTop
+			};
+
+			// I hate to do this, but there is no another option
+			if( getHasMozTransform() ) {
+				obj['-moz-transform'] = obj['transform'] = 'translate(' + offset.left + 'px,' + offset.top + 'px)';
+			} else {
+				obj.left = offset.left;
+				obj.top = offset.top;
+			}
+			return obj;
+		}
+
+	}
+});
+
+
+
+/*>>zoom*/
+
 /*>>iframe*/
 
 var IFRAME_NS = 'iframe',
@@ -1582,6 +1824,7 @@ $.magnificPopup.registerModule('gallery', {
 				}).on('error.mfploader', function() {
 					item.hasSize = true;
 					item.loadError = true;
+					_mfpTrigger('LazyLoadError', item);
 				}).attr('src', item.src);
 			}
 

assets/less/480.less

@@ -3,14 +3,6 @@
 // TEXTURE ====================================================
 // ELEMENTS ===================================================
 // LAYOUT =====================================================
-.article-author-top,
-.article-author-bottom {
-	.transition(all .2s ease);
-	.opacity(.7);
-	&:hover {
-		.opacity(1);
-	}
-}
 .image-grid {
 	li {
 		width: 33.333333%;

assets/less/600.less

@@ -45,6 +45,24 @@
 	.grid(12,2);
 	.prefix(12,0.5);
 	.suffix(12,0.5);
+	h3,
+	.bio-photo,
+	p,
+	.author-social {
+		display: block;
+		max-width: 125px;
+		margin: auto;
+	}
+	h3 {
+		margin-top: 10px;
+		margin-bottom: 10px;
+	}
+	p {
+		margin-bottom: 20px;
+	}
+	.author-social {
+		margin-bottom: 5px;
+	}
 }
 .article-author-bottom {
 	display: none;
@@ -54,8 +72,8 @@
 	.grid(12,2);
 	.prefix(12,0.5);
 	.suffix(12,0.5);
-	position: fixed;
-	top: 120px;
+	position: absolute;
+	top: 5.5em;
 	right: 0;
 	.box-shadow(0 0 5px rgba(0,0,0,.50));
 }

assets/less/992.less

@@ -5,6 +5,12 @@
 // LAYOUT =====================================================
 .article-author-top,
 .article-author-bottom {
+	h3,
+	.bio-photo,
+	p,
+	.author-social {
+		max-width: 150px;
+	}
 	img.bio-photo {
 		width: 150px;
 		height: 150px;

assets/less/coderay.less

@@ -4,6 +4,7 @@
   .font(12);
   color: #333332;
   margin-bottom: 1.5em;
+  .rounded(4px);
   pre {
     margin: 0px;
     padding: 1em;

assets/less/elements.less

@@ -47,7 +47,7 @@ svg:not(:root) {
   background-color: @black;
   color: @white;
   border: 2px solid @black !important;
-  .rounded(20px);
+  .rounded(4px);
   &:visited {
     color: @white;
   }

assets/less/page.less

@@ -69,8 +69,12 @@ body {
 	}
 	article {
 		h2 {
-			margin-bottom: 0;
-			.font-rem(24);
+			margin-bottom: 4px;
+			.font-rem(20);
+			text-transform: uppercase;
+		}
+		p {
+			.font-rem(14);
 		}
 		p+p {
 			text-indent: 0;
@@ -145,7 +149,6 @@ body {
 }
 .article-author-top {
 	display: none;
-	text-align: center;
 }
 .article-author-bottom {
 	margin-bottom: 1em;
@@ -204,15 +207,20 @@ body {
 		font-family: @heading-font;
 		border-bottom: 1px solid darken(@white, 50);
 		&:last-child {
-			border-bottom: 0 solid transparent;
+			border-bottom-width: 0;
 		}
-		a, a:hover {
-			color: @white;
-			border-bottom: 0 solid transparent;
-		}
-		a { 
+		a {
 			padding: 10px;
 			display: block;
+			color: @white;
+			border-bottom-width: 0;
+			&:hover {
+				font-weight: 400;
+				:before {
+					content: "\00bb";
+					padding-right: 5px;
+				}
+			}
 		}
 		ul {
 			margin: 0;

assets/less/pygments.less

@@ -4,6 +4,7 @@
 	.font(12);
 	color: #333332;
 	margin-bottom: 1.5em;
+	.rounded(4px);
 	pre {
 		position: relative;
 		margin: 0;

package.json

@@ -0,0 +1,25 @@
+{
+  "name": "minimal-mistakes-theme",
+  "author": "Michael Rose <michael@mademistakes.com>",
+  "homepage": "http://mmistakes.github.io/minima-mistakes/",
+  "repository": {
+    "type": "git",
+    "url": "git://github.com/mmistakes/minimal-mistakes.git"
+  },
+  "bugs": {
+    "url": "https://github.com/mmistakes/minimal-mistakes/issues"
+  },
+  "engines": {
+    "node": ">= 0.10.0"
+  },
+  "devDependencies": {
+    "grunt": "~0.4.1",
+    "grunt-contrib-clean": "~0.5.0",
+    "grunt-contrib-jshint": "~0.6.3",
+    "grunt-contrib-uglify": "~0.2.2",
+    "grunt-contrib-watch": "~0.5.2",
+    "grunt-recess": "~0.3.5",
+    "grunt-contrib-imagemin": "~0.2.0",
+    "grunt-svgmin": "~0.2.0"
+  }
+}

theme-setup.md

@@ -12,7 +12,7 @@ image:
 
 <section id="table-of-contents" class="toc">
   <header>
-    <h3 class="delta">Contents</h3>
+    <h3 >Contents</h3>
   </header>
 <div id="drawer" markdown="1">
 *  Auto generated table of contents
@@ -131,7 +131,7 @@ Any article or page that you want a *table of contents* to render insert the fol
 {% highlight html %}
 <section id="table-of-contents" class="toc">
   <header>
-    <h3 class="delta">Contents</h3>
+    <h3>Contents</h3>
   </header>
 <div id="drawer" markdown="1">
 *  Auto generated table of contents