Replace FA minus-circle with SVG close

app/assets/stylesheets/fontawesome_custom.scss

@@ -278,10 +278,6 @@
   content: '\f0a3';
 }
 
-.fa-minus-circle::before {
-  content: '\f056';
-}
-
 .fa-bitbucket::before {
   content: '\f171';
 }

app/assets/stylesheets/framework/ci_variable_list.scss

@@ -86,7 +86,6 @@
   height: $input-height;
   padding: 0;
   background: transparent;
-  border: 0;
   color: $gl-text-color-secondary;
 
   &:hover,

app/views/ci/variables/_url_query_variable_row.html.haml

@@ -24,5 +24,5 @@
         name: value_input_name,
         placeholder: s_('CiVariables|Input variable value') }
         = value
-    %button.js-row-remove-button.ci-variable-row-remove-button.table-section.section-5.border-top-0{ type: 'button', 'aria-label': s_('CiVariables|Remove variable row') }
-      = icon('minus-circle')
+    %button.btn.btn-svg.btn-item-remove.js-row-remove-button.ci-variable-row-remove-button.table-section{ type: 'button', 'aria-label': s_('CiVariables|Remove variable row') }
+      = sprite_icon('close')

app/views/ci/variables/_variable_row.html.haml

@@ -60,5 +60,5 @@
             value: is_masked,
             data: { default: is_masked_default.to_s } }
       = render_if_exists 'ci/variables/environment_scope', form_field: form_field, variable: variable
-    %button.js-row-remove-button.ci-variable-row-remove-button.table-section.section-5.border-top-0{ type: 'button', 'aria-label': s_('CiVariables|Remove variable row') }
-      = icon('minus-circle')
+    %button.btn.btn-svg.btn-item-remove.js-row-remove-button.ci-variable-row-remove-button.table-section{ type: 'button', 'aria-label': s_('CiVariables|Remove variable row') }
+      = sprite_icon('close')