1 files changed, 66 insertions, 0 deletions
diff --git a/resources/mediawiki.ui/sourcefiles/scss/mixins/_forms.scss b/resources/mediawiki.ui/sourcefiles/scss/mixins/_forms.scss
new file mode 100644
index 00000000..0f3f6ad3
--- /dev/null
+++ b/resources/mediawiki.ui/sourcefiles/scss/mixins/_forms.scss
@@ -0,0 +1,66 @@
+// Font is not included.
+// For Vector, that should be layered on top with vector-type
+@mixin agora-field-styling() {
+
+	border: {
+		style: solid;
+		width: 1px;
+		color: $agoraGray;
+	};
+
+	&:focus {
+		// Styling focus of native checkboxes etc on Mac is almost impossible.
+		&:not([type=checkbox]):not([type=radio]) {
+			@include reset-focus;  // Removes OS field focus
+		};
+
+		// @include box-shadow generates unneeded prefixes
+		// https://github.com/chriseppstein/compass/issues/1054 , so specify
+		// directly.
+		box-shadow: $agoraBlueShadow 0px 0px 5px;
+
+		border: {
+			color: $agoraBlueShadow;
+		};
+	}
+
+	color: $agoraTextColor;
+	padding: 0.35em 0 0.35em 0.5em;
+}
+
+@mixin agora-label-styling() {
+	font: {
+		//weight: bold;
+		size: 0.9em;
+	};
+	color: darken($agoraGray, 50%);
+
+	& * {
+		font-weight: normal;
+	}
+}
+
+@mixin agora-inline-label-styling() {
+	margin-bottom: 0.5em;
+	cursor: pointer;
+	vertical-align: bottom;
+	line-height: normal;
+
+	font: {
+		weight: normal;
+	};
+
+	& > input[type="checkbox"],
+	& > input[type="radio"] {
+		width: auto;
+		height: auto;
+		margin: 0 0.1em 0em 0;
+		padding: 0;
+		border: {
+			style: solid;
+			width: 1px;
+			color: $agoraGray;
+		}
+		cursor: pointer;
+	}
+}