[css.container.cards(section)] animation on display

This commit is contained in:
xdrm-brackets 2018-03-14 10:30:51 +01:00
parent a827e66ba1
commit 4053768474
3 changed files with 12 additions and 2 deletions

View File

@ -46,7 +46,7 @@
</div>
</section>
<section v-if='gstore.professors.length <= 0'>Aucun enseignant trouvé</section>
<section v-if='gstore.professors.length <= 0' data-anim='0'>Aucun enseignant trouvé</section>
<section v-for='(prof, pi) in gstore.professors'
:class="gstore.edit_i==pi ? 'search' : ''"

View File

@ -35,7 +35,7 @@
</div>
</section>
<section v-if='gstore.ues.length <= 0'>Aucune UE trouvée</section>
<section v-if='gstore.ues.length <= 0' data-anim='0'>Aucune UE trouvée</section>
<section v-for='(ue, pi) in gstore.ues'
:class="gstore.edit_i==pi ? 'search' : ''"

View File

@ -144,6 +144,11 @@
}
@keyframes showup{
from{ transform: scale(.95); }
to{ transform: scale(1); }
}
/* (1) Card container */
& > section{
@ -159,6 +164,11 @@
border: 1px solid transparent;
box-shadow: 0 1px 1px darken(#fff, 20%);
&:not([data-anim='0']){
animation: showup .2s ease-out;
}
&.invalid{ box-shadow: 0; border: 1px solid $form-invalid-color; }
&.valid{ box-shadow: 0; border: 1px solid $form-valid-color; }
&.search{ box-shadow: 0; border: 1px solid $form-search-color; }