DevTools: [Persistence] introduce badged icons instead of checkmarks

third_party/WebKit/Source/devtools/front_end/ui/Icon.js

Index: third_party/WebKit/Source/devtools/front_end/ui/Icon.js
diff --git a/third_party/WebKit/Source/devtools/front_end/ui/Icon.js b/third_party/WebKit/Source/devtools/front_end/ui/Icon.js
index f7789b72b7a0d182dd10cab42d75a55863369738..f460823a1c6c2b897c28e8ebc8896e83fafa27b7 100644
--- a/third_party/WebKit/Source/devtools/front_end/ui/Icon.js
+++ b/third_party/WebKit/Source/devtools/front_end/ui/Icon.js
@@ -30,6 +30,17 @@ UI.Icon = class extends HTMLSpanElement {
   }
 
   /**
+   * @param {!Array<!UI.Icon>} icons
+   * @return {!Element}
+   */
+  static combine(icons) {
+    var container = createElementWithClass('span', 'icon-stack');
+    for (var icon of icons)
+      container.appendChild(icon);
+    return container;
+  }
+
+  /**
    * @override
    */
   createdCallback() {
@@ -108,14 +119,15 @@ UI.Icon.Descriptors = {
   'smallicon-shadow': {x: -60, y: -20, width: 10, height: 10, spritesheet: 'smallicons', isMask: true},
   'smallicon-bezier': {x: -80, y: -20, width: 10, height: 10, spritesheet: 'smallicons', isMask: true},
   'smallicon-dropdown-arrow': {x: -18, y: -96, width: 12, height: 12, spritesheet: 'largeicons', isMask: true},
-  'smallicon-checkmark': {x: -100, y: -20, width: 10, height: 10, spritesheet: 'smallicons', isMask: true},
-  'smallicon-green-checkmark': {x: -120, y: -20, width: 10, height: 10, spritesheet: 'smallicons'},
   'smallicon-triangle-right': {x: -4, y: -98, width: 10, height: 8, spritesheet: 'largeicons', isMask: true},
   'smallicon-triangle-bottom': {x: -20, y: -98, width: 10, height: 8, spritesheet: 'largeicons', isMask: true},
   'smallicon-arrow-in-circle': {x: -10, y: -127, width: 11, height: 11, spritesheet: 'largeicons', isMask: true},
   'smallicon-cross': {x: -177, y: -98, width: 10, height: 10, spritesheet: 'largeicons'},
   'smallicon-inline-breakpoint': {x: -140, y: -20, width: 10, height: 10, spritesheet: 'smallicons'},
   'smallicon-inline-breakpoint-conditional': {x: -160, y: -20, width: 10, height: 10, spritesheet: 'smallicons'},
+  'smallicon-file': {x: -64, y: -24, width: 10, height: 14, spritesheet: 'largeicons'},
+  'smallicon-file-sync': {x: -74, y: -24, width: 12, height: 14, spritesheet: 'largeicons'},
+  'smallicon-badge-sync': {x: -84, y: -24, width: 12, height: 14, spritesheet: 'largeicons'},
 
   'largeicon-longclick-triangle': {x: -290, y: -46, width: 28, height: 24, spritesheet: 'largeicons', isMask: true},
   'largeicon-menu': {x: -192, y: -24, width: 28, height: 24, spritesheet: 'largeicons', isMask: true},
@@ -208,6 +220,9 @@ UI.Icon.Descriptors = {
     transform: 'translate(4px, 1px) rotate(-90deg)'
   },
   'largeicon-navigator-file': {x: -224, y: -72, width: 32, height: 24, spritesheet: 'largeicons', isMask: true},
+  'largeicon-navigator-file-synced': {x: -160, y: -24, width: 32, height: 24, spritesheet: 'largeicons', isMask: true},
+  'badge-navigator-file-synced': {x: -288, y: -72, width: 32, height: 24, spritesheet: 'largeicons'},
+  'badge-navigator-file-sync-error': {x: -320, y: -72, width: 32, height: 24, spritesheet: 'largeicons'},

[dgozman, 2016/12/21 02:44:40]

Remove.

   'largeicon-navigator-folder': {x: -64, y: -120, width: 32, height: 24, spritesheet: 'largeicons', isMask: true},
   'largeicon-navigator-domain': {x: -160, y: -144, width: 32, height: 24, spritesheet: 'largeicons', isMask: true},
   'largeicon-navigator-frame': {x: -256, y: -144, width: 32, height: 24, spritesheet: 'largeicons', isMask: true},