seatable-ui/site/views/progress.html

Basic style of dtable related products

<div class="example">
	<h3>Indeterminate progress bar</h3>
	<div class="example mb-4">
		<div class="progress">
			<div class="progress-bar progress-bar-indeterminate"></div>
		</div>
	</div>

	<h3>Disabled progress bar</h3>
	<div class="example mb-4">
		<div class="progress">
			<div class="progress-bar" style="width: 25%;"></div>
		</div>
	</div>

	<h3>Dimmer</h3>
	<div class="example mb-4">
		<div class="dimmer">
			<div class="dimmer-content">
				<p>Dimmer is a simple, CSS-only overlay to disabled any element.</p>
				<button class="btn btn-primary" onclick="toggleDimmer(this)">Toggle dimmer</button>
			</div>
			<div class="loader"></div>
		</div>
	</div>

	<script>
		function toggleDimmer(el) {
			var dimmer = el.parentNode.parentNode;
			dimmer.classList.toggle('active');
		}
	</script>
</div>