1 files changed, 134 insertions, 0 deletions
diff --git a/resources/src/mediawiki.widgets/mw.widgets.DateInputWidget.less b/resources/src/mediawiki.widgets/mw.widgets.DateInputWidget.less
new file mode 100644
index 00000000..873cca19
--- /dev/null
+++ b/resources/src/mediawiki.widgets/mw.widgets.DateInputWidget.less
@@ -0,0 +1,134 @@
+/*!
+ * MediaWiki Widgets – DateInputWidget styles.
+ *
+ * @copyright 2011-2015 MediaWiki Widgets Team and others; see AUTHORS.txt
+ * @license The MIT License (MIT); see LICENSE.txt
+ */
+
+.oo-ui-box-sizing( @type: border-box ) {
+	-webkit-box-sizing: @type;
+	-moz-box-sizing: @type;
+	box-sizing: @type;
+}
+
+.oo-ui-unselectable() {
+	-webkit-touch-callout: none;
+	-webkit-user-select: none;
+	-moz-user-select: none;
+	-ms-user-select: none;
+	user-select: none;
+}
+
+.oo-ui-inline-spacing( @spacing, @cancelled-spacing: 0 ) {
+	margin-right: @spacing;
+	&:last-child {
+		margin-right: @cancelled-spacing;
+	}
+}
+
+@indicator-size: unit(12 / 16 / 0.8, em);
+
+.mw-widget-dateInputWidget {
+	display: inline-block;
+	position: relative;
+
+	&-handle {
+		width: 100%;
+		display: inline-block;
+		cursor: pointer;
+		position: relative;
+
+		.oo-ui-unselectable();
+		.oo-ui-box-sizing(border-box);
+
+		> .oo-ui-indicatorElement-indicator {
+			display: none;
+		}
+	}
+
+	&.oo-ui-indicatorElement .mw-widget-dateInputWidget-handle > .oo-ui-indicatorElement-indicator {
+		display: block;
+		position: absolute;
+		top: 0;
+		right: 0;
+		height: 100%;
+	}
+
+	&.oo-ui-widget-disabled .mw-widget-dateInputWidget-handle {
+		cursor: default;
+	}
+
+	&-calendar {
+		position: absolute;
+		z-index: 1;
+	}
+
+	// Theme-specific styles
+	width: 21em;
+	margin: 0.25em 0;
+
+	.oo-ui-inline-spacing(0.5em);
+
+	&-handle {
+		padding: 0.5em 1em;
+		border: 1px solid #ccc;
+		border-radius: 0.1em;
+		line-height: 1.275em;
+		background-color: white;
+	}
+
+	&.oo-ui-indicatorElement .mw-widget-dateInputWidget-handle > .oo-ui-indicatorElement-indicator {
+		width: @indicator-size;
+		margin: 0 0.775em;
+	}
+
+	> .oo-ui-textInputWidget input {
+		padding-left: 1em;
+	}
+
+	> .oo-ui-textInputWidget {
+		z-index: 2;
+	}
+
+	&-calendar {
+		background-color: white;
+		margin-top: -2px;
+
+		&:focus {
+			z-index: 3;
+		}
+	}
+
+	&.oo-ui-widget-enabled {
+		.mw-widget-dateInputWidget-handle:hover {
+			border-color: #347bff;
+		}
+	}
+
+	&.oo-ui-widget-disabled {
+		.mw-widget-dateInputWidget-handle {
+			color: #ccc;
+			text-shadow: 0 1px 1px #fff;
+			border-color: #ddd;
+			background-color: #f3f3f3;
+
+			> .oo-ui-indicatorElement-indicator {
+				opacity: 0.2;
+			}
+		}
+
+	}
+
+	&.oo-ui-flaggedElement-invalid {
+		.mw-widget-dateInputWidget-handle {
+			border-color: red;
+			box-shadow: inset 0 0 0 0 red;
+		}
+	}
+
+	&-empty {
+		.mw-widget-dateInputWidget-handle {
+			color: #ccc;
+		}
+	}
+}