[incubator-dubbo-website] branch asf-site updated: Revert "highlight stars and forks. resolve #322 (#323)" (#324)

[wangxin]

This is an automated email from the ASF dual-hosted git repository.

wangxin pushed a commit to branch asf-site
in repository https://gitbox.apache.org/repos/asf/incubator-dubbo-website.git


The following commit(s) were added to refs/heads/asf-site by this push:
     new 8c38b97  Revert "highlight stars and forks. resolve #322 (#323)" (#324)
8c38b97 is described below

commit 8c38b97697cdabf83d0248d0fef2ec0acfe095af
Author: Xin Wang <xin.victorw...@gmail.com>
AuthorDate: Thu Mar 14 16:09:04 2019 +0800

    Revert "highlight stars and forks. resolve #322 (#323)" (#324)
    
    This reverts commit 49dc2336040852fa6453081d49b84a14676104f6.
---
 src/pages/home/index.jsx  | 40 ++++++++++++++++++++++++++++++----------
 src/pages/home/index.scss | 34 ++++++++++++++++++++++++++++++----
 2 files changed, 60 insertions(+), 14 deletions(-)

diff --git a/src/pages/home/index.jsx b/src/pages/home/index.jsx
index d56c707..1626c4b 100644
--- a/src/pages/home/index.jsx
+++ b/src/pages/home/index.jsx
@@ -17,6 +17,8 @@ class Home extends Language {
     super(props);
     this.state = {
       headerType: 'primary',
+      starCount: 0,
+      forkCount: 0,
     };
   }
 
@@ -33,9 +35,19 @@ class Home extends Language {
         });
       }
     });
+
+    fetch('//api.github.com/repos/apache/incubator-dubbo')
+        .then(res => res.json())
+        .then((data) => {
+          this.setState({
+            starCount: data.stargazers_count,
+            forkCount: data.forks_count,
+          });
+        });
   }
 
   render() {
+    const { starCount, forkCount } = this.state;
     const language = this.getLanguage();
     const dataSource = homeConfig[language];
     const { headerType } = this.state;
@@ -61,16 +73,24 @@ class Home extends Language {
               <Button type="primary" 
link={getLink(dataSource.brand.getStartedButton.link)}>{dataSource.brand.getStartedButton.text}</Button>
               <Button type="normal" 
link={getLink(dataSource.brand.viewOnGithubButton.link)}>{dataSource.brand.viewOnGithubButton.text}</Button>
             </div>
-                                         <div className="github-buttons">
-                                                       <a 
href="https://github.com/apache/incubator-dubbo";>
-                                                               <img 
alt="GitHub stars"
-                                                                               
 
src="https://img.shields.io/github/stars/apache/incubator-dubbo.svg?style=for-the-badge";
 />
-                                                       </a>
-                                                       <a 
href="https://github.com/apache/incubator-dubbo";>
-                                                               <img 
alt="GitHub forks"
-                                                                               
 
src="https://img.shields.io/github/forks/apache/incubator-dubbo.svg?style=for-the-badge";
 />
-                                                       </a>
-                                         </div>
+            <div className="github-buttons">
+              <a href="https://github.com/apache/incubator-dubbo";>
+                <div className="star">
+                  <img src="/img/star.png" />
+                  <span className="type">Star</span>
+                  <span className="line" />
+                  <span className="count">{starCount}</span>
+                </div>
+              </a>
+              <a href="https://github.com/apache/incubator-dubbo/fork";>
+                <div className="fork">
+                  <img src="/img/fork.png" />
+                  <span className="type">Fork</span>
+                  <span className="line" />
+                  <span className="count">{forkCount}</span>
+                </div>
+              </a>
+            </div>
           </div>
           <div className="animation animation1" />
           <div className="animation animation2" />
diff --git a/src/pages/home/index.scss b/src/pages/home/index.scss
index ae04444..3abc3ac 100644
--- a/src/pages/home/index.scss
+++ b/src/pages/home/index.scss
@@ -130,10 +130,36 @@
     }
     .github-buttons {
       margin-top: 20px;
-         text-align: center;
-         a {
-                 margin-left: 20px;
-         }
+      a {
+        margin-right: 10px;
+        margin-left: 10px;
+        img {
+          width: 16px;
+          height: 16px;
+        }
+        div {
+          border-radius: 2px;
+          display: inline-block;
+          height: 24px;
+          line-height: 24px;
+          padding-left: 5px;
+          color: #fff;
+          background: rgba(255, 255, 255, 0.2);
+          .type {
+            padding: 0 8px 0 4px;
+          }
+          .line {
+            display: inline-block;
+            box-sizing: border-box;
+            width: 1px;
+            height: 12px;
+            border-left: 1px solid rgba(255, 255, 255, 0.2);
+          }
+          .count {
+            padding: 0 14px;
+          }
+        }
+      }
     }
   }
   .introduction-section {