<template>
  <div class="dof-col" :style="style">
    <slot></slot>
  </div>
</template>

<script>
import { mixChild } from '../utils/mix-child.js'
export default {
  mixins: [mixChild('dof-row')],
  computed: {
    gap() {
      return (this.parent && this.parent.gap) || 16
    },
    style() {
      const res = {}
      // console.log('this.parent.gap')
      const constGap = (this.parent && this.parent.gap) || 20
      if (!this.isLast) {
        res.marginRight = `${constGap}px`
      }
      return res
    }
  }
}
</script>

<style scoped>
.dof-col {
  flex: 1;
  flex-direction: column;
}
</style>
