Replace Grunt tasks with Gulp

_assets/css/_typography.scss

@@ -0,0 +1,167 @@
+/* ==========================================================================
+   Typography
+   ========================================================================== */
+
+/*
+   Headings
+   ========================================================================== */
+
+h1, h2, h3, h4, h5, h6 {
+	font-family: $heading-font;
+}
+h1 {
+	@include font-size(32);
+}
+h2 {
+	@include font-size(28);
+}
+h3 {
+	@include font-size(24);
+}
+h4 {
+	@include font-size(18);
+}
+h5 {
+	@include font-size(16);
+}
+h6 {
+	@include font-size(14);
+}
+
+/*
+   Links
+   ========================================================================== */
+
+a {
+	text-decoration: none;
+	color: $link-color;
+	&:visited {
+		color: $linkcolorvisited;
+	}
+	&:hover {
+		color: $linkcolorhover;
+	}
+	&:focus {
+		outline: thin dotted;
+		color: $linkcolorfocus;
+	}
+	&:hover,
+	&:active {
+		outline: 0;
+	}
+}
+
+/*
+   Figure captions
+   ========================================================================== */
+
+figcaption {
+	padding-top: 10px;
+	@include font(14);
+	line-height: 1.3;
+	color: lighten($text-color, 10);
+}
+
+/*
+   Feature image captions
+   ========================================================================== */
+
+.image-caption {
+	@include grid(12,10);
+	@include prefix(12,1);
+	@include suffix(12,1);
+	display: block;
+	text-align: right;
+	@include font(12);
+	line-height: 1.3;
+	font-style: italic;
+	color: lighten($text-color, 30);
+	@media #{$small} {
+		@include grid(12,9);
+		@include prefix(12,0);
+		@include suffix(12,0);
+	}
+	@media #{$x-large} {
+		@include grid(12,8.5);
+	}
+	a {
+		color: lighten($text-color, 30);
+	}
+}
+
+/*
+   Notices
+   ========================================================================== */
+
+.notice {
+	margin-top: 1.5em;
+	padding: .5em 1em;
+	text-indent: 0;
+	@include font-rem(14);
+	background-color: $body-color;
+	border: 1px solid darken($body-color,20);
+	@include rounded(3px);
+}
+
+/*
+   Blockquotes
+   ========================================================================== */
+
+blockquote {
+	margin-left: -28px;
+	padding-left: 20px;
+	border-left: 8px solid $border-color;
+	font-family: $alt-font;
+	font-style: italic;
+}
+
+/*
+   Footnotes
+   ========================================================================== */
+
+.footnotes {
+	ol, li, p {
+		margin-bottom: 0;
+		@include font-rem(14);
+	}
+}
+
+/*
+   Paragraphs
+   ========================================================================== */
+
+p {
+	margin: 0 0 $indent-var;
+	// sibling indentation
+  @if $paragraph-indent == true {
+    & + p {
+			text-indent: $indent-var;
+			margin-top: -($indent-var);
+		}
+	}
+}
+
+/*
+   Code snippets
+   ========================================================================== */
+
+tt, code, kbd, samp, pre {
+	font-family: $code-font;
+}
+p,
+li {
+	code {
+		@include font-rem(12);
+		line-height: 1.5;
+		margin: 0 2px;
+		padding: 0 5px;
+		border: 1px solid lighten($black, 90);
+		background-color: #efefef;
+		@include rounded(3px);
+	}
+}
+pre {
+	@include font-rem(12);
+	line-height: 1.5;
+	overflow-x: auto;
+}