vendredi 4 mars 2016

Ember: How to make element removal visually better?

Hi is there a way to use fade out on a component/element removal, using pure CSS? Currently delete happens so fast its hard for end-user to see what actually happened.

For instance i have this code for fade-in. It's easy to add and you dont need to change any script logics.

{{#each dataContainer as |data|}}
       <div class="panel custom-panel fade-in">
             xx
           <button class="remove"> Delete </button>
       </div>
{{/each}} 


.fade-in{
  animation: fadeIn 1s;
}

@keyframes fadeIn {
    from {
        background-color: #fff7c0;
        opacity:0;
    }
    to {
        background-color: white;
        opacity:1;
    }
}




Aucun commentaire:

Enregistrer un commentaire