Added more fancy stuff

This commit is contained in:
Pünkösd Marcell 2020-11-25 04:33:57 +01:00
parent fa18ba7252
commit 8997076da6
2 changed files with 35 additions and 1 deletions

View File

@ -2,7 +2,20 @@ import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import {MdButton, MdContent, MdTabs, MdCard, MdField, MdElevation, MdProgress, MdToolbar, MdDrawer, MdList, MdAvatar} from 'vue-material/dist/components'
import {
MdButton,
MdContent,
MdTabs,
MdCard,
MdField,
MdElevation,
MdProgress,
MdToolbar,
MdDrawer,
MdList,
MdAvatar,
MdRipple
} from 'vue-material/dist/components'
import 'vue-material/dist/vue-material.min.css'
import 'vue-material/dist/theme/default.css'
@ -20,6 +33,7 @@ Vue.use(MdToolbar);
Vue.use(MdDrawer);
Vue.use(MdList);
Vue.use(MdAvatar);
Vue.use(MdRipple);
new Vue({

View File

@ -7,11 +7,17 @@
</md-button>
<span class="md-title">VideON</span>
<div class="md-toolbar-section-end">
<md-button class="md-raised" :disabled="true">Apply</md-button>
</div>
</md-toolbar>
<md-drawer :md-active.sync="showNavigation" md-swipeable>
<md-toolbar class="md-transparent" md-elevation="0">
<span class="md-title">VideON</span>
</md-toolbar>
<md-list>
@ -29,6 +35,13 @@
</md-drawer>
<md-content id="diagram-container">
<md-progress-bar v-if="true" class="md-accent" md-mode="indeterminate"></md-progress-bar>
<div id="fab-holder">
<md-button class="md-fab">
<md-icon>add</md-icon>
</md-button>
</div>
</md-content>
@ -54,4 +67,11 @@ export default {
#diagram-container {
height: calc(100% - 64px);
}
#fab-holder {
position: absolute;
z-index: 5;
right: 2rem;
bottom: 2rem;
}
</style>