Use same remove icon as in QuickAdd panel

client/modules/User/components/Collection.jsx

@@ -23,7 +23,7 @@ import { SketchSearchbar } from '../../IDE/components/Searchbar';
 
 const arrowUp = require('../../../images/sort-arrow-up.svg');
 const arrowDown = require('../../../images/sort-arrow-down.svg');
-const trashCan = require('../../../images/trash-can.svg');
+const removeIcon = require('../../../images/close.svg');
 
 const ShareURL = ({ value }) => {
   const [showURL, setShowURL] = React.useState(false);
@@ -75,7 +75,7 @@ class CollectionItemRowBase extends React.Component {
             className="collection-row__remove-button"
             onClick={this.handleSketchRemove}
           >
-            <InlineSVG src={trashCan} alt="Remove" />
+            <InlineSVG src={removeIcon} alt="Remove" />
           </button>
         </td>
       </tr>);

client/styles/components/_collection.scss

@@ -130,13 +130,35 @@
 }
 
 .collection-row__remove-button {
+  display: inline-block;
+  width:#{35 / $base-font-size}rem;
+  height:#{35 / $base-font-size}rem;
+  @include icon();
   @include themify() {
-    svg path {
+    // icon graphic
+    polygon {
+      fill: getThemifyVariable('table-button-color');
+    }
+
+    // icon background circle
+    path {
       fill: getThemifyVariable('table-button-background-color');
     }
 
-    &:hover svg path {
-      fill: getThemifyVariable('table-button-background-hover-color');
+    & svg {
+      width:#{35 / $base-font-size}rem;
+      height:#{35 / $base-font-size}rem;
+    }
+
+    &:hover,
+    &:focus {
+      polygon {
+        fill: getThemifyVariable('table-button-hover-color');
+      }
+
+      path {
+        fill: getThemifyVariable('table-button-background-hover-color');
+      }
     }
   }
 }