@import "minerva.variables";
@import "minerva.mixins";



// Asynchronous loading
//
// Use the loading class along with spinner or content class whilst asynchronously loading content.
//
// Markup:
// <div class="loading spinner"></div>
//
// Styleguide 6.
.loading {

	&.spinner {
		height: 100px;
	}

	// needs !important to override images from more specific rules
	background-image: @ajaxLoadingImage !important;
	background-repeat: no-repeat;
	background-position: center;
	.background-size( 32px, auto );

	// FIXME: Merge rules with spinner?
	&.content {
		padding-top: 48px;
		text-align: center;
		background-position: 50% 0;
	}

	// Loading content inside a drawer
	//
	// Apply the loading class to a drawer when you are dynamically loading something.
	//
	// Markup:
	// <div class="loading spinner drawer visible"></div>
	//
	// Styleguide 4.1.1.
	&.drawer, &.buttonBar {
		background-position: 16px 50%;
		padding-left: 60px;
	}
}

.hidden {
	display: none !important;
}

.progress-bar {
	width: 100%;
	height: .9em;
	border: 1px solid #cacaca;
	.box-sizing(border-box);

	.value {
		width: 0;
		height: 100%;
		background: @blueBase;
	}
}