.sidebar-right{
#left{
left:auto;
right:0;
.subnav{
.dropdown-submenu{
&>a{
&:after{
display: block;
float: left;
width: 0;
height: 0;
margin-top: 5px;
margin-left:-9px;
border-color: rgba(0, 0, 0, 0);
border-right-color: #aaa;
border-style: solid;
border-width: 5px 5px 5px 0;
content: " ";
}
}
}
.subnav-menu{
&>li.dropdown{
&>a{
&:after{
position: absolute;
left:5px;
top:10px;
width: 5px;
border-color: rgba(0, 0, 0, 0);
border-right-color: #999;
border-style: solid;
border-width: 5px 5px 5px 0;
content: " ";
}
}
&.open{
.dropdown-menu{
left:auto;
right:100%;
}
&>.dropdown-menu{
border-right:0;
border-left:2px solid #aaa;
}
}
}
}
}
}
#main{
margin-left:0;
margin-right:200px;
}
}
#left{
width:200px;
position: absolute;
left:0;
bottom:0;
background: #eee;
height:100%;
overflow-x:visible;
&.mobile-show{
position: fixed;
z-index:1000;
}
&.full{
bottom:auto;
height:auto;
}
&.sidebar-fixed{
position: fixed;
top:40px;
overflow-x:hidden;
.ui-resizable-handle{
right:0;
}
}
.subnav{
margin-top: 15px;
&:hover{
.subnav-title{
.toggle-subnav{
i{
display: block;
}
}
}
}
.subnav-content{
@include pie-clearfix;
padding:10px 20px;
&.less{
padding:10px 13px;
}
}
.subnav-title{
@include pie-clearfix;
text-overflow:ellipsis;
white-space:nowrap;
span{
margin-left:20px;
font-size:18px;
text-overflow:ellipsis;
white-space:nowrap;
}
.toggle-subnav{
color:#444;
padding:1px 6px;
text-decoration: none;
display:block;
position: relative;
text-overflow:ellipsis;
white-space:nowrap;
overflow:hidden;
i{
position: absolute;
font-size:14px;
left:10px;
top:4px;
display: none;
}
&:hover{
color:#222;
}
}
}
.subnav-menu{
list-style-type: none;
margin: 5px 0;
padding: 0;
&>li{
text-overflow:ellipsis;
white-space:nowrap;
&.dropdown{
&>a{
position: relative;
&:after{
position: absolute;
right:5px;
top:10px;
width: 5px;
border-color: rgba(0, 0, 0, 0);
border-left-color: #999;
border-style: solid;
border-width: 5px 0 5px 5px;
content: " ";
}
}
&.open{
&>a{
background: #ccc;
color:#333;
}
.dropdown-menu{
left:100%;
top:0;
border-color:#aaa;
border-left:0;
margin: 0;
.dropdown-submenu{
.dropdown-menu{
border-left:2px solid #999;
}
&:hover,&:focus{
&>a{
background: #ccc;
color:#333;
&:after{
border-left-color: #999;
}
}
}
}
}
}
}
&>a{
color:#555;
display:block;
padding:5px 0 5px 27px;
text-decoration: none;
white-space:nowrap;
text-overflow:ellipsis;
overflow:hidden;
&:hover{
background:#ddd;
color:#222;
}
}
&.active{
&>a{
background: #ccc;
color:#222;
font-weight:bold;
}
}
}
}
}
}
|