From 46adfeda7bd45a8d3167ce9a6265a3789c2e08cb Mon Sep 17 00:00:00 2001
From: Starla Huang <starla_huang@epam.com>
Date: Tue, 9 Jan 2024 15:12:51 +0800
Subject: [PATCH] #3545 follow the latest design

---
 .../ketcher-core/src/application/editor/tools/Bond.ts  |  2 ++
 .../render/renderers/BaseMonomerRenderer.ts            | 10 +---------
 .../application/render/renderers/PeptideRenderer.ts    |  4 ++--
 .../src/application/render/renderers/SugarRenderer.ts  |  4 ++--
 4 files changed, 7 insertions(+), 13 deletions(-)

diff --git a/packages/ketcher-core/src/application/editor/tools/Bond.ts b/packages/ketcher-core/src/application/editor/tools/Bond.ts
index e0bf66b11a..398cbf6bde 100644
--- a/packages/ketcher-core/src/application/editor/tools/Bond.ts
+++ b/packages/ketcher-core/src/application/editor/tools/Bond.ts
@@ -101,6 +101,7 @@ class PolymerBond implements BaseTool {
       this.editor.drawingEntitiesManager.hidePolymerBondInformation(
         renderer.polymerBond,
       );
+    this.editor.renderersContainer.markForRecalculateBegin();
     this.editor.renderersContainer.update(modelChanges);
   }
 
@@ -112,6 +113,7 @@ class PolymerBond implements BaseTool {
       this.editor.drawingEntitiesManager.showPolymerBondInformation(
         renderer.polymerBond,
       );
+    this.editor.renderersContainer.markForRecalculateBegin();
     this.editor.renderersContainer.update(modelChanges);
   }
 
diff --git a/packages/ketcher-core/src/application/render/renderers/BaseMonomerRenderer.ts b/packages/ketcher-core/src/application/render/renderers/BaseMonomerRenderer.ts
index b67a15ffed..6081bb846a 100644
--- a/packages/ketcher-core/src/application/render/renderers/BaseMonomerRenderer.ts
+++ b/packages/ketcher-core/src/application/render/renderers/BaseMonomerRenderer.ts
@@ -368,13 +368,6 @@ export abstract class BaseMonomerRenderer extends BaseRenderer {
     y: number;
   } | void;
 
-  protected get beginningElementColor() {
-    if (this.monomer.hovered) {
-      return '#0097A8';
-    }
-    return '#7C7C7F';
-  }
-
   public setEnumeration(enumeration: number | null) {
     this.enumeration = enumeration;
   }
@@ -410,11 +403,11 @@ export abstract class BaseMonomerRenderer extends BaseRenderer {
     this.beginningElement = this.rootElement
       .append('text')
       .attr('direction', 'rtl')
+      .attr('fill', '#0097A8')
       .attr('font-size', '12px')
       .attr('line-height', '14px')
       .attr('font-weight', '500')
       .attr('text-align', 'right')
-      .attr('fill', this.beginningElementColor)
       .attr('x', this.beginningElementPosition.x)
       .attr('y', this.beginningElementPosition.y)
       .text(this.beginning);
@@ -424,7 +417,6 @@ export abstract class BaseMonomerRenderer extends BaseRenderer {
     assert(this.beginningElement);
     assert(this.beginningElementPosition);
     this.beginningElement
-      .attr('fill', this.beginningElementColor)
       .attr('x', this.beginningElementPosition.x)
       .attr('y', this.beginningElementPosition.y)
       .text(this.beginning);
diff --git a/packages/ketcher-core/src/application/render/renderers/PeptideRenderer.ts b/packages/ketcher-core/src/application/render/renderers/PeptideRenderer.ts
index 6bc6d41ab5..b5abb28040 100644
--- a/packages/ketcher-core/src/application/render/renderers/PeptideRenderer.ts
+++ b/packages/ketcher-core/src/application/render/renderers/PeptideRenderer.ts
@@ -43,8 +43,8 @@ export class PeptideRenderer extends BaseMonomerRenderer {
 
   protected get beginningElementPosition() {
     if (this.monomer.hovered) {
-      return { x: 0, y: -29 };
+      return { x: 2, y: -30 };
     }
-    return { x: 0, y: -2 };
+    return { x: 2, y: -1 };
   }
 }
diff --git a/packages/ketcher-core/src/application/render/renderers/SugarRenderer.ts b/packages/ketcher-core/src/application/render/renderers/SugarRenderer.ts
index f338f79410..b3d0359d02 100644
--- a/packages/ketcher-core/src/application/render/renderers/SugarRenderer.ts
+++ b/packages/ketcher-core/src/application/render/renderers/SugarRenderer.ts
@@ -41,8 +41,8 @@ export class SugarRenderer extends BaseMonomerRenderer {
 
   protected get beginningElementPosition() {
     if (this.monomer.hovered) {
-      return { x: 0, y: -29 };
+      return { x: -6, y: -30 };
     }
-    return { x: -4, y: -2 };
+    return { x: -2, y: -1 };
   }
 }