You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@dubbo.apache.org by hu...@apache.org on 2018/07/26 14:41:51 UTC

[incubator-dubbo-website] 01/02: Add view on Github button.

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

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

commit f5fa7149410c140359706d605073d23d5a3c69dc
Author: Huxing Zhang <hu...@gmail.com>
AuthorDate: Thu Jul 26 22:31:03 2018 +0800

    Add view on Github button.
---
 index.html                       |  3 ++-
 site_config/home.jsx             | 14 +++++++++++---
 src/components/button/index.jsx  | 22 ++++++++++++++++++++++
 src/components/button/index.scss | 20 ++++++++++++++++++++
 src/pages/home/index.jsx         | 10 ++++++----
 src/pages/home/index.scss        |  3 +++
 6 files changed, 64 insertions(+), 8 deletions(-)

diff --git a/index.html b/index.html
index 9947324..57e07b1 100644
--- a/index.html
+++ b/index.html
@@ -15,6 +15,8 @@
 	<script src="https://f.alicdn.com/react/15.4.1/react-with-addons.min.js"></script>
 	<script src="https://f.alicdn.com/react/15.4.1/react-dom.min.js"></script>
 	<script src="https://cdn.jsdelivr.net/npm/react-router-dom@4.2.2/umd/react-router-dom.min.js"></script>
+	<!-- Place this tag in your head or just before your close body tag. -->
+	<script defer src="https://buttons.github.io/buttons.js"></script>
 	<script src="./build/page.js"></script>
 
 	<!-- Global site tag (gtag.js) - Google Analytics -->
@@ -26,7 +28,6 @@
 
 		gtag('config', 'UA-112489517-1');
 	</script>
-	<script async defer src="https://buttons.github.io/buttons.js"></script>
 </body>
 
 </html>
\ No newline at end of file
diff --git a/site_config/home.jsx b/site_config/home.jsx
index 605e0e9..719b911 100644
--- a/site_config/home.jsx
+++ b/site_config/home.jsx
@@ -5,9 +5,13 @@ export default {
     brand: {
       brandName: 'Apache Dubbo',
       briefIntroduction: 'Apache Dubbo™ (incubating)是一款高性能Java RPC框架。',
-      button: {
-        text: '立即开始',
+      getStartedButton: {
+        text: '快速开始',
         link: '/docs/user/quick-start.md',
+      },
+      viewOnGithubButton: {
+        text: '在Github中查看',
+        link: 'https://github.com/apache/incubator-dubbo',
       }
     },
     introduction: {
@@ -88,9 +92,13 @@ export default {
     brand: {
       brandName: 'Apache Dubbo',
       briefIntroduction: 'Apache Dubbo™ (incubating) is a high-performance, java based open source RPC framework.',
-      button: {
+      getStartedButton: {
         text: 'GET STARTED',
         link: '/docs/user/quick-start.md',
+      },
+      viewOnGithubButton: {
+        text: 'View on Github',
+        link: 'https://github.com/apache/incubator-dubbo',
       }
     },
     introduction: {
diff --git a/src/components/button/index.jsx b/src/components/button/index.jsx
new file mode 100644
index 0000000..f25852d
--- /dev/null
+++ b/src/components/button/index.jsx
@@ -0,0 +1,22 @@
+import React from 'react';
+import classnames from 'classnames';
+import './index.scss';
+
+const Button = (props) => {
+  return (
+    <a
+      className={
+        classnames({
+          button: true,
+          [`button-${props.type}`]: true,
+        })
+      }
+      target="__blank"
+      href={props.link}
+    >
+      {props.children}
+    </a>
+  );
+};
+
+export default Button;
\ No newline at end of file
diff --git a/src/components/button/index.scss b/src/components/button/index.scss
new file mode 100644
index 0000000..d39f362
--- /dev/null
+++ b/src/components/button/index.scss
@@ -0,0 +1,20 @@
+.button {
+    box-sizing: border-box;
+    display: inline-block;
+    height: 48px;
+    line-height: 48px;
+    min-width: 140px;
+    font-family: Avenir-Heavy;
+    font-size: 16px;
+    color: #FFF;
+    text-align: center;
+    border-radius: 4px;
+    text-decoration: none;
+    &-primary {
+      background: #4190FF;
+    }
+    &-normal {
+      background: transparent;
+      border: 1px solid #fff;
+    }
+  }
\ No newline at end of file
diff --git a/src/pages/home/index.jsx b/src/pages/home/index.jsx
index 7bb1066..1c2d8a9 100644
--- a/src/pages/home/index.jsx
+++ b/src/pages/home/index.jsx
@@ -4,6 +4,7 @@ import cookie from 'js-cookie';
 import qs from 'querystring';
 import { getScrollTop } from '../../../utils';
 import Header from '../../components/header';
+import Button from '../../components/button';
 import Footer from '../../components/footer';
 import Language from '../../components/language';
 import Item from './featureItem';
@@ -69,11 +70,9 @@ class Home extends Language {
               <img src="./img/incubating.svg" />
             </div>
             <p className="product-desc">{dataSource.brand.briefIntroduction}</p>
-            <p style={{ marignTop: 20, height: 28 }}>
-              <a className="github-button" href="https://github.com/apache/incubator-dubbo" data-size="large" data-show-count="true" aria-label="Star apache/incubator-dubbo on GitHub">Star</a>
-            </p>
             <div className="button-area">
-              <Link className="button" to={dataSource.brand.button.link}>{dataSource.brand.button.text}</Link>
+              <Link className="button" to={dataSource.brand.getStartedButton.link}>{dataSource.brand.getStartedButton.text}</Link>
+              <Button type="primary" link={dataSource.brand.viewOnGithubButton.link}>{dataSource.brand.viewOnGithubButton.text}</Button>
             </div>
           </div>
           <div className="animation animation1" />
@@ -113,6 +112,9 @@ class Home extends Language {
         </section>
         <section className="users-section">
           <h3>{dataSource.users.title}</h3>
+          <p style={{ marginBottom: 20 }}>
+              <a className="github-button" href="https://github.com/apache/incubator-dubbo" data-size="large" data-show-count="true" aria-label="Star apache/incubator-dubbo on GitHub">Star</a>
+          </p>
           <p>{dataSource.users.desc}</p>
           <div className="users">
           {
diff --git a/src/pages/home/index.scss b/src/pages/home/index.scss
index d1d6260..90775fb 100644
--- a/src/pages/home/index.scss
+++ b/src/pages/home/index.scss
@@ -136,6 +136,9 @@
         color: #2DACEC;
         text-align: center;
       }
+      .button:first-child {
+        margin-right: 20px;
+      }
     }
   }
   .introduction-section {