// fix nav

This commit is contained in:
Kevin Granger
2013-09-13 17:48:46 +02:00
parent be0592d5a2
commit bcfd092a1d
5 changed files with 76 additions and 93 deletions
+65 -83
View File
@@ -11,87 +11,82 @@
border-top: 1px black solid
list-style: none
li.maintab > a > i
font-size: 20px
@include border-radius(40px)
display: inline-block
height: 30px
width: 30px
font-size: 20px
line-height: 30px
color: white
display: inline-block
text-align: center
line-height: 30px
@include border-radius(40px)
li:not(.active)
ul
display: none
li.expanded
color: lighten($main-color,30%)!important
span.submenu_expand
@extend .icon-angle-up
ul.submenu
display: block
li a
color: lighten($main-color,30%)!important
background-color: darken($main-color,20%)!important
border-bottom: solid 1px lighten($main-color,10%)!important
&:last-child a
border: none!important
li.active
span.submenu_expand
display: none
> ul.menu > li.maintab
position: relative
&.active > a
color: contrast-color($brand-primary, white, #333, 10%)
background-color: $brand-primary
i
color: black
background-color: white
&.active:hover > a
color: contrast-color($main-color, white, #333, 10%)
&:hover > a
i
background-color: white
> a
display: block
ul.menu
li.maintab
position: relative
padding: 2px 0 2px 8px
border-bottom: 1px solid darken($main-color,10%)
font-size: 12px
line-height: 28px
$color: contrast-color($main-color, white, #333, 10%)
color: mix($main-color, $color, 30%)
background-color: $main-color
text-transform: uppercase
text-decoration: none
@include transition-property(background-color, border, box-shadow)
@include transition-duration(0.4s)
@include transition-timing-function(ease-out)
i
color: lighten($main-color,25%)
background-color: darken($main-color,25%)
@include transition-property(color)
&.active > a
color: contrast-color($brand-primary, white, #333, 10%)
background-color: $brand-primary
i
color: black
background-color: white
&.active > a:hover
color: contrast-color($main-color, white, #333, 10%)
&.expanded
color: lighten($main-color,30%)!important
background-color: darken($main-color,10%)
span.submenu_expand
@extend .icon-angle-up
ul.submenu
display: block
li a
color: lighten($main-color,30%)
background-color: darken($main-color,20%)
border-bottom: solid 1px darken($main-color,20%)
&:last-child a
border: none
> a
display: block
position: relative
padding: 2px 0 2px 8px
border-bottom: 1px solid darken($main-color,10%)
font-size: 12px
line-height: 28px
$color: contrast-color($main-color, white, #333, 10%)
color: mix($main-color, $color, 30%)
background-color: $main-color
text-transform: uppercase
text-decoration: none
@include transition-property(background-color, border, box-shadow)
@include transition-duration(0.4s)
@include transition-timing-function(ease-out)
&:hover
color: white
span.submenu_expand
position: absolute
right: 10px
top: 2px
cursor: pointer
@extend .icon-angle-down
font-family: FontAwesome
font-size: 24px
font-weight: 100
color: black
@include text-shadow(lighten($main-color,10%) 1px 1px 0)
background-color: transparent
&:hover
color: white
@include text-shadow(darken($main-color,20%) -1px -1px 0)
@media (max-width: $screen-tablet)
display: none
i
color: lighten($main-color,25%)
background-color: darken($main-color,25%)
@include transition-property(color)
@include transition-duration(0.4s)
@include transition-timing-function(ease-out)
&:hover
color: white
span.submenu_expand
position: absolute
right: 10px
top: 2px
cursor: pointer
@extend .icon-angle-down
font-family: FontAwesome
font-size: 24px
font-weight: 100
color: black
@include text-shadow(lighten($main-color,10%) 1px 1px 0)
background-color: transparent
&:hover
color: white
@include text-shadow(darken($main-color,20%) -1px -1px 0)
ul.submenu
list-style: none
padding: 0
@@ -113,6 +108,8 @@
color: contrast-color($brand-primary, white, #333, 10%)
background-color: $brand-primary
border-bottom: solid 1px darken($brand-primary,10%)
@media (max-width: $screen-tablet)
display: none
#nav-topbar
position: fixed
@@ -266,45 +263,30 @@
.icon-AdminDashboard
@extend .icon-dashboard
background-color: adjust-hue($icon-color, 0)
.icon-AdminCatalog
@extend .icon-book
background-color: adjust-hue($icon-color, 30)
.icon-AdminParentOrders
@extend .icon-credit-card
background-color: adjust-hue($icon-color, 60)
.icon-AdminParentCustomer
@extend .icon-group
background-color: adjust-hue($icon-color, 90)
.icon-AdminPriceRule
@extend .icon-tags
background-color: adjust-hue($icon-color, 120)
.icon-AdminParentShipping
@extend .icon-truck
background-color: adjust-hue($icon-color, 150)
.icon-AdminParentLocalization
@extend .icon-globe
background-color: adjust-hue($icon-color, 180)
.icon-AdminParentModules
@extend .icon-puzzle-piece
background-color: adjust-hue($icon-color, 210)
.icon-AdminParentPreferences
@extend .icon-wrench
background-color: adjust-hue($icon-color, 240)
.icon-AdminTools
@extend .icon-cogs
background-color: adjust-hue($icon-color, 270)
.icon-AdminAdmin
@extend .icon-cog
background-color: adjust-hue($icon-color, 300)
.icon-AdminParentStats
@extend .icon-bar-chart
background-color: adjust-hue($icon-color, 330)
.icon-AdminStock
@extend .icon-archive
background-color: adjust-hue($icon-color, 360)
[class^="icon-Admin"]
background-color: black
margin-right: 6px
color: white
File diff suppressed because one or more lines are too long
@@ -124,8 +124,7 @@ html, body
border-left: solid 1px #ccc
&:hover
text-decoration: none
color: white
background-color: $brand-primary
color: black
i
text-align: center
font-size: 1.2em
@@ -304,7 +303,7 @@ input[type="password"].input-tiny
td.actions
min-width: 200px
.btn-group-action
min-width: 200px
float: right
a
text-decoration: none
@@ -338,12 +337,14 @@ hr
border-collapse: separate
border-spacing: 0 2px
margin-bottom: 5px
thead th
background-color: darken($bg-content-color,10%)
thead > tr > th
border: none
font-weight: normal
vertical-align: top
span.title_box
color: black
font-size: 1.1em
font-weight: bold
display: block
word-wrap: nowrap
white-space: nowrap
@@ -363,6 +364,7 @@ hr
vertical-align: middle
word-wrap: nowrap
font-size: 12px
border-bottom: solid 1px #eee
//@include box-shadow(rgba(black,0.15) 0 1px 0)
td.center, th.center
@@ -376,7 +378,7 @@ hr
//filter table
tr.filter
background-color: $bg-content-color
background-color: lighten($brand-primary,25%)
input[type="text"].filter, input[type="password"].filter, select.filter
font-size: 12px
+1 -2
View File
@@ -49,6 +49,7 @@ $( document ).ready(function() {
}
//nav top bar
function navTopbar(){
$('span.submenu_expand').remove();
$('.expanded').removeClass('expanded');
$('#nav-topbar').on('mouseenter', 'li.maintab.has_submenu',
@@ -80,7 +81,6 @@ $( document ).ready(function() {
//nav switch
function navSwitch(){
if ($('body').hasClass('page-sidebar')||$('body').hasClass('page-sidebar-closed')) {
$('body').removeClass('page-sidebar').removeClass('page-sidebar-closed').addClass('page-topbar');
$('#nav-sidebar').attr('id','nav-topbar');
@@ -101,7 +101,6 @@ $( document ).ready(function() {
navTopbar();
}
$('#header_shopname').on('click',
function(e){
e.preventDefault();
@@ -303,7 +303,7 @@
</th>
{/if}
{if $has_actions}
<th>{l s='Actions'}{if !$simple_header}{/if}</th>
<th>{if !$simple_header}{/if}</th>
{/if}
</tr>
{if !$simple_header && $show_filters}