Initial commit

plugins/jetpack/scss/_utilities/_accessibility.scss

@@ -0,0 +1,30 @@
+// ==========================================================================
+// Accessibility
+// ==========================================================================
+
+// Text meant only for screen readers
+.screen-reader-text {
+	clip: rect(1px, 1px, 1px, 1px);
+	position: absolute !important;
+
+	&:hover,
+	&:active,
+	&:focus {
+		background-color: #f1f1f1;
+		border-radius: 3px;
+		box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
+		clip: auto !important;
+		color: #21759b;
+		display: block;
+		font-size: 14px;
+		font-weight: bold;
+		height: auto;
+		left: 5px;
+		line-height: normal;
+		padding: 15px 23px 14px;
+		text-decoration: none;
+		top: 5px;
+		width: auto;
+		z-index: 100000; // Above WP toolbar
+	}
+}

plugins/jetpack/scss/_utilities/_clearings.scss

@@ -0,0 +1,21 @@
+// ==========================================================================
+// Clearings
+//
+// You can either use the mixin or @extend .clear.
+// ==========================================================================
+
+
+// The mixin
+@mixin clearfix() {
+	&:before, &:after {
+		content: "";
+		display: table;
+	}
+	&:after {
+		clear: both;
+	}
+}
+
+%clearfix {
+	@include clearfix;
+}

plugins/jetpack/scss/_utilities/_grid.scss

@@ -0,0 +1,75 @@
+// ==========================================================================
+// Grid styles
+// 12 column grid
+// ==========================================================================
+
+.j-row {
+	width: 100%;
+	margin: 0 auto;
+	&:before, 
+	&:after {
+		content: " ";
+		display: table; 
+	}
+
+	&:after {
+		clear: both;
+	}
+}
+
+.j-col {
+	padding: 0.85em;
+	width: 100%;
+	float: left; 
+	position: relative;
+}
+
+// Small grid (Mobile first)
+@media only screen {
+	.j-sm-1		{width: 8.33333%;}
+	.j-sm-2		{width: 16.66667%;}
+	.j-sm-3		{width: 25%;}
+	.j-sm-4		{width: 33.33333%;}
+	.j-sm-5		{width: 41.66667%;}
+	.j-sm-6		{width: 50%;}
+	.j-sm-7		{width: 58.33333%;}
+	.j-sm-8		{width: 66.66667%;}
+	.j-sm-9		{width: 75%;}
+	.j-sm-10	{width: 83.33333%;}
+	.j-sm-11	{width: 91.66667%;}
+	.j-sm-12	{width: 100%;}
+}
+
+// Medium grid
+// 530px and up
+@include minbreakpoint(large-phone) {
+	.j-md-1		{width: 8.33333%;}
+	.j-md-2		{width: 16.66667%;}
+	.j-md-3		{width: 25%;}
+	.j-md-4		{width: 33.33333%;}
+	.j-md-5		{width: 41.66667%;}
+	.j-md-6		{width: 50%;}
+	.j-md-7		{width: 58.33333%;}
+	.j-md-8		{width: 66.66667%;}
+	.j-md-9		{width: 75%;}
+	.j-md-10	{width: 83.33333%;}
+	.j-md-11	{width: 91.66667%;}
+	.j-md-12	{width: 100%;}
+}
+
+// Large grid
+// 782px and up
+@include minbreakpoint(tablet) {
+	.j-lrg-1	{width: 8.33333%;}
+	.j-lrg-2	{width: 16.66667%;}
+	.j-lrg-3	{width: 25%;}
+	.j-lrg-4	{width: 33.33333%;}
+	.j-lrg-5	{width: 41.66667%;}
+	.j-lrg-6	{width: 50%;}
+	.j-lrg-7	{width: 58.33333%;}
+	.j-lrg-8	{width: 66.66667%;}
+	.j-lrg-9	{width: 75%;}
+	.j-lrg-10	{width: 83.33333%;}
+	.j-lrg-11	{width: 91.66667%;}
+	.j-lrg-12	{width: 100%;}
+}

plugins/jetpack/scss/_utilities/_ie.scss

@@ -0,0 +1,48 @@
+// ==========================================================================
+// Internet Explorer
+// ==========================================================================
+
+// ==========================================================================
+// IE9
+// ==========================================================================
+
+// .lt-ie10 {
+// 	.masthead {
+// 		@include ie-gradient($green, lighten($green, 12%));
+// 	}
+// 	.footer {
+// 		@include ie-gradient(lighten($green, 12%), $green);
+// 	}
+// 	@media screen and (max-width: 768px) {
+// 		$menu_width: 260px;
+//
+// 		.drawer-checkbox:checked ~ .header .drawer-nav {
+// 			left: 0;
+// 		}
+// 		.drawer-checkbox:checked ~ .wrapper{
+// 			margin-left: $menu_width;
+// 			margin-right:-($menu_width);
+// 		}
+// 	}
+// }
+
+// ==========================================================================
+// IE8
+// ==========================================================================
+
+.lt-ie9 {
+}
+
+// ==========================================================================
+// IE7
+// ==========================================================================
+
+.lt-ie8 {
+}
+
+// ==========================================================================
+// IE6
+// ==========================================================================
+
+.lt-ie7 {
+}

plugins/jetpack/scss/_utilities/_normalize.scss

@@ -0,0 +1,322 @@
+// ==========================================================================
+// Normalize
+// ==========================================================================
+
+/*! normalize.css v3.0.0 | MIT License | git.io/normalize */
+
+// 1. Set default font family to sans-serif.
+// 2. Prevent iOS text size adjust after orientation change, without disabling
+//    user zoom.
+html {
+	font-family: sans-serif; // 1
+	-ms-text-size-adjust: 100%; // 2
+	-webkit-text-size-adjust: 100%; // 2
+}
+
+// Remove default margin.
+body {
+	margin: 0;
+}
+*,
+*:before,
+*:after { /* apply a natural box layout model to all elements; see http://www.paulirish.com/2012/box-sizing-border-box-ftw/ */
+	-webkit-box-sizing: border-box; /* Not needed for modern webkit but still used by Blackberry Browser 7.0; see http://caniuse.com/#search=box-sizing */
+	-moz-box-sizing:    border-box; /* Still needed for Firefox 28; see http://caniuse.com/#search=box-sizing */
+	box-sizing:         border-box;
+}
+
+// ==========================================================================
+// HTML5 display definitions
+// ==========================================================================
+
+// Correct `block` display not defined in IE 8/9.
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+main,
+nav,
+section,
+summary {
+	display: block;
+}
+
+// 1. Correct `inline-block` display not defined in IE 8/9.
+// 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
+audio,
+canvas,
+progress,
+video {
+	display: inline-block; // 1
+	vertical-align: baseline; // 2
+}
+
+// Prevent modern browsers from displaying `audio` without controls.
+// Remove excess height in iOS 5 devices.
+audio:not([controls]) {
+	display: none;
+	height: 0;
+}
+
+// Address `[hidden]` styling not present in IE 8/9.
+// Hide the `template` element in IE, Safari, and Firefox < 22.
+[hidden],
+template {
+	display: none;
+}
+
+// ==========================================================================
+// Links
+// ==========================================================================
+
+// Remove the gray background color from active links in IE 10.
+a {
+	background: transparent;
+}
+
+// Improve readability when focused and also mouse hovered in all browsers.
+a:active,
+a:hover {
+	outline: 0;
+}
+
+// ==========================================================================
+// Text-level semantics
+// ==========================================================================
+
+// Address styling not present in IE 8/9, Safari 5, and Chrome.
+abbr[title] {
+	border-bottom: 1px dotted;
+}
+
+// Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
+b,
+strong {
+	font-weight: bold;
+}
+
+// Address styling not present in Safari 5 and Chrome.
+dfn {
+	font-style: italic;
+}
+
+// Address variable `h1` font-size and margin within `section` and `article`
+// contexts in Firefox 4+, Safari 5, and Chrome.
+h1 {
+	font-size: 2em;
+	margin: 0.67em 0;
+}
+
+// Address styling not present in IE 8/9.
+mark {
+	background: #ff0;
+	color: #000;
+}
+
+// Address inconsistent and variable font size in all browsers.
+small {
+	font-size: 80%;
+}
+
+// Prevent `sub` and `sup` affecting `line-height` in all browsers.
+sub,
+sup {
+	font-size: 75%;
+	line-height: 0;
+	position: relative;
+	vertical-align: baseline;
+}
+sup {
+	top: -0.5em;
+}
+sub {
+	bottom: -0.25em;
+}
+
+// ==========================================================================
+// Embedded content
+// ==========================================================================
+
+// Remove border when inside `a` element in IE 8/9.
+img {
+	border: 0;
+}
+
+// Correct overflow displayed oddly in IE 9.
+svg:not(:root) {
+	overflow: hidden;
+}
+
+// ==========================================================================
+// Grouping content
+// ==========================================================================
+
+// Address margin not present in IE 8/9 and Safari 5.
+figure {
+	margin: 1em 40px;
+}
+
+// Address differences between Firefox and other browsers.
+hr {
+	box-sizing: content-box;
+	height: 0;
+}
+
+// Contain overflow in all browsers.
+pre {
+	overflow: auto;
+}
+
+// Address odd `em`-unit font size rendering in all browsers.
+code,
+kbd,
+pre,
+samp {
+	font-family: monospace, monospace;
+	font-size: 1em;
+}
+
+// ==========================================================================
+// Forms
+// ==========================================================================
+
+// Known limitation: by default, Chrome and Safari on OS X allow very limited
+// styling of `select`, unless a `border` property is set.
+
+// 1. Correct color not being inherited.
+//    Known issue: affects color of disabled elements.
+// 2. Correct font properties not being inherited.
+// 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
+button,
+input,
+optgroup,
+select,
+textarea {
+	color: inherit; // 1
+	font: inherit; // 2
+	margin: 0; // 3
+}
+
+// Address `overflow` set to `hidden` in IE 8/9/10.
+button {
+	overflow: visible;
+}
+
+// Address inconsistent `text-transform` inheritance for `button` and `select`.
+// All other form control elements do not inherit `text-transform` values.
+// Correct `button` style inheritance in Firefox, IE 8+, and Opera
+// Correct `select` style inheritance in Firefox.
+button,
+select {
+	text-transform: none;
+}
+
+// 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
+//    and `video` controls.
+// 2. Correct inability to style clickable `input` types in iOS.
+// 3. Improve usability and consistency of cursor style between image-type
+//    `input` and others.
+button,
+html input[type="button"], // 1
+input[type="reset"],
+input[type="submit"] {
+	-webkit-appearance: button; // 2
+	cursor: pointer; // 3
+}
+
+// Re-set default cursor for disabled elements.
+button[disabled],
+html input[disabled] {
+	cursor: default;
+}
+
+// Remove inner padding and border in Firefox 4+.
+button::-moz-focus-inner,
+input::-moz-focus-inner {
+	border: 0;
+	padding: 0;
+}
+
+// Address Firefox 4+ setting `line-height` on `input` using `!important` in
+// the UA stylesheet.
+input {
+	line-height: normal;
+}
+
+// It's recommended that you don't attempt to style these elements.
+// Firefox's implementation doesn't respect box-sizing, padding, or width.
+//
+// 1. Address box sizing set to `content-box` in IE 8/9/10.
+// 2. Remove excess padding in IE 8/9/10.
+input[type="checkbox"],
+input[type="radio"] {
+	box-sizing: border-box; // 1
+	padding: 0; // 2
+}
+
+// Fix the cursor style for Chrome's increment/decrement buttons. For certain
+// `font-size` values of the `input`, it causes the cursor style of the
+// decrement button to change from `default` to `text`.
+input[type="number"]::-webkit-inner-spin-button,
+input[type="number"]::-webkit-outer-spin-button {
+	height: auto;
+}
+
+// 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
+// 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
+//    (include `-moz` to future-proof).
+input[type="search"] {
+  -webkit-appearance: textfield; // 1
+  box-sizing: content-box;
+}
+
+// Remove inner padding and search cancel button in Safari and Chrome on OS X.
+// Safari (but not Chrome) clips the cancel button when the search input has
+// padding (and `textfield` appearance).
+input[type="search"]::-webkit-search-cancel-button,
+input[type="search"]::-webkit-search-decoration {
+	-webkit-appearance: none;
+}
+
+// Define consistent border, margin, and padding.
+fieldset {
+	border: 1px solid #c0c0c0;
+	margin: 0 2px;
+	padding: 0.35em 0.625em 0.75em;
+}
+
+// 1. Correct `color` not being inherited in IE 8/9.
+// 2. Remove padding so people aren't caught out if they zero out fieldsets.
+legend {
+	border: 0; // 1
+	padding: 0; // 2
+}
+
+// Remove default vertical scrollbar in IE 8/9.
+textarea {
+	overflow: auto;
+}
+
+// Don't inherit the `font-weight` (applied by a rule above).
+// NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
+optgroup {
+	font-weight: bold;
+}
+
+// ==========================================================================
+// Tables
+// ==========================================================================
+
+// Remove most spacing between table cells.
+table {
+	border-collapse: collapse;
+	border-spacing: 0;
+}
+td,
+th {
+	padding: 0;
+}

plugins/jetpack/scss/_utilities/_print.scss

@@ -0,0 +1,67 @@
+// ==========================================================================
+// Print styles.
+// Inlined to avoid required HTTP connection: h5bp.com/r
+// ==========================================================================
+@media print {
+	* {
+		background: transparent !important;
+		color: #000 !important; // Black prints faster: h5bp.com/s
+		box-shadow: none !important;
+		text-shadow: none !important;
+	}
+
+	a,
+	a:visited {
+		text-decoration: underline;
+	}
+
+	a[href]:after {
+		content: " (" attr(href) ")";
+	}
+
+	abbr[title]:after {
+		content: " (" attr(title) ")";
+	}
+
+	// Don't show links for images, or javascript/internal links
+	.ir a:after,
+	a[href^="javascript:"]:after,
+	a[href^="#"]:after {
+		content: "";
+	}
+
+	pre,
+	blockquote {
+		border: 1px solid #999;
+		page-break-inside: avoid;
+	}
+
+	thead {
+		display: table-header-group; // h5bp.com/t
+	}
+
+	tr,
+	img {
+		page-break-inside: avoid;
+	}
+
+	img {
+		max-width: 100% !important;
+	}
+
+	@page {
+		margin: 0.5cm;
+	}
+
+	p,
+	h2,
+	h3 {
+		orphans: 3;
+		widows: 3;
+	}
+
+	h2,
+	h3 {
+		page-break-after: avoid;
+	}
+}

plugins/jetpack/scss/_utilities/mixins/_arrows.scss

@@ -0,0 +1,64 @@
+// ==========================================================================
+// Arrows
+//
+// Use this to generate most of the code for your CSS arrows.
+//
+//
+// EXAMPLE
+//
+// .tooltip {
+// 	&:before {
+// 		@include arrow--up(7px, #333);
+// 		left: 50%;
+// 		margin-left: -7px;
+// 	}
+// }
+//
+// ==========================================================================
+
+@mixin arrow--base(){
+	position: absolute;
+	content: '';
+	width: 0;
+	height: 0;
+}
+
+@mixin arrow--top($size: 10px, $color: #ccc){
+	@include arrow--base;
+	bottom: 100%;
+	border-left: $size solid transparent;
+	border-right: $size solid transparent;
+	border-bottom: $size solid $color;
+}
+
+@mixin arrow--up($size: 10px, $color: #ccc){
+	@include arrow--top($size, $color);
+}
+
+@mixin arrow--right($size: 10px, $color: #ccc){
+	@include arrow--base;
+	left: 100%;
+	border-top: $size solid transparent;
+	border-bottom: $size solid transparent;
+	border-left: $size solid $color;
+}
+
+@mixin arrow--bottom($size: 10px, $color: #ccc){
+	@include arrow--base;
+	top: 100%;
+	border-left: $size solid transparent;
+	border-right: $size solid transparent;
+	border-top: $size solid $color;
+}
+
+@mixin arrow--down($size: 10px, $color: #ccc){
+	@include arrow--bottom($size, $color);
+}
+
+@mixin arrow--left($size: 10px, $color: #ccc){
+	@include arrow--base;
+	right: 100%;
+	border-top: $size solid transparent;
+	border-bottom: $size solid transparent;
+	border-right:$size solid $color;
+}

plugins/jetpack/scss/_utilities/mixins/_breakpoint.scss

@@ -0,0 +1,46 @@
+// ==========================================================================
+// Breakpoint Mixin
+//
+// Uses Sass Maps which requires Sass v3.3.0 or newer
+//
+//
+// EXAMPLE
+//
+// body {
+// 	@include breakpoint(tablet){
+// 		font-size: 14px;
+// 	};
+// }
+
+// ==========================================================================
+
+// Add or remove breakpoints as you desire
+$breakpoints:(
+	phone: 320px,
+	large-phone: 530px,
+	phablet: 600px,
+	tablet: 782px,
+	desktop: 900px,
+	large-desktop: 1147px,
+);
+
+@mixin breakpoint($size){
+	@each $breakpoint, $value in $breakpoints {
+		@if $size == $breakpoint {
+			@media (max-width: map-get($breakpoints, $breakpoint)){
+				@content;
+			}
+		}
+	}
+}
+
+// For mobile first
+@mixin minbreakpoint($size){
+	@each $breakpoint, $value in $breakpoints {
+		@if $size == $breakpoint {
+			@media (min-width: map-get($breakpoints, $breakpoint)){
+				@content;
+			}
+		}
+	}
+}

plugins/jetpack/scss/_utilities/mixins/_button.scss

@@ -0,0 +1,45 @@
+// Taken from core `wp-admin/css/colors/_mixins.scss`
+
+/*
+ * Button mixin- creates 3d-ish button effect with correct
+ * highlights/shadows, based on a base color.
+ */
+@mixin button( $button-color, $text-color: white ) {
+	background: $button-color;
+	border-color: darken( $button-color, 10% );
+	color: $text-color;
+	box-shadow: inset 0 1px 0 lighten( $button-color, 15% ), 0 1px 0 rgba(0,0,0,.15);
+
+	&:hover,
+	&:focus {
+		background: darken( $button-color, 5% );
+		border-color: darken( $button-color, 15% );
+		color: $text-color;
+		box-shadow: inset 0 1px 0 lighten( $button-color, 10% );
+	}
+
+	&:focus {
+		box-shadow: inset 0 1px 0 lighten( $button-color, 10% ),
+		0 0 0 1px #5b9dd9,
+		0 0 2px 1px rgba( 30, 140, 190, .8 );
+	}
+
+	&:active {
+		background: darken( $button-color, 10% );
+		border-color: darken( $button-color, 15% );
+		color: $text-color;
+		box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 ),
+		0 0 0 1px #5b9dd9,
+		0 0 2px 1px rgba( 30, 140, 190, .8 );
+	}
+
+	&[disabled],
+	&:disabled,
+	&.button-primary-disabled,
+	&.disabled {
+		color: hsl( hue( $button-color ), 10%, 80% ) !important;
+		background: darken( $button-color, 8% ) !important;
+		border-color: darken( $button-color, 15% ) !important;
+		text-shadow: none !important;
+	}
+}

plugins/jetpack/scss/_utilities/mixins/_custom-scrollbar.scss

@@ -0,0 +1,16 @@
+// ==========================================================================
+// Custom scrollbars
+// ==========================================================================
+
+@mixin custom-scrollbar($width: .8em, $track: rgba(217, 217, 217, .5), $thumb: rgba(184, 184, 184, .5)){
+	::-webkit-scrollbar {
+		width: $width;
+	}
+	::-webkit-scrollbar-track {
+		background-color: $track;
+	}
+	::-webkit-scrollbar-thumb {
+		background: $thumb;
+		box-shadow: inset .05em .05em 0 rgba(0, 0, 0, .1), inset 0 -.05em 0 rgba(0, 0, 0, .07);
+	}
+}

plugins/jetpack/scss/_utilities/mixins/_full-width-bars.scss

@@ -0,0 +1,21 @@
+// ==========================================================================
+// Full-width bars
+// ==========================================================================
+
+@mixin full-width-bars() {
+	// Still testing this one
+	position: relative;
+	z-index: 1;
+
+	&:before {
+		position: absolute;
+		content: "";
+		display: block;
+		top: 0;
+		left: -5000px;
+		height: 100%;
+		width: 15000px;
+		z-index: -1;
+		@content;
+	}
+}

plugins/jetpack/scss/_utilities/mixins/_gradient--vertical.scss

@@ -0,0 +1,8 @@
+// ==========================================================================
+// Vertical gradient
+// ==========================================================================
+
+@mixin gradient--vertical($start, $end){
+	background-color: $end;
+	background-image: linear-gradient(top, $start, $end); // Chrome 26, Firefox 16+, IE 10+, Opera 12.10+
+}

plugins/jetpack/scss/_utilities/mixins/_ie__gradient--vertical.scss

@@ -0,0 +1,7 @@
+// ==========================================================================
+// ie__gradient--vertical
+// ==========================================================================
+
+@mixin ie__gradient--vertical($start, $end){
+	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#{$start}', EndColorStr='#{$end}');
+}

plugins/jetpack/scss/_utilities/mixins/_image-replacement.scss

@@ -0,0 +1,13 @@
+// ==========================================================================
+// Image replacement
+// ==========================================================================
+
+@mixin image-replacement($url, $width, $height) {
+	// I totally stole this idea from Marcel Shields.
+	// Read his article: http://css-tricks.com/replace-the-image-in-an-img-with-css/
+	display: block;
+	width: $width; // Width of new image
+	height: $height; // Height of new image
+	padding-left: $width; // Equal to width of new image
+	background: url($url) no-repeat;
+}

plugins/jetpack/scss/_utilities/mixins/_mixins.scss

@@ -0,0 +1,13 @@
+// ==========================================================================
+// Mixins
+// ==========================================================================
+
+@import
+	"arrows",
+	"breakpoint",
+	"custom-scrollbar",
+	"gradient--vertical",
+	"ie__gradient--vertical",
+	"image-replacement",
+	"retina-background",
+	"sections";

plugins/jetpack/scss/_utilities/mixins/_retina-background.scss

@@ -0,0 +1,17 @@
+// ==========================================================================
+// Retina background
+// ==========================================================================
+
+@mixin retina-background ($url, $file-type, $width: auto, $repeat: repeat, $ratio: 1.5, $suffix: "@2x") {
+	background: url($url + "." + $file-type);
+	background-repeat: $repeat;
+	// Media queries from http://git.io/k-x0wA
+	@media only screen and (-webkit-min-device-pixel-ratio: $ratio),
+		only screen and (min--moz-device-pixel-ratio: $ratio),
+		only screen and (-o-min-device-pixel-ratio: #{$ratio}/1),
+		only screen and (min-resolution: #{round($ratio*96)}dpi),
+		only screen and (min-resolution: #{$ratio}dppx) {
+		background: url($url + $suffix + "." + $file-type);
+		background-size: $width auto;
+	}
+}

plugins/jetpack/scss/_utilities/mixins/_sections.scss

@@ -0,0 +1,25 @@
+// ==========================================================================
+// Retina background
+// ==========================================================================
+
+@mixin section($section, $sub: false) {
+	// Creates value to be used as section numbers
+	@if variable-exists(toc-value){} @else {
+		$toc-value: 0 !global;
+	}
+
+	// Sets index numbering
+	@if $sub == false { // increments by 1 (rounding down)
+		$toc-value: floor($toc-value) + 1 !global;
+	} @else { // increments by .1
+		$toc-value: $toc-value + .1  !global;
+	}
+
+	$spacing: ' ';
+	@for $i from 1 to (6 - str-length('#{$toc-value}')) {
+		$spacing: $spacing + ' ';
+	}
+	/*--------------------------------------------------------------
+	#{$toc-value}#{$spacing}#{$section}
+	--------------------------------------------------------------*/
+}