DevTools: convert datagrid and network waterfall sort icons to UI.Icon

third_party/WebKit/Source/devtools/front_end/network/networkLogView.css

 /*
  * Copyright (C) 2013 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 358 matching lines @@
     font-size: 11px;
 }
 
 .network-waterfall-header .sort-order-icon-container {
     position: absolute;
     top: 1px;
     right: 0;
     bottom: 1px;
     display: flex;
     align-items: center;
-    padding-left: 0px;
 }
 
 .network-waterfall-header .sort-order-icon {
+    align-items: center;
     margin-right: 4px;
-    background-image: url(Images/toolbarButtonGlyphs.png);
-    background-size: 352px 168px;
-    opacity: 0.5;
-    width: 8px;
-    height: 7px;
-    display: none;

[dgozman, 2017/01/24 20:23:05]

This means the icon is visible all the time, which should not be the case when
sorting by name.

[lushnikov, 2017/01/25 00:06:12]

Yes, it is visible all the time on Canary. I updated the CL so that it gets
hidden via the:

     this._waterfallColumnSortIcon.setIconType('');

-}
-
-.network-waterfall-header .sort-ascending.sort-order-icon {
-    display: block;
-    background-position: -4px -111px;
-}
-
-.network-waterfall-header .sort-descending.sort-order-icon {
-    display: block;
-    background-position: -20px -99px;
-}
+}