tutorial

Author: AlexChien

src/css/_contribution.scss

@@ -0,0 +1,79 @@
+.contribution {
+
+  .chrome-icon {
+      background: url(../images/contrib/[email protected]);
+      width: 57px;
+      height: 57px;
+      background-size: 100%;
+      margin:5px auto;
+  }
+
+  .metamask-icon {
+      background: url(../images/contrib/[email protected]);
+      width: 65px;
+      height: 60px;
+      background-size: 100%;
+      margin:5px auto;
+  }
+
+  .mew-icon {
+      background: url(../images/contrib/[email protected]);
+      width: 58px;
+      height: 57px;
+      background-size: 100%;
+      margin:5px auto;
+  }
+
+  .imtoken-icon {
+      background: url(../images/contrib/imtoken.png);
+      width: 58px;
+      height: 57px;
+      background-size: 100%;
+      margin:5px auto;
+  }
+
+  @media (max-width: 767px) {
+    .address-txt { font-size:80%; }
+  }
+
+  .ico-address {
+      background: url(../images/contrib/att_ico_address.png);
+      width: 280px;
+      height: 280px;
+      background-size: 100%;
+      margin:5px auto;
+  }
+
+  pre { background-color: #333; }
+
+  .box {
+    .title {
+      margin-top:10px; margin-bottom:5px;
+    }
+    .block {
+      padding:10px; background: #333; color: white;
+    }
+  }
+
+  .tabs-container {
+    ul.nav.nav-tabs {
+      li {
+        margin-bottom:-1px;
+        a {
+          padding:15px 25px;
+
+          &:hover {
+            background-color:transparent;
+          }
+        }
+
+        &.active {
+          a {
+            border-bottom:1px solid black;
+            color:white;
+          }
+        }
+      }
+    }
+  }
+}

src/css/_landing.scss

@@ -13,6 +13,7 @@
   body { padding-top:55px; }
 }
 
+body.normal { padding-top: 100px; }
 .wechat-icon { display:none; }
 
 .landing-page.pace .pace-progress {

src/css/app.scss

@@ -14,6 +14,7 @@
 @import "form";
 @import "mailing_list";
 @import "flags";
+@import "contribution";
 
 
 .logo {

src/en.html

@@ -74,4 +74,22 @@ require 'file-loader?name=images/team/[name].[ext]!./team/zhoushuoji.jpg'
 require 'file-loader?name=images/team/[name].[ext]!./team/jizhoudong.jpg'
 require 'file-loader?name=images/team/[name].[ext]!./team/laomao.jpg'
 require 'file-loader?name=images/team/[name].[ext]!./team/huangtianwei.jpg'
-require 'file-loader?name=images/team/[name].[ext]!./team/inb.jpg'
+require 'file-loader?name=images/team/[name].[ext]!./team/inb.jpg'
+
+# contrib
+require 'file-loader?name=images/contrib/mew/[name].[ext]!./contrib/mew/mew-1.png'
+require 'file-loader?name=images/contrib/mew/[name].[ext]!./contrib/mew/mew-2.png'
+require 'file-loader?name=images/contrib/mew/[name].[ext]!./contrib/mew/mew-3.png'
+require 'file-loader?name=images/contrib/mew/[name].[ext]!./contrib/mew/mew-4.png'
+require 'file-loader?name=images/contrib/mew/[name].[ext]!./contrib/mew/mew-5.png'
+require 'file-loader?name=images/contrib/mew/[name].[ext]!./contrib/mew/mew-6.png'
+require 'file-loader?name=images/contrib/mew/[name].[ext]!./contrib/mew/mew-7.png'
+require 'file-loader?name=images/contrib/mew/[name].[ext]!./contrib/mew/mew-8.png'
+require 'file-loader?name=images/contrib/mew/[name].[ext]!./contrib/mew/mew-9.png'
+require 'file-loader?name=images/contrib/mew/[name].[ext]!./contrib/mew/mew-10.png'
+
+require 'file-loader?name=images/contrib/imtoken/[name].[ext]!./contrib/imtoken/imtoken-1.jpg'
+require 'file-loader?name=images/contrib/imtoken/[name].[ext]!./contrib/imtoken/imtoken-2.jpg'
+require 'file-loader?name=images/contrib/imtoken/[name].[ext]!./contrib/imtoken/imtoken-3.jpg'
+require 'file-loader?name=images/contrib/imtoken/[name].[ext]!./contrib/imtoken/imtoken-4.jpg'
+require 'file-loader?name=images/contrib/imtoken/[name].[ext]!./contrib/imtoken/imtoken-5.png'

src/images/contrib/att_ico_address.png

@@ -1,6 +1,7 @@
 # pages
 require "file-loader?name=index.html!./index.html"
 require "file-loader?name=en.html!./en.html"
+require "file-loader?name=instruction.html!./instruction.html"
 
 # icons
 require "file-loader?name=favicon.ico!./favicon.ico"
@@ -23,6 +24,8 @@ require "file-loader?name=resource/[name].[ext]!./resource/whitepaper-v0.2.6.pdf
 
 require "file-loader?name=resource/[name].[ext]!./resource/whitepaper-v0.2.1-draft-en.pdf"
 
+require "file-loader?name=resource/[name].[ext]!./resource/get-imtoken.pdf"
+
 # json
 require "file-loader?name=manifest.json!./manifest.json"
 # require "./manifest.json"

src/images/contrib/[email protected]

@@ -38,8 +38,9 @@ drawAllowcationChart = (locale = "zh-CN") ->
     segmentStrokeWidth: 2,
     responsive: true
 
-  ctx3 = document.getElementById("allocationChart").getContext("2d");
-  new Chart(ctx3, {type: 'pie', data: data, options: options});
+  if document.getElementById("allocationChart")
+    ctx3 = document.getElementById("allocationChart").getContext("2d");
+    new Chart(ctx3, {type: 'pie', data: data, options: options});
 
 window.set_locale = (locale) ->
   if locale == 'en'

src/images/contrib/imtoken.png

@@ -141,7 +141,10 @@ module.exports = function(){
         },
         {
           test: /\.(png|jpg|gif)$/,
-          exclude:[path.resolve(root_dir, "src/images/icons"),path.resolve(root_dir, "src/images/team")],
+          exclude:[
+            path.resolve(root_dir, "src/images/icons"),
+            path.resolve(root_dir, "src/images/team")
+          ],
           use: "file-loader?name=./images/[name].[ext]"
         },
         {