// fix nav

This commit is contained in:
Kevin Granger committed 2013-09-13 18:35:27 +02:00
1 parent bcfd092a1d
commit 81a783679d
4 files changed
+42 -27

No files matched your search

+37 -25
View File
@@ -1,15 +1,10 @@
#nav-sidebar #nav-sidebar
height: 100%!important
z-index: 500
float: left float: left
width: 240px width: 240px
height: 100%!important
z-index: 500
background-color: $main-color background-color: $main-color
border-right: 1px solid black border-right: 1px solid black
ul.menu
margin: 0
padding: 0
border-top: 1px black solid
list-style: none
li.maintab > a > i li.maintab > a > i
display: inline-block display: inline-block
height: 30px height: 30px
@@ -26,30 +21,43 @@
span.submenu_expand span.submenu_expand
display: none display: none
ul.menu ul.menu
margin: 0
padding: 0
border-top: 1px black solid
list-style: none
li.maintab li.maintab
position: relative position: relative
&.active > a &.active
color: contrast-color($brand-primary, white, #333, 10%) a.title
background-color: $brand-primary color: contrast-color($brand-primary, white, #333, 10%)
i background-color: $brand-primary
color: black i
background-color: white color: black
&.active > a:hover background-color: white
color: contrast-color($main-color, white, #333, 10%) &.active
a.title:hover
color: contrast-color($main-color, white, #333, 10%)
&.expanded &.expanded
color: lighten($main-color,30%)!important a.title
background-color: darken($main-color,10%) color: white
background-color: darken($main-color,10%)
border-bottom: solid 1px darken($main-color,25%)
&:hover
background-color: lighten($main-color,10%)
i
color: white
span.submenu_expand span.submenu_expand
@extend .icon-angle-up @extend .icon-angle-up
ul.submenu ul.submenu
display: block display: block
li a a
color: lighten($main-color,30%) color: lighten($main-color,30%)
background-color: darken($main-color,20%) background-color: darken($main-color,15%)
border-bottom: solid 1px darken($main-color,20%) border-bottom: solid 1px darken($main-color,25%)
&:last-child a &:hover
border: none color: white
> a background-color: darken($main-color,5%)
a.title
display: block display: block
position: relative position: relative
padding: 2px 0 2px 8px padding: 2px 0 2px 8px
@@ -71,19 +79,23 @@
@include transition-duration(0.4s) @include transition-duration(0.4s)
@include transition-timing-function(ease-out) @include transition-timing-function(ease-out)
&:hover &:hover
background-color: lighten($main-color,10%)
color: white color: white
i
color: white
span.submenu_expand span.submenu_expand
position: absolute position: absolute
right: 10px right: 10px
top: 2px top: 2px
cursor: pointer cursor: pointer
@extend .icon-angle-down
font-family: FontAwesome font-family: FontAwesome
font-size: 24px font-size: 24px
font-weight: 100 font-weight: 100
color: black color: black
@include text-shadow(lighten($main-color,10%) 1px 1px 0)
background-color: transparent background-color: transparent
@extend .icon-angle-down
@include text-shadow(lighten($main-color,10%) 1px 1px 0)
&:hover &:hover
color: white color: white
@include text-shadow(darken($main-color,20%) -1px -1px 0) @include text-shadow(darken($main-color,20%) -1px -1px 0)
+1 -1
View File
@@ -30,4 +30,4 @@
* Email: dave@fontawesome.io * Email: dave@fontawesome.io
* Twitter: http://twitter.com/byscuits * Twitter: http://twitter.com/byscuits
* Work: Lead Product Designer @ Kyruus - http://kyruus.com * Work: Lead Product Designer @ Kyruus - http://kyruus.com
*/@font-face{font-family:'FontAwesome';src:url("../font/fontawesome-webfont.eot?v=3.2.1");src:url("../font/fontawesome-webfont.eot?#iefix&v=3.2.1") format("embedded-opentype"),url("../font/fontawesome-webfont.woff?v=3.2.1") format("woff"),url("../font/fontawesome-webfont.ttf?v=3.2.1") format("truetype"),url("../font/fontawesome-webfont.svg#fontawesomeregular?v=3.2.1") format("svg");font-weight:normal;font-style:normal}[class^="icon-"],[class*=" icon-"]{font-family:FontAwesome;font-weight:normal;font-style:normal;text-decoration:inherit;-webkit-font-smoothing:antialiased;*margin-right:.3em}[class^="icon-"]:before,[class*=" icon-"]:before{text-decoration:inherit;display:inline-block;speak:none}.icon-large:before{vertical-align:-10%;font-size:1.3333333333333333em}a [class^="icon-"],a [class*=" icon-"]{display:inline}[class^="icon-"].icon-fixed-width,[class*=" icon-"].icon-fixed-width{display:inline-block;width:1.1428571428571428em;text-align:right;padding-right:0.2857142857142857em}[class^="icon-"].icon-fixed-width.icon-large,[class*=" icon-"].icon-fixed-width.icon-large{width:1.4285714285714286em}.icons-ul{margin-left:2.142857142857143em;list-style-type:none}.icons-ul>li{position:relative}.icons-ul .icon-li{position:absolute;left:-2.142857142857143em;width:2.142857142857143em;text-align:center;line-height:inherit}[class^="icon-"].hide,[class*=" icon-"].hide{display:none}.icon-muted{color:#eeeeee}.icon-light{color:#ffffff}.icon-dark{color:#333333}.icon-border{border:solid 1px #eeeeee;padding:.2em .25em .15em;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px}.icon-2x{font-size:2em}.icon-2x.icon-border{border-width:2px;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}.icon-3x{font-size:3em}.icon-3x.icon-border{border-width:3px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}.icon-4x{font-size:4em}.icon-4x.icon-border{border-width:4px;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px}.icon-5x{font-size:5em}.icon-5x.icon-border{border-width:5px;-webkit-border-radius:7px;-moz-border-radius:7px;border-radius:7px}.pull-right,#content h3 .panel-heading-action,#content .panel-heading .panel-heading-action,#content #header_notifs_icon_wrapper .notifs_panel .notifs_panel_header .panel-heading-action,#header_notifs_icon_wrapper .notifs_panel #content .notifs_panel_header .panel-heading-action{float:right}.pull-left,.page-head h2.page-title{float:left}[class^="icon-"].pull-left,.page-head h2[class^="icon-"].page-title,[class*=" icon-"].pull-left,.page-head h2[class*=" icon-"].page-title{margin-right:.3em}[class^="icon-"].pull-right,#content h3 [class^="icon-"].panel-heading-action,#content .panel-heading [class^="icon-"].panel-heading-action,#content #header_notifs_icon_wrapper .notifs_panel .notifs_panel_header [class^="icon-"].panel-heading-action,#header_notifs_icon_wrapper .notifs_panel #content .notifs_panel_header [class^="icon-"].panel-heading-action,[class*=" icon-"].pull-right,#content h3 [class*=" icon-"].panel-heading-action,#content .panel-heading [class*=" icon-"].panel-heading-action,#content #header_notifs_icon_wrapper .notifs_panel .notifs_panel_header [class*=" icon-"].panel-heading-action,#header_notifs_icon_wrapper .notifs_panel #content .notifs_panel_header [class*=" icon-"].panel-heading-action{margin-left:.3em}[class^="icon-"],[class*=" icon-"]{display:inline;width:auto;height:auto;line-height:normal;vertical-align:baseline;background-image:none;background-position:0% 0%;background-repeat:repeat;margin-top:0}.icon-white,.nav-pills>.active>a>[class^="icon-"],.nav-pills>.active>a>[class*=" icon-"],.nav-list>.active>a>[class^="icon-"],.nav-list>.active>a>[class*=" icon-"],.navbar-inverse .nav>.active>a>[class^="icon-"],#header_infos .nav>.active>a>[class^="icon-"],.navbar-inverse #header_notifs_icon_wrapper>.active>a>[class^="icon-"],#header_infos #header_notifs_icon_wrapper>.active>a>[class^="icon-"],.navbar-inverse #header_employee_box>.active>a>[class^="icon-"],#header_infos #header_employee_box>.active>a>[class^="icon-"],.navbar-inverse #header_quick>.active>a>[class^="icon-"],#header_infos #header_quick>.active>a>[class^="icon-"],.navbar-inverse .nav>.active>a>[class*=" icon-"],#header_infos .nav>.active>a>[class*=" icon-"],.navbar-inverse #header_notifs_icon_wrapper>.active>a>[class*=" icon-"],#header_infos #header_notifs_icon_wrapper>.active>a>[class*=" icon-"],.navbar-inverse #header_employee_box>.active>a>[class*=" icon-"],#header_infos #header_employee_box>.active>a>[class*=" icon-"],.navbar-inverse #header_quick>.active>a>[class*=" icon-"],#header_infos #header_quick>.active>a>[class*=" icon-"],.dropdown-menu>li>a:hover>[class^="icon-"],.dropdown-menu>li>a:hover>[class*=" icon-"],.dropdown-menu>.active>a>[class^="icon-"],.dropdown-menu>.active>a>[class*=" icon-"],.dropdown-submenu:hover>a>[class^="icon-"],.dropdown-submenu:hover>a>[class*=" icon-"]{background-image:none}.btn [class^="icon-"].icon-large,.nav [class^="icon-Line truncated */@font-face{font-family:'FontAwesome';src:url("../font/fontawesome-webfont.eot?v=3.2.1");src:url("../font/fontawesome-webfont.eot?#iefix&v=3.2.1") format("embedded-opentype"),url("../font/fontawesome-webfont.woff?v=3.2.1") format("woff"),url("../font/fontawesome-webfont.ttf?v=3.2.1") format("truetype"),url("../font/fontawesome-webfont.svg#fontawesomeregular?v=3.2.1") format("svg");font-weight:normal;font-style:normal}[class^="icon-"],[class*=" icon-"]{font-family:FontAwesome;font-weight:normal;font-style:normal;text-decoration:inherit;-webkit-font-smoothing:antialiased;*margin-right:.3em}[class^="icon-"]:before,[class*=" icon-"]:before{text-decoration:inherit;display:inline-block;speak:none}.icon-large:before{vertical-align:-10%;font-size:1.3333333333333333em}a [class^="icon-"],a [class*=" icon-"]{display:inline}[class^="icon-"].icon-fixed-width,[class*=" icon-"].icon-fixed-width{display:inline-block;width:1.1428571428571428em;text-align:right;padding-right:0.2857142857142857em}[class^="icon-"].icon-fixed-width.icon-large,[class*=" icon-"].icon-fixed-width.icon-large{width:1.4285714285714286em}.icons-ul{margin-left:2.142857142857143em;list-style-type:none}.icons-ul>li{position:relative}.icons-ul .icon-li{position:absolute;left:-2.142857142857143em;width:2.142857142857143em;text-align:center;line-height:inherit}[class^="icon-"].hide,[class*=" icon-"].hide{display:none}.icon-muted{color:#eeeeee}.icon-light{color:#ffffff}.icon-dark{color:#333333}.icon-border{border:solid 1px #eeeeee;padding:.2em .25em .15em;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px}.icon-2x{font-size:2em}.icon-2x.icon-border{border-width:2px;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}.icon-3x{font-size:3em}.icon-3x.icon-border{border-width:3px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}.icon-4x{font-size:4em}.icon-4x.icon-border{border-width:4px;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px}.icon-5x{font-size:5em}.icon-5x.icon-border{border-width:5px;-webkit-border-radius:7px;-moz-border-radius:7px;border-radius:7px}.pull-right,#content h3 .panel-heading-action,#content .panel-heading .panel-heading-action,#content #header_notifs_icon_wrapper .notifs_panel .notifs_panel_header .panel-heading-action,#header_notifs_icon_wrapper .notifs_panel #content .notifs_panel_header .panel-heading-action{float:right}.pull-left,.page-head h2.page-title{float:left}[class^="icon-"].pull-left,.page-head h2[class^="icon-"].page-title,[class*=" icon-"].pull-left,.page-head h2[class*=" icon-"].page-title{margin-right:.3em}[class^="icon-"].pull-right,#content h3 [class^="icon-"].panel-heading-action,#content .panel-heading [class^="icon-"].panel-heading-action,#content #header_notifs_icon_wrapper .notifs_panel .notifs_panel_header [class^="icon-"].panel-heading-action,#header_notifs_icon_wrapper .notifs_panel #content .notifs_panel_header [class^="icon-"].panel-heading-action,[class*=" icon-"].pull-right,#content h3 [class*=" icon-"].panel-heading-action,#content .panel-heading [class*=" icon-"].panel-heading-action,#content #header_notifs_icon_wrapper .notifs_panel .notifs_panel_header [class*=" icon-"].panel-heading-action,#header_notifs_icon_wrapper .notifs_panel #content .notifs_panel_header [class*=" icon-"].panel-heading-action{margin-left:.3em}[class^="icon-"],[class*=" icon-"]{display:inline;width:auto;height:auto;line-height:normal;vertical-align:baseline;background-image:none;background-position:0% 0%;background-repeat:repeat;margin-top:0}.icon-white,.nav-pills>.active>a>[class^="icon-"],.nav-pills>.active>a>[class*=" icon-"],.nav-list>.active>a>[class^="icon-"],.nav-list>.active>a>[class*=" icon-"],.navbar-inverse .nav>.active>a>[class^="icon-"],#header_infos .nav>.active>a>[class^="icon-"],.navbar-inverse #header_notifs_icon_wrapper>.active>a>[class^="icon-"],#header_infos #header_notifs_icon_wrapper>.active>a>[class^="icon-"],.navbar-inverse #header_employee_box>.active>a>[class^="icon-"],#header_infos #header_employee_box>.active>a>[class^="icon-"],.navbar-inverse #header_quick>.active>a>[class^="icon-"],#header_infos #header_quick>.active>a>[class^="icon-"],.navbar-inverse .nav>.active>a>[class*=" icon-"],#header_infos .nav>.active>a>[class*=" icon-"],.navbar-inverse #header_notifs_icon_wrapper>.active>a>[class*=" icon-"],#header_infos #header_notifs_icon_wrapper>.active>a>[class*=" icon-"],.navbar-inverse #header_employee_box>.active>a>[class*=" icon-"],#header_infos #header_employee_box>.active>a>[class*=" icon-"],.navbar-inverse #header_quick>.active>a>[class*=" icon-"],#header_infos #header_quick>.active>a>[class*=" icon-"],.dropdown-menu>li>a:hover>[class^="icon-"],.dropdown-menu>li>a:hover>[class*=" icon-"],.dropdown-menu>.active>a>[class^="icon-"],.dropdown-menu>.active>a>[class*=" icon-"],.dropdown-submenu:hover>a>[class^="icon-"],.dropdown-submenu:hover>a>[class*=" icon-"]{background-image:none}.btn [class^="icon-"].icon-large,.nav [class^="icon-Line truncated
@@ -365,7 +365,6 @@ hr
word-wrap: nowrap word-wrap: nowrap
font-size: 12px font-size: 12px
border-bottom: solid 1px #eee border-bottom: solid 1px #eee
//@include box-shadow(rgba(black,0.15) 0 1px 0)
td.center, th.center td.center, th.center
text-align: center text-align: center
@@ -381,6 +380,7 @@ tr.filter
background-color: lighten($brand-primary,25%) background-color: lighten($brand-primary,25%)
input[type="text"].filter, input[type="password"].filter, select.filter input[type="text"].filter, input[type="password"].filter, select.filter
font-size: 12px font-size: 12px
border-color: lighten($brand-primary,10%)
.breadcrumb .breadcrumb
background-color: lighten($bg-content-color,7%) background-color: lighten($bg-content-color,7%)
@@ -26,6 +26,8 @@ $( document ).ready(function() {
//nav side bar //nav side bar
function navSidebar(){ function navSidebar(){
$('.expanded').removeClass('expanded');
$('.submenu').not('.active').hide();
$('#nav-sidebar li.maintab.has_submenu').append('<span class="submenu_expand"></span>'); $('#nav-sidebar li.maintab.has_submenu').append('<span class="submenu_expand"></span>');
$('#nav-sidebar .submenu_expand').on('click',function(){ $('#nav-sidebar .submenu_expand').on('click',function(){
var $navId = $(this).parent(); var $navId = $(this).parent();
@@ -114,6 +116,7 @@ $( document ).ready(function() {
//sidebar menu collapse //sidebar menu collapse
$('.menu-collapse').click(function(){ $('.menu-collapse').click(function(){
$('body').toggleClass('page-sidebar-closed'); $('body').toggleClass('page-sidebar-closed');
$('.expanded').removeClass('expanded');
}); });
}); });