// opti css menu
This commit is contained in:
Kevin Granger
@@ -6795,105 +6795,95 @@ html, body {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
line-height: 30px; }
|
||||
#nav-sidebar > ul > li > ul.sub-menu {
|
||||
display: none;
|
||||
list-style: none;
|
||||
clear: both;
|
||||
margin: 8px 0px 8px 0px; }
|
||||
#nav-sidebar > ul {
|
||||
#nav-sidebar ul {
|
||||
margin: 0;
|
||||
padding: 0; }
|
||||
#nav-sidebar > ul li {
|
||||
background-color: #3a3a4a;
|
||||
list-style: none; }
|
||||
#nav-sidebar > ul li:not(.active) ul {
|
||||
display: none; }
|
||||
#nav-sidebar > ul li.expanded ul {
|
||||
display: block;
|
||||
#nav-sidebar li {
|
||||
list-style: none; }
|
||||
#nav-sidebar li:not(.active) ul {
|
||||
display: none; }
|
||||
#nav-sidebar li.expanded ul {
|
||||
display: block;
|
||||
background-color: white; }
|
||||
#nav-sidebar > ul > li.active > a {
|
||||
color: white;
|
||||
background-color: #00a89c;
|
||||
border-top: 1px solid #00c2b4;
|
||||
border-bottom: 1px solid #00423d;
|
||||
-webkit-box-shadow: #00756d -4px 0 0 inset;
|
||||
box-shadow: #00756d -4px 0 0 inset; }
|
||||
#nav-sidebar > ul > li.active > a i {
|
||||
color: #1d7878 !important;
|
||||
background-color: white; }
|
||||
#nav-sidebar > ul > li.active > a {
|
||||
color: white;
|
||||
background-color: #00a89c;
|
||||
border-top: 1px solid #00c2b4;
|
||||
border-bottom: 1px solid #00423d;
|
||||
-webkit-box-shadow: #00756d -4px 0 0 inset;
|
||||
box-shadow: #00756d -4px 0 0 inset; }
|
||||
#nav-sidebar > ul > li.active > a i {
|
||||
color: #1d7878 !important;
|
||||
background-color: white; }
|
||||
#nav-sidebar > ul > li.active:hover > a {
|
||||
color: white;
|
||||
-webkit-box-shadow: #00756d -4px 0 0 inset;
|
||||
box-shadow: #00756d -4px 0 0 inset; }
|
||||
#nav-sidebar > ul > li:hover > a {
|
||||
-webkit-box-shadow: #1d7878 -4px 0 0 inset;
|
||||
box-shadow: #1d7878 -4px 0 0 inset; }
|
||||
#nav-sidebar > ul > li:hover > a i {
|
||||
color: #00a89c !important;
|
||||
background-color: white; }
|
||||
#nav-sidebar > ul > li > a {
|
||||
display: block;
|
||||
padding: 2px 0 2px 8px;
|
||||
border-top: 1px solid #454558;
|
||||
border-bottom: 1px solid #24242d;
|
||||
font-size: 12px;
|
||||
line-height: 28px;
|
||||
color: #c3c3c8;
|
||||
background-color: #3a3a4a;
|
||||
text-transform: uppercase;
|
||||
text-decoration: none;
|
||||
-webkit-transition-property: background-color, border, box-shadow;
|
||||
-moz-transition-property: background-color, border, box-shadow;
|
||||
-o-transition-property: background-color, border, box-shadow;
|
||||
transition-property: background-color, border, box-shadow;
|
||||
#nav-sidebar > ul > li.active:hover > a {
|
||||
color: white;
|
||||
-webkit-box-shadow: #00756d -4px 0 0 inset;
|
||||
box-shadow: #00756d -4px 0 0 inset; }
|
||||
#nav-sidebar > ul > li:hover > a {
|
||||
-webkit-box-shadow: #1d7878 -4px 0 0 inset;
|
||||
box-shadow: #1d7878 -4px 0 0 inset; }
|
||||
#nav-sidebar > ul > li:hover > a i {
|
||||
color: #00a89c !important;
|
||||
background-color: white; }
|
||||
#nav-sidebar > ul > li > a {
|
||||
display: block;
|
||||
padding: 2px 0 2px 8px;
|
||||
border-top: 1px solid #454558;
|
||||
border-bottom: 1px solid #24242d;
|
||||
font-size: 12px;
|
||||
line-height: 28px;
|
||||
color: #c3c3c8;
|
||||
background-color: #3a3a4a;
|
||||
text-transform: uppercase;
|
||||
text-decoration: none;
|
||||
-webkit-transition-property: background-color, border, box-shadow;
|
||||
-moz-transition-property: background-color, border, box-shadow;
|
||||
-o-transition-property: background-color, border, box-shadow;
|
||||
transition-property: background-color, border, box-shadow;
|
||||
-webkit-transition-duration: 0.4s;
|
||||
transition-duration: 0.4s;
|
||||
-webkit-transition-timing-function: ease-out;
|
||||
-moz-transition-timing-function: ease-out;
|
||||
-o-transition-timing-function: ease-out;
|
||||
transition-timing-function: ease-out;
|
||||
-webkit-box-shadow: #18181f -4px 0 0 inset;
|
||||
box-shadow: #18181f -4px 0 0 inset; }
|
||||
#nav-sidebar > ul > li > a i {
|
||||
color: #737391;
|
||||
background-color: #020203;
|
||||
-webkit-transition-property: color;
|
||||
-moz-transition-property: color;
|
||||
-o-transition-property: color;
|
||||
transition-property: color;
|
||||
-webkit-transition-duration: 0.4s;
|
||||
transition-duration: 0.4s;
|
||||
-webkit-transition-timing-function: ease-out;
|
||||
-moz-transition-timing-function: ease-out;
|
||||
-o-transition-timing-function: ease-out;
|
||||
transition-timing-function: ease-out;
|
||||
-webkit-box-shadow: #18181f -4px 0 0 inset;
|
||||
box-shadow: #18181f -4px 0 0 inset; }
|
||||
#nav-sidebar > ul > li > a i {
|
||||
color: #737391;
|
||||
background-color: #020203;
|
||||
-webkit-transition-property: color;
|
||||
-moz-transition-property: color;
|
||||
-o-transition-property: color;
|
||||
transition-property: color;
|
||||
-webkit-transition-duration: 0.4s;
|
||||
transition-duration: 0.4s;
|
||||
-webkit-transition-timing-function: ease-out;
|
||||
-moz-transition-timing-function: ease-out;
|
||||
-o-transition-timing-function: ease-out;
|
||||
transition-timing-function: ease-out; }
|
||||
#nav-sidebar > ul > li img {
|
||||
margin-right: 10px; }
|
||||
#nav-sidebar > ul > li ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: white; }
|
||||
#nav-sidebar > ul > li ul li a {
|
||||
display: block;
|
||||
padding: 2px 5px 2px 10px;
|
||||
font-size: 12px;
|
||||
border: none;
|
||||
border-bottom: solid 1px #eeeeee;
|
||||
background-color: white; }
|
||||
#nav-sidebar > ul > li ul li a i {
|
||||
margin-top: 3px;
|
||||
color: #00a89c; }
|
||||
#nav-sidebar > ul > li ul li a:hover {
|
||||
color: #1d7878;
|
||||
background-color: #ebebec;
|
||||
text-decoration: none; }
|
||||
#nav-sidebar > ul > li ul li a:hover i {
|
||||
color: #3a3a4a; }
|
||||
#nav-sidebar > ul > li ul li.active a {
|
||||
color: white;
|
||||
background-color: #1d7878; }
|
||||
#nav-sidebar > ul > li ul li.active a i {
|
||||
color: #3a3a4a; }
|
||||
transition-timing-function: ease-out; }
|
||||
#nav-sidebar > ul > li img {
|
||||
margin-right: 10px; }
|
||||
#nav-sidebar ul.submenu a {
|
||||
display: block;
|
||||
padding: 2px 5px 2px 10px;
|
||||
font-size: 12px;
|
||||
border: none;
|
||||
border-bottom: solid 1px #eeeeee;
|
||||
background-color: white; }
|
||||
#nav-sidebar ul.submenu a i {
|
||||
margin-top: 3px;
|
||||
color: #00a89c; }
|
||||
#nav-sidebar ul.submenu a:hover {
|
||||
color: #1d7878;
|
||||
background-color: #ebebec;
|
||||
text-decoration: none; }
|
||||
#nav-sidebar ul.submenu a:hover i {
|
||||
color: #3a3a4a; }
|
||||
#nav-sidebar ul.submenu.active a {
|
||||
color: white;
|
||||
background-color: #1d7878; }
|
||||
#nav-sidebar ul.submenu.active a i {
|
||||
color: #3a3a4a; }
|
||||
@media (max-width: 768px) {
|
||||
#nav-sidebar {
|
||||
display: none; } }
|
||||
|
||||
@@ -202,7 +202,6 @@ html, body
|
||||
margin-left: 0
|
||||
width: 100%
|
||||
|
||||
|
||||
.page-head
|
||||
width: 100%
|
||||
height: 55px
|
||||
@@ -252,23 +251,19 @@ html, body
|
||||
display: inline-block
|
||||
text-align: center
|
||||
line-height: 30px
|
||||
> ul > li > ul.sub-menu
|
||||
display: none
|
||||
list-style: none
|
||||
clear: both
|
||||
margin: 8px 0px 8px 0px
|
||||
> ul
|
||||
ul
|
||||
margin: 0
|
||||
padding: 0
|
||||
li
|
||||
background-color: $main-color
|
||||
list-style: none
|
||||
li:not(.active) ul
|
||||
li
|
||||
list-style: none
|
||||
li:not(.active)
|
||||
ul
|
||||
display: none
|
||||
li.expanded
|
||||
ul
|
||||
display: block
|
||||
background-color: white
|
||||
li.expanded
|
||||
ul
|
||||
display: block
|
||||
background-color: white
|
||||
> ul
|
||||
> li
|
||||
&.active > a
|
||||
color: contrast-color($main-color, white, #333, 10%)
|
||||
@@ -295,7 +290,7 @@ html, body
|
||||
font-size: 12px
|
||||
line-height: 28px
|
||||
$color: contrast-color($main-color, white, #333, 10%)
|
||||
color: mix($main-color, $color, 30%)
|
||||
color: mix($main-color, $color, 30%)
|
||||
background-color: $main-color
|
||||
text-transform: uppercase
|
||||
text-decoration: none
|
||||
@@ -311,36 +306,33 @@ html, body
|
||||
@include transition-timing-function(ease-out)
|
||||
img
|
||||
margin-right: 10px
|
||||
ul
|
||||
margin: 0
|
||||
padding: 0
|
||||
background-color: white
|
||||
li
|
||||
a
|
||||
display: block
|
||||
padding: 2px 5px 2px 10px
|
||||
font-size: 12px
|
||||
border: none
|
||||
border-bottom: solid 1px #eee
|
||||
background-color: white
|
||||
i
|
||||
margin-top: 3px
|
||||
color: $secondary-color
|
||||
&:hover
|
||||
color: $brand-primary
|
||||
background-color: mix(white, $main-color, 90%)
|
||||
text-decoration: none
|
||||
i
|
||||
color: $main-color
|
||||
&.active
|
||||
a
|
||||
color: contrast-color($brand-primary, white, #333, 10%)
|
||||
background-color: $brand-primary
|
||||
i
|
||||
color: $main-color
|
||||
ul.submenu
|
||||
a
|
||||
display: block
|
||||
padding: 2px 5px 2px 10px
|
||||
font-size: 12px
|
||||
border: none
|
||||
border-bottom: solid 1px #eee
|
||||
background-color: white
|
||||
i
|
||||
margin-top: 3px
|
||||
color: $secondary-color
|
||||
&:hover
|
||||
color: $brand-primary
|
||||
background-color: mix(white, $main-color, 90%)
|
||||
text-decoration: none
|
||||
i
|
||||
color: $main-color
|
||||
&.active
|
||||
a
|
||||
color: contrast-color($brand-primary, white, #333, 10%)
|
||||
background-color: $brand-primary
|
||||
i
|
||||
color: $main-color
|
||||
@media (max-width: $screen-tablet)
|
||||
display: none
|
||||
|
||||
|
||||
.page-sidebar-closed
|
||||
#nav-sidebar
|
||||
width: 50px
|
||||
@@ -1071,7 +1063,6 @@ fieldset > .row
|
||||
line-height: 1em
|
||||
font-size: 1.1em
|
||||
font-weight: 300
|
||||
dd
|
||||
svg
|
||||
height: 350px
|
||||
|
||||
|
||||
@@ -298,7 +298,6 @@
|
||||
{/if}
|
||||
|
||||
<div id="main">
|
||||
|
||||
<nav id="nav-sidebar" data-spy="affix" data-offset-top="0" role="navigation">
|
||||
{if !$tab}
|
||||
<div class="mainsubtablist" style="display:none"></div>
|
||||
@@ -326,13 +325,15 @@
|
||||
<i class="icon-{$t.class_name}"></i>
|
||||
<span class="title">{if $t.name eq ''}{$t.class_name}{else}{$t.name}{/if}</span>
|
||||
</a>
|
||||
|
||||
|
||||
<ul class="submenu">
|
||||
{foreach from=$t.sub_tabs item=t2}
|
||||
{if $t2.active}
|
||||
<li {if $t2.current} class="active"{/if}>
|
||||
<a href="{$t2.href|escape:'htmlall':'UTF-8'}">
|
||||
{if $t2.name eq ''}{$t2.class_name}{else}{$t2.name|escape:'htmlall':'UTF-8'}{/if}
|
||||
<!-- <i class="icon-chevron-sign-right pull-right"></i> -->
|
||||
<i class="icon-chevron-sign-right pull-right"></i>
|
||||
</a>
|
||||
</li>
|
||||
{/if}
|
||||
|
||||
Reference in New Issue
Block a user