[Client] Add some animations 🎨

This commit is contained in:
syuilo
2018-12-16 11:32:20 +09:00
parent a70070ac7d
commit d18ee12d2f
7 changed files with 67 additions and 40 deletions

View File

@@ -18,29 +18,31 @@
<option value="remote">{{ $t('origin.remote') }}</option>
</ui-select>
</ui-horizon-group>
<div class="kidvdlkg" v-for="file in files">
<div @click="file._open = !file._open">
<div>
<div class="thumbnail" :style="thumbnail(file)"></div>
</div>
<div>
<header>
<b>{{ file.name }}</b>
<span class="username">@{{ file.user | acct }}</span>
</header>
<sequential-entrance animation="entranceFromTop" delay="25">
<div class="kidvdlkg" v-for="file in files">
<div @click="file._open = !file._open">
<div>
<div class="thumbnail" :style="thumbnail(file)"></div>
</div>
<div>
<header>
<b>{{ file.name }}</b>
<span class="username">@{{ file.user | acct }}</span>
</header>
<div>
<span style="margin-right:16px;">{{ file.type }}</span>
<span>{{ file.datasize | bytes }}</span>
<div>
<span style="margin-right:16px;">{{ file.type }}</span>
<span>{{ file.datasize | bytes }}</span>
</div>
<div><mk-time :time="file.createdAt" mode="detail"/></div>
</div>
<div><mk-time :time="file.createdAt" mode="detail"/></div>
</div>
</div>
<div v-show="file._open">
<ui-button @click="del(file)"><fa :icon="faTrashAlt"/> {{ $t('delete') }}</ui-button>
</div>
</div>
<div v-show="file._open">
<ui-button @click="del(file)"><fa :icon="faTrashAlt"/> {{ $t('delete') }}</ui-button>
</div>
</div>
</sequential-entrance>
<ui-button v-if="existMore" @click="fetch">{{ $t('@.load-more') }}</ui-button>
</section>
</ui-card>