fix: flex布局容器,、表单等取消边距 (#7681)

* feat: flex布局容器, 表单一些边距修复

* fix: 去掉分栏边距

---------

Co-authored-by: qiaoganggang <qiaoganggang@baidu.com>
This commit is contained in:
qiaoganggang 2023-08-03 17:32:45 +08:00 committed by GitHub
parent 4d3cb33a3d
commit 654baa846e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 19 additions and 14 deletions

View File

@ -997,7 +997,8 @@ export class FormItemWrap extends React.Component<FormItemProps> {
: 'normal'
}`]: horizontal.leftFixed,
[`Form-itemColumn--${left}`]: !horizontal.leftFixed,
'Form-label--left': labelAlign === 'left'
'Form-label--left': labelAlign === 'left',
'Form-label-noLabel': label === ''
},
getItemLabelClassName(props)
)}

View File

@ -33,7 +33,7 @@ export const defaultFlexColumnSchema = (title?: string) => {
// 默认的布局容器Schema
const defaultFlexContainerSchema = {
type: 'flex',
className: 'p-1',
className: '',
items: [
defaultFlexColumnSchema('第一列'),
defaultFlexColumnSchema('第二列'),

View File

@ -14,7 +14,7 @@ export default class Layout_fixed_top extends FlexPluginBase {
type: 'flex',
isSorptionContainer: true,
sorptionPosition: 'top',
className: 'p-1',
className: '',
items: [
defaultFlexColumnSchema(),
defaultFlexColumnSchema(),

View File

@ -1,22 +1,22 @@
.#{$ns}Wrapper,
.#{$ns}Container {
&--xs {
padding: var(--gap-xs);
// padding: var(--gap-xs);
}
&--sm {
padding: var(--gap-sm);
// padding: var(--gap-sm);
}
&--md {
padding: var(--gap-md);
// padding: var(--gap-md);
}
&--lg {
padding: var(--gap-lg);
// padding: var(--gap-lg);
}
&--xl {
padding: var(--gap-xl);
// padding: var(--gap-xl);
}
}

View File

@ -274,6 +274,10 @@
margin-right: var(--Form--horizontal-label-gap);
flex-shrink: 0;
&-noLabel {
margin-right: 0;
}
.#{$ns}Form-star {
position: absolute;
left: px2rem(-6px);

View File

@ -17,23 +17,23 @@
min-height: 1px;
max-width: 100%;
width: 100%;
padding-left: math.div($Grid-gutterWidth, 2);
padding-right: math.div($Grid-gutterWidth, 2);
// padding-left: math.div($Grid-gutterWidth, 2);
// padding-right: math.div($Grid-gutterWidth, 2);
}
.#{$ns}Grid-col--#{$class}Auto {
flex: 0 0 auto;
width: auto;
max-width: 100%;
padding-left: math.div($Grid-gutterWidth, 2);
padding-right: math.div($Grid-gutterWidth, 2);
// padding-left: math.div($Grid-gutterWidth, 2);
// padding-right: math.div($Grid-gutterWidth, 2);
}
}
// Generate Grid row
@mixin make-row($gutter: $Grid-gutterWidth) {
margin-left: math.div($gutter, -2);
margin-right: math.div($gutter, -2);
// margin-left: math.div($gutter, -2);
// margin-right: math.div($gutter, -2);
display: flex;
flex-wrap: wrap;
}