add meetup message on the header (#362)

diff --git a/site_config/site.js b/site_config/site.js
index b9323ed..4755221 100644
--- a/site_config/site.js
+++ b/site_config/site.js
@@ -8,6 +8,9 @@
   defaultSearch: 'google', // 默认搜索引擎,baidu或者google
   defaultLanguage: 'en-us',
   'en-us': {
+    meetup: {
+      text: '2021-05-15 14:00(PDT) Apache DolphinScheduler & Apache ShardingSphere Global Online co-Meetup is coming!',
+    },
     pageMenu: [
       {
         key: 'home', // 用作顶部菜单的选中
@@ -210,6 +213,9 @@
     copyright: 'Copyright © 2019-2021 The Apache Software Foundation. Apache DolphinScheduler, DolphinScheduler, and its feather logo are trademarks of The Apache Software Foundation.',
   },
   'zh-cn': {
+    meetup: {
+      text: '2021-05-16 上午 5:00  Apache DolphinScheduler & Apache ShardingSphere 将联合举行全球线上沙龙!',
+    },
     pageMenu: [
       {
         key: 'home',
diff --git a/src/components/header/index.jsx b/src/components/header/index.jsx
index 9d09818..31d9363 100644
--- a/src/components/header/index.jsx
+++ b/src/components/header/index.jsx
@@ -140,6 +140,7 @@
   render() {
     const { type, logo, onLanguageChange } = this.props;
     const { menuBodyVisible, language, search, searchVisible } = this.state;
+    const dataSource = siteConfig[language];
     return (
       <header
         className={
@@ -149,6 +150,18 @@
           })
         }
       >
+        <div
+          className={
+            classnames({
+              'meetup-container': true,
+              [`meetup-container-${type}`]: true,
+            })
+          }
+        >
+          <a href="https://www.meetup.com/dolphinscheduler/events/277413098/">
+            <p>{dataSource.meetup.text}</p>
+          </a>
+        </div>
         <div className="header-body">
           <a href={getLink(`/${language}/index.html`)}>
             <img className="logo" alt={siteConfig.name} title={siteConfig.name} src={getLink(logo)} />
diff --git a/src/components/header/index.scss b/src/components/header/index.scss
index 8597162..db1a746 100644
--- a/src/components/header/index.scss
+++ b/src/components/header/index.scss
@@ -26,6 +26,37 @@
     background-color: #fff;
     box-shadow: 0 2px 10px 0 rgba(0,0,0,0.08);
   }
+  .meetup-container{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 100%;
+    height: 30px;
+    font-family: Avenir-Medium;
+    font-size: 16px;
+    font-weight: bold;
+    text-align: center;
+    &-primary {
+      background-color: #000F20;
+      p{
+        color: #fff;
+      }
+    }
+    &-dark {
+      background-color: #fff;
+      p{
+        // margin-top: 5px;
+        color: #000F20;
+      }
+    }
+    &-normal {
+      background-color: #000F20;
+      p{
+        // margin-top: 5px;
+        color: #fff;
+      }
+    }
+  }
   .header-body {
     max-width: $contentWidth;
     margin: 0 auto;
diff --git a/src/pages/home/index.jsx b/src/pages/home/index.jsx
index 2c01b61..6691286 100644
--- a/src/pages/home/index.jsx
+++ b/src/pages/home/index.jsx
@@ -51,35 +51,6 @@
         });
       });
   }
-  
-  addClick = (length) => {
-    if (this.state.index < length - 1) {
-      this.setState({
-        ...this.state,
-        index: this.state.index + 1,
-      });
-    } else {
-      this.setState({
-        ...this.state,
-        index: 0,
-      });
-    }
-  }
-
-  minusClick =(length) => {
-    if (this.state.index > 0) {
-      this.setState({
-        ...this.state,
-        index: this.state.index - 1,
-      });
-    } else {
-      this.setState({
-        ...this.state,
-        index: length - 1,
-      });
-    }
-  }
-
 
   addClick = (length) => {
     if (this.state.index < length - 1) {