<commit_before>.textinput {
	display: block;
	.appearance(none);
	.box-sizing(border-box);
	width: 100%;
	height: @heightInputText;
	overflow: hidden;
	padding-left: 6px;
	padding-right: 6px;
	border-radius: 0;
	background: @colorBg;
	border: 1px solid @colorFgBorderEmphasize2;
	.transition(.1s);

	&:hover {
		border-left: 1px solid lighten(@colorNotice, 15);
	}
}

textarea.textinput {
	height: @heightInputTextarea;
	padding-top: 7px;
	overflow: auto;
	resize: vertical;
}

select {
	border: 1px solid @colorFgBorderEmphasize3;
	max-width: 100%;
}

label {
	//Fix for fastclick
	> * {
		pointer-events: none;
	}
}

.placeholder(@color) {
	::-webkit-input-placeholder {
		color: @color;
	}
	:-moz-placeholder { // < FF 19
		color: @color;
	}
	::-moz-placeholder {
		color: @color;
	}
	:-ms-input-placeholder {
		color: @color;
	}
	label.placeholder {
		color: @color;
		margin-top: 7px;

		.CM_FormField_Textarea & {
			margin-top: 1px;
		}
	}
}

.placeholder(lighten(@colorFgShy, 10));

.button {
	.box-sizing(border-box);
	width: auto;
	height: @sizeButton;
	line-height: @sizeButton - 2px;
	min-width: @sizeButton;
	max-width: 100%;
	overflow: hidden;
	margin: 1px;
	font-weight: bold;
	cursor: pointer;
	vertical-align: top;
	white-space: nowrap;
	border-radius: 0;
	.transition(.1s);
	padding: 0 8px;

	&:active {
		box-shadow: inset 0 3 5px rgba(0, 0, 0, 0.125);
	}

	&:focus {
		.input_focus;
	}

	&:disabled {
		opacity: .5;
	}

	&.hasIcon {
		padding: 0;

		&.hasLabel {
			padding: 0 8px;

			.icon {
				margin-right: 5px;
			}
		}
	}

	&.hasIconRight.hasLabel .icon {
		margin-left: 5px;
	}
}

.button.confirmClick {
	.button-success;
}

.button.confirmClick.warning {
	.button-danger;
}

.button-default-active {
	.gradient(vertical, darken(@colorBgButtonDefault, 12), darken(@colorBgButtonDefault, 12));
}

.button-default {
	border: 1px solid @colorFgBorderEmphasize3;
	.gradient(vertical, @colorBgButtonDefault, darken(@colorBgButtonDefault, 6));
	color: lighten(@colorFg, 25);
	text-shadow: 1px 1px fadeout(@colorFgTheme, 80);

	&:not(:disabled):hover {
		border-color: darken(@colorFgBorderEmphasize3, 10);
		.gradient(vertical, @colorBgButtonDefault, darken(@colorBgButtonDefault, 12));
		color: @colorFg;
	}

	&:active {
		.button-default-active;
	}
}

.button-highlight {
	border: 1px solid spin(@colorBgButtonHighlight, -3);
	background-color: @colorBgButtonHighlight;
	.gradient(vertical, @colorBgButtonHighlight, spin(@colorBgButtonHighlight, -3));
	color: @colorFgTheme;
	text-shadow: 1px 1px spin(@colorBgButtonHighlight, -8);

	&:not(:disabled):hover {
		.gradient(vertical, spin(@colorBgButtonHighlight, -2), spin(@colorBgButtonHighlight, -8));
		color: @colorFgTheme;
	}

	&:active {
		border-color: spin(@colorBgButtonHighlight, -15);
		background: spin(@colorBgButtonHighlight, -12);
	}
}

.button-success {
	border: 1px solid lighten(@colorOk, 3);
	.gradient(vertical, lighten(@colorOk, 9), lighten(@colorOk, 3));
	color: @colorFgTheme;
	text-shadow: 1px 1px spin(@colorOk, -8);

	&:not(:disabled):hover {
		border-color: @colorOk;
		.gradient(vertical, lighten(@colorOk, 6), @colorOk);
		color: @colorFgTheme;
	}

	&:active {
		border-color: darken(@colorOk, 6);
		background: @colorOk;
	}
}

.button-danger {
	border: 1px solid @colorError;
	.gradient(vertical, lighten(@colorError, 10), @colorError);
	color: @colorBg;
	text-shadow: 1px 1px @colorError;

	&:not(:disabled):hover {
		border-color: @colorError;
		.gradient(vertical, lighten(@colorError, 6), darken(@colorError, 6));
		color: @colorFgTheme;
	}

	&:active {
		border-color: darken(@colorError, 12);
		background: darken(@colorError, 6);
	}
}

.button-large {
	height: 1.5*@sizeButton;
	min-width: 1.5*@sizeButton;
	font-size: 2em;
	border-radius: 3px;
	padding: 0 15px;

	&.hasIcon.hasLabel {
		padding: 0 20px 0 10px;

		.icon {
			margin-right: 10px;
			font-size: 1em;
		}
	}
}

input:disabled {
	opacity: .5;
}

input:focus, .textinput:focus, .textinput.focus, select:focus, textarea:focus {
	.input_focus;
}
<commit_msg>simplify button styles (animate gradient background for hover effect)<commit_after>.textinput {
	display: block;
	.appearance(none);
	.box-sizing(border-box);
	width: 100%;
	height: @heightInputText;
	overflow: hidden;
	padding-left: 6px;
	padding-right: 6px;
	border-radius: 0;
	background: @colorBg;
	border: 1px solid @colorFgBorderEmphasize2;
	.transition(.1s);

	&:hover {
		border-left: 1px solid lighten(@colorNotice, 15);
	}
}

textarea.textinput {
	height: @heightInputTextarea;
	padding-top: 7px;
	overflow: auto;
	resize: vertical;
}

select {
	border: 1px solid @colorFgBorderEmphasize3;
	max-width: 100%;
}

label {
	//Fix for fastclick
	> * {
		pointer-events: none;
	}
}

.placeholder(@color) {
	::-webkit-input-placeholder {
		color: @color;
	}
	:-moz-placeholder { // < FF 19
		color: @color;
	}
	::-moz-placeholder {
		color: @color;
	}
	:-ms-input-placeholder {
		color: @color;
	}
	label.placeholder {
		color: @color;
		margin-top: 7px;

		.CM_FormField_Textarea & {
			margin-top: 1px;
		}
	}
}

.placeholder(lighten(@colorFgShy, 10));

.button {
	.box-sizing(border-box);
	width: auto;
	height: @sizeButton;
	line-height: @sizeButton - 2px;
	min-width: @sizeButton;
	max-width: 100%;
	padding: 0 8px;
	overflow: hidden;
	margin: 1px;
	font-weight: bold;
	cursor: pointer;
	vertical-align: top;
	white-space: nowrap;
	border-radius: 0;
	background-size: auto 200%;
	background-position: 0 0;
	.transition(200ms);

	&:active {
		box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	}

	&:not(:disabled):hover {
		background-position: 0 100%;
	}

	&:focus {
		.input_focus;
	}

	&:disabled {
		opacity: .5;
	}

	&.hasIcon {
		padding: 0;

		&.hasLabel {
			padding: 0 8px;

			.icon {
				margin-right: 5px;
			}
		}
	}

	&.hasIconRight.hasLabel .icon {
		margin-left: 5px;
	}
}

.button.confirmClick {
	.button-success;
}

.button.confirmClick.warning {
	.button-danger;
}

.button-default-active {
	background: darken(@colorBgButtonDefault, 8);
}

.button-default {
	.gradient(vertical, @colorBgButtonDefault, darken(@colorBgButtonDefault, 10));
	border: 1px solid @colorFgBorderEmphasize3;
	color: lighten(@colorFg, 25);
	text-shadow: 1px 1px fadeout(@colorFgTheme, 80);

	&:active {
		border-color: darken(@colorFgBorderEmphasize3, 5);
	}
}

.button-highlight {
	.gradient(vertical, @colorBgButtonHighlight, spin(@colorBgButtonHighlight, -6));
	border: 1px solid spin(@colorBgButtonHighlight, -3);
	color: @colorFgTheme;
	text-shadow: 1px 1px spin(@colorBgButtonHighlight, -8);

	&:active {
		border-color: spin(@colorBgButtonHighlight, -15);
	}
}

.button-success {
	.gradient(vertical, lighten(@colorOk, 9), lighten(@colorOk, 3));
	border: 1px solid lighten(@colorOk, 3);
	color: @colorFgTheme;
	text-shadow: 1px 1px spin(@colorOk, -8);

	&:active {
		border-color: darken(@colorOk, 6);
	}
}

.button-danger {
	.gradient(vertical, lighten(@colorError, 10), @colorError);
	border: 1px solid @colorError;
	color: @colorFgTheme;
	text-shadow: 1px 1px @colorError;

	&:active {
		border-color: darken(@colorError, 12);
	}
}

.button-large {
	height: 1.5*@sizeButton;
	min-width: 1.5*@sizeButton;
	font-size: 2em;
	border-radius: 3px;
	padding: 0 15px;

	&.hasIcon.hasLabel {
		padding: 0 20px 0 10px;

		.icon {
			margin-right: 10px;
			font-size: 1em;
		}
	}
}

input:disabled {
	opacity: .5;
}

input:focus, .textinput:focus, .textinput.focus, select:focus, textarea:focus {
	.input_focus;
}

{'fraction_non_alphanumeric': 0.16070948669712443, 'fraction_numerical': 0.031174415479709755, 'mean_word_length': 4.16875, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 5, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '941918', 'n_tokens_mistral': 3309, 'n_tokens_neox': 2914, 'n_words': 585}