Your IP : 216.73.217.68

Current Path : /home/atelierpru/www/OLD/squelettes/less/theme_components/
Upload File :
Current File : /home/atelierpru/www/OLD/squelettes/less/theme_components/navigation.less

/*! -- Stack Navigation -- */

.nav--fixed{
	.box-shadow;
}

.menu-horizontal > li, .menu-vertical > li{
	font-family: @nav-item-font, 'Roboto', 'Helvetica', Sans-Serif;
}

@media all and (min-width: 768px){
	.nav-bar{
		.menu-module{
			position: relative;
			top: 6px;
		}
	}
	.logo{
		position: relative;
		top: 6px;
	}
}

.nav--fixed{
	animation: fadeInDown .3s ease forwards;
	-webkit-animation: fadeInDown .3s ease forwards;
}

.menu-horizontal{
	> li{
		> a, > span{
			&:not(:hover){
				opacity: .75;
			}
		}
	}
}

.nav-bar-1{
	padding: @base-line-height/1.5 0;
	.menu-horizontal{
		> li{
			>a,>span{
				text-transform: uppercase;
				font-size: @h6-size;
				font-weight: 600;
				letter-spacing: .5px;
			}
		}
	}
}

// Mobile
@media all and (max-width: 990px){
	.nav-bar-1{
		.logo-module{
			position: relative;
			left: @base-line-height/2;
			top: 7px;
		}
		.nav-mobile-toggle{
			top: 7px;
		}
	}
}

.nav-bar-2{
	.menu-horizontal{
		> li{
			> a, >span{
				font-weight: 400;
			}
		}
	}
}

// Desktop

@media all and (min-width: 768px){
	.nav-bar-2{
		.menu-module{
			position: relative;
			top: 9px;
		}
	}
}

// Tablet

@media all and (max-width: 990px){
	.nav-bar-2{
		.logo-module{
			position: relative;
			bottom: 9px;
		}
		.nav-mobile-toggle{
			top: 24px;
		}
	}
}

// Mobile

@media all and (max-width: 767px){
	.nav-bar-2{
		.logo-module{
			position: relative;
			bottom: 2px;
		}
	}	
}

@media all and (min-width: 768px){
	.nav-bar-fullscreen{
		.logo-module{
			position: relative;
			bottom: 10px;
		}	
	}
}

// Desktop
@media all and (min-width: 990px){
	.nav-bar-fullscreen{
		.logo-module{
			text-align: center;
		}
	}
}

.menu-toggle{
	user-select: none;
	> span{
		display: inline-block;
		transform: scaleX(2.5) scaleY(1.2);
		.transition(0.2s,ease-out);
		&:hover{
			transform: scaleX(2.5) scaleY(1.8);
		}
	}
}

.menu-fullscreen{
	.logo{
		max-height: @base-line-height*1.25;
		position: relative;
		margin-bottom: @base-line-height*2.5;
	}
	.modal-content{
		.modal-close-cross{
			top: 0;
			right: @base-line-height;
			&:before{
				color: #fff;
			}
		}
		.pos-vertical-center{
			.transition(0.3s,ease);
		}
	}
	.menu-vertical{
		> li{
			> a, > span{
				font-size: @h2-size;
				font-weight: 300;
				text-decoration: none;
			}
			&:not(:last-child){
				margin-bottom: @base-line-height;
			}
		}
		&:not(:last-child){
			margin-bottom: @base-line-height*2;
		}
	}
	&:not(.modal-active){
		.pos-vertical-center{
			-webkit-filter: blur(5px);
		}
	}
}

.nav-bar-fullscreen{
	a{
		color: @color-dark;
	}
}

// Desktop
@media all and (min-width: 990px){
	.nav-bar-fullscreen.nav--transparent{
		&:not(.nav--fixed){
			a{
				color: #fff;
			}
		}
	}
}

.nav-bar-sidebar{
	z-index: 99;
	width: 100%;
	padding-top: @base-line-height;
	.logo{
		max-height: @base-line-height;
	}
	&:not(.nav--fixed){
		position: absolute;
	}
	&.nav--fixed{
		.logo{
			display: none !important;
		}
		.menu-toggle{
			.box-shadow-wide;
		}
	}
	.menu-toggle{
		position: fixed;
		.box-shadow-wide;
		width: @base-line-height*2;
		height: @base-line-height*2;
		.translate3d(-@base-line-height*2,0,0);
		line-height: @base-line-height*2;
		background: #fff;
		border-radius: 50%;
		text-align: center;
		cursor: pointer;
		right: 0;
	}
	.logo-module{
		position: relative;
		top: 5px;
	}
}

.nav-bar-sidebar + .side-menu{
	.pos-vertical-center{
		> .menu-vertical{
			.transition(.5s,ease);
			transition-delay: .2s;
			> li{
				> a, > span{
					.h3;
					text-decoration: none;
					&:hover{
						text-decoration: none;
					}
				}
				&:not(:last-child){
					margin-bottom: @base-line-height/2;
				}
			}
		}
	}
	&:not(.notification--reveal){
		.pos-vertical-center{
			.menu-vertical{
				.translate3d(20px,0,0);
				opacity: 0;
			}
		}
	}
}

nav.notification--reveal{
	+.main-container{
		&:before{
			opacity: 0;
			animation: fadeIn .3s ease forwards;
			content: '';
			position: fixed;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background: rgba(0,0,0,0.5);
			z-index: 20;
		}
	}
}

.nav-bar-logo{
	.logo{
		margin-right: @base-line-height;
	}
}

.dropdown{
	.dropdown__content{
		border-radius: 6px;
		.box-shadow;
		padding: @base-line-height/1.5 @base-line-height;
		&:not([class*='bg-']){
			border: 1px solid #ececec;
		}
		h5{
			&:not(:last-child){
				margin-bottom: @base-line-height/2;
			}
		}
		.background-image-holder{
			border-radius: 6px 0 0 6px;
		}
		>.pos-absolute[class*='col-']{
			left: 0;
			top: 0;
			height: 100%;
			position: absolute !important;
			&[data-overlay]{
				&:before{
					border-radius: 6px 0 0 6px;
				}
			}
		}
	}
}

.nav--transparent{
	&:not(.nav--fixed){
		.dropdown{
			.dropdown__content--lg{
				border: none;
			}
		}
	}
}

// Mobile
@media all and (max-width: 990px){
	.dropdown{
		[class*='col-']+[class*='col-']{
			margin-top: @base-line-height/2;
		}
		.dropdown__content{
			&:not([class*='bg-']){
				border: none;
				box-shadow: none;
			}
		}
	}
}

.menu-vertical{
	li{
		.transition(0.3s,ease);
		&:not(:hover){
			opacity: .75;
		}
		&:not(:last-child){
			margin-bottom: @base-line-height/6;
		}
		&.dropdown{
			position: relative;
			&:after{
				content: '\e80c';
				font-family: 'stack-interface';
				right: 0;
				position: absolute;
				.transition(0.3s,ease);
				display: inline-block;
				.translate3d(-10px,0,0);
			}
			&:hover{
				&:after{
					.translate3d(-5px,0,0);
				}
			}
		}
		&.separate{
			border-top: 1px solid lighten(@color-body, 50%);
			margin-top: @base-line-height/2;
			padding-top: @base-line-height/2;
		}
	}
	+h5{
		margin-top: @base-line-height;
	}
}