Merge branch 'ervu/tmp_makets' into update/3.185.1

# Conflicts:
#	packages/ru.cg.webbpm.packages.base.resources/metadata/java.metadata
#	pom.xml

frontend/src/resources/css/components-business-metrics.css

@@ -8,6 +8,9 @@
 .webbpm.ervu_business_metrics .pull-center > div {
     justify-content: center;
 }
+.webbpm.ervu_business_metrics .pull-center .btn {
+    margin-bottom: var(--indent-base);
+}
 
 .webbpm.ervu_business_metrics .btn {
     color: var(--color-text-primary) !important;
@@ -23,9 +26,15 @@
     background: var(--block-active-bg) !important
 }
 
+.webbpm.ervu_business_metrics .selectize-dropdown, 
+.webbpm.ervu_business_metrics .selectize-input, 
+.webbpm.ervu_business_metrics .selectize-input input {
+    font-size: var(--size-text-secondary);
+}    
 .webbpm.ervu_business_metrics .selectize-control {
     display: flex;
-    height: auto;
+    //height: auto;
+    height: 30px;
     background-color: transparent;
 }
 .webbpm.ervu_business_metrics .selectize-control .selectize-input {
@@ -40,7 +49,7 @@
     color: var(--color-text-primary);
     font-family: bootstrap-icons !important;
     font-weight: 800 !important;
-    font-size: var(--size-text-secondary);
+    font-size: var(--size-text-mini);
     top: calc((50% - var(--size-text-secondary) / 2));
     right: var(--indent-small);
     height: auto;
@@ -93,7 +102,7 @@
     font-family: 'GolosM';
     font-size: var(--size-text-secondary);
     text-transform: uppercase;
-    padding: 10px 0;
+    padding: 12px 0;
     border: 0;
     background-color: transparent !important;
 }
@@ -206,7 +215,7 @@
     display: flex;
     align-items: end;
     font-family: 'GolosM';
-    font-size: var(--size-text-primary);
+    font-size: var(--size-text-secondary);
     color: var(--color-text-primary);
     text-align: left;
     width: 100%;
@@ -226,15 +235,30 @@
 .webbpm.ervu_business_metrics .group-section + .group-section {
     margin-top: var(--indent-mini);
 }
+.webbpm.ervu_business_metrics .block-panel .panel-btn-fixed .btn {
+    padding-right: 64px;
+}
 
-.webbpm.ervu_business_metrics .block-section {
-    flex: 1;
+.webbpm.ervu_business_metrics .block-section {  
     padding-right: 0;
 }
+.webbpm.ervu_business_metrics .block-section:first-child:last-child :is(.graph-donut, .graph-donut-large) {
+    justify-content: right;
+}
 .webbpm.ervu_business_metrics .block-section + .block-section {
     padding-left: var(--indent-mini);
 }
+.webbpm.ervu_business_metrics .horizontal-container > .block-section ~ vbox {
+    flex: 1;
+    padding-left: var(--indent-mini);
+}
+.webbpm.ervu_business_metrics .vertical-container > .block-section + .block-section {
+    flex: 1;
+    padding-left: 0;
+    padding-top: var(--indent-mini);
+}
 .webbpm.ervu_business_metrics .block-section > div {
+    flex: 1;
     padding: var(--indent-xbase) var(--indent-medium) var(--indent-medium) var(--indent-medium);
     border: 1px solid var(--border);
     border-radius: var(--indent-small);
@@ -315,7 +339,12 @@
 }
 .webbpm.ervu_business_metrics .subtitle {
     font-size: var(--size-text-subtitle);
-    margin-bottom: var(--indent-base);
+    margin-bottom: var(--indent-base) !important;
+}
+.webbpm.ervu_business_metrics .subhead {
+    font-family: 'GolosUIM';
+    font-size: var(--size-text-subhead);
+    margin-bottom: var(--indent-base) !important;
 }
 
 .webbpm.ervu_business_metrics .mute {
@@ -348,15 +377,13 @@
     width: min(10vw, 12.5rem);
     height: min(7vw, 9rem);
 }
+.webbpm.ervu_business_metrics .graph-row .chart-content {
+}
 .webbpm.ervu_business_metrics .graph-donut .chart-content {
     width: min(11vw, 13.75rem) !important; /*220px*/
     height: min(11vw, 13.75rem) !important; /*220px*/
-}
-.webbpm.ervu_business_metrics .graph-donut-medium .chart-content {
-
 }
 .webbpm.ervu_business_metrics .graph-donut-large .chart-content {
-
 }
    
 .webbpm.ervu_business_metrics [class*="graph-legend"] * {
@@ -371,15 +398,45 @@
     position: absolute;
     width: 12px;
     height: 12px;
-    top: 5px;
+    top: calc((var(--size-text-primary)*1.5 - 12px) / 2);
     left: 0;
     border-radius: var(--indent-small);
 }
-.webbpm.ervu_business_metrics [class*="graph-legend"] text {
-    margin-top: var(--indent-small);
+.webbpm.ervu_business_metrics .graph-row-left {
+    width: 35%;
+    padding-right: 0;
+}
+.webbpm.ervu_business_metrics .graph-row-left ervu-chart-v2 {
+    margin-top: -30px;
 }
 .webbpm.ervu_business_metrics .graph-legend-right {
-    margin-left: var(--indent-medium);
+    align-items: center;
+    width: calc(100% - min(11vw, 13.75rem) - var(--indent-medium));
+    margin-left: var(--indent-base);
+}
+.webbpm.ervu_business_metrics .graph-row-left + .graph-legend-right {
+    align-items: flex-start;
+    width: calc(100% - 35% - var(--indent-medium));
+}
+.webbpm.ervu_business_metrics .graph-legend-right text + text {
+    margin-top: var(--indent-small);
+}
+.webbpm.ervu_business_metrics .graph-legend-right .horizontal-container > text + text {
+    margin-top: 0;
+}
+.webbpm.ervu_business_metrics .graph-legend-right .text-wrap {
+    flex: 1;
+    width: 50%;
+}
+.webbpm.ervu_business_metrics .graph-legend-right .text-wrap text > .form-group > div:last-of-type {
+    display: inline-block;
+    width: auto;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+}
+.webbpm.ervu_business_metrics .graph-text-hidden {
+    height: calc(var(--size-text-primary)*1.5);
 }
 .webbpm.ervu_business_metrics [class*="graph-legend"] .legend-col-green::before {
     background-color: #a3bd9c;

frontend/src/resources/css/inbox-business-metrics.css

@@ -21,11 +21,13 @@
     --block-active-bg: linear-gradient(155deg, #1497cf 0%, #064f99 100%);
     --block-shadow: 0 3px 2px -2px rgba(0, 75, 118, 0.15);
 
-    --size-text-header: 28px;
-    --size-text-title: 20px;
-    --size-text-subtitle: 16px;
-    --size-text-primary: 14px;
-    --size-text-secondary: 10px;
+    --size-text-header: 32px;
+    --size-text-title: 24px;
+    --size-text-subtitle: 20px;
+    --size-text-subhead: 18px;
+    --size-text-primary: 16px;
+    --size-text-secondary: 14px;
+    --size-text-mini: 10px;
 
     --size-num-title: 36px;
 

frontend/src/ts/ervu_business_metrics/component/chart/model/AxisSettings.ts

@@ -2,7 +2,8 @@ import {AxisGridSettings} from "./AxisGridSettings";
 import {AxisTicksSettings} from "./AxisTicksSettings";
 
 export class AxisSettings {
+  public stacked: boolean;
   public grid: AxisGridSettings;
   public ticks: AxisTicksSettings;
   public grace: string;
-}
+}