nexus/vuefilemanager
2
0
Fork 0
mirror of https://github.com/VueFileManager/vuefilemanager.git synced 2026-04-19 08:32:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

empty page fix

Browse Source 
grid fix
auth page fix
This commit is contained in:
Čarodej
2021-10-29 17:22:33 +02:00
parent b1a6fc3bf2
commit 06bb51989e
6 changed files with 162 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
resources/js/components/FilesView/EmptyFilePage.vue
View File

@@ -1,13 +1,15 @@
<template>
<div class="empty-page" v-if="isLoading || isEmpty">
<div class="empty-state">
<div v-if="!isLoading" class="text-content">
<slot></slot>
</div>
<div v-else class="text-content">
<Spinner />
</div>
</div>
<div class="flex items-center justify-center h-full" v-if="isLoading || isEmpty">
<!--Show message for user-->
<div v-if="!isLoading" class="text-content text-center">
<slot></slot>
</div>
<!--Show spinner when loading content-->
<div v-else class="sm:relative fixed top-0 bottom-0">
<Spinner />
</div>
</div>
</template>
@@ -36,45 +38,28 @@
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.empty-page {
margin-top: 85px;
.empty-state {
margin: 0 auto;
padding-left: 15px;
padding-right: 15px;
}
.title {
@include font-size(20);
color: $text;
font-weight: 700;
margin: 0;
}
.text-content {
text-align: center;
margin: 30px 0;
.title {
@include font-size(20);
color: $text;
font-weight: 700;
margin: 0;
}
.description {
@include font-size(13);
color: $text-muted;
margin-bottom: 20px;
display: block;
}
.description {
@include font-size(13);
color: $text-muted;
margin-bottom: 20px;
display: block;
}
.dark {
.text-content {
.title {
color: $dark_mode_text_primary;
}
.title {
color: $dark_mode_text_primary;
}
.description {
color: $dark_mode_text_secondary;
}
.description {
color: $dark_mode_text_secondary;
}
}
</style>