<template>
  <div class="ipub-row"
       :style="style">
    <slot></slot>
  </div>
</template>

<script>
export default {
  name: 'IpubRow',
  props: {
    gutter: {
      type: [Number, Array],
      default: 0
    }
  },
  provide () {
    return {
      gutter: this.gutter,
      align: this.align
    };
  },
  data () {
    return {
      style: {
        margin: `0 -${parseFloat(this.gutter[0] || this.gutter) / 2}px`,
        width: `calc(100% + ${this.gutter[0] || this.gutter}px)`,
        'margin-bottom': `${parseFloat(this.gutter[1] || 0)}px`
      },
    }
  },
}
</script>

