1
0
mirror of https://github.com/BookStackApp/BookStack.git synced 2025-07-28 17:02:04 +03:00

Made header more responsive and added nicer settings switches

This commit is contained in:
Dan Brown
2015-10-18 17:29:26 +01:00
parent 13fa1080dc
commit 6c4b4e1cf9
8 changed files with 123 additions and 20 deletions

View File

@ -0,0 +1,28 @@
<template>
<div class="toggle-switch" v-on="click: switch" v-class="active: isActive">
<input type="hidden" v-attr="name: name, value: value"/>
<div class="switch-handle"></div>
</div>
</template>
<script>
module.exports = {
props: ['name', 'value'],
data: function() {
return {
isActive: this.value == true && this.value != 'false'
}
},
ready: function() {
this.value = (this.value == true && this.value != 'false') ? 'true' : 'false';
},
methods: {
switch: function() {
this.isActive = !this.isActive;
this.value = this.isActive ? 'true' : 'false';
}
}
}
</script>

View File

@ -40,6 +40,7 @@ Vue.use(require('vue-resource'));
// Vue Components
Vue.component('image-manager', require('./components/image-manager.vue'));
Vue.component('image-picker', require('./components/image-picker.vue'));
Vue.component('toggle-switch', require('./components/toggle-switch.vue'));
// Vue Controllers
if(elemExists('#book-dashboard')) {