You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by sh...@apache.org on 2020/11/09 11:08:58 UTC

[incubator-echarts-www] branch next updated: feat: add 5.0 home page about section

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

shenyi pushed a commit to branch next
in repository https://gitbox.apache.org/repos/asf/incubator-echarts-www.git


The following commit(s) were added to refs/heads/next by this push:
     new 8f3d8cd  feat: add 5.0 home page about section
     new ffbdd68  Merge pull request #16 from zhanfang/next
8f3d8cd is described below

commit 8f3d8cdb33e9f0b9b98b8bfd55313f103cb81087
Author: zhanfang <zh...@baidu.com>
AuthorDate: Mon Nov 9 18:43:30 2020 +0800

    feat: add 5.0 home page about section
---
 _jade/components/svg/github.jade  |   5 +
 _jade/components/svg/twitter.jade |   5 +
 _jade/components/svg/wechart.jade |   6 +
 _jade/components/svg/weibo.jade   |   9 ++
 _jade/zh/index.jade               |  32 ++++--
 _scss/_pages.index.scss           | 229 ++++++++++++++------------------------
 images/ercode.jpg                 | Bin 0 -> 65663 bytes
 7 files changed, 129 insertions(+), 157 deletions(-)

diff --git a/_jade/components/svg/github.jade b/_jade/components/svg/github.jade
new file mode 100644
index 0000000..1fe86e4
--- /dev/null
+++ b/_jade/components/svg/github.jade
@@ -0,0 +1,5 @@
+svg(width='22px', height='22px', viewBox='0 0 22 22', version='1.1', xmlns='http://www.w3.org/2000/svg', xmlns:xlink='http://www.w3.org/1999/xlink')
+    g(stroke='none', stroke-width='1', fill='none', fill-rule='evenodd')
+        g(transform='translate(-262.000000, -2480.000000)', fill='rgba(77, 98, 246)')
+            g(transform='translate(252.000000, 2470.000000)')
+                path(d='M29.9006449,27.904446 C28.5016932,29.8668872 26.6944882,31.2248797 24.4790301,31.9784237 C24.2211218,32.0272886 24.0325745,31.9931534 23.9133882,31.876018 C23.7942019,31.7588827 23.7346171,31.6119968 23.7346338,31.4353603 L23.7346338,28.3376019 C23.7346338,27.3880159 23.4865017,26.6930482 22.9902375,26.2526987 C23.5347812,26.1938141 24.024319,26.1058042 24.458851,25.9886688 C24.893383,25.8715335 25.3422785,25.680801 25.8055376,25.4164714 C26.2687966,25.1521418 26. [...]
diff --git a/_jade/components/svg/twitter.jade b/_jade/components/svg/twitter.jade
new file mode 100644
index 0000000..fa8694f
--- /dev/null
+++ b/_jade/components/svg/twitter.jade
@@ -0,0 +1,5 @@
+svg(width='22px', height='19px', viewBox='0 0 22 19', version='1.1', xmlns='http://www.w3.org/2000/svg', xmlns:xlink='http://www.w3.org/1999/xlink')
+    g(stroke='none', stroke-width='1', fill='none', fill-rule='evenodd')
+        g(transform='translate(-1029.000000, -2481.000000)', fill='rgba(0, 172, 237)' fill-rule='nonzero')
+            g(transform='translate(1019.000000, 2470.000000)')
+                path(d='M31.9965682,13.2536272 C31.3736136,14.2239084 30.6196136,15.0506018 29.7346591,15.7332964 C29.7441818,15.8714453 29.7489318,16.0792366 29.7489318,16.3566705 C29.7489318,17.6436908 29.5720682,18.9275445 29.2183409,20.2082316 C28.8645909,21.4890636 28.3274091,22.7184796 27.6069091,23.8965522 C26.8862955,25.0746247 26.0280455,26.1166031 25.0323864,27.0222697 C24.0366364,27.9281298 22.8360682,28.6508066 21.4306364,29.1904211 C20.0251818,29.7300356 18.5226591,30 16.923 [...]
diff --git a/_jade/components/svg/wechart.jade b/_jade/components/svg/wechart.jade
new file mode 100644
index 0000000..bff8024
--- /dev/null
+++ b/_jade/components/svg/wechart.jade
@@ -0,0 +1,6 @@
+svg(width='25px', height='21px', viewBox='0 0 25 21', version='1.1', xmlns='http://www.w3.org/2000/svg', xmlns:xlink='http://www.w3.org/1999/xlink')
+    g(stroke='none', stroke-width='1', fill='none', fill-rule='evenodd')
+        g(transform='translate(-512.000000, -2480.000000)', fill='rgba(93, 201, 116)')
+            g(transform='translate(512.000000, 2480.000000)')
+                path(d='M17.6290595,6.47976119 C17.7534123,6.47976119 17.8770026,6.48260946 18,6.4873469 C17.2166965,2.79549199 13.5198007,0 9.07678865,0 C4.06379837,0 0,3.55853831 0,7.94816178 C0,10.5128275 1.38756065,12.7933344 3.54074891,14.2466508 L2.63388325,17 L5.63681512,15.3050455 C6.69779456,15.6858421 7.85912588,15.8963236 9.07676039,15.8963236 C9.31148885,15.8963236 9.54412784,15.8885344 9.77433851,15.8731886 C9.52032463,15.1807388 9.38270085,14.4428328 9.38270085,13.676822 C9 [...]
+                path(d='M25,13.4664775 C25,9.89513318 21.6421433,7 17.4999862,7 C13.3578291,7 10,9.89513318 10,13.4664775 C10,17.0378217 13.3578567,19.9329549 17.5000138,19.9329549 C18.36973,19.9329549 19.2046277,19.804878 19.9813841,19.5701641 L22.5457108,21 L21.8004292,18.7646117 C23.7349834,17.5951163 25,15.6582837 25,13.4664775 Z M15,12 C14.447707,12 14,11.552293 14,11 C14,10.447707 14.447707,10 15,10 C15.552293,10 16,10.447707 16,11 C16,11.552293 15.552293,12 15,12 Z M20,12 C19.4477 [...]
\ No newline at end of file
diff --git a/_jade/components/svg/weibo.jade b/_jade/components/svg/weibo.jade
new file mode 100644
index 0000000..12b4b2e
--- /dev/null
+++ b/_jade/components/svg/weibo.jade
@@ -0,0 +1,9 @@
+svg(width='25px', height='20px', viewBox='0 0 25 20', version='1.1', xmlns='http://www.w3.org/2000/svg', xmlns:xlink='http://www.w3.org/1999/xlink')
+    g(stroke='none', stroke-width='1', fill='none', fill-rule='evenodd')
+        g(transform='translate(-774.000000, -2480.000000)', fill='rgba(174, 44, 53)')
+            g(transform='translate(767.000000, 2470.000000)')
+                g(transform='translate(7.000000, 10.000000)')
+                    path(d='M9.56107255,18.530208 C5.55942203,18.7083394 2.28534432,16.6598289 2.28534432,13.9878588 C2.28534432,11.3158886 5.55942203,9.08924686 9.56107255,8.91111551 C13.5627231,8.73298415 16.8368008,10.4252319 16.8368008,13.0972021 C16.8368008,15.7691722 13.5627231,18.3520767 9.56107255,18.530208 Z M18.1100532,9.71270657 C17.1096406,9.53457522 17.6553202,9.0001812 17.6553202,9.0001812 C17.6553202,9.0001812 18.5647862,7.48606478 17.473427,6.32821106 C16.1092279,4.903160 [...]
+                    path(d='M12.8641827,12.2517204 C12.2123929,10.4024172 10.0707976,9.57023078 7.92920237,10.2174869 C5.78760713,10.9572081 4.57714023,12.9914416 5.13581726,14.7482796 C5.78760713,16.5975828 7.92920237,17.4297692 10.0707976,16.7825131 C12.2123929,16.135257 13.4228598,14.1010235 12.8641827,12.2517204 Z M8.11542806,15.4880009 C7.37052537,15.6729312 6.53250982,15.3955358 6.34628415,14.7482797 C6.16005847,14.1010235 6.62562266,13.4537674 7.46363821,13.176372 C8.2085409,12.99 [...]
+                    path(d='M24.5953609,9.4285714 C24.5953609,9.3333333 24.6913146,9.2380952 24.6913146,9.14285713 C25.2670362,7.5238095 24.9791754,5.9047619 24.3075001,4.38095238 C23.0601032,1.7142857 20.3734021,0 17.4947939,0 C16.9190722,0 16.3433505,0.0952380996 15.8635825,0.190476199 L15.8635825,0.190476199 L15.8635825,0.190476199 C15.8635825,0.190476199 15.7676289,0.190476199 15.6716753,0.285714299 L15.6716753,0.285714299 C15.2878608,0.476190498 15,0.857142874 15,1.33333335 C15,2.00 [...]
+                    path(d='M17.6310803,4 C17.3252528,4 16.9174827,4.08510639 16.6116551,4.08510639 C16.3058276,4.17021275 16,4.42553192 16,4.76595745 C16,5.10638297 16.3058275,5.36170214 16.7135976,5.36170214 C16.8155402,5.36170214 16.9174827,5.36170214 17.0194252,5.27659575 C17.2233102,5.27659575 17.3252527,5.19148936 17.5291378,5.19148936 C18.548563,5.19148936 19.4660456,5.87234042 19.4660456,6.72340425 C19.4660456,6.89361703 19.4660456,6.97872339 19.3641031,7.14893617 L19.3641031,7.4 [...]
diff --git a/_jade/zh/index.jade b/_jade/zh/index.jade
index 1973858..c5166fa 100644
--- a/_jade/zh/index.jade
+++ b/_jade/zh/index.jade
@@ -159,25 +159,37 @@ block content
             section.normal#about-section
                 .container
                     h3 关注我们
+                    hr
                     p 可以通过以下渠道关注 ECharts,及时获得更多最新动态
                     .btn-panel
                         a#btn-github(href='https://github.com/apache/incubator-echarts')
                             .btn-content
-                                img.lazy(data-src='#{cdnPayRoot}/#{ecWWWLang}/images/icon-github.png?_v_=#{cdnPayVersion}')
-                                span GitHub
-                            .btn-shadow
+                                .btn-logo
+                                    include ../components/svg/github
+                                    span GitHub
+                                .icon-v-right
 
-                        a#btn-weibo(href='https://weibo.com/echarts')
+                        a#btn-weixin
                             .btn-content.zh
-                                img.lazy(data-src='#{cdnPayRoot}/#{ecWWWLang}/images/icon-weibo.png?_v_=#{cdnPayVersion}')
-                                span 微博
-                            .btn-shadow
+                                .btn-logo
+                                    include ../components/svg/wechart
+                                    span 公众号
+                                .weixin-code
+                                    img(src="images/ercode.jpg")
+
+                        a#btn-weibo(href='https://weibo.com/echarts')
+                            .btn-content
+                                .btn-logo
+                                    include ../components/svg/weibo
+                                    span 微博
+                                .icon-v-right
 
                         a#btn-twitter(href='https://twitter.com/echartsjs')
                             .btn-content
-                                img.lazy(data-src='#{cdnPayRoot}/#{ecWWWLang}/images/icon-twitter.png?_v_=#{cdnPayVersion}')
-                                span Twitter
-                            .btn-shadow
+                                .btn-logo
+                                    include ../components/svg/twitter
+                                    span Twitter
+                                .icon-v-right
 
         include ../components/footer
 
diff --git a/_scss/_pages.index.scss b/_scss/_pages.index.scss
index 989e1c1..dd35992 100644
--- a/_scss/_pages.index.scss
+++ b/_scss/_pages.index.scss
@@ -180,23 +180,9 @@ body {
 
     section.normal {
         padding-top: 50px;
-        padding-bottom: 50px;
+        padding-bottom: 165px;
         text-align: center;
     }
-
-    .btn-panel {
-        margin-top: 30px;
-        text-align: center;
-
-        .btn {
-            width: 140px;
-            padding: 9px;
-            margin-left: 0;
-            margin-right: 36px;
-            border-radius: 25px;
-            text-indent: 10px;
-        }
-    }
 }
 
 #efe-more {
@@ -563,29 +549,6 @@ body {
         }
     }
 
-    #about-section {
-        padding-top: 40px;
-        padding-bottom: 90px;
-        background-color: #fff;
-
-        p {
-            margin-top: 12px;
-        }
-
-        .btn-panel {
-            .btn {
-                margin: 0 25px;
-                margin-top: 10px;
-                margin-bottom: 10px;
-            }
-
-            .btn-red {
-                padding-left: 10px;
-            }
-        }
-
-    }
-
 #gongzhonghao {
     margin: 40px 0;
 
@@ -595,141 +558,113 @@ body {
     }
 }
 
-#about-section a {
-    color: #fff;
-    position: relative;
-    background-color: transparent;
-    width: 140px;
-    height: 40px;
-    display: inline-block;
-    margin: 0 15px;
+#about-section {
+    padding-top: 40px;
+    padding-bottom: 90px;
+    background-color: #fff;
 
-    &:hover {
-        text-decoration: none;
+    h3 {
+        font-weight: 600;
+        font-size: 35px;
+        color: #06133B;
     }
-}
 
-    .btn-content {
-        border-radius: 25px;
-        width: 100%;
-        height: 100%;
-        padding: 10px;
-        padding-left: 8px;
-        text-indent: 10px;
-        position: relative;
-        z-index: 100;
-        transition: 0.3s;
-
-        img {
-            margin-right: 10px;
-            position: relative;
-            top: -2px;
-        }
+    hr {
+        display: inline-block;
+        text-align: center;
+        width: 36px;
+        height: 2px;
+        background-color: #8EE3A9;
+        color: #8EE3A9;
+        margin-top: 24px;
+        border: 0px;
     }
 
-    .btn-shadow {
-        display: block;
-        width: 136px;
-        height: 37px;
-        border-radius: 19px;
-        position: absolute;
-        top: 2px;
-        left: 1px;
-        box-shadow: 1px 0 9px rgba(187, 37, 48, 0.6);
-        transition: 0.3s;
+    p {
+        font-size: 12px;
+        color: #949CB1;
+        letter-spacing: 0;
     }
 
-#btn-github {
-    .btn-content {
-        background-color: #4D62F6;
-
-        &:hover {
-            background-color: #7086FF;
-            box-shadow: none;
-        }
-
-        &:active {
-            background-color: #4151CA;
-            box-shadow: none;
-        }
+    .btn-panel {
+        display: flex;
+        justify-content: center;
+        margin-top: 71px;
+        text-align: center;
 
-        img {
-            width: 20px;
-            top: -3px;
+        a {
+            flex: 0 0 220px;
+            height: 78px;
+            display: inline-block;
+            margin: 0 15px;
+            background: #FFFFFF;
+            box-shadow: 2px 4px 14px 4px rgba(112,114,124,0.15);
+            border-radius: 8px;
+        
+            &:hover {
+                text-decoration: none;
+            }
         }
     }
 
-    .btn-shadow {
-        box-shadow: 1px 0 9px rgba(52, 57, 107, 0.6);
-    }
-
-    &:hover .btn-shadow {
-        box-shadow: 1px 3px 9px rgba(52, 57, 107, 0.7);
+    #btn-weixin {
+        .btn-logo span {
+            margin-left: 0px;
+        }
     }
-}
 
-#btn-weibo {
     .btn-content {
-        background-color: #FF414F;
-
-        &:hover {
-            background-color: #FF6060;
-            box-shadow: none;
-        }
-
-        &:active {
-            background-color: #D72D3A;
-            box-shadow: none;
-        }
-
-        &.zh {
-            letter-spacing: 5px;
-        }
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        width: 100%;
+        height: 100%;
+        padding: 9px 22px 9px 24px;
+        text-indent: 10px;
+        position: relative;
+        z-index: 100;
+        transition: 0.3s;
+        line-height: 60px;
+
+        .btn-logo {
+            display: flex;
+            align-items: center;
+            span {
+                margin-left: 14px;
+                font-size: 20px;
+                font-weight: 500;
+                color: #06133B;
+            }
 
-        img {
-            width: 22px;
+            svg {
+                height: 41px;
+                width: 41px;
+            }
+            
         }
-    }
-
-    .btn-shadow {
-        box-shadow: 1px 2px 7px rgba(187, 37, 48, 0.5);
-    }
-
-    &:hover .btn-shadow {
-        box-shadow: 1px 3px 9px rgba(187, 37, 48, 0.7);
-    }
-}
 
-#btn-twitter {
-    .btn-content {
-        background-color: #00ACED;
-
-        &:hover {
-            background-color: #67CFF6;
-            box-shadow: none;
+        .icon-v-right {
+            width: 12px;
+            height: 12px;
+            border: 2px solid rgba(148, 156, 177, 0.40);;
+            border-width: 2px 2px 0 0;
+            transform: rotate(45deg);
+            margin: 0;
+            line-height: 60px;
         }
 
-        &:active {
-            background-color: #019CD6;
-            box-shadow: none;
+        .weixin-code {
+            width: 60px;
         }
 
         img {
-            width: 22px;
+            margin-right: 10px;
+            position: relative;
+            top: -2px;
         }
     }
-
-    .btn-shadow {
-        box-shadow: 1px 0 7px rgba(11, 126, 170, 0.4);
-    }
-
-    &:hover .btn-shadow {
-        box-shadow: 1px 3px 9px rgba(11, 126, 170, 0.7);
-    }
 }
 
-
-
 @media (max-width: 992px) {
     #home-section {
         .description {
diff --git a/images/ercode.jpg b/images/ercode.jpg
new file mode 100644
index 0000000..bc5443d
Binary files /dev/null and b/images/ercode.jpg differ


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org