CORE_V5 // sass

PATH: var / www / vhosts / lahuertaatomica.es / httpdocs / assets / plugins / jPanelMenu / docs / sass /

Editing: _jPanelMenu.scss

$header-size: 50px;
$menu-color: mix($text-color,$black);

.jPanelMenu {
	header.main {
		@include linear-gradient($blue, mix($blue, $blue-dark, 25%));
		@include box-shadow(0,1px,5px,rgba($black,.5));
		width: 100% - ($horizontal-space-xl*2);
		max-width: none;
		height: $header-size;
		margin: 0;
		padding: 0 $horizontal-space-xl;
		border-bottom: 1px solid $blue-dark;
		z-index: 10;

.logo a, .menu-trigger {
			display: block;
			max-height: 100%;
			text-shadow: 0 -1px 1px $black;
			line-height: $header-size;
			color: $white;
		}

.logo {
			@include type-medium;
			float: none;
			width: 60%;
			margin: 0 auto;

a {
				position: static;
			}

a:before { display: none !important; }
		}

.menu-trigger {
			position: absolute;
			top: 0;
			left: 0;
			padding: 0 $vertical-space*1.5;
			font-size: 1.2em;
			line-height: $header-size*1.15;

&:active { text-shadow: 0 -1px 1px $black, 0 0 50px $white; }
		}

nav {
			text-indent: -9999px;
		}
	}

.content {
		.spec, h3 {
			margin-top: 0;
			padding-top: $vertical-space-xl;
		}

.spec h3 { padding-top: 0; }

.jPM-specific {
			display: block;
		}
	}
}

#jPanelMenu-menu {
	background: $menu-color;

ul {
		border-bottom: 1px solid lighten($menu-color,5%);
	}

li a {
		@include linear-gradient(lighten($menu-color,1%), darken($menu-color,1%));
		@include type-medium;
		display: block;
		padding: $vertical-space-small $horizontal-space-large;
		border-top: 1px solid lighten($menu-color,5%);
		border-bottom: 1px solid darken($menu-color,5%);
		text-decoration: none;
		text-shadow: 0 -1px 2px $black;
		color: $white;

&:hover, &:focus { @include linear-gradient(lighten($menu-color,5%), darken($menu-color,1%)); }
		&:active {
			@include linear-gradient(lighten($menu-color,1%), darken($menu-color,5%));
			@include box-shadow(0,2px,7px,$black,true);
			border-top-color: darken($menu-color,10%);
			padding-top: $vertical-space-small*1.1;
			padding-bottom: $vertical-space-small*.9;
		}
	}
}

.jPanelMenu-panel {
	@include box-shadow(0,0,25px,$black);
}

CANCEL