[scss.menu] added left border when channel active

webpack/scss/menu.scss

@@ -33,7 +33,7 @@
 		background: $menu-item-bg center center no-repeat;
 		background-size: auto 55%;
 
-		overflow: hidden;
+		overflow: visible;
 
 		cursor: pointer;
 
@@ -65,6 +65,27 @@
 
 		}
 
+		// {4} active channel : left border //
+		&:not([data-add='1']):not([data-sub]):after{
+			content: '';
+
+			display: block;
+			position: absolute;
+				top: 10%;
+				left: calc( #{$menu-item-size/2} - #{$menu-width/2} - 10px );
+				width: 10px;
+				height: 80%;
+
+			border-radius: 3px;
+
+			background-color: #aaa;
+
+			transition: left .2s ease-in-out;
+		}
+		&:not([data-add='1']):not([data-sub]).active:after{
+			left: calc( #{$menu-item-size/2} - #{$menu-width/2} - 5px );
+		}
+
 		// {4} sub label //
 		&[data-sub]:not([data-sub='']){
 
@@ -73,8 +94,6 @@
 
 			margin-bottom: #{$menu-item-space + 2em};
 
-			overflow: visible;
-
 			// show sub-text
 			&:before{
 				content: attr(data-sub);