catalog list: small updates for vuetify 2

This commit is contained in:
2019-10-01 15:44:29 -07:00
parent 06b8d6e0f2
commit c777f85b94
4 changed files with 56 additions and 25 deletions

View File

@ -19,7 +19,7 @@
<v-tab key="public">Public Catalogs</v-tab>
<v-tab-item key="mine">
<v-card flat>
<v-card text>
<v-card-title>
<v-spacer></v-spacer>
@ -73,7 +73,7 @@
</v-tab-item>
<v-tab-item key="public">
<v-card flat>
<v-card text>
<v-card-title>
<v-spacer></v-spacer>
@ -196,13 +196,13 @@
<v-divider></v-divider>
<v-card-text>
<v-btn class="ma-0" small flat :href="'/catalog/edit/' + selectedCatalog.id">Edit</v-btn>
<v-btn class="ma-0" small text :href="'/catalog/edit/' + selectedCatalog.id">Edit</v-btn>
<v-btn
class="ma-0"
small flat
small text
:disabled="selectedCatalog.build_progress < 100"
:href="selectedCatalog.pdf">Download</v-btn>
<!-- <v-btn class="ma-0" small flat>Share</v-btn> -->
<!-- <v-btn class="ma-0" small text>Share</v-btn> -->
</v-card-text>
</v-card>
<v-card v-else>

View File

@ -1,5 +1,5 @@
<template>
<v-toolbar dark dense absolute app color="keen_dark_grey">
<v-app-bar dark dense absolute app color="keen_dark_grey">
<!-- <v-toolbar-side-icon></v-toolbar-side-icon> -->
<img src="/static/img/keen_logo.svg" width="85"/>
<v-toolbar-title color="primary" class="headline">
@ -8,37 +8,37 @@
</v-toolbar-title>
<v-spacer></v-spacer>
<v-toolbar-items class="hidden-sm-and-down">
<v-btn flat small href="/">Dashboard</v-btn>
<v-btn text small href="/">Dashboard</v-btn>
<v-menu open-on-hover bottom offset-y>
<template v-slot:activator="{ on }">
<v-btn flat small v-on="on">Support</v-btn>
<v-btn text small v-on="on">Support</v-btn>
</template>
<v-list class="navbar-menu ma-0 pa-0">
<v-list-tile dense class="navbar-menu-item">
<v-btn flat small href="mailto:support@procatalog.io?Subject=Keen%20ProCatalog%20support%20request" class="navbar-menu-button">Email Support</v-btn>
</v-list-tile>
<v-list-item dense class="navbar-menu-item">
<v-btn text small href="mailto:support@procatalog.io?Subject=Keen%20ProCatalog%20support%20request" class="navbar-menu-button">Email Support</v-btn>
</v-list-item>
</v-list>
</v-menu>
<v-menu open-on-hover bottom offset-y>
<template v-slot:activator="{ on }">
<v-btn flat small v-on="on">
<v-btn text small v-on="on">
Account
</v-btn>
</template>
<v-list class="navbar-menu ma-0 pa-0">
<v-list-tile dense class="navbar-menu-item">
<v-btn flat small href="/account/settings" class="navbar-menu-button">Profile</v-btn>
</v-list-tile>
<v-list-tile dense class="navbar-menu-item">
<v-btn flat small href="/account/logout" class="navbar-menu-button">Log Out</v-btn>
</v-list-tile>
<v-list-item dense class="navbar-menu-item">
<v-btn text small href="/account/settings" class="navbar-menu-button">Profile</v-btn>
</v-list-item>
<v-list-item dense class="navbar-menu-item">
<v-btn text small href="/account/logout" class="navbar-menu-button">Log Out</v-btn>
</v-list-item>
</v-list>
</v-menu>
</v-toolbar-items>
</v-toolbar>
</v-app-bar>
</template>
<script>

View File

@ -1,5 +1,6 @@
import Vue from 'vue'
import '../../plugins/vuetify'
import Vuetify from 'vuetify/lib'
import Vue2Filters from 'vue2-filters'
import App from './App.vue'
import { store } from './store'
@ -7,8 +8,31 @@ import 'material-design-icons-iconfont/dist/material-design-icons.css' // Ensure
Vue.config.productionTip = false
Vue.use(Vue2Filters)
Vue.use(Vuetify)
const opts = {
theme: {
primary: '#fdd02f',
keen_yellow: '#fddd04',
keen_dark_grey: '#373737',
keen_light_grey: '#bababa',
secondary: '#424242',
accent: '#82B1FF',
error: '#FF5252',
info: '#2196F3',
success: '#4CAF50',
warning: '#FFC107'
},
options: {
customProperties: true
},
// icons: {
// iconfont: 'md',
// },
}
new Vue({
store,
render: h => h(App)
render: h => h(App),
vuetify: new Vuetify(opts)
}).$mount('#app')

View File

@ -1,8 +1,7 @@
import Vue from 'vue'
import Vuetify from 'vuetify/lib'
import 'vuetify/src/stylus/app.styl'
Vue.use(Vuetify, {
const opts = {
theme: {
primary: '#fdd02f',
keen_yellow: '#fddd04',
@ -18,5 +17,13 @@ Vue.use(Vuetify, {
options: {
customProperties: true
},
iconfont: 'md'
})
icons: {
iconfont: 'md',
},
}
Vue.use(Vuetify)
new Vue({
vuetify: new Vuetify(opts)
}).$mount('#app')