fix typo

site/theme/template/Home/Page1.jsx

@@ -187,7 +187,7 @@ export default class Page1 extends React.PureComponent {
             component="svg"
             resetStyleBool={false}
           >
-            {(this.props.isMoblie || isHover) && this.getSvgChild(item.svgBg.props.children)}
+            {(this.props.isMobile || isHover) && this.getSvgChild(item.svgBg.props.children)}
           </TweenOneGroup>
           <QueueAnim
             className="page1-block"

site/theme/template/Home/Page2.jsx

@@ -69,7 +69,7 @@ const svgBgChildArray = svgBgChild.map((item, i) => {
   const { props } = item;
   return React.cloneElement(item, { children: svgBgToParallax(props.children, i) });
 });
-export default function Page2({ isMoblie, locale }) {
+export default function Page2({ isMobile, locale }) {
   const isZhCN = locale === 'zh-CN';
   const componentButton = (
     <div key="b" className="components-button-wrapper">
@@ -82,10 +82,10 @@ export default function Page2({ isMoblie, locale }) {
     </div>
   );
   const children = page2Data.map((item, i) => {
-    if (!isMoblie && !i) {
+    if (!isMobile && !i) {
       return null;
     }
-    const content = isMoblie && !i ? componentButton : [
+    const content = isMobile && !i ? componentButton : [
       <p key="p">{item.slogan}</p>,
       <a key="a" href={item.link} target="_black">learn more <Icon type="right" /></a>,
     ];
@@ -96,7 +96,7 @@ export default function Page2({ isMoblie, locale }) {
           md={i === 2 ? 6 : 8}
           className={`block-image-wrapper${i % 2 ? ' right' : ''}`}
         >
-          <img src={item.img} style={isMoblie && i === 2 ? { marginLeft: 16 } : {}} alt="icon" />
+          <img src={item.img} style={isMobile && i === 2 ? { marginLeft: 16 } : {}} alt="icon" />
         </Col>
         <Col xs={16} md={i === 2 ? 18 : 16} className="block-text-wrapper">
           <h4>{item.name}</h4>

site/theme/template/Home/index.jsx

@@ -63,7 +63,7 @@ const vidoeSrc = 'https://gw.alipayobjects.com/os/rmsportal/DNDyihnvkHUuANuumKck
 class Home extends React.Component {
   static contextTypes = {
     intl: PropTypes.object.isRequired,
-    isMoblie: PropTypes.bool.isRequired,
+    isMobile: PropTypes.bool.isRequired,
   }
   constructor(props) {
     super(props);
@@ -81,8 +81,8 @@ class Home extends React.Component {
     }
   }
   render() {
-    const { isMoblie, intl } = this.context;
-    const childProps = { ...this.props, isMoblie, locale: intl.locale };
+    const { isMobile, intl } = this.context;
+    const childProps = { ...this.props, isMobile, locale: intl.locale };
     const noShowNewVersionVideo = this.state.noShowNewVersionVideo ? null : (
       <div className="new-version-video" key="video">
         <div className="vidoe-wrap">
@@ -101,9 +101,11 @@ class Home extends React.Component {
           <Page2 {...childProps} />
           <Page3 {...childProps} />
           <style dangerouslySetInnerHTML={{ __html: getStyle() }} />
-          <Animate transitionName="fade">
-            {noShowNewVersionVideo}
-          </Animate>
+          {!isMobile && (
+            <Animate transitionName="fade">
+              {noShowNewVersionVideo}
+            </Animate>
+          )}
         </div>
       </DocumentTitle>
     );

site/theme/template/Layout/Header.jsx

@@ -48,7 +48,7 @@ export default class Header extends React.Component {
   static contextTypes = {
     router: PropTypes.object.isRequired,
     intl: PropTypes.object.isRequired,
-    isMoblie: PropTypes.bool.isRequired,
+    isMobile: PropTypes.bool.isRequired,
   }
 
   state = {
@@ -111,8 +111,8 @@ export default class Header extends React.Component {
 
   render() {
     const { menuVisible } = this.state;
-    const { isMoblie } = this.context;
-    const menuMode = isMoblie ? 'inline' : 'horizontal';
+    const { isMobile } = this.context;
+    const menuMode = isMobile ? 'inline' : 'horizontal';
     const {
       location, themeConfig,
     } = this.props;
@@ -181,7 +181,7 @@ export default class Header extends React.Component {
     const searchPlaceholder = locale === 'zh-CN' ? '搜索组件...' : 'Search Components...';
     return (
       <header id="header" className={headerClassName}>
-        {isMoblie && (
+        {isMobile && (
           <Popover
             overlayClassName="popover-menu"
             placement="bottomRight"
@@ -210,7 +210,7 @@ export default class Header extends React.Component {
               <Icon type="search" />
               <Input ref={ref => this.searchInput = ref} placeholder={searchPlaceholder} />
             </div>
-            {!isMoblie && menu}
+            {!isMobile && menu}
           </Col>
         </Row>
       </header>

site/theme/template/Layout/index.jsx

@@ -30,12 +30,12 @@ export default class Layout extends React.Component {
     router: PropTypes.object.isRequired,
   }
   static childContextTypes = {
-    isMoblie: PropTypes.bool,
+    isMobile: PropTypes.bool,
   };
 
   getChildContext() {
     return {
-      isMoblie: this.state.isMobile,
+      isMobile: this.state.isMobile,
     };
   }