CatalogList.vue: layout improvements

This commit is contained in:
2020-01-15 12:58:41 -08:00
parent 5d7f14652c
commit eb57d25b5c

View File

@ -1,7 +1,7 @@
<template> <template>
<v-container fluid> <v-container fluid>
<v-row> <v-row>
<v-col cols="3"> <v-col cols="3" class="px-5 py-2">
<v-btn color="primary" <v-btn color="primary"
class="black--text" class="black--text"
href="/catalog/new" href="/catalog/new"
@ -10,7 +10,7 @@
<v-col cols="9"/> <v-col cols="9"/>
</v-row> </v-row>
<v-row> <v-row class="px-2">
<v-col cols="8"> <v-col cols="8">
<v-card> <v-card>
@ -23,10 +23,9 @@
<!-- my catalogs --> <!-- my catalogs -->
<v-tab-item key="mine"> <v-tab-item key="mine">
<v-card text> <v-row>
<v-col cols="7"/>
<v-card-title> <v-col cols="5" class="px-8">
<v-spacer/>
<v-text-field <v-text-field
v-model="search" v-model="search"
append-icon="search" append-icon="search"
@ -34,12 +33,15 @@
single-line single-line
hide-details hide-details
/> />
</v-card-title> </v-col>
</v-row>
<v-row>
<v-col>
<v-data-table <v-data-table
:headers="myHeaders" :headers="myHeaders"
:items="myCatalogs" :items="myCatalogs"
:items-per-page="15" :items-per-page="10"
:search="search" :search="search"
:loading="loadingMyCatalogs" :loading="loadingMyCatalogs"
class="scroll-area" class="scroll-area"
@ -70,16 +72,15 @@
No Catalogs No Catalogs
</template> </template>
</v-data-table> </v-data-table>
</v-col>
</v-card> </v-row>
</v-tab-item> </v-tab-item>
<!-- public catalogs --> <!-- public catalogs -->
<v-tab-item key="public"> <v-tab-item key="public">
<v-card text> <v-row>
<v-col cols="7"/>
<v-card-title> <v-col cols="5" class="px-8">
<v-spacer/>
<v-text-field <v-text-field
v-model="search" v-model="search"
append-icon="search" append-icon="search"
@ -87,12 +88,15 @@
single-line single-line
hide-details hide-details
/> />
</v-card-title> </v-col>
</v-row>
<v-row>
<v-col>
<v-data-table <v-data-table
:headers="pubHeaders" :headers="pubHeaders"
:items="publicCatalogs" :items="publicCatalogs"
:items-per-page="15" :items-per-page="10"
:search="search" :search="search"
:loading="loadingPublicCatalogs" :loading="loadingPublicCatalogs"
class="scroll-area" class="scroll-area"
@ -123,12 +127,11 @@
No Catalogs No Catalogs
</template> </template>
</v-data-table> </v-data-table>
</v-col>
</v-card> </v-row>
</v-tab-item> </v-tab-item>
</v-tabs> </v-tabs>
</v-card> </v-card>
</v-col> </v-col>
<v-col cols="4"> <v-col cols="4">
@ -332,10 +335,12 @@ export default {
</script> </script>
<style scoped> <style scoped>
/*
.scroll-area { .scroll-area {
height: 300px; height: 300px;
overflow-y: auto; overflow-y: auto;
} }
*/
</style> </style>
<style> <style>