From 5ed2dfbf26d626174281fede8b5c9c97bf22c4bc Mon Sep 17 00:00:00 2001
From: Calixte Denizet <calixte.denizet@gmail.com>
Date: Mon, 25 Aug 2025 16:35:58 +0200
Subject: [PATCH] [Editor] Change the icon for inline comments

---
 web/annotation_editor_layer_builder.css  |  5 ++---
 web/annotation_layer_builder.css         |  1 -
 web/comment_manager.css                  |  2 +-
 web/images/comment-editButton.svg        | 11 ++++++++---
 web/images/comment-inline-editButton.svg |  3 ---
 web/viewer.css                           |  1 +
 6 files changed, 12 insertions(+), 11 deletions(-)
 delete mode 100644 web/images/comment-inline-editButton.svg

diff --git a/web/annotation_editor_layer_builder.css b/web/annotation_editor_layer_builder.css
index ce13d8022..209a35d0c 100644
--- a/web/annotation_editor_layer_builder.css
+++ b/web/annotation_editor_layer_builder.css
@@ -230,7 +230,6 @@
     --editor-toolbar-delete-image: url(images/editor-toolbar-delete.svg);
     --editor-toolbar-bg-color: light-dark(#f0f0f4, #2b2a33);
     --editor-toolbar-highlight-image: url(images/toolbarButton-editorHighlight.svg);
-    --editor-toolbar-comment-edit-image: url(images/comment-editButton.svg);
     --editor-toolbar-fg-color: light-dark(#2e2e56, #fbfbfe);
     --editor-toolbar-border-color: #8f8f9d;
     --editor-toolbar-hover-border-color: var(--editor-toolbar-border-color);
@@ -343,7 +342,7 @@
         }
 
         &.commentButton::before {
-          mask-image: var(--editor-toolbar-comment-edit-image);
+          mask-image: var(--comment-edit-button-icon);
         }
 
         &.deleteButton::before {
@@ -489,7 +488,7 @@
 
         &::before {
           content: "";
-          mask-image: var(--editor-toolbar-comment-edit-image);
+          mask-image: var(--comment-edit-button-icon);
           mask-repeat: no-repeat;
           mask-position: center;
           display: inline-block;
diff --git a/web/annotation_layer_builder.css b/web/annotation_layer_builder.css
index 95c33f4a2..c1c2a8d54 100644
--- a/web/annotation_layer_builder.css
+++ b/web/annotation_layer_builder.css
@@ -17,7 +17,6 @@
   color-scheme: only light;
 
   --annotation-unfocused-field-background: url("data:image/svg+xml;charset=UTF-8,<svg width='1px' height='1px' xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' style='fill:rgba(0, 54, 255, 0.13);'/></svg>");
-  --comment-edit-image: url(images/comment-inline-editButton.svg);
   --input-focus-border-color: Highlight;
   --input-focus-outline: 1px solid Canvas;
   --input-unfocused-border-color: transparent;
diff --git a/web/comment_manager.css b/web/comment_manager.css
index 698ae494c..87410afe8 100644
--- a/web/comment_manager.css
+++ b/web/comment_manager.css
@@ -310,7 +310,7 @@
       height: 100%;
       mask-repeat: no-repeat;
       mask-size: cover;
-      mask-image: var(--comment-edit-image);
+      mask-image: var(--comment-edit-button-icon);
       background-color: var(--comment-button-fg);
       margin: 0;
       padding: 0;
diff --git a/web/images/comment-editButton.svg b/web/images/comment-editButton.svg
index fdd8f6d4e..9b32158e4 100644
--- a/web/images/comment-editButton.svg
+++ b/web/images/comment-editButton.svg
@@ -1,3 +1,8 @@
-<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M13.4686 2.68492L12.9276 2.14392H2.40626L1.86526 2.68492V10.1102L2.40626 10.6512H6.71147C6.92794 10.6511 7.14165 10.7265 7.31497 10.8571L10.4357 13.3978V11.2299C10.4357 11.1049 10.485 10.9851 10.5795 10.8906C10.674 10.7961 10.7938 10.7468 10.9188 10.7468H12.9276L13.4686 10.2058V2.68492ZM2.52747 0.805556H12.7181C13.2412 0.805556 13.7478 1.01961 14.1371 1.40889C14.5264 1.79817 14.7405 2.30481 14.7405 2.82792V9.82792C14.7405 10.351 14.5264 10.8577 14.1371 11.247C13.7478 11.6363 13.2412 11.8503 12.7181 11.8503H11.4686V14.2055H10.4357L6.62747 11.8503H2.52747C2.00436 11.8503 1.49772 11.6363 1.10844 11.247C0.719162 10.8577 0.505107 10.351 0.505107 9.82792V2.82792C0.505107 2.30481 0.719162 1.79817 1.10844 1.40889C1.49772 1.01961 2.00436 0.805556 2.52747 0.805556ZM10.824 5.12016H4.46259C4.30418 5.12016 4.15436 5.05707 4.04541 4.94812C3.93646 4.83917 3.87337 4.68935 3.87337 4.53094C3.87337 4.37253 3.93646 4.22271 4.04541 4.11376C4.15436 4.00481 4.30418 3.94172 4.46259 3.94172H10.824C10.9824 3.94172 11.1322 4.00481 11.2412 4.11376C11.3501 4.22271 11.4132 4.37253 11.4132 4.53094C11.4132 4.68935 11.3501 4.83917 11.2412 4.94812C11.1322 5.05707 10.9824 5.12016 10.824 5.12016ZM8.82403 8.16137H4.46259C4.30418 8.16137 4.15436 8.09828 4.04541 7.98933C3.93646 7.88038 3.87337 7.73056 3.87337 7.57215C3.87337 7.41374 3.93646 7.26392 4.04541 7.15497C4.15436 7.04602 4.30418 6.98293 4.46259 6.98293H8.82403C8.98244 6.98293 9.13226 7.04602 9.24121 7.15497C9.35016 7.26392 9.41325 7.41374 9.41325 7.57215C9.41325 7.73056 9.35016 7.88038 9.24121 7.98933C9.13226 8.09828 8.98244 8.16137 8.82403 8.16137Z" fill="black"/>
-</svg>
+<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <g>
+    <path d="M10.75 7.5H12.25V6H10.75V7.5Z" fill="black"/>
+    <path d="M7.5 7.5H9V6H7.5V7.5Z" fill="black"/>
+    <path d="M4.25 7.5H5.75V6H4.25V7.5Z" fill="black"/>
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M2 0.5C0.895786 0.5 0 1.39579 0 2.5V11C0 12.1042 0.895786 13 2 13H3V15.75C3 16.0405 3.16778 16.305 3.43066 16.4287C3.6937 16.5523 4.00473 16.5126 4.22852 16.3271L8.27051 12.9775L13.9941 12.9961C15.1007 12.9991 15.9999 12.1033 16 10.9961V2.5C16 1.39579 15.1042 0.5 14 0.5H2ZM14 2C14.2758 2 14.5 2.22421 14.5 2.5V10.9961C14.4999 11.2727 14.2753 11.4969 13.998 11.4961L8.00195 11.4775L7.87207 11.4893C7.74389 11.5115 7.62281 11.5664 7.52148 11.6504L4.5 14.1543V12.25C4.5 11.8358 4.16421 11.5 3.75 11.5H2C1.72421 11.5 1.5 11.2758 1.5 11V2.5C1.5 2.22421 1.72421 2 2 2H14Z" fill="black"/>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/web/images/comment-inline-editButton.svg b/web/images/comment-inline-editButton.svg
deleted file mode 100644
index f33e29151..000000000
--- a/web/images/comment-inline-editButton.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M2.25 2.85098L2.85 2.25098H13.15L13.75 2.85098V10.151L13.15 10.751H8.913C8.68584 10.7509 8.46541 10.8281 8.288 10.97L5.25 13.4V11.251C5.25 11.1184 5.19732 10.9912 5.10355 10.8974C5.00979 10.8037 4.88261 10.751 4.75 10.751H2.85L2.25 10.151V2.85098ZM13 1.00098H3C2.46957 1.00098 1.96086 1.21169 1.58579 1.58676C1.21071 1.96184 1 2.47054 1 3.00098V10.001C1 10.5314 1.21071 11.0401 1.58579 11.4152C1.96086 11.7903 2.46957 12.001 3 12.001H4V15.001H5.25L9 12.001H13C13.5304 12.001 14.0391 11.7903 14.4142 11.4152C14.7893 11.0401 15 10.5314 15 10.001V3.00098C15 2.47054 14.7893 1.96184 14.4142 1.58676C14.0391 1.21169 13.5304 1.00098 13 1.00098ZM4.875 5.25098H11.125C11.2908 5.25098 11.4497 5.18513 11.5669 5.06792C11.6842 4.95071 11.75 4.79174 11.75 4.62598C11.75 4.46022 11.6842 4.30124 11.5669 4.18403C11.4497 4.06682 11.2908 4.00098 11.125 4.00098H4.875C4.70924 4.00098 4.55027 4.06682 4.43306 4.18403C4.31585 4.30124 4.25 4.46022 4.25 4.62598C4.25 4.79174 4.31585 4.95071 4.43306 5.06792C4.55027 5.18513 4.70924 5.25098 4.875 5.25098ZM6.875 8.25098H11.125C11.2908 8.25098 11.4497 8.18513 11.5669 8.06792C11.6842 7.95071 11.75 7.79174 11.75 7.62598C11.75 7.46022 11.6842 7.30125 11.5669 7.18403C11.4497 7.06682 11.2908 7.00098 11.125 7.00098H6.875C6.70924 7.00098 6.55027 7.06682 6.43306 7.18403C6.31585 7.30125 6.25 7.46022 6.25 7.62598C6.25 7.79174 6.31585 7.95071 6.43306 8.06792C6.55027 8.18513 6.70924 8.25098 6.875 8.25098Z" fill="black"/>
-</svg>
diff --git a/web/viewer.css b/web/viewer.css
index daf980b78..ec44fa98d 100644
--- a/web/viewer.css
+++ b/web/viewer.css
@@ -144,6 +144,7 @@
   );
   --secondaryToolbarButton-documentProperties-icon: url(images/secondaryToolbarButton-documentProperties.svg);
   --editorParams-stampAddImage-icon: url(images/toolbarButton-zoomIn.svg);
+  --comment-edit-button-icon: url(images/comment-editButton.svg);
 }
 
 :root:dir(rtl) {