jquery_uniform-rails 0.0.1 → 2.1.2.3

data/vendor/assets/javascripts/jquery.uniform.min.js

@@ -0,0 +1 @@
+!function(e,t,n){"use strict";function s(e){var t=Array.prototype.slice.call(arguments,1);return e.prop?e.prop.apply(e,t):e.attr.apply(e,t)}function a(e,t,n){var s,a;for(s in n)n.hasOwnProperty(s)&&(a=s.replace(/ |$/g,t.eventNamespace),e.bind(a,n[s]))}function r(e,t,n){a(e,n,{focus:function(){t.addClass(n.focusClass)},blur:function(){t.removeClass(n.focusClass),t.removeClass(n.activeClass)},mouseenter:function(){t.addClass(n.hoverClass)},mouseleave:function(){t.removeClass(n.hoverClass),t.removeClass(n.activeClass)},"mousedown touchbegin":function(){e.is(":disabled")||t.addClass(n.activeClass)},"mouseup touchend":function(){t.removeClass(n.activeClass)}})}function i(e,t){e.removeClass(t.hoverClass+" "+t.focusClass+" "+t.activeClass)}function l(e,t,n){n?e.addClass(t):e.removeClass(t)}function u(e,t,n){var s="checked",a=t.is(":"+s);t.prop?t.prop(s,a):a?t.attr(s,s):t.removeAttr(s),l(e,n.checkedClass,a)}function o(e,t,n){l(e,n.disabledClass,t.is(":disabled"))}function c(e,t,n){switch(n){case"after":return e.after(t),e.next();case"before":return e.before(t),e.prev();case"wrap":return e.wrap(t),e.parent()}return null}function d(e,n,a){var r,i,l;return a||(a={}),a=t.extend({bind:{},divClass:null,divWrap:"wrap",spanClass:null,spanHtml:null,spanWrap:"wrap"},a),r=t("<div />"),i=t("<span />"),n.autoHide&&e.is(":hidden")&&"none"===e.css("display")&&r.hide(),a.divClass&&r.addClass(a.divClass),n.wrapperClass&&r.addClass(n.wrapperClass),a.spanClass&&i.addClass(a.spanClass),l=s(e,"id"),n.useID&&l&&s(r,"id",n.idPrefix+"-"+l),a.spanHtml&&i.html(a.spanHtml),r=c(e,r,a.divWrap),i=c(e,i,a.spanWrap),o(r,e,n),{div:r,span:i}}function f(e,n){var s;return n.wrapperClass?(s=t("<span />").addClass(n.wrapperClass),s=c(e,s,"wrap")):null}function p(){var n,s,a,r;return r="rgb(120,2,153)",s=t('<div style="width:0;height:0;color:'+r+'">'),t("body").append(s),a=s.get(0),n=e.getComputedStyle?e.getComputedStyle(a,"").color:(a.currentStyle||a.style||{}).color,s.remove(),n.replace(/ /g,"")!==r}function m(e){return e?t("<span />").text(e).html():""}function v(){return navigator.cpuClass&&!navigator.product}function h(){return void 0!==e.XMLHttpRequest?!0:!1}function C(e){var t;return e[0].multiple?!0:(t=s(e,"size"),!t||1>=t?!1:!0)}function b(){return!1}function y(e,t){var n="none";a(e,t,{"selectstart dragstart mousedown":b}),e.css({MozUserSelect:n,msUserSelect:n,webkitUserSelect:n,userSelect:n})}function w(e,t,n){var s=e.val();""===s?s=n.fileDefaultHtml:(s=s.split(/[\/\\]+/),s=s[s.length-1]),t.text(s)}function g(e,t,n){var s,a;for(s=[],e.each(function(){var e;for(e in t)Object.prototype.hasOwnProperty.call(t,e)&&(s.push({el:this,name:e,old:this.style[e]}),this.style[e]=t[e])}),n();s.length;)a=s.pop(),a.el.style[a.name]=a.old}function k(e,t){var n;n=e.parents(),n.push(e[0]),n=n.not(":visible"),g(n,{visibility:"hidden",display:"block",position:"absolute"},t)}function H(e,t){return function(){e.unwrap().unwrap().unbind(t.eventNamespace)}}var x=!0,A=!1,W=[{match:function(e){return e.is("a, button, :submit, :reset, input[type='button']")},apply:function(t,n){var l,u,c,f,p;return u=n.submitDefaultHtml,t.is(":reset")&&(u=n.resetDefaultHtml),f=t.is("a, button")?function(){return t.html()||u}:function(){return m(s(t,"value"))||u},c=d(t,n,{divClass:n.buttonClass,spanHtml:f()}),l=c.div,r(t,l,n),p=!1,a(l,n,{"click touchend":function(){var n,a,r,i;p||t.is(":disabled")||(p=!0,t[0].dispatchEvent?(n=document.createEvent("MouseEvents"),n.initEvent("click",!0,!0),a=t[0].dispatchEvent(n),t.is("a")&&a&&(r=s(t,"target"),i=s(t,"href"),r&&"_self"!==r?e.open(i,r):document.location.href=i)):t.click(),p=!1)}}),y(l,n),{remove:function(){return l.after(t),l.remove(),t.unbind(n.eventNamespace),t},update:function(){i(l,n),o(l,t,n),t.detach(),c.span.html(f()).append(t)}}}},{match:function(e){return e.is(":checkbox")},apply:function(e,t){var n,s,l;return n=d(e,t,{divClass:t.checkboxClass}),s=n.div,l=n.span,r(e,s,t),a(e,t,{"click touchend":function(){u(l,e,t)}}),u(l,e,t),{remove:H(e,t),update:function(){i(s,t),l.removeClass(t.checkedClass),u(l,e,t),o(s,e,t)}}}},{match:function(e){return e.is(":file")},apply:function(e,n){function l(){w(e,p,n)}var u,f,p,m;return u=d(e,n,{divClass:n.fileClass,spanClass:n.fileButtonClass,spanHtml:n.fileButtonHtml,spanWrap:"after"}),f=u.div,m=u.span,p=t("<span />").html(n.fileDefaultHtml),p.addClass(n.filenameClass),p=c(e,p,"after"),s(e,"size")||s(e,"size",f.width()/10),r(e,f,n),l(),v()?a(e,n,{click:function(){e.trigger("change"),setTimeout(l,0)}}):a(e,n,{change:l}),y(p,n),y(m,n),{remove:function(){return p.remove(),m.remove(),e.unwrap().unbind(n.eventNamespace)},update:function(){i(f,n),w(e,p,n),o(f,e,n)}}}},{match:function(e){if(e.is("input")){var t=(" "+s(e,"type")+" ").toLowerCase(),n=" color date datetime datetime-local email month number password search tel text time url week ";return n.indexOf(t)>=0}return!1},apply:function(e,t){var n,a;return n=s(e,"type"),e.addClass(t.inputClass),a=f(e,t),r(e,e,t),t.inputAddTypeAsClass&&e.addClass(n),{remove:function(){e.removeClass(t.inputClass),t.inputAddTypeAsClass&&e.removeClass(n),a&&e.unwrap()},update:b}}},{match:function(e){return e.is(":radio")},apply:function(e,n){var l,c,f;return l=d(e,n,{divClass:n.radioClass}),c=l.div,f=l.span,r(e,c,n),a(e,n,{"click touchend":function(){t.uniform.update(t(':radio[name="'+s(e,"name")+'"]'))}}),u(f,e,n),{remove:H(e,n),update:function(){i(c,n),u(f,e,n),o(c,e,n)}}}},{match:function(e){return e.is("select")&&!C(e)?!0:!1},apply:function(e,n){var s,l,u,c;return n.selectAutoWidth&&k(e,function(){c=e.width()}),s=d(e,n,{divClass:n.selectClass,spanHtml:(e.find(":selected:first")||e.find("option:first")).html(),spanWrap:"before"}),l=s.div,u=s.span,n.selectAutoWidth?k(e,function(){g(t([u[0],l[0]]),{display:"block"},function(){var e;e=u.outerWidth()-u.width(),l.width(c+e),u.width(c)})}):l.addClass("fixedWidth"),r(e,l,n),a(e,n,{change:function(){u.html(e.find(":selected").html()),l.removeClass(n.activeClass)},"click touchend":function(){var t=e.find(":selected").html();u.html()!==t&&e.trigger("change")},keyup:function(){u.html(e.find(":selected").html())}}),y(u,n),{remove:function(){return u.remove(),e.unwrap().unbind(n.eventNamespace),e},update:function(){n.selectAutoWidth?(t.uniform.restore(e),e.uniform(n)):(i(l,n),u.html(e.find(":selected").html()),o(l,e,n))}}}},{match:function(e){return e.is("select")&&C(e)?!0:!1},apply:function(e,t){var n;return e.addClass(t.selectMultiClass),n=f(e,t),r(e,e,t),{remove:function(){e.removeClass(t.selectMultiClass),n&&e.unwrap()},update:b}}},{match:function(e){return e.is("textarea")},apply:function(e,t){var n;return e.addClass(t.textareaClass),n=f(e,t),r(e,e,t),{remove:function(){e.removeClass(t.textareaClass),n&&e.unwrap()},update:b}}}];v()&&!h()&&(x=!1),t.uniform={defaults:{activeClass:"active",autoHide:!0,buttonClass:"button",checkboxClass:"checker",checkedClass:"checked",disabledClass:"disabled",eventNamespace:".uniform",fileButtonClass:"action",fileButtonHtml:"Choose File",fileClass:"uploader",fileDefaultHtml:"No file selected",filenameClass:"filename",focusClass:"focus",hoverClass:"hover",idPrefix:"uniform",inputAddTypeAsClass:!0,inputClass:"uniform-input",radioClass:"radio",resetDefaultHtml:"Reset",resetSelector:!1,selectAutoWidth:!0,selectClass:"selector",selectMultiClass:"uniform-multiselect",submitDefaultHtml:"Submit",textareaClass:"uniform",useID:!0,wrapperClass:null},elements:[]},t.fn.uniform=function(n){var s=this;return n=t.extend({},t.uniform.defaults,n),A||(A=!0,p()&&(x=!1)),x?(n.resetSelector&&t(n.resetSelector).mouseup(function(){e.setTimeout(function(){t.uniform.update(s)},10)}),this.each(function(){var e,s,a,r=t(this);if(r.data("uniformed"))return t.uniform.update(r),void 0;for(e=0;e<W.length;e+=1)if(s=W[e],s.match(r,n))return a=s.apply(r,n),r.data("uniformed",a),t.uniform.elements.push(r.get(0)),void 0})):this},t.uniform.restore=t.fn.uniform.restore=function(e){e===n&&(e=t.uniform.elements),t(e).each(function(){var e,n,s=t(this);n=s.data("uniformed"),n&&(n.remove(),e=t.inArray(this,t.uniform.elements),e>=0&&t.uniform.elements.splice(e,1),s.removeData("uniformed"))})},t.uniform.update=t.fn.uniform.update=function(e){e===n&&(e=t.uniform.elements),t(e).each(function(){var e,n=t(this);e=n.data("uniformed"),e&&e.update(n,e.options)})}}(this,jQuery);

data/vendor/assets/stylesheets/jquery.uniform/uniform._base.scss

@@ -0,0 +1,567 @@
+@mixin opacity($opacity) {
+	opacity: $opacity;
+	filter: unquote("alpha(opacity=#{round($opacity * 100)})");
+	-moz-opacity: $opacity;
+}
+
+@mixin hideYetClickable() {
+	@include opacity(0);
+	border: none;
+	background: none;
+}
+
+@mixin inline-block() {
+	display: -moz-inline-box;
+	display: inline-block;
+	*display: inline;
+	zoom: 1;
+}
+
+@mixin ellipsis() {
+	text-overflow: ellipsis;
+	display: block;
+	overflow: hidden;
+	white-space: nowrap;
+}
+
+@mixin border-radius($radius) {
+	-webkit-border-radius: $radius;
+	-moz-border-radius: $radius;
+	border-radius: $radius;
+}
+
+@mixin box-shadow($def) {
+	-webkit-box-shadow: $def;
+	-moz-box-shadow: $def;
+	box-shadow: $def;
+}
+
+@mixin retina() {
+	@media only screen {
+		@media (min-resolution: 124dpi), (-webkit-min-device-pixel-ratio: 1.3), (min--moz-device-pixel-ratio: 1.3), (-o-min-device-pixel-ratio: 4/3), (min-device-pixel-ratio: 1.3), (min-resolution: 1.3dppx) {
+			@include use-backgrounds(url($sprite-retina), $sprite-size, url($input-background-retina), url($input-background-focus-retina), $input-background-size);
+		}
+	}
+}
+
+@mixin use-backgrounds($sprite, $sprite-size, $input, $input-focus, $input-size) {
+	div#{$class-wrapper} {
+		&#{$class-select},
+		&#{$class-select} span,
+		&#{$class-checkbox} span,
+		&#{$class-radio} span,
+		&#{$class-upload},
+		&#{$class-upload} span#{$class-action},
+		&#{$class-button},
+		&#{$class-button} span {
+			background-image: url($sprite);
+
+			@if $sprite-size > 0 {
+				background-size: $sprite-size;
+			}
+		}
+	}
+
+	#{$class-wrapper-element}#{$class-wrapper} input#{$class-input},
+    #{$class-wrapper-element}#{$class-wrapper} select#{$class-multiselect},
+    #{$class-wrapper-element}#{$class-wrapper} textarea#{$class-textarea} {
+		background-image: url($input);
+
+		@if $sprite-size > 0 {
+			background-size: $input-size;
+		}
+
+		@include whenActive {
+			background-image: url($input-focus);
+		}
+	}
+}
+
+@mixin whenActive {
+	&#{$class-active} {
+		@content
+	}
+}
+
+@mixin whenHover {
+	&#{$class-hover}, &#{$class-focus} {
+		@content
+	}
+}
+
+@mixin whenDisabled {
+	&#{$class-disabled}, &#{$class-disabled}#{$class-active} {
+		@content
+	}
+}
+
+@mixin whenChecked {
+	&#{$class-checked} {
+		@content
+	}
+}
+
+
+$sprite: image-path("jquery.uniform/sprite.png") !default;
+$sprite-retina: image-path("jquery.uniform/sprite-retina.png") !default;
+$sprite-size: 493px !default;
+$button-height: 30px !default;
+$button-margin-left: 13px !default;
+$button-padding: 0 !default;
+$button-span-height: $button-height !default;
+$checkbox-height: 19px !default;
+$checkbox-width: 19px !default;
+$input-padding: 3px !default;
+$input-background: image-path("jquery.uniform/bg-input.png") !default;
+$input-background-retina: image-path("jquery.uniform/bg-input-retina.png") !default;
+$input-background-focus: image-path("jquery.uniform/bg-input-focus.png") !default;
+$input-background-focus-retina: image-path("jquery.uniform/bg-input-focus-retina.png") !default;
+$input-background-size: 1px !default;
+$radio-height: 18px !default;
+$radio-width: 18px !default;
+$select-fixed-width: 190px !default;
+$select-height: 26px !default;
+$select-margin-left: 10px !default;
+$select-margin-right: 25px !default;
+$select-select-height: 22px !default;
+$select-select-top: 2px !default;
+$upload-action-width: 85px !default;
+$upload-filename-margin-top: 2px !default;
+$upload-filename-margin-bottom: 2px !default;
+$upload-filename-margin-left: 2px !default;
+$upload-filename-width: 82px !default;
+$upload-filename-padding: 0 10px !default;
+$upload-height: 28px !default;
+$upload-width: 190px !default;
+
+$checkbox-voffset: (-10 * $select-height);
+$radio-voffset: ($checkbox-voffset - $checkbox-height);
+$upload-voffset: ($radio-voffset - $radio-height);
+$button-voffset: ($upload-voffset - (8 * $upload-height));
+
+$class-action: ".action" !default;
+$class-active: ".active" !default;
+$class-button: ".button" !default;
+$class-checkbox: ".checker" !default;
+$class-checked: ".checked" !default;
+$class-disabled: ".disabled" !default;
+$class-input: ".uniform-input" !default;
+$class-filename: ".filename" !default;
+$class-focus: ".focus" !default;
+$class-hover: ".hover" !default;
+$class-multiselect: ".uniform-multiselect" !default;
+$class-radio: ".radio" !default;
+$class-select: ".selector" !default;
+$class-upload: ".uploader" !default;
+$class-textarea: ".uniform" !default;
+$class-wrapper: "" !default;
+
+$class-wrapper-element: "";
+@if $class-wrapper != "" {
+	$class-wrapper-element: "span"
+}
+
+/* General settings */
+
+div#{$class-wrapper} {
+	&#{$class-select},
+	&#{$class-select} span,
+	&#{$class-checkbox} span,
+	&#{$class-radio} span,
+	&#{$class-upload},
+	&#{$class-upload} span#{$class-action},
+	&#{$class-button},
+	&#{$class-button} span {
+		background-image: url($sprite);
+		background-repeat: no-repeat;
+		-webkit-font-smoothing: antialiased;
+	}
+
+	&#{$class-select},
+	&#{$class-checkbox},
+	&#{$class-button},
+	&#{$class-radio},
+	&#{$class-upload} {
+		@include inline-block();
+		vertical-align: middle;
+
+		/* Keeping this as :focus to remove browser styles */
+		&:focus {
+			outline: 0;
+		}
+	}
+
+	&#{$class-select},
+	&#{$class-radio},
+	&#{$class-checkbox},
+	&#{$class-upload},
+	&#{$class-button} {
+		&, & * {
+			margin: 0;
+			padding: 0;
+		}
+	}
+}
+
+.highContrastDetect {
+	background: url($input-background) repeat-x 0 0;
+	width: 0px;
+	height: 0px;
+}
+
+/* Input & Textarea */
+
+#{$class-wrapper-element}#{$class-wrapper} input#{$class-input},
+#{$class-wrapper-element}#{$class-wrapper} select#{$class-multiselect},
+#{$class-wrapper-element}#{$class-wrapper} textarea#{$class-textarea} {
+	padding: $input-padding;
+	background: url($input-background) repeat-x 0 0;
+	outline: 0;
+
+	@include whenActive {
+		background: url($input-background-focus) repeat-x 0 0;
+	}
+}
+
+/* Remove default webkit and possible mozilla .search styles.
+ * Keeping this as :active to remove browser styles */
+div#{$class-wrapper}#{$class-checkbox} input,
+input[type="search"],
+input[type="search"]:active  {
+	-moz-appearance: none;
+	-webkit-appearance: none;
+}
+
+/* Select */
+
+div#{$class-wrapper}#{$class-select} {
+	background-position: 0 (-5 * $select-height);
+	line-height: $select-height;
+	height: $select-height;
+	padding: 0 0 0 $select-margin-left;
+	position: relative;
+	overflow: hidden;
+
+	span {
+		@include ellipsis();
+		background-position: right 0;
+		height: $select-height;
+		line-height: $select-height;
+		padding-right: $select-margin-right;
+		cursor: pointer;
+		width: 100%;
+		display: block;
+	}
+
+	&.fixedWidth{
+		width: $select-fixed-width;
+
+		span {
+			width: ($select-fixed-width - $select-margin-left - $select-margin-right);
+		}
+	}
+
+	select {
+		@include hideYetClickable();
+		position: absolute;
+		height: $select-select-height;
+		top: $select-select-top;
+		left: 0px;
+		width: 100%;
+	}
+
+	@include whenActive {
+		background-position: 0 (-6 * $select-height);
+
+		span {
+			background-position: right (-1 * $select-height);
+		}
+	}
+
+	@include whenHover {
+		background-position: 0 (-7 * $select-height);
+
+		span {
+			background-position: right (-2 * $select-height);
+		}
+
+		@include whenActive {
+			background-position: 0 (-8 * $select-height);
+
+			span {
+				background-position: right (-3 * $select-height);
+			}
+		}
+	}
+
+	@include whenDisabled {
+		background-position: 0 (-9 * $select-height);
+
+		span {
+			background-position: right (-4 * $select-height);
+		}
+	}
+}
+
+
+/* Checkbox */
+
+div#{$class-wrapper}#{$class-checkbox} {
+	position: relative;
+
+	&, span, input {
+		width: $checkbox-width;
+		height: $checkbox-height;
+	}
+
+	span {
+		@include inline-block();
+		text-align: center;
+		background-position: 0 $checkbox-voffset;
+
+		@include whenChecked {
+			background-position: (-4 * $checkbox-width) $checkbox-voffset;
+		}
+	}
+
+	input {
+		@include hideYetClickable();
+		@include inline-block();
+	}
+
+	@include whenActive {
+		span {
+			background-position: (-1 * $checkbox-width) $checkbox-voffset;
+		
+			@include whenChecked {
+				background-position: (-5 * $checkbox-width) $checkbox-voffset;
+			}
+		}
+	}
+
+	@include whenHover {
+		span {
+			background-position: (-2 * $checkbox-width) $checkbox-voffset;
+
+			@include whenChecked {
+				background-position: (-6 * $checkbox-width) $checkbox-voffset;
+			}
+		}
+
+		@include whenActive {
+			span {
+				background-position: (-3 * $checkbox-width) $checkbox-voffset;
+
+				@include whenChecked {
+					background-position: (-7 * $checkbox-width) $checkbox-voffset;
+				}
+			}
+		}
+	}
+
+	@include whenDisabled {
+		background-position: (-8 * $checkbox-width) $checkbox-voffset;
+
+		span {
+			@include whenChecked {
+				background-position: (-9 * $checkbox-width) $checkbox-voffset;
+			}
+		}
+	}
+}
+
+/* Radio */
+
+div#{$class-wrapper}#{$class-radio} {
+	position: relative;
+
+	&, span, input {
+		width: $radio-width;
+		height: $radio-height;
+	}
+
+	span {
+		@include inline-block();
+		text-align: center;
+		background-position: 0 $radio-voffset;
+
+		@include whenChecked {
+			background-position: (-4 * $radio-width) $radio-voffset;
+		}
+	}
+
+	input {
+		@include hideYetClickable();
+		@include inline-block();
+		text-align: center;
+	}
+
+	@include whenActive {
+		span {
+			background-position: (-1 * $radio-width) $radio-voffset;
+
+			@include whenChecked {
+				background-position: (-5 * $radio-width) $radio-voffset;
+			}
+		}
+	}
+
+	@include whenHover {
+		span {
+			background-position: (-2 * $radio-width) $radio-voffset;
+
+			@include whenChecked {
+				background-position: (-6 * $radio-width) $radio-voffset;
+			}
+		}
+
+		@include whenActive {
+			span {
+				background-position: (-3 * $radio-width) $radio-voffset;
+
+				@include whenChecked {
+					background-position: (-7 * $radio-width) $radio-voffset;
+				}
+			}
+		}
+	}
+
+	@include whenDisabled {
+		span {
+			background-position: (-8 * $radio-width) $radio-voffset;
+
+			@include whenChecked {
+				background-position: (-9 * $radio-width) $radio-voffset;
+			}
+		}
+	}
+}
+
+/* Uploader */
+
+div#{$class-wrapper}#{$class-upload} {
+	background-position: 0 $upload-voffset;
+	height: $upload-height;
+	width: $upload-width;
+	cursor: pointer;
+	position: relative;
+	overflow: hidden;
+
+	span#{$class-action} {
+		background-position: right ($upload-voffset + (-4 * $upload-height));
+		height: $upload-height;
+		line-height: $upload-height;
+		width: $upload-action-width;
+		text-align: center;
+		float: left;
+		display: inline;
+		overflow: hidden;
+		cursor: pointer;
+	}
+
+	span#{$class-filename} {
+		@include ellipsis();
+		float: left;
+		cursor: default;
+		height: ($upload-height - $upload-filename-margin-top - $upload-filename-margin-bottom);
+		margin: $upload-filename-margin-top 0 $upload-filename-margin-bottom $upload-filename-margin-left;
+		line-height: ($upload-height - $upload-filename-margin-top - $upload-filename-margin-bottom);
+		width: $upload-filename-width;
+		padding: $upload-filename-padding;
+	}
+
+	input {
+		@include hideYetClickable();
+		position: absolute;
+		top: 0;
+		right: 0;
+		float: right;
+		cursor: default;
+		width: 100%;
+		height: 100%;
+	}
+
+	@include whenActive {
+		span#{$class-action} {
+			background-position: right ($upload-voffset + (-6 * $upload-height));
+		}
+	}
+
+	@include whenHover {
+		background-position: 0 ($upload-voffset + (-2 * $upload-height));
+
+		span#{$class-action} {
+			background-position: right ($upload-voffset + (-5 * $upload-height));
+		}
+
+		@include whenActive {
+			span#{$class-action} {
+				background-position: right ($upload-voffset + (-7 * $upload-height));
+			}
+		}
+	}
+
+	@include whenDisabled {
+		background-position: 0 ($upload-voffset + (-1 * $upload-height));
+		
+		span#{$class-action} {
+			background-position: right ($upload-voffset + (-3 * $upload-height));
+		}
+	}
+}
+
+/* Buttons */
+
+div#{$class-wrapper}#{$class-button} {
+	background-position: 0 ($button-voffset + (-4 * $button-height));
+	height: $button-height;
+	cursor: pointer;
+	position: relative;
+
+	/* Keep buttons barely visible so they can get focus */
+	a, button, input {
+		@include opacity(0.01);
+		display: block;
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		position: absolute;
+	}
+
+	span {
+		@include inline-block();
+		line-height: $button-span-height;
+		text-align: center;
+		background-position: right $button-voffset;
+		height: $button-span-height;
+		margin-left: $button-margin-left;
+		padding: $button-padding;
+	}
+
+	@include whenActive {
+		background-position: 0 ($button-voffset + (-5 * $button-height));
+
+		span {
+			background-position: right ($button-voffset + (-1 * $button-height));
+			cursor: default;
+		}
+	}
+
+	@include whenHover {
+		background-position: 0 ($button-voffset + (-6 * $button-height));
+
+		span {
+			background-position: right ($button-voffset + (-2 * $button-height)); 
+		}
+	}
+
+	@include whenDisabled {
+		background-position: 0 ($button-voffset + (-7 * $button-height));
+
+		span {
+			background-position: right ($button-voffset + (-3 * $button-height));
+			cursor: default;
+		}
+	}
+}