Input.Group组件box-shadow效果被遮盖 #10230
Input.Group组件box-shadow效果被遮盖 #10230
Comments
Translation of this issue: Input.Group component box-shadow effect is covered
Version3.4.3 EnvironmentAny environment (the official website demo can reproduce) Reproduction linkhttps://ant.design/components/input-cn/#components-input-demo-group Steps to reproduce(The official website demo can reproduce) When you fill in an input box in the group, the box-shadow attribute effect is obscured What is expected?When each nested component is in the :focus state, the right side of the box-shadow attribute is not obscured What is actually happening?Each nested component is in the :focus state, the right side of the box-shadow attribute effect is covered by the next component Suggested repair plan: And add in each nested component |
I will handle this issue. |
163: Update dependency antd to v3.5.3 r=rehandalal a=renovate[bot] This Pull Request updates dependency [antd](https://github.com/ant-design/ant-design) from `v3.5.2` to `v3.5.3` <details> <summary>Release Notes</summary> ### [`v3.5.3`](https://github.com/ant-design/ant-design/releases/3.5.3) [Compare Source](ant-design/ant-design@3.5.2...3.5.3) -🐞 Fix `Affix` with offsetTop === 0, value becomes `undefined` problem [#​10566](`ant-design/ant-design#10566) -🐞 Fixed issue with shaded `Input.Group` component shadows[#​10230](`ant-design/ant-design#10230) -🐞 Fixed issue where the `Transfer` component checkbox event fired twice [#​10480](`ant-design/ant-design#10480) -💄 Unifying the name of the variable [12d3046](ant-design/ant-design@12d3046) -💄 Fine-tuned the style of `Dropdown` [8e2f72f](ant-design/ant-design@8e2f72f) -💄 The components of the Chinese document will now be demonstrated using Chinese language packages. [9b17a94](ant-design/ant-design@9b17a94) -💄 The main theme switch was changed to `antd-theme-generato`, thanks to the work of [@​mzohaibqc]. - TypeScript -🐞 Fixed an issue with the type of gutter attribute in `Row` [b7d508e](ant-design/ant-design@b7d508e) -💄 Improved the `Form` component type [#​10564](`ant-design/ant-design#10564) -💄 Improved the `Button` and `Tag` types[1ed9fed](ant-design/ant-design@1ed9fed) --- -🐞 修复了 `Affix` 当 `offsetTop === 0`, 值将变为 `undefined` 的问题 [#​10566](`ant-design/ant-design#10566) -🐞 修复了 `Menu` item 中的高亮链接颜色问题 [09d5e36](ant-design/ant-design@09d5e36) -🐞 修复了 `Input.Group` 组件阴影被遮盖的问题 [#​10230](`ant-design/ant-design#10230) -🐞 修复了 `Transfer` 组件 checkbox 事件触发两次的问题 [`#10480`](`ant-design/ant-design#10480) -💄 统一 less 的变量命名 [12d3046](ant-design/ant-design@12d3046) -💄 微调了 `Dropdown` 的样式 [8e2f72f](ant-design/ant-design@8e2f72f) -💄 现在中文文档的组件会用中文语言包进行演示。[9b17a94](ant-design/ant-design@9b17a94) -💄 主站主题切换 修改为 `antd-theme-generato` ,感谢 [@​mzohaibqc] 的工作. - TypeScript -🐞 修复了 `Row` 中 gutter 属性的类型问题 [b7d508e](ant-design/ant-design@b7d508e) -💄 改进了 `Form` 组件类型 [#​10564](`ant-design/ant-design#10564) -💄 改进了 `Button` 和 `Tag` 类型 [1ed9fed](ant-design/ant-design@1ed9fed) --- </details> --- This PR has been generated by [Renovate Bot](https://renovatebot.com). Co-authored-by: Renovate Bot <bot@renovateapp.com>
Version
3.4.3
Environment
任意环境(官网demo即可重现)
Reproduction link
https://ant.design/components/input-cn/#components-input-demo-group
Steps to reproduce
(官网demo即可重现)
使用Input.Group组件,并设置compact属性为true,
Input.Group组件内部嵌套两个以上任意Input、select组件均可
当在填写group中的某一输入框时,box-shadow属性效果被遮盖
What is expected?
每个内部嵌套的组件处于:focus状态时,right侧的box-shadow属性效果不被遮盖


What is actually happening?
每个内部嵌套的组件处于:focus状态时,right侧的box-shadow属性效果被下一组件遮盖


建议修复方案:
ant-design/components/input/style/mixin.less(270行)
去除z-index: auto属性
并在每个被嵌套的组件添加
&:focus {
z-index: 1;
border-right-width: 1px;
}
The text was updated successfully, but these errors were encountered: