From faaefd0fa8454b2c7f2a2caf5dcdef48592055cc Mon Sep 17 00:00:00 2001
From: silverwind <me@silverwind.io>
Date: Thu, 2 Apr 2026 21:53:14 +0200
Subject: [PATCH] Replace escape warning emoji with octicon-alert-fill SVG mask
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Use a CSS mask with octicon-alert-fill instead of the ⚠️ emoji for
the toggle-escape-button. This gives consistent rendering across
platforms and better vertical alignment with code lines.

Co-Authored-By: Claude (Opus 4.6) <noreply@anthropic.com>
---
 web_src/css/base.css   |  1 +
 web_src/css/review.css | 19 +++++++++++++++----
 2 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/web_src/css/base.css b/web_src/css/base.css
index b004c5724f..a8d9dea2a2 100644
--- a/web_src/css/base.css
+++ b/web_src/css/base.css
@@ -17,6 +17,7 @@
   /* images */
   --checkbox-mask-checked: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="9" viewBox="0 0 12 9"><path fill-rule="evenodd" d="M11.78.22a.75.75 0 0 1 0 1.061L4.52 8.541a.75.75 0 0 1-1.062 0L.202 5.285a.75.75 0 0 1 1.061-1.061l2.725 2.723L10.718.22a.75.75 0 0 1 1.062 0"/></svg>');
   --checkbox-mask-indeterminate: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="2" viewBox="0 0 10 2"><path fill-rule="evenodd" d="M0 1a1 1 0 0 1 1-1h8a1 1 0 1 1 0 2H1a1 1 0 0 1-1-1" clip-rule="evenodd"/></svg>');
+  --octicon-alert-fill: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path d="M6.457 1.047c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0 1 14.082 15H1.918a1.75 1.75 0 0 1-1.543-2.575ZM8 5a.75.75 0 0 0-.75.75v2.5a.75.75 0 0 0 1.5 0v-2.5A.75.75 0 0 0 8 5Zm1 6a1 1 0 1 0-2 0 1 1 0 0 0 2 0Z"/></svg>');
   --octicon-chevron-right: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path d="M6.22 3.22a.75.75 0 0 1 1.06 0l4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L9.94 8 6.22 4.28a.75.75 0 0 1 0-1.06Z"></path></svg>');
   --octicon-x: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.75.75 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.75.75 0 0 1-.734-.215L8 9.06l-3.22 3.22a.75.75 0 0 1-1.042-.018.75.75 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06"/></svg>');
   --select-arrows: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path d="m4.074 9.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.043 9H4.251a.25.25 0 0 0-.177.427m0-1.957L7.47 4.073a.25.25 0 0 1 .354 0L11.22 7.47a.25.25 0 0 1-.177.426H4.251a.25.25 0 0 1-.177-.426"/></svg>');
diff --git a/web_src/css/review.css b/web_src/css/review.css
index 16103f8d8f..8fb5e1e29a 100644
--- a/web_src/css/review.css
+++ b/web_src/css/review.css
@@ -15,12 +15,23 @@
   transform: scale(1.1);
 }
 
+.lines-escape .toggle-escape-button {
+  padding: 2px;
+  transform: translateY(-1px);
+}
+
 .lines-escape .toggle-escape-button::before {
   visibility: visible;
-  content: "⚠️";
-  font-family: var(--fonts-emoji);
-  padding: 0 2px;
-  color: var(--color-red);
+  content: "";
+  display: inline-block;
+  width: 14px;
+  height: 14px;
+  vertical-align: middle;
+  background-color: var(--color-yellow);
+  mask-image: var(--octicon-alert-fill);
+  -webkit-mask-image: var(--octicon-alert-fill);
+  mask-size: contain;
+  -webkit-mask-size: contain;
 }
 
 .repository .diff-file-box .code-diff td.lines-escape {