2016-07-27 06:15:02 +00:00
|
|
|
<template>
|
2016-08-26 07:49:12 +00:00
|
|
|
<div
|
|
|
|
class="el-row"
|
|
|
|
:style="style"
|
|
|
|
:class="[
|
|
|
|
justify !== 'start' ? 'is-justify-' + justify : '',
|
|
|
|
align !== 'top' ? 'is-align-' + align : '',
|
|
|
|
{
|
|
|
|
'el-row--flex': type === 'flex'
|
|
|
|
}
|
|
|
|
]"
|
|
|
|
>
|
2016-07-27 06:15:02 +00:00
|
|
|
<slot></slot>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
|
|
export default {
|
|
|
|
name: 'ElRow',
|
|
|
|
|
|
|
|
props: {
|
2016-08-26 07:49:12 +00:00
|
|
|
gutter: Number,
|
|
|
|
type: String,
|
|
|
|
justify: {
|
|
|
|
type: String,
|
|
|
|
default: 'start'
|
|
|
|
},
|
|
|
|
align: {
|
|
|
|
type: String,
|
|
|
|
default: 'top'
|
|
|
|
}
|
2016-07-27 06:15:02 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
computed: {
|
|
|
|
style() {
|
|
|
|
var ret = {};
|
|
|
|
|
|
|
|
if (this.gutter) {
|
|
|
|
ret.marginLeft = `-${this.gutter / 2}px`;
|
|
|
|
ret.marginRight = ret.marginLeft;
|
|
|
|
}
|
|
|
|
|
|
|
|
return ret;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
};
|
|
|
|
</script>
|