diff --git a/packages/amis-ui/scss/components/form/_form.scss b/packages/amis-ui/scss/components/form/_form.scss index 2dc8099d8e1..1e4c3b5ee85 100644 --- a/packages/amis-ui/scss/components/form/_form.scss +++ b/packages/amis-ui/scss/components/form/_form.scss @@ -531,80 +531,18 @@ } } -.#{$ns}Form--column-1 > .#{$ns}Form-item { - width: 100%; -} - -.#{$ns}Form--column-2 > .#{$ns}Form-item { - width: 50%; -} - -.#{$ns}Form--column-2 > .#{$ns}Form-item:nth-last-child(2) { - margin-bottom: 0; -} - -.#{$ns}Form--column-3 > .#{$ns}Form-item { - width: 33%; -} - -.#{$ns}Form--column-3 > .#{$ns}Form-item:nth-last-child(-n + 3) { - margin-bottom: 0; -} - -.#{$ns}Form--column-4 > .#{$ns}Form-item { - width: 25%; -} - -.#{$ns}Form--column-4 > .#{$ns}Form-item:nth-last-child(-n + 4) { - margin-bottom: 0; -} - -.#{$ns}Form--column-5 > .#{$ns}Form-item { - width: 20%; -} - -.#{$ns}Form--column-5 > .#{$ns}Form-item:nth-last-child(-n + 5) { - margin-bottom: 0; -} - -.#{$ns}Form--column-6 > .#{$ns}Form-item { - width: 16.6%; -} - -.#{$ns}Form--column-6 > .#{$ns}Form-item:nth-last-child(-n + 6) { - margin-bottom: 0; -} - -.#{$ns}Form--column-7 > .#{$ns}Form-item { - width: 14.2%; -} - -.#{$ns}Form--column-7 > .#{$ns}Form-item:nth-last-child(-n + 7) { - margin-bottom: 0; -} - -.#{$ns}Form--column-8 > .#{$ns}Form-item { - width: 12.5%; -} - -.#{$ns}Form--column-8 > .#{$ns}Form-item:nth-last-child(-n + 8) { - margin-bottom: 0; -} - -.#{$ns}Form-column-9 > .#{$ns}Form-item { - width: 11.1%; -} - -.#{$ns}Form--column-9 > .#{$ns}Form-item:nth-last-child(-n + 9) { - margin-bottom: 0; -} +@for $i from 1 through 10 { + .#{$ns}Form--column-#{$i} > .#{$ns}Form-item { + width: 100 / $i * 1%; + } -.#{$ns}Form-column-10 > .#{$ns}Form-item { - width: 10%; -} + .#{$ns}Form--column-#{$i} > [data-role*='container'] { + flex: 100%; + } -.#{$ns}Form--column-10 > .#{$ns}Form-item:nth-last-child(-n + 10) { - margin-bottom: 0; + .#{$ns}Form--column-#{$i} > .#{$ns}Form-item:nth-last-child(-n + #{$i}) { + margin-bottom: 0; + } } /* 移动端样式调整 */ diff --git a/packages/amis-ui/src/components/CollapseGroup.tsx b/packages/amis-ui/src/components/CollapseGroup.tsx index 6a8edd4be9d..df4e3b1d8d0 100644 --- a/packages/amis-ui/src/components/CollapseGroup.tsx +++ b/packages/amis-ui/src/components/CollapseGroup.tsx @@ -161,6 +161,7 @@ class CollapseGroup extends React.Component< className )} style={style} + data-role="container" > {this.getItems(children)} diff --git a/packages/amis-ui/src/components/Tabs.tsx b/packages/amis-ui/src/components/Tabs.tsx index 9a983953972..ce56e77580b 100644 --- a/packages/amis-ui/src/components/Tabs.tsx +++ b/packages/amis-ui/src/components/Tabs.tsx @@ -898,6 +898,7 @@ export class Tabs extends React.Component { )} style={style} {...testIdBuilder?.getTestId()} + data-role="container" > {!['vertical', 'sidebar', 'chrome'].includes(mode) ? (