webshims-rails 0.3 → 0.4

data/vendor/assets/javascripts/webshims/dev/shims/styles/shim.css

@@ -0,0 +1,677 @@
+article,aside,canvas,details,figcaption,figure,
+footer,header,hgroup,menu,nav,section,summary { 
+	display:block;
+}
+audio {
+	display: none;
+	height: 0;
+	width: 0;
+}
+audio.webshims-controls,
+video {
+	display: inline-block;
+	min-height: 45px;
+	min-width: 40px;
+}
+audio[controls] {
+	display: inline-block;
+	min-height: 45px;
+	min-width: 40px;
+}
+video *,
+audio * {
+	display: none !important;
+}
+.flashblocker-assumed {
+	min-height: 20px;
+	min-width: 20px;
+}
+.cue-display {
+	position: absolute !important;
+	margin: 0;
+	padding: 0px !important;
+	max-width: 100% !important;
+	max-height: 100% !important;
+	border: none !important;
+	background: none !important;
+	text-align: center;
+	visibility: hidden;
+	font-family: sans-serif;
+	font-size: 12px;
+	white-space: pre-wrap;
+	overflow: hidden;
+}
+.cue-display b {
+	font-weight: bold;
+}
+.cue-display i {
+	font-style: italic;
+}
+.cue-display u {
+	text-decoration: underline;
+}
+.cue-display span.cue-wrapper {
+	position: absolute;
+	left: 0;
+	bottom: 0;
+	right: 0;
+	display: block;
+	padding: 0;
+	margin: 0;
+	width: 100%;
+	font-size: 160%;
+	color: #fff;
+	visibility: visible !important;
+}
+.cue-display span.cue {
+	display: inline-block;
+	padding: 3px 5px;
+	background: #000;
+	background: rgba(0,0,0,0.8);
+	color: #fff;
+}
+mark {
+	background-color: #ff9;
+	color: #000; 
+	font-style: italic;
+	font-weight: bold;
+}
+
+/* reset */
+.input-range .ui-slider-range,
+.placeholder-box,
+.placeholder-text,
+.input-datetime-local,
+.step-controls,
+.step-controls span,
+.input-range,
+.input-range .ui-slider-handle,
+.input-range .ui-slider-range,
+.details-open-indicator {
+	margin: 0;
+	padding: 0;
+	border: none;
+	width: auto;
+	background: transparent none;
+}
+output {
+	position: relative;
+}
+
+.webshims-visual-hide {
+	position: absolute !important;
+	top: 0 !important;
+	left: 0 !important;
+	visibility: hidden !important;
+	width: 0 !important;
+	height: 0 !important;
+	overflow: hidden !important;
+}
+
+.webshims-visual-hide * {
+	visibility: hidden !important;
+}
+
+/* placeholder */
+.placeholder-box {
+	position: relative;
+	display: inline-block;
+	zoom: 1;
+}
+.polyfill-important .placeholder-box {
+	position: relative !important;
+	display: inline-block !important;
+	margin: 0 !important;
+	padding: 0 !important;
+	width: auto !important;
+	height: auto !important;
+}
+.placeholder-box-input {
+	vertical-align: bottom;
+}
+
+.placeholder-box-left {
+	float: left;
+}
+.placeholder-box-right {
+	float: right;
+}
+
+.placeholder-text {
+	position: absolute;
+	display: none;
+	top: 0;
+	left: 0;
+	overflow: hidden;
+	color: #999;
+	line-height: 1;
+	cursor: text;
+}
+.polyfill-important .placeholder-text { 
+	margin: 0 !important;
+	padding-right: 0 !important;
+	padding-bottom: 0 !important;
+	display: none !important;
+}
+.placeholder-box-input .placeholder-text {
+	white-space: nowrap;
+}
+.placeholder-visible {
+	color: #999;
+}
+.placeholder-visible .placeholder-text,
+.placeholder-text.placeholder-visible {
+	display: inline-block;
+}
+.placeholder-focused.placeholder-visible {
+	color: #ccc;
+}
+.polyfill-important .placeholder-visible .placeholder-text,
+.polyfill-important .placeholder-text.placeholder-visible {
+	display: inline-block !important;
+}
+
+/* datetime-local */
+.input-datetime-local {
+	display: inline-block;
+	zoom: 1;
+	vertical-align: middle;
+}
+.polyfill-important .input-datetime-local {
+	display: inline-block !important;
+	height: auto !important;
+	padding: 0 !important;
+	margin: 0 !important;
+	border: none !important;
+}
+.polyfill-important .input-datetime-local input {
+	display: inline !important;
+}
+.input-datetime-local-date {
+	margin: 0 2px 0 0;
+}
+.polyfill-important .input-datetime-local-date {
+	margin: 0 2px 0 0 !important;
+}
+.input-datetime-local-time {
+	margin: 0 0 0 2px;
+}
+.polyfill-important .input-datetime-local-time {
+	margin: 0 0 0 2px !important;
+}
+img.ui-datepicker-trigger {
+	display: inline;
+	display: inline-block;
+	width: 16px;
+}
+/* spinner control for time, number (usable for date, datetime-local) */
+.has-step-controls {
+	display: inline;
+}
+.polyfill-important .has-step-controls {
+	display: inline !important;
+}
+.step-controls {
+	position: relative;
+	zoom: 1;
+	overflow: hidden;
+	display: inline-block;
+	font-size: 0;
+	vertical-align: middle;
+	vertical-align: top;
+	margin-left: -17px;
+	height: 19px;
+	width: 15px;
+}
+.polyfill-important .step-controls {
+	display: inline-block !important;
+	padding: 0 !important;
+	vertical-align: top !important;
+}
+.step-controls span {
+	position: absolute;
+	display: inline-block;
+	overflow: hidden;
+	margin: 0 !important;
+	padding: 0 !important;
+	width: 15px;
+	height: 9px;
+	cursor: pointer;
+	font-size: 0;
+	line-height: 0;
+	background: url(forms.png) no-repeat 0 0;
+}
+.polyfill-important .step-controls span {
+	display: inline-block !important;
+	margin: 0 !important;
+	padding: 0 !important;
+	font-size: 0 !important;
+}
+
+.step-controls span.step-up {
+	top: 0;
+	background-position: -80px 0;
+}
+.step-controls span.step-up:hover {
+	background-position: -105px 0;
+}
+.step-controls > span.mousepress-ui.step-up {
+	background-position: -105px -20px;
+}
+.step-controls span.step-down {
+	bottom: 0;
+	background-position: -155px 0;
+}
+.step-controls span.step-down:hover {
+	background-position: -180px 0;
+}
+.step-controls > span.mousepress-ui.step-down {
+	background-position: -180px -20px;
+}
+/* disabled or readonly */
+.step-controls.disabled-step-control span {
+	opacity: 0.95;
+	cursor: default;
+}
+.step-controls.disabled-step-control span.step-up {
+	background-position: -130px 0;
+}
+.step-controls.disabled-step-control span.step-down {
+	background-position: -205px 0;
+}
+
+/* range */
+.input-range {
+	position: relative;
+	display: inline-block;
+	vertical-align: middle;
+	margin: 5px 0;
+	zoom: 1;
+	border: none;
+	height: 9px;
+	width: 155px;
+	border-radius: 1px;
+	background: url(forms.png) 0 -43px no-repeat;
+	cursor: pointer;
+	font-size: 0;
+	line-height: 0;
+}
+.polyfill-important .input-range {
+	display: inline-block !important;
+	padding: 0 !important;
+	font-size: 0 !important;
+}
+.input-range .ui-slider-handle {
+	top: 0;
+	position: absolute;
+	display: block;
+	z-index: 4;
+	overflow: hidden;
+	margin: -5px 0 0 -8px;
+	height: 22px;
+	width: 17px;
+	background: url(forms.png) 0 0 no-repeat;
+	cursor: pointer;
+	outline: none;
+	font-size: 0;
+	line-height: 0;
+}
+.input-range .ui-slider-handle:hover,
+.input-range .ui-slider-handle:focus {
+	background-position: -17px 0;
+}
+.input-range .ui-slider-handle.ui-state-active {
+	background-position: -34px 0;
+}
+.input-range.ui-slider-disabled {
+	cursor: default;
+	opacity: 0.95;
+}
+.input-range.ui-slider-disabled .ui-slider-handle {
+	cursor: default;
+	background-position: -51px 0;
+}
+.input-range .ui-slider-range {
+	position: absolute;
+	z-index: 1;
+	overflow: hidden;
+	display: block;
+	background: #b6e2fb;
+}
+.input-range .input-range .ui-slider-range,
+.polyfill-important .input-range .ui-slider-handle {
+	position: absolute !important;
+	display: block !important;
+	padding: 0 !important;
+}
+.input-range.ui-slider-horizontal .ui-slider-range {
+	top: 4px;
+	height: 1px;
+}
+.input-range.ui-slider-horizontal .ui-slider-range-min {
+	left: 0;
+}
+.input-range.ui-slider-horizontal .ui-slider-range-max {
+	right: 0;
+}
+.input-date-datepicker-control {
+	position: absolute;
+	zoom: 1;
+	display: none;
+	background-color: #fff;
+	z-index: 100;
+	overflow: visible;
+	padding: 5px;
+	font-family: "MS Shell Dlg", "Lucida Grande", "Calibri", sans-serif;
+	font-size: 14px;
+	border: 1px solid #333;
+}
+.polyfill-important .input-date-datepicker-control {
+	z-index: 999999999 !important;
+}
+.input-date-datepicker-control .ui-datepicker-header {
+	position: relative;
+	margin: 0 0 3px;
+	padding: 2px 0;
+}
+.input-date-datepicker-control .ui-datepicker-header select {
+    border: 1px solid #333;
+    padding: 1px 2px 2px;
+}
+.input-date-datepicker-control .ui-datepicker-header option {
+	padding-right: 8px;
+}
+.input-date-datepicker-control .ui-datepicker-header .ui-icon {
+	position: absolute;
+	display: block;
+	top: 0.2em;
+	width: 15px;
+	height: 18px;
+	text-indent: -9999em;
+	font-size: 10px;
+	line-height: 0;
+	background: url(forms.png) no-repeat;
+	cursor: pointer;
+}
+.input-date-datepicker-control .ui-datepicker-header .ui-state-disabled .ui-icon {
+	cursor: default;
+}
+.input-date-datepicker-control .ui-datepicker-header .ui-icon-circle-triangle-w {
+	left: 3px;
+	background-position: -235px 3px;
+}
+.input-date-datepicker-control .ui-datepicker-header .ui-state-hover .ui-icon-circle-triangle-w {
+	background-position: -235px -17px;
+}
+.input-date-datepicker-control .ui-datepicker-header .ui-icon-circle-triangle-e {
+	right: 3px;
+	background-position: -248px 3px;
+}
+.input-date-datepicker-control .ui-datepicker-header .ui-state-hover .ui-icon-circle-triangle-e {
+	background-position: -248px -17px;
+}
+.input-date-datepicker-control table {
+	font-size: 100%;
+	border-spacing: 1px;
+}
+.input-date-datepicker-control .ui-datepicker-title {
+	margin: 0 20px;
+}
+.input-date-datepicker-control .ui-datepicker-title,
+.input-date-datepicker-control th {
+	color: #069;
+	text-align: center;
+	font-weight: bold;
+}
+
+.input-date-datepicker-control td,
+.input-date-datepicker-control th {
+	padding: 0 2px;
+	text-align: center;
+	font-weight: normal;
+}
+
+.input-date-datepicker-control td {
+	padding: 0 4px;
+	cursor: pointer;
+	text-align: right;
+	border: 1px solid #fff;
+	border-radius: 2px;
+}
+
+.input-date-datepicker-control td.ui-datepicker-current-day {
+	background-color: #adf;
+	color: #000;
+	border-color: #06c;
+}
+.input-date-datepicker-control td.ui-datepicker-today{
+	border-color: #06c;
+}
+.input-date-datepicker-control td.ui-datepicker-current-day a {
+	color: #000;
+}
+.input-date-datepicker-control td a {
+	color: #000;
+	text-decoration: none;
+}
+
+.input-date-datepicker-control td:hover {
+	background-color: #bef;
+	border-color: #06c;
+}
+.input-date-datepicker-control td.ui-state-disabled {
+	cursor: default;
+	border-color: #fff;
+	color: #bbb;
+	background-color: transparent;
+}
+
+.input-date-datepicker-control .ui-datepicker-buttonpane {
+	margin: 4px 0 0;
+}
+.input-date-datepicker-control .ui-datepicker-cover {
+	display: none; /*sorry for IE5*/
+	display/**/: block; /*sorry for IE5*/
+	position: absolute; /*must have*/
+	z-index: -1; /*must have*/
+	filter: mask(); /*must have*/
+	top: -4px; /*must have*/
+	left: -4px; /*must have*/
+	width: 200px; /*must have*/
+	height: 200px; /*must have*/
+}
+
+datalist {
+	display: none;
+}
+.datalist-polyfill {
+	position: absolute !important;
+	font-family: "Lucida Grande", "MS Shell Dlg", "Calibri", sans-serif;
+	font-size: 100%;
+	top: 0;
+	left: 0;
+	margin: 0;
+	padding: 0;
+	display: none;
+	z-index: 999999999;
+}
+.datalist-polyfill.datalist-visible{
+	display: block;
+}
+.datalist-polyfill div {
+	margin: 0;
+	padding: 0;
+}
+.datalist-polyfill .datalist-box {
+	border: 1px solid #333;
+	max-height: 200px;
+	overflow: hidden;
+	overflow-x: hidden !important;
+	overflow-y: auto;
+}
+.datalist-polyfill ul,
+.datalist-polyfill li {
+	font-size: 100%;
+	list-style: none !important;
+}
+.datalist-polyfill ul {
+	position: static !important;
+	overflow: hidden;
+	margin: 0;
+	padding: 2px 0;
+	height:  auto !important;
+	background-color: #fff;
+	color: #000;
+	
+}
+.datalist-polyfill li {
+	margin: 1px 1px 1px 0;
+	padding: 2px 2px 2px 5px;
+	overflow: hidden;
+	white-space: nowrap;
+	cursor: default;
+	zoom: 1;
+	overflow: hidden;
+}
+.datalist-polyfill .option-label {
+	display: inline-block;
+	float: left;
+	max-width: 100%;
+	text-overflow: ellipsis;
+}
+.datalist-polyfill .option-value {
+	display: none;
+	float: right;
+	text-overflow: ellipsis;
+}
+.datalist-polyfill .hidden-item {
+	display: none !important;
+}
+.datalist-polyfill .active-item {
+	background-color: #39f;
+	color: #fff;
+	cursor: default;
+}
+
+.validity-alert-wrapper {
+	position: absolute !important;
+	overflow: hidden;
+	padding: 0 6px 6px 0;
+	font: 12px/140% sans-serif;
+	z-index: 1000000000;
+	
+}
+.validity-alert {
+	display: inline-block;
+	padding: 8px 0 0;
+}
+.validity-alert .va-box {
+	display: inline-block !important;
+	background: #fafafa;
+	color: #000;
+	border: 1px solid #ccc;
+	padding: 5px;
+	border-radius: 5px;
+	box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
+	zoom: 1 !important;
+	min-width: 60px;
+}
+
+.validity-alert .va-arrow {
+	position: absolute;
+	top: 1px;
+	left: 20px;
+	display: block;
+	width: 0;
+	height: 0;
+	border-left: 9px solid transparent;
+	border-right: 9px solid transparent;
+	
+	border-bottom: 7px solid #ccc;
+	border-top: none;
+	zoom: 1;
+	font-size: 0;
+}
+html .validity-alert span.va-arrow,
+html .validity-alert .va-arrow .va-arrow-box{
+	border-left-color: transparent;
+	border-right-color: transparent;
+}
+.polyfill-important .validity-alert span.va-arrow,
+.polyfill-important .validity-alert .va-arrow .va-arrow-box {
+	border-left-color: transparent !important;
+	border-right-color: transparent !important;
+}
+* html .validity-alert .va-arrow {display: none;}
+.validity-alert .va-arrow .va-arrow-box {
+	position: relative;
+	top: 1px;
+	left: -9px;
+	display: block;
+	width: 0;
+	height: 0;
+	border-left: 9px solid transparent;
+	border-right: 9px solid transparent;
+	border-bottom: 7px solid #fafafa;
+	border-top: none;
+}
+
+/* localStorage */
+#swflocalstorageshim-wrapper {
+	position: absolute; 
+	top: -999px; 
+	left: -9999px; 
+	overflow: hidden; 
+	width: 215px; 
+	min-width: 215px !important;
+	z-index: 2147483647;
+}
+#swflocalstorageshim-wrapper .polyfill-exceeded-message {
+	margin: 0 0 5px;
+	padding: 5px;
+	background: #ffd;
+	color: #000;
+	font-size: 13px;
+}
+#swflocalstorageshim-wrapper object {
+	min-height: 138px !important;
+	min-width: 215px !important;
+}
+details {
+	overflow: hidden;
+}
+summary {
+	position: relative;
+}
+.closed-details-child {
+	display: none !important;
+}
+
+.details-open-indicator {
+	margin: -1px 0 0;
+	display: inline-block;
+	width: 16px;
+	height: 11px;
+	background: url(details-arrows.png) no-repeat 0 0;
+	vertical-align: middle;
+}
+.closed-details-summary .details-open-indicator {
+	background-position: 0 -20px;
+}
+.polyfill-important .details-open-indicator {
+	margin: -1px 0 0 !important;
+	padding: 0 !important;
+	border: 0 !important;
+	display: inline-block !important;
+	width: 16px !important;
+	height: 11px !important;
+	background: url(details-arrows.png) no-repeat 0 0 !important;
+	vertical-align: middle !important;
+}
+.polyfill-important .closed-details-summary .details-open-indicator {
+	background-position: 0 -20px !important;
+}
+summary.summary-has-focus {
+	outline: 1px dotted #aaa;
+	outline-offset: -1px;
+}