header.scss 3.7 KB
@import "../../../scss/krhr/mixins-component";
/**/
.header{
	@include z-depth(1);
	width: 100%;
	height: 56px;
	padding: 11px;
	background-color: $white;
}
/**/
.hr_header{
	@include z-depth(1);
	width: 100%;
	height: 76px;
	padding: 25px 30px 11px 30px;
	background-color: $white;
	position: relative;
	z-index: 1;
	.imgSize{
		height: 40px;display: inline-block;line-height: 40px;
		img{
			height: 40px;
		}
	}
}
.header_menu_wrap{
	display: inline-block;
	width: 380px;
	border-left: 1px solid #d9d9d9;
	height: 32px;
	margin-left: 20px;
	padding: 0 20px;
}
.menu_item{
	font-size: $font-size-large;
	font-weight: bold;
	margin-right:40px;
	color: #333333; 
	padding: 5px 0 2px 0;
	border-bottom: 2px solid transparent; 
	transition: color 0.4s cubic-bezier(.05,.77,.63,.85)
} 
.menu_item:hover{
	text-decoration: none;
	color: $success; 
}
.activate.menu_item{
	border-bottom-color: $success;
}

.header_shortcut_menu_wrap{
	position: absolute;
	right: 30px;
	top: 20px;
	height: 32px;
}
.shortcut_menu{
	font-size: $font-size-large;
	color: #333333; 
	display: inline-block;
	padding: 5px 7px;
	border: 1px solid #d9d9d9;
	border-radius: 3px;
	margin-left: 40px;
	cursor: pointer;
}
.message_point{
	color: $red;
	position: absolute; 
	top: -5px;
	padding-left: 6px;
}
/*custom table*/
.custom_header_wrap{
	width: 100%;
	height: 120px;
    overflow: auto;
	position: relative;
	background-color: #f1f1f1;
}
.column_wrap{
	display: inline-block; 
	float: right;
	input[type="text"]{
		display: inline-block;
		width: 120px;
		border-bottom-right-radius: 0px;
    	border-top-right-radius: 0px;
    	position: relative;
	    z-index: 2;
	    float: left; 
	    margin-bottom: 0;
	}
	.input_group_addon{
		padding: 9px 10px; 
		cursor: pointer; 
	    font-size: 14px;
	    font-weight: 400;
	    line-height: 1;
	    color: #555;
	    text-align: center;
	    background-color: #eee;
	    border: 1px solid #ccc;
	    border-radius: 4px;
	    border-bottom-left-radius: 0px;
    	border-top-left-radius: 0px;
	}
	.input_group_addon:last-child {
	    
	}
}
.add_custom_wrap{
	position: relative;
	 
}
.column_name_wrap{
	display: inline-block;
	position: relative;
	overflow: hidden;
	.remove_column_wrap{ 
		position: absolute;
		padding: 9px 2px;
		background-color: rgba(0,0,0,.6);
		color: $white;
		cursor: pointer;
		transform: translateX(-20px);
		animation: translateX .5s;
	}
	.column_name_item{ 
		padding: 6px 10px; 
		background-color: #58A1E0;
		border-left: 1px solid $gray;
		color: $darkWhite;
	}
}
.column_name_wrap:hover{
	.remove_column_wrap{
		transform: translateX(0px);
	}
}

//
.head_back_btn{
	position: absolute; 
    cursor: pointer;
    z-index: 10;
    font-size: 20px;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 0px 5px;
    text-align: center;
    left: 35px;
    a{
    	color: #999;
    	font-weight: bold;
    }
}

// 企业帐户  by  chenming 2016/10/31



.step_bar_wrap{
	height: 140px;
    padding: 40px 20px 10px 20px;
    text-align: center;
    margin: 0px 20px;
    border-bottom: 1px solid #ddd;
}


.step_item_wrap{
	width: 140px;
	text-align: center;
	display: inline-block;
	position: relative;
	margin-right: 50px;
}
.step_item{
	width: 45px;
	height: 45px;
	border-radius: 25px;
	border: 2px solid #DDD;
	font-size: 20px;
	padding: 6px 2px;
	text-align: center;
	margin: 0px auto 5px auto; 
}
.step_item_content{ 
	font-size: 14px;
	color: #333333;
	letter-spacing: 0px;
}
.step_item_line{
	height: 1px;
    width: 120px;
    background: #CCCCCC;
    position: absolute;
    top: 22px;
    left: 105px;
}
.active.step_item_line{ 
    background: #56ABE4; 
}
.active{
	.step_item{  
		border: 2px solid #56ABE4;  
		color: #56ABE4; 
	}
	.step_item_content{
		color: #56ABE4;
	} 
}