* Add metric title at main side.

module/metric/css/preview.ui.css

@@ -2,8 +2,11 @@
 #mainContent .side {flex: 1 0 33%; overflow-x: hidden; padding-right: 2px;}
 #mainContent .main {flex: 1 0 67%; overflow-x: hidden;}
 
-.side .metric-name {height: 48px; padding-left: 16px; margin-bottom: 8px}
+.side .title {height: 48px; padding-left: 16px; margin-bottom: 8px;}
 .side .name-color {color: #475569;}
-.side .metric-list {padding-left: 24px;  height: calc(100vh - 200px); overflow-y: scroll;}
+.side .metric-tree {padding-left: 24px;  height: calc(100vh - 200px); overflow-y: scroll;}
 .side .metric-item {padding-bottom: 12px;}
 .side .metric-current {color: var(--nav-active-color);}
+
+.main .metric-name {height: 48px; padding-left: 16px;}
+.main .metric-name-weight {font-weight: 600; font-size: 0.9rem;}

module/metric/ui/preview.html.php

@@ -32,7 +32,7 @@ div
         setClass('canvas'),
         div
         (
-            setClass('metric-name flex items-center'),
+            setClass('title flex items-center'),
             span
             (
                 setClass('name-color'),
@@ -41,7 +41,7 @@ div
         ),
         div
         (
-            setClass('metric-list'),
+            setClass('metric-tree'),
             $metricTree,
         ),
     ),
@@ -51,7 +51,16 @@ div
     setClass('main'),
     div
     (
-        setClass('canvas flex p-4'),
+        setClass('canvas'),
+        div
+        (
+            setClass('metric-name flex items-center'),
+            span
+            (
+                setClass('metric-name-weight'),
+                $current->name
+            ),
+        ),
     ),
 );
 render();