kotovalexarian-likes-gitlab
/
gitlab-org--gitlab-foss
1
0
Fork 0
Code Releases Activity

Prevent fade out transition on loading-button

This commit is contained in:
Enrique Alcántara 2019-03-25 09:00:36 +00:00 committed by Phil Hughes
parent 668c38f4f8
commit 4f03122959
3 changed files with 12 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/assets/javascripts/vue_shared/components/loading_button.vue
View File

@ -53,7 +53,7 @@ export default {
<template>
<button :class="containerClass" :disabled="loading || disabled" type="button" @click="onClick">
<transition name="fade">
<transition name="fade-in">
<gl-loading-icon
v-if="loading"
:inline="true"
@ -63,7 +63,7 @@ export default {
class="js-loading-button-icon"
/>
</transition>
<transition name="fade">
<transition name="fade-in">
<slot>
<span v-if="label" class="js-loading-button-label"> {{ label }} </span>
</slot>

6
app/assets/stylesheets/framework/vue_transitions.scss
View File

@ -1,9 +1,13 @@
.fade-enter-active,
.fade-leave-active {
.fade-leave-active,
.fade-in-enter-active,
.fade-out-leave-active {
transition: opacity $sidebar-transition-duration $general-hover-transition-curve;
}
.fade-enter,
.fade-in-enter,
.fade-out-leave-to,
.fade-leave-to {
opacity: 0;
}

5
changelogs/unreleased/57409-loading-button-transition.yml Normal file
View File

@ -0,0 +1,5 @@
---
title: Prevent fade out transition on loading-button component.
merge_request: 26428
author:
type: fixed