Commit 225c1c12 authored by Filipa Lacerda's avatar Filipa Lacerda

Replace pipeline's action icons with svg

parent 9e70ff34
......@@ -3,6 +3,7 @@
import eventHub from '../event_hub';
import loadingIcon from '../../vue_shared/components/loading_icon.vue';
import icon from '../../vue_shared/components/icon.vue';
import tooltip from '../../vue_shared/directives/tooltip';
export default {
......@@ -11,6 +12,7 @@
},
components: {
loadingIcon,
icon,
},
props: {
endpoint: {
......@@ -41,9 +43,6 @@
};
},
computed: {
iconClass() {
return `fa fa-${this.icon}`;
},
buttonClass() {
return `btn ${this.cssClass}`;
},
......@@ -76,10 +75,9 @@
data-container="body"
data-placement="top"
:disabled="isLoading">
<i
:class="iconClass"
aria-hidden="true">
</i>
<icon
:name="icon"
/>
<loading-icon v-if="isLoading" />
</button>
</template>
<script>
import playIconSvg from 'icons/_icon_play.svg';
import eventHub from '../event_hub';
import loadingIcon from '../../vue_shared/components/loading_icon.vue';
import icon from '../../vue_shared/components/icon.vue';
import tooltip from '../../vue_shared/directives/tooltip';
export default {
......@@ -10,6 +10,7 @@
},
components: {
loadingIcon,
icon,
},
props: {
actions: {
......@@ -19,7 +20,6 @@
},
data() {
return {
playIconSvg,
isLoading: false,
};
},
......@@ -52,7 +52,9 @@
aria-label="Manual job"
:disabled="isLoading"
>
<span v-html="playIconSvg"></span>
<icon
name="play"
/>
<i
class="fa fa-caret-down"
aria-hidden="true">
......
......@@ -312,7 +312,7 @@
:endpoint="pipeline.cancel_path"
css-class="js-pipelines-cancel-button btn-remove"
title="Cancel"
icon="remove"
icon="close"
confirm-action-message="Are you sure you want to cancel this pipeline?"
/>
</div>
......
......@@ -69,13 +69,6 @@
border-color: $border-white-normal;
}
}
.btn {
.icon-play {
height: 13px;
width: 12px;
}
}
}
.btn .text-center {
......
......@@ -13,7 +13,7 @@ describe('Pipelines Async Button', () => {
propsData: {
endpoint: '/foo',
title: 'Foo',
icon: 'fa fa-foo',
icon: 'repeat',
cssClass: 'bar',
},
}).$mount();
......@@ -23,8 +23,8 @@ describe('Pipelines Async Button', () => {
expect(component.$el.tagName).toEqual('BUTTON');
});
it('should render the provided icon', () => {
expect(component.$el.querySelector('i').getAttribute('class')).toContain('fa fa-foo');
it('should render svg icon', () => {
expect(component.$el.querySelector('svg')).not.toBeNull();
});
it('should render the provided title', () => {
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment