diff --git a/CHANGELOG.md b/CHANGELOG.md
index c41c2b33a..acfe95c83 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -10,6 +10,7 @@
- 修复 `DatePicker` 在 type 为 daterange 时候,传入不合法日期,面板显示异常 [#1418](https://github.com/XiaoMi/hiui/issues/1418)
- 修复 `Table` 对其他组件造成的样式污染问题 [#1428](https://github.com/XiaoMi/hiui/issues/1428)
- 修复 `Tree` onDrop 回调函数参数不正确的问题 [#1425](https://github.com/XiaoMi/hiui/issues/1425)
+- 优化 `Tabs` 组件弹出层样式[#1437](https://github.com/XiaoMi/hiui/issues/1437)
## 3.2.0
diff --git a/components/tabs/ItemDropdown.js b/components/tabs/ItemDropdown.js
index ddb880318..5f6b38319 100644
--- a/components/tabs/ItemDropdown.js
+++ b/components/tabs/ItemDropdown.js
@@ -79,27 +79,28 @@ class ItemDropdown extends Component {
attachEle={this.toggleRef}
zIndex={1010}
width="auto"
- leftGap={-18}
topGap={3}
>
-
- {items.map((item, index) => {
- return (
-
{
- this.toggle()
- onChoose(item, e)
- }}
- key={index}
- >
- {item.tabTitle}
-
- )
- })}
+
+
+ {items.map((item, index) => {
+ return (
+ - {
+ this.toggle()
+ onChoose(item, e)
+ }}
+ key={index}
+ >
+ {item.tabTitle}
+
+ )
+ })}
+
diff --git a/components/tabs/style/index.scss b/components/tabs/style/index.scss
index 0cba6d175..6aa5eb597 100644
--- a/components/tabs/style/index.scss
+++ b/components/tabs/style/index.scss
@@ -394,18 +394,26 @@ $prefix: 'hi-tabs' !default;
}
.hi-tabs-dropdown {
+ &__wrapper {
+ max-height: 178px;
+ padding: 8px 0;
+ overflow: auto;
+ background-color: use-color('white');
+ border-radius: 2px;
+ border: 1px solid use-color('gray-20');
+ box-shadow: 0 2px 8px 0 rgba(56, 62, 71, 0.1);
+ }
+
&__toggle-title {
margin-right: 8px;
}
&__items {
- max-height: 160px;
- padding: 4px 0;
+ max-height: 162px;
+ list-style: none;
+ margin: 0;
+ padding: 0;
overflow: auto;
- background-color: use-color('white');
- border-radius: 2px;
- border: 1px solid use-color('gray-20');
- box-shadow: 0 2px 8px 0 rgba(56, 62, 71, 0.1);
}
&__item {