puniko/FoundKey
1
0
Fork 0
forked from FoundKeyGang/FoundKey
Code Issues Pull requests Projects Releases Packages Wiki Activity

client: center drive loading ui

Browse source
This commit is contained in:
Johann150 2023-03-26 10:10:11 +02:00
parent 7401a0b400
commit aac6a93bae
Signed by untrusted user: Johann150
GPG key ID: 9EE6577A2A06F8F1
1 changed files with 32 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

63
packages/client/src/components/drive.vue
View file

@ -38,7 +38,6 @@
<MkPagination <MkPagination
ref="paginationElem" ref="paginationElem"
:pagination="pagination" :pagination="pagination"
class="contents"
> >
<template #empty> <template #empty>
<p v-if="folder == null" class="empty"><strong>{{ i18n.ts.emptyDrive }}</strong></p> <p v-if="folder == null" class="empty"><strong>{{ i18n.ts.emptyDrive }}</strong></p>
@ -46,34 +45,36 @@
</template> </template>
<template #default="{ items }"> <template #default="{ items }">
<template v-for="(f, i) in items"> <div class="contents">
<XFile <template v-for="(f, i) in items">
v-if="'size' in f" <XFile
:key="f.id" v-if="'size' in f"
v-anim="i" :key="f.id"
:file="f" v-anim="i"
:select-mode="select !== 'folder'" :file="f"
:is-selected="selected.some(x => x.id === f.id)" :select-mode="select !== 'folder'"
@chosen="choose" :is-selected="selected.some(x => x.id === f.id)"
@dragstart="isDragSource = true" @chosen="choose"
@dragend="isDragSource = false" @dragstart="isDragSource = true"
/> @dragend="isDragSource = false"
<XFolder />
v-else <XFolder
:key="f.id" v-else
v-anim="i" :key="f.id"
:folder="f" v-anim="i"
:select-mode="select !== 'file'" :folder="f"
:is-selected="selected.some(x => x.id === f.id)" :select-mode="select !== 'file'"
@chosen="choose" :is-selected="selected.some(x => x.id === f.id)"
@move="move" @chosen="choose"
@upload="upload" @move="move"
@removeFile="removeFile" @upload="upload"
@removeFolder="removeFolder" @removeFile="removeFile"
@dragstart="isDragSource = true" @removeFolder="removeFolder"
@dragend="isDragSource = false" @dragstart="isDragSource = true"
/> @dragend="isDragSource = false"
</template> />
</template>
</div>
</template> </template>
</MkPagination> </MkPagination>
</div> </div>
@ -631,13 +632,13 @@ onBeforeUnmount(() => {
height: calc(100% - 38px - 100px); height: calc(100% - 38px - 100px);
} }
> .contents { .contents {
display: grid; display: grid;
grid-template-columns: repeat(5, 1fr); grid-template-columns: repeat(5, 1fr);
gap: .5em; gap: .5em;
} }
> .empty { .empty {
padding: 16px; padding: 16px;
text-align: center; text-align: center;
pointer-events: none; pointer-events: none;