change colors for ace_snippet-marker (#5474)

* change colors for ace_snippet-marker * fix screen reader reading snippets as their insert value * remove border
ajaxorg · Jan 29, 2024 · 5914dc5 · 5914dc5
1 parent c807f9e
commit 5914dc5
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 1 deletion.
diff --git a/src/autocomplete/popup.js b/src/autocomplete/popup.js
@@ -153,7 +153,7 @@ class AcePopup {
                 el.setAttribute("aria-activedescendant", ariaId);
                 selected.setAttribute("role", optionAriaRole);
                 selected.setAttribute("aria-roledescription", nls("item"));
-                selected.setAttribute("aria-label", popup.getData(row).value);
+                selected.setAttribute("aria-label", popup.getData(row).caption || popup.getData(row).value);
                 selected.setAttribute("aria-setsize", popup.data.length);
                 selected.setAttribute("aria-posinset", row + 1);
                 selected.setAttribute("aria-describedby", "doc-tooltip");

diff --git a/src/theme/cloud_editor-css.js b/src/theme/cloud_editor-css.js
@@ -181,6 +181,10 @@ module.exports = `
 .ace-cloud_editor .ace_tooltip.ace_hover-tooltip:focus > div {
     outline: 1px solid #0073bb;
 }
+.ace-cloud_editor .ace_snippet-marker {
+    background-color: #CED6E0;
+    border: 0;
+}
 
 .ace-cloud_editor.ace_editor.ace_autocomplete .ace_marker-layer .ace_active-line {
     background-color: #f2f3f3;

diff --git a/src/theme/cloud_editor_dark-css.js b/src/theme/cloud_editor_dark-css.js
@@ -184,6 +184,10 @@ module.exports = `
 .ace-cloud_editor_dark .ace_tooltip.ace_hover-tooltip:focus > div {
     outline: 1px solid #44b9d6;
 }
+.ace-cloud_editor_dark .ace_snippet-marker {
+    background-color: #434650;
+    border: 0;
+}
 
 .ace-cloud_editor_dark.ace_dark.ace_editor.ace_autocomplete .ace_marker-layer .ace_active-line {
     background-color: #272A30;