feat: chan strip zero indicators on eq, comp and monitor mix

olzzon · Jan 22, 2020 · b9ec40e · b9ec40e
1 parent e978093
commit b9ec40e
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 0 deletions.
diff --git a/client/assets/css/ChanStrip.css b/client/assets/css/ChanStrip.css
@@ -23,6 +23,7 @@
 .chan-strip-body > .parameters {
 	top: 5px;
 	left: 2px;
+	height: 900px;
 	overflow: auto;
 	text-align: center;
 	color: #fff;
@@ -44,6 +45,27 @@
 	font-size: 110%;
 }
 
+.zero-eq {
+	width: 63px;
+	height: 2px;
+	margin-left: -68px;
+	margin-top: 111px;
+}
+
+.zero-comp {
+	width: 63px;
+	height: 2px;
+	margin-left: -68px;
+	margin-top: 81px;
+}
+
+.zero-monitor {
+	width: 2px;
+	height: 20px;
+	margin-left: -66px;
+	margin-top: -150px;
+}
+
 .parameters > .parameter-text {
 	list-style-type: none;
 	text-align: center;

diff --git a/client/components/ChanStrip.tsx b/client/components/ChanStrip.tsx
@@ -242,6 +242,7 @@ class ChanStrip extends React.PureComponent<IChanStripProps & IChanStripInjectPr
                         this.handleMonitorLevel(event, channelIndex)
                     }}
                 />
+                <p className="zero-monitor">_______</p>
             </li>
         )
     }
@@ -253,16 +254,21 @@ class ChanStrip extends React.PureComponent<IChanStripProps & IChanStripInjectPr
                 </div>
                 <div className="parameter-group">
                     {this.threshold()}
+                    <p className="zero-comp">______</p>
                     {this.ratio()}
+                    <p className="zero-comp">______</p>
                 </div>
                 <hr/>
                 <div className="group-text">
                     {"EQUALIZER"}
                 </div>
                 <div className="parameter-group">
                     {this.low()}
+                    <p className="zero-eq">_______</p>
                     {this.mid()}
+                    <p className="zero-eq">_______</p>
                     {this.high()}
+                    <p className="zero-eq">_______</p>
                 </div>
                 <hr/>
                 <div className="group-text">