//响应式侧栏，状态可以为隐藏|只显示一个ICON|完整显示
.@{prefix}{
	@sidebar-item-height: 50px;

	&sidebar-menu{
    background: @sidebar-background;
		transition: width ease-in-out 0.4s !important;
		> li >span{
			transition: all ease-in-out 0.4s !important;
			display: block;
			white-space:nowrap;
		}

    .menu-item-icon{
      padding-left: @sidebar-item-height !important;

      i{
        position: absolute;
				width: @sidebar-item-height;
      	left:0;
        top:0;
				text-align: center;
        line-height: @sidebar-item-height;
        font-size: 1.5em;
        color:lighten(@sidebar-background, 60%) !important;
      }
    }

		.menu-item{
			min-height: @sidebar-item-height;
			line-height: @sidebar-item-height;
			//padding: 0.5em;
			position: relative;
			text-align: left;
			padding-left: 1em;
			font-size: 16px;
			color: #fff;
			cursor: pointer;

			.tip{
				line-height: 1em;
				margin-top:-10px;
				padding-bottom: 15px;
				font-size: 13px;
			}
		}

		.menu-item-current{
			position: relative;
			background: lighten(@sidebar-background, 10%);
	 		color: lighten(@sidebar-background, 80%);

			&:after{
				position: absolute;
			    content: " ";
			    width: 0px;
			    height: 0px;
			    border-width: 8px;
			    border-style: solid;
			    border-color: transparent;
			    top:50%;
			    right:0;
			    margin-top: -8px;
			    border-right-color:#fff;
			}
			i{
				color:@color-primary;
				//left: 16px;
			}
		}

		a{
			height: 100%;
			width: 100%;
			display: block;
			color: lighten(#A7B1C2, 5%);

		}
	}

	&sidebar-menu-sm{
    .menu-item{
      min-height: 0.7*@sidebar-item-height;
      line-height: 0.7*@sidebar-item-height;

			.tip{
				line-height: 1em;
				margin-top:-5px;
				padding-bottom: 10px;
				font-size: 13px;
			}
    }
    .menu-item-icon{
			padding-left: 0.7*@sidebar-item-height !important;
      i{
				width: 0.7*@sidebar-item-height;
				text-align: center;
        line-height: 0.7*@sidebar-item-height;
				font-size: 1.2em;
      }
    }
		.menu-item-current{

			&:after{
					position: absolute;
			    content: " ";
			    width: 0px;
			    height: 0px;
			    border-width: 6px;
			    border-style: solid;
			    border-color: transparent;
			    top:50%;
			    right:0;
			    margin-top: -6px;
			    border-right-color:#fff;
			}
		}
  }

	&sidebar-menu-white{
    background: #fff;

    .menu-item-icon{
      i{
        color:@font-color-light !important;
      }
    }

		.menu-item{

			color: @font-color-light !important;

		}

		.menu-item-current{

			background: @color-secondary;
	 		color: @font-color-light !important;

			&:after{
				display: none;
			}
			i{
				color:@color-primary;
				//left: 16px;
			}
		}
	}

	//选中为白色的侧栏
	&sidebar-menu-light{
    background: none;

    .menu-item-icon{
      i{
        color:@font-color-light !important;
      }
    }

		.menu-item{
			color: @font-color-light !important;

		}

		.menu-item-current{
			border-left: 2px @color-primary solid;
			background: #fff;
	 		color: @color-primary !important;

			&:after{
				display: none;
			}
			i{
				color:@color-primary !important;
				//left: 16px;
			}
		}
	}



	&sidebar-menu-curl{
		width: @sidebar-item-height !important;
		> li >span{

			transform: scale(0);
			//display: none;
		}
	}


	&sidebar-menu-sm-curl{
		width: 0.7*@sidebar-item-height !important;
		> li >span{
			transform: scale(0);
			//display: none;
		}
	}

}