fix: add closable classname for fix text overlap

components/alert/index.tsx

@@ -106,18 +106,19 @@ export default class Alert extends React.Component<AlertProps, AlertState> {
       }
     }
 
+    // closeable when closeText is assigned
+    if (closeText) {
+      closable = true;
+    }
+
     const alertCls = classNames(prefixCls, `${prefixCls}-${type}`, {
       [`${prefixCls}-close`]: !this.state.closing,
       [`${prefixCls}-with-description`]: !!description,
       [`${prefixCls}-no-icon`]: !showIcon,
       [`${prefixCls}-banner`]: !!banner,
+      [`${prefixCls}-closable`]: closable,
     }, className);
 
-    // closeable when closeText is assigned
-    if (closeText) {
-      closable = true;
-    }
-
     const closeIcon = closable ? (
       <a onClick={this.handleClose} className={`${prefixCls}-close-icon`}>
         {closeText || <Icon type="close" />}

components/alert/style/index.less

@@ -17,6 +17,10 @@
     padding: 8px 15px;
   }
 
+  &&-closable {
+    padding-right: 30px;
+  }
+
   &-icon {
     top: 8px + @font-size-base * @line-height-base / 2 - @font-size-base / 2;
     left: 16px;