[sources] Update the "Disable breakpoints" icon to GM3.
Screenshot: https://imgur.com/409qntT.png
Bug: chromium:1427397, chromium:1428917
Change-Id: I0f6f0b4717e7d100503d3cb52778dbf1daa41772
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/4381793
Commit-Queue: Kateryna Prokopenko <[email protected]>
Reviewed-by: Kateryna Prokopenko <[email protected]>
Auto-Submit: Benedikt Meurer <[email protected]>
diff --git a/front_end/Images/src/breakpoint-crossed-filled.svg b/front_end/Images/src/breakpoint-crossed-filled.svg
new file mode 100644
index 0000000..3ecc574
--- /dev/null
+++ b/front_end/Images/src/breakpoint-crossed-filled.svg
@@ -0,0 +1 @@
+<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M17.06 17 3 2.94 1.94 4l2 2H3.5A1.5 1.5 0 0 0 2 7.5v5A1.5 1.5 0 0 0 3.5 14h8.44L16 18.06 17.06 17Zm.94-7-2.72 3.108L8.172 6h5.647a1.5 1.5 0 0 1 1.13.512L18 10Z" fill="#000"/></svg>
\ No newline at end of file
diff --git a/front_end/Images/src/breakpoint-crossed.svg b/front_end/Images/src/breakpoint-crossed.svg
new file mode 100644
index 0000000..fcf8882
--- /dev/null
+++ b/front_end/Images/src/breakpoint-crossed.svg
@@ -0,0 +1 @@
+<svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M17.06 17 3 2.94 1.94 4l2 2H3.5A1.5 1.5 0 0 0 2 7.5v5A1.5 1.5 0 0 0 3.5 14h8.44L16 18.06 17.06 17Zm-6.62-4.5-5-5H3.5v5h6.94ZM18 10l-2.72 3.108-1.063-1.063L16.007 10l-2.188-2.5H9.672L8.172 6h5.647a1.5 1.5 0 0 1 1.13.512L18 10Z" fill="#000"/></svg>
\ No newline at end of file
diff --git a/front_end/panels/sources/sources-meta.ts b/front_end/panels/sources/sources-meta.ts
index c364889..84d68e0 100644
--- a/front_end/panels/sources/sources-meta.ts
+++ b/front_end/panels/sources/sources-meta.ts
@@ -721,7 +721,8 @@
UI.ActionRegistration.registerActionExtension({
category: UI.ActionRegistration.ActionCategory.DEBUGGER,
actionId: 'debugger.toggle-breakpoints-active',
- iconClass: UI.ActionRegistration.IconClass.LARGE_ICON_DEACTIVATE_BREAKPOINTS,
+ iconClass: UI.ActionRegistration.IconClass.BREAKPOINT_CROSSED,
+ toggledIconClass: UI.ActionRegistration.IconClass.BREAKPOINT_CROSSED_FILLED,
toggleable: true,
async loadActionDelegate() {
const Sources = await loadSourcesModule();
diff --git a/front_end/ui/legacy/ActionRegistration.ts b/front_end/ui/legacy/ActionRegistration.ts
index 1ff124e..3dfd41f 100644
--- a/front_end/ui/legacy/ActionRegistration.ts
+++ b/front_end/ui/legacy/ActionRegistration.ts
@@ -240,7 +240,8 @@
LARGE_ICON_STEP_INTO = 'step-into',
LARGE_ICON_STEP = 'step',
LARGE_ICON_STEP_OUT = 'step-out',
- LARGE_ICON_DEACTIVATE_BREAKPOINTS = 'largeicon-deactivate-breakpoints',
+ BREAKPOINT_CROSSED_FILLED = 'breakpoint-crossed-filled',
+ BREAKPOINT_CROSSED = 'breakpoint-crossed',
LARGE_ICON_ADD = 'largeicon-add',
}
diff --git a/front_end/ui/legacy/Icon.ts b/front_end/ui/legacy/Icon.ts
index 7e693c6..fff1ff7 100644
--- a/front_end/ui/legacy/Icon.ts
+++ b/front_end/ui/legacy/Icon.ts
@@ -99,6 +99,8 @@
['bottom-panel-close', {cellWidth: 20, cellHeight: 20, padding: 0}],
['bottom-panel-open', {cellWidth: 20, cellHeight: 20, padding: 0}],
+ ['breakpoint-crossed-filled', {cellWidth: 20, cellHeight: 20, padding: 0}],
+ ['breakpoint-crossed', {cellWidth: 20, cellHeight: 20, padding: 0}],
['chevron-double-right', {cellWidth: 20, cellHeight: 20, padding: 0}],
['cross', {cellWidth: 20, cellHeight: 20, padding: 0}],
['database', {cellWidth: 20, cellHeight: 20, padding: 0}],
@@ -213,7 +215,6 @@
['largeicon-checkmark', {position: 'c8', spritesheet: 'largeicons', isMask: true}],
['largeicon-clear', {position: 'a6', spritesheet: 'largeicons', isMask: true}],
['largeicon-copy', {position: 'b6', spritesheet: 'largeicons', isMask: true}],
- ['largeicon-deactivate-breakpoints', {position: 'c6', spritesheet: 'largeicons', isMask: true}],
['largeicon-delete', {position: 'd9', spritesheet: 'largeicons', isMask: true}],
['largeicon-delete-filter', {position: 'i5', spritesheet: 'largeicons', isMask: true}],
['largeicon-delete-list', {position: 'i6', spritesheet: 'largeicons', isMask: true}],
@@ -272,6 +273,8 @@
['bottom-panel-close', {position: 'a1', spritesheet: 'bottom-panel-close', isMask: true}],
['bottom-panel-open', {position: 'a1', spritesheet: 'bottom-panel-open', isMask: true}],
+ ['breakpoint-crossed-filled', {position: 'a1', spritesheet: 'breakpoint-crossed-filled', isMask: true}],
+ ['breakpoint-crossed', {position: 'a1', spritesheet: 'breakpoint-crossed', isMask: true}],
['chevron-double-right', {position: 'a1', spritesheet: 'chevron-double-right', isMask: true}],
['cross', {position: 'a1', spritesheet: 'cross', isMask: true}],
['database', {position: 'a1', spritesheet: 'database', isMask: true}],
diff --git a/front_end/ui/legacy/inspectorCommon.css b/front_end/ui/legacy/inspectorCommon.css
index 77516c4..fd3ade6 100644
--- a/front_end/ui/legacy/inspectorCommon.css
+++ b/front_end/ui/legacy/inspectorCommon.css
@@ -552,6 +552,14 @@
-webkit-mask-image: var(--image-file-bottom-panel-open);
}
+.spritesheet-breakpoint-crossed-filled.icon-mask {
+ -webkit-mask-image: var(--image-file-breakpoint-crossed-filled);
+}
+
+.spritesheet-breakpoint-crossed.icon-mask {
+ -webkit-mask-image: var(--image-file-breakpoint-crossed);
+}
+
.spritesheet-cross.icon-mask {
-webkit-mask-image: var(--image-file-cross);
}
