blob: 88a835ec411a5a741bd62178d8994f2cc3c46e08 [file] [log] [blame]
<template>
<div
:style="{ backgroundColor: bgColor }"
class="item"
v-on:click="click"
v-on:touchstart="touchstart"
v-on:touchend="touchend">
<slot></slot>
</div>
</template>
<script>
module.exports = {
props: {
bgColor: { default: '#ffffff' }
},
methods: {
click: function () {
this.$emit('click')
},
touchstart: function() {
// FIXME android touch
// TODO adaptive opposite bgColor
// this.bgColor = '#e6e6e6';
},
touchend: function() {
// FIXME android touchend not triggered
// this.bgColor = '#ffffff';
}
}
}
</script>
<style scoped>
.item {
padding-top: 25px;
padding-bottom: 25px;
padding-left: 35px;
padding-right: 35px;
height: 160px;
justify-content: center;
/*margin-bottom: 1px; FUTURE */
border-bottom-width: 1px;
border-color: #dddddd;
}
</style>