Browse Source

fix title can't be hidden in <img /> type icon when menu collapsed

pull/1115/head
ddcat1115 8 years ago
parent
commit
bacc203148
  1. 2
      src/components/SiderMenu/SiderMenu.js
  2. 14
      src/components/SiderMenu/index.less

2
src/components/SiderMenu/SiderMenu.js

@ -14,7 +14,7 @@ const { SubMenu } = Menu;
// icon: <Icon type="setting" />,
const getIcon = (icon) => {
if (typeof icon === 'string' && icon.indexOf('http') === 0) {
return <img src={icon} alt="icon" className={styles.icon} />;
return <img src={icon} alt="icon" className={`${styles.icon} sider-menu-item-img`} />;
}
if (typeof icon === 'string') {
return <Icon type={icon} />;

14
src/components/SiderMenu/index.less

@ -49,4 +49,18 @@
.drawer .drawer-content {
background: #001529;
}
.ant-menu-inline-collapsed {
& > .ant-menu-item .sider-menu-item-img + span,
& > .ant-menu-item-group > .ant-menu-item-group-list > .ant-menu-item .sider-menu-item-img + span,
& > .ant-menu-submenu > .ant-menu-submenu-title .sider-menu-item-img + span {
max-width: 0;
display: inline-block;
opacity: 0;
}
}
.ant-menu-item .sider-menu-item-img + span,
.ant-menu-submenu-title .sider-menu-item-img + span {
transition: opacity .3s @ease-in-out, width .3s @ease-in-out;
opacity: 1;
}
}

Loading…
Cancel
Save