Cleaner animation
This commit is contained in:
parent
e906ada528
commit
5170d40bb2
1 changed files with 20 additions and 18 deletions
|
@ -3,27 +3,29 @@
|
|||
<div v-if="loading">
|
||||
<div class="spinner spinner-xl blue"></div>
|
||||
</div>
|
||||
<div class="context-box" v-else-if="!databases.length">
|
||||
<div class="flex items-center">
|
||||
<database-icon class="flex-none text-grey-darker"></database-icon>
|
||||
<div class="flex-1 px-4 text-grey-darker">
|
||||
<p>You have no databases.</p>
|
||||
<div class="animate fadein" v-else>
|
||||
<div class="context-box" v-if="!databases.length">
|
||||
<div class="flex items-center">
|
||||
<database-icon class="flex-none text-grey-darker"></database-icon>
|
||||
<div class="flex-1 px-4 text-grey-darker">
|
||||
<p>You have no databases.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<database-row v-for="database in databases" :database="database" :key="database.name"/>
|
||||
</div>
|
||||
<div>
|
||||
<button class="btn btn-blue btn-lg" v-on:click="showCreateModal = true">Create new database</button>
|
||||
</div>
|
||||
<modal :show="showCreateModal" v-on:close="showCreateModal = false">
|
||||
<create-database-modal
|
||||
v-on:close="showCreateModal = false"
|
||||
v-on:database="handleModalCallback"
|
||||
v-if="showCreateModal"
|
||||
/>
|
||||
</modal>
|
||||
</div>
|
||||
<div v-else>
|
||||
<database-row v-for="database in databases" :database="database" :key="database.name"/>
|
||||
</div>
|
||||
<div>
|
||||
<button class="btn btn-blue btn-lg" v-on:click="showCreateModal = true">Create new database</button>
|
||||
</div>
|
||||
<modal :show="showCreateModal" v-on:close="showCreateModal = false">
|
||||
<create-database-modal
|
||||
v-on:close="showCreateModal = false"
|
||||
v-on:database="handleModalCallback"
|
||||
v-if="showCreateModal"
|
||||
/>
|
||||
</modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
Loading…
Reference in a new issue