fix(col): update (#875)

This commit is contained in:
kooriookami 2020-12-09 05:53:07 -06:00 committed by GitHub
parent 709ec69c12
commit 1c30c50512
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 25 additions and 11 deletions

View File

@ -20,8 +20,8 @@ const ElCol = defineComponent({
type: Number,
default: 0,
},
push:{
type: Number,
push: {
type: Number,
default: 0,
},
xs: {
@ -51,6 +51,8 @@ const ElCol = defineComponent({
const style = computed(() => {
if (gutter) {
return {
display: 'block',
minHeight: '1px',
paddingLeft: gutter / 2 + 'px',
paddingRight: gutter / 2 + 'px',
}
@ -82,7 +84,7 @@ const ElCol = defineComponent({
return ret
})
return () =>h(
return () => h(
'div',
{
class: ['el-col', classList.value],

View File

@ -1,4 +1,5 @@
import { defineComponent, computed, h, provide } from 'vue'
export default defineComponent({
name: 'ElRow',
props: {
@ -27,7 +28,12 @@ export default defineComponent({
provide('ElRow', props.gutter)
const style = computed(() => {
const ret = { marginLeft: '', marginRight: '' }
const ret = {
display: 'flex',
flexWrap: 'wrap',
marginLeft: '',
marginRight: '',
}
if (props.gutter) {
ret.marginLeft = `-${props.gutter / 2}px`
ret.marginRight = ret.marginLeft

View File

@ -12,7 +12,8 @@
@for $i from 0 through 24 {
.el-col-#{$i} {
width: (1 / 24 * $i * 100) * 1%;
max-width: (1 / 24 * $i * 100) * 1%;
flex: 0 0 (1 / 24 * $i * 100) * 1%;
}
.el-col-offset-#{$i} {
@ -36,7 +37,8 @@
}
@for $i from 0 through 24 {
.el-col-xs-#{$i} {
width: (1 / 24 * $i * 100) * 1%;
max-width: (1 / 24 * $i * 100) * 1%;
flex: 0 0 (1 / 24 * $i * 100) * 1%;
}
.el-col-xs-offset-#{$i} {
@ -61,7 +63,8 @@
}
@for $i from 0 through 24 {
.el-col-sm-#{$i} {
width: (1 / 24 * $i * 100) * 1%;
max-width: (1 / 24 * $i * 100) * 1%;
flex: 0 0 (1 / 24 * $i * 100) * 1%;
}
.el-col-sm-offset-#{$i} {
@ -86,7 +89,8 @@
}
@for $i from 0 through 24 {
.el-col-md-#{$i} {
width: (1 / 24 * $i * 100) * 1%;
max-width: (1 / 24 * $i * 100) * 1%;
flex: 0 0 (1 / 24 * $i * 100) * 1%;
}
.el-col-md-offset-#{$i} {
@ -111,7 +115,8 @@
}
@for $i from 0 through 24 {
.el-col-lg-#{$i} {
width: (1 / 24 * $i * 100) * 1%;
max-width: (1 / 24 * $i * 100) * 1%;
flex: 0 0 (1 / 24 * $i * 100) * 1%;
}
.el-col-lg-offset-#{$i} {
@ -136,7 +141,8 @@
}
@for $i from 0 through 24 {
.el-col-xl-#{$i} {
width: (1 / 24 * $i * 100) * 1%;
max-width: (1 / 24 * $i * 100) * 1%;
flex: 0 0 (1 / 24 * $i * 100) * 1%;
}
.el-col-xl-offset-#{$i} {
@ -153,4 +159,4 @@
left: (1 / 24 * $i * 100) * 1%;
}
}
}
}