_utilities.scss 4.45 KB
.a {
	background-color: transparent;
	border: 0;
	display: inline;
	color: $link-color;
	-webkit-appearance: none;
	&:focus,
	&:hover {
		color: $link-color-hover;
		outline: 0;
		text-decoration: underline;
	}
}

.access-hide {
	border: 0;
	clip: rect(0, 0, 0, 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	&.focusable {
		&:active,
		&:focus {
			clip: auto;
			height: auto;
			margin: 0;
			overflow: visible;
			position: static;
			width: auto;
		}
	}
}

.avoid-fout,
.el-loading {
	position: relative;
}

body.avoid-fout,
body.el-loading {
	position: static;
}

.avoid-fout-indicator,
.el-loading-indicator {
	font-family: sans-serif !important;
	height: 0;
	min-height: ($base / 2);
	overflow: hidden;
	position: absolute;
		top: 0;
		left: 0;
	text-align: center;
	width: 0;
	z-index: 2;
}

.avoid-fout > .avoid-fout-indicator,
.el-loading > .el-loading-indicator {
	background-color: $white;
	height: 100%;
	padding: $line-height $grid-gutter;
	width: 100%;
	@include box-shadow(0 -1px 0 $black-bg, 0 0 2px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.15));
	@include opacity(1);
}

.avoid-fout-done > .avoid-fout-indicator,
.el-loading-done > .el-loading-indicator {
	height: 0;
	padding: 0;
	width: 0;
	@include opacity(0);
	@include transition(height 0s 0.3s, opacity 0.3s $timing, padding 0s 0.3s, width 0s 0.3s);
}

.avoid-fout-indicator-fixed,
.el-loading-indicator-fixed {
	position: fixed;
	z-index: ($top-base + 1);
}

.avoid-fout-indicator-linear,
.el-loading-indicator-linear {
	padding: 0 !important;
}

.clearfix {
	@include clearfix();
}

.collapse {
	display: none;
	&.in {
		display: block;
	}
}

.collapsed-hide {
	display: inline;
	.collapsed & {
		display: none;
	}
}

.collapsed-show {
	display: none;
	.collapsed & {
		display: inline;
	}
}

.collapsible-region {
	overflow: hidden;
}

.collapsing {
	height: 0;
	overflow: hidden;
	position: relative;
	@include transition(height 0.3s $timing);
}

.fade {
		@include opacity(0);
		@include transition(opacity 0.3s $timing);
	&.in {
		@include opacity(1);
	}
}

.iframe-seamless {
	border: 0;
	display: block;
	height: 100%;
	margin: 0;
	padding: 0;
	width: 100%;
}

.img-responsive {
	@include img-responsive();
}

.list-clear {
	list-style: none;
	padding-left: 0;
}

.list-inline {
	@extend .list-clear;
	margin-left: ($grid-gutter / -2);
	> li {
		display: inline-block;
		padding-right: ($grid-gutter / 2);
		padding-left: ($grid-gutter / 2);
	}
}

.margin-bottom {
	margin-bottom: $line-height !important;
}

.margin-bottom-half {
	margin-bottom: ($line-height / 2) !important;
}

.margin-left {
	margin-left: $grid-gutter !important;
}

.margin-left-half {
	margin-left: ($grid-gutter / 2) !important;
}

.margin-no {
	margin: 0 !important;
}

.margin-no-bottom {
	margin-bottom: 0 !important;
}

.margin-no-left {
	margin-left: 0  !important;
}

.margin-no-right {
	margin-right: 0 !important;
}

.margin-no-top {
	margin-top: 0 !important;
}

.margin-right {
	margin-right: $grid-gutter !important;
}

.margin-right-half {
	margin-right: ($grid-gutter / 2) !important;
}

.margin-top {
	margin-top: $line-height !important;
}

.margin-top-half {
	margin-top: ($line-height / 2) !important;
}

.media,
.media-inner {
	overflow: hidden;
}

.media-object {
	&.pull-left {
		margin-right: $grid-gutter;
	}
	&.pull-right {
		margin-left: $grid-gutter;
	}
}

.modal-scrollbar-measure {
	height: 50px;
	overflow: scroll;
	position: absolute;
		top: -99999px;
	width: 50px;
}

.no-overflow {
	overflow: hidden;
}

.p {
	display: block;
	margin-top: $line-height;
	margin-bottom: $line-height;
}

.pull-left {
	float: left;
}

.pull-none {
	float: none !important;
}

.pull-right {
	float: right;
}

.text-break {
	word-break: break-all;
	-webkit-hyphens: auto;
	   -moz-hyphens: auto;
	    -ms-hyphens: auto;
	        hyphens: auto;
}

.text-lead {
	font-size: $font-size-h4;
	font-weight: 300;
	line-height: $line-height-h4;
}

.text-overflow {
	@include text-overflow();
}

.text-nowrap {
	white-space: nowrap;
}

// alignment
	.text-center {
		text-align: center;
	}

	.text-left {
		text-align: left;
	}

	.text-right {
		text-align: right;
	}

// color
	.text-bg {
		color: $black-bg;
	}

	.text-black {
		color: $black;
	}

	.text-default {
		color: $black-text;
	}

	.text-hint {
		color: $black-hint;
	}

	.text-sec {
		color: $black-sec;
	}

	.text-white {
		color: $white;
	}

	@each $color in $palette-list {
		$i: index($palette-list, $color);
		
		.text-#{$color} {
			color: nth($palette-color, $i);
		}
	}