<commit_before>.spinner,
.global-spinner {
	$transitionDuration: 0.3s;

	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 9999;
	opacity: 0;
	transition: visibility 0s $transitionDuration, opacity $transitionDuration linear;
	visibility: hidden;

	&.showSpinner {
		transition: opacity $transitionDuration linear;
		opacity: 1;
		visibility: visible;
	}

	.whiteBackground {
		background: white;
		opacity: 0.92;
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}

	.spin {
		$spinnerHeight: 60px;
		text-align: center;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		white-space: nowrap;
		font-size: 0;

		.textLabel {
			font-weight: 300;
			color: black;
			font-size: 26px;
			display: inline-block;
			vertical-align: middle;
			margin-left: 20px;
		}

		.rect {
			display: inline-block;
			vertical-align: middle;
			background-color: $default-color-lightblack;
			height: $spinnerHeight;
			width: 6px;
			animation: spinner-stretchdelay 1.2s infinite ease-in-out;
			& + .rect {
				margin-left: 3px;
			}
		}
		.rect2 {
			animation-delay: -1.1s;
		}
		.rect3 {
			animation-delay: -1.0s;
		}
		.rect4 {
			animation-delay: -0.9s;
		}
		.rect5 {
			animation-delay: -0.8s;
		}
	}
}

.spinner.bounded-spinner {
	top:auto;
	z-index: 100;
	height: 14%;
}
@keyframes spinner-stretchdelay {
	0%, 40%, 100% {
		transform: scaleY(0.4);
	}
	20% {
		transform: scaleY(1.0);
	}
}

.global-spinner {
	.whiteBackground {
		opacity: 1;
	}
	.deferred-bootstrap-loading & {
		transition: opacity 0.3 linear;
		opacity: 1;
		visibility: visible;
	}
}

.inline-spinner {
	$duration: 1s;

	display: block;
	position: relative;
	width: 1em;<commit_msg>spinner design bug fix<commit_after>.spinner,
.global-spinner {
	$transitionDuration: 0.3s;

	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 9999;
	opacity: 0;
	transition: visibility 0s $transitionDuration, opacity $transitionDuration linear;
	visibility: hidden;

	&.showSpinner {
		transition: opacity $transitionDuration linear;
		opacity: 1;
		visibility: visible;
	}

	.whiteBackground {
		background: white;
		opacity: 0.92;
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}

	.spin {
		$spinnerHeight: 60px;
		text-align: center;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		white-space: nowrap;
		font-size: 0;

		.textLabel {
			font-weight: 300;
			color: black;
			font-size: 26px;
			display: inline-block;
			vertical-align: middle;
			margin-left: 20px;
		}

		.rect {
			display: inline-block;
			vertical-align: middle;
			background-color: $default-color-lightblack;
			height: $spinnerHeight;
			width: 6px;
			animation: spinner-stretchdelay 1.2s infinite ease-in-out;
			& + .rect {
				margin-left: 3px;
			}
		}
		.rect2 {
			animation-delay: -1.1s;
		}
		.rect3 {
			animation-delay: -1.0s;
		}
		.rect4 {
			animation-delay: -0.9s;
		}
		.rect5 {
			animation-delay: -0.8s;
		}
	}
}

.spinner.bounded-spinner {
	top:auto;
	z-index: 100;
	height: 76px;
}
@keyframes spinner-stretchdelay {
	0%, 40%, 100% {
		transform: scaleY(0.4);
	}
	20% {
		transform: scaleY(1.0);
	}
}

.global-spinner {
	.whiteBackground {
		opacity: 1;
	}
	.deferred-bootstrap-loading & {
		transition: opacity 0.3 linear;
		opacity: 1;
		visibility: visible;
	}
}

.inline-spinner {
	$duration: 1s;

	display: block;
	position: relative;
	width: 1em;
{'fraction_non_alphanumeric': 0.14732912119471567, 'fraction_numerical': 0.048822515795519814, 'mean_word_length': 3.078454332552693, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, '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': '2813009', 'n_tokens_mistral': 1652, 'n_tokens_neox': 1356, 'n_words': 304}