FooterToolBar width is fixed at 100% when using rc-drawer SliderMenu.

src/components/FooterToolbar/index.js

@@ -1,12 +1,44 @@
 import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import styles from './index.less';
 
 export default class FooterToolbar extends Component {
+  static contextTypes = {
+    isMobile: PropTypes.bool,
+  };
+
+  state = {
+    width: undefined,
+  };
+
+  componentDidMount() {
+    window.addEventListener('resize', this.resizeFooterToolbar);
+    this.resizeFooterToolbar();
+  }
+
+  componentWillUnmount() {
+    window.removeEventListener('resize', this.resizeFooterToolbar);
+  }
+
+  resizeFooterToolbar = () => {
+    const sider = document.querySelector('.ant-layout-sider');
+    if (sider == null) {
+      return;
+    }
+    const { isMobile } = this.context;
+    const width = isMobile ? null : `calc(100% - ${sider.style.width})`;
+    const { width: stateWidth } = this.state;
+    if (stateWidth !== width) {
+      this.setState({ width });
+    }
+  };
+
   render() {
     const { children, className, extra, ...restProps } = this.props;
+    const { width } = this.state;
     return (
-      <div className={classNames(className, styles.toolbar)} {...restProps}>
+      <div className={classNames(className, styles.toolbar)} style={{ width }} {...restProps}>
         <div className={styles.left}>{extra}</div>
         <div className={styles.right}>{children}</div>
       </div>