From ad35a930c6d07074fb1ef6844f7d4c431a8cdaba Mon Sep 17 00:00:00 2001
From: darshanr0107 <darshan@mermaidchart.com>
Date: Wed, 3 Sep 2025 14:13:40 +0530
Subject: [PATCH] fix: preserve annotations and adjust styling for clarity

on-behalf-of: @Mermaid-Chart <hello@mermaidchart.com>
---
 .../mermaid/src/diagrams/class/shapeUtil.ts   | 26 +++++++++++++++----
 packages/mermaid/src/diagrams/class/styles.js |  2 +-
 2 files changed, 22 insertions(+), 6 deletions(-)

diff --git a/packages/mermaid/src/diagrams/class/shapeUtil.ts b/packages/mermaid/src/diagrams/class/shapeUtil.ts
index 7dd1e8eec..eedeacdac 100644
--- a/packages/mermaid/src/diagrams/class/shapeUtil.ts
+++ b/packages/mermaid/src/diagrams/class/shapeUtil.ts
@@ -36,16 +36,31 @@ export async function textHelper<T extends SVGGraphicsElement>(
 
   annotationGroup = shapeSvg.insert('g').attr('class', 'annotation-group text');
   if (node.annotations.length > 0) {
-    await addText(annotationGroup, { text: `` } as unknown as ClassMember, 0);
-
+    const annotation = node.annotations[0].toLowerCase();
+    let isSupported = false;
+    switch (annotation) {
+      case 'interface':
+      case 'abstract':
+      case 'enumeration':
+        isSupported = true;
+        break;
+    }
+    if (!isSupported) {
+      await addText(
+        annotationGroup,
+        { text: `«${node.annotations[0]}»` } as unknown as ClassMember,
+        0,
+        []
+      );
+      annotationGroup.style('opacity', '1');
+    }
     const annotationGroupBBox = annotationGroup.node()!.getBBox();
     annotationGroupHeight = annotationGroupBBox.height;
   }
-
   labelGroup = shapeSvg.insert('g').attr('class', 'label-group text');
 
   // Determine styling based on annotations
-  let labelStyles = ['font-weight: bolder']; // Default bold style
+  let labelStyles = [''];
   let labelClass = '';
   if (node.annotations && node.annotations.length > 0) {
     const annotation = node.annotations[0].toLowerCase();
@@ -63,7 +78,8 @@ export async function textHelper<T extends SVGGraphicsElement>(
         labelStyles = [];
         break;
       default:
-        labelStyles = ['font-weight: bolder'];
+        labelClass = '';
+        labelStyles = [];
         break;
     }
   }
diff --git a/packages/mermaid/src/diagrams/class/styles.js b/packages/mermaid/src/diagrams/class/styles.js
index dcdda99ce..c73efe06d 100644
--- a/packages/mermaid/src/diagrams/class/styles.js
+++ b/packages/mermaid/src/diagrams/class/styles.js
@@ -31,7 +31,7 @@ const getStyles = (options) =>
 }
 
 .classTitle {
-  font-weight: bolder;
+  font-weight: normal;
 }
 .node rect,
   .node circle,