Merge pull request #916 from ethereum/dev

Deploy v1.3.3

Author: samajammin

.all-contributorsrc

@@ -301,7 +301,9 @@
       "avatar_url": "https://avatars3.githubusercontent.com/u/6292?v=4",
       "profile": "https://shazow.net/",
       "contributions": [
-        "content"
+        "content",
+        "ideas",
+        "a11y"
       ]
     },
     {
@@ -1419,6 +1421,35 @@
       "contributions": [
         "ideas"
       ]
+    },
+    {
+      "login": "linda-xie",
+      "name": "Linda Xie",
+      "avatar_url": "https://avatars0.githubusercontent.com/u/55955358?v=4",
+      "profile": "https://github.com/linda-xie",
+      "contributions": [
+        "review",
+        "content"
+      ]
+    },
+    {
+      "login": "IanEck",
+      "name": "Ian Eck",
+      "avatar_url": "https://avatars2.githubusercontent.com/u/5863338?v=4",
+      "profile": "https://github.com/IanEck",
+      "contributions": [
+        "review",
+        "content"
+      ]
+    },
+    {
+      "login": "cwaring",
+      "name": "Chris Waring",
+      "avatar_url": "https://avatars2.githubusercontent.com/u/106938?v=4",
+      "profile": "http://wwaves.co",
+      "contributions": [
+        "code"
+      ]
     }
   ],
   "contributorsPerLine": 7,

README.md

@@ -1,5 +1,5 @@
 <!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->
-[![All Contributors](https://img.shields.io/badge/all_contributors-154-orange.svg?style=flat-square)](#contributors)
+[![All Contributors](https://img.shields.io/badge/all_contributors-157-orange.svg?style=flat-square)](#contributors)
 <!-- ALL-CONTRIBUTORS-BADGE:END -->
 
 <h1 align="center" style="margin-top: 1em; margin-bottom: 3em;">
@@ -272,7 +272,7 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
     <td align="center"><a href="https://github.com/phillux"><img src="https://avatars1.githubusercontent.com/u/6450379?v=4" width="100px;" alt=""/><br /><sub><b>Phil </b></sub></a><br /><a href="#content-phillux" title="Content">🖋</a></td>
     <td align="center"><a href="https://exomel.com"><img src="https://avatars1.githubusercontent.com/u/11348?v=4" width="100px;" alt=""/><br /><sub><b>Rémi Prévost</b></sub></a><br /><a href="#content-remiprev" title="Content">🖋</a></td>
     <td align="center"><a href="http://shanejonas.net"><img src="https://avatars2.githubusercontent.com/u/364566?v=4" width="100px;" alt=""/><br /><sub><b>Shane</b></sub></a><br /><a href="#content-shanejonas" title="Content">🖋</a></td>
-    <td align="center"><a href="https://shazow.net/"><img src="https://avatars3.githubusercontent.com/u/6292?v=4" width="100px;" alt=""/><br /><sub><b>Andrey Petrov</b></sub></a><br /><a href="#content-shazow" title="Content">🖋</a></td>
+    <td align="center"><a href="https://shazow.net/"><img src="https://avatars3.githubusercontent.com/u/6292?v=4" width="100px;" alt=""/><br /><sub><b>Andrey Petrov</b></sub></a><br /><a href="#content-shazow" title="Content">🖋</a> <a href="#ideas-shazow" title="Ideas, Planning, & Feedback">🤔</a> <a href="#a11y-shazow" title="Accessibility">️️️️♿️</a></td>
     <td align="center"><a href="https://twitter.com/smpalladino"><img src="https://avatars2.githubusercontent.com/u/429604?v=4" width="100px;" alt=""/><br /><sub><b>Santiago Palladino</b></sub></a><br /><a href="#content-spalladino" title="Content">🖋</a></td>
     <td align="center"><a href="http://www.twitter.com/timbeiko"><img src="https://avatars0.githubusercontent.com/u/9390255?v=4" width="100px;" alt=""/><br /><sub><b>Tim Beiko</b></sub></a><br /><a href="#content-timbeiko" title="Content">🖋</a></td>
   </tr>
@@ -429,10 +429,18 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
     <td align="center"><a href="https://www.emin.tech"><img src="https://avatars2.githubusercontent.com/u/10382507?v=4" width="100px;" alt=""/><br /><sub><b>Ahmet Emin Koçal</b></sub></a><br /><a href="#translation-ahmeteminkocal" title="Translation">🌍</a></td>
     <td align="center"><a href="http://empire.studio"><img src="https://avatars0.githubusercontent.com/u/33502282?v=4" width="100px;" alt=""/><br /><sub><b>Aqeel</b></sub></a><br /><a href="#ideas-qnou" title="Ideas, Planning, & Feedback">🤔</a></td>
   </tr>
+  <tr>
+    <td align="center"><a href="https://github.com/linda-xie"><img src="https://avatars0.githubusercontent.com/u/55955358?v=4" width="100px;" alt=""/><br /><sub><b>Linda Xie</b></sub></a><br /><a href="https://github.com/ethereum/ethereum-org-website/pulls?q=is%3Apr+reviewed-by%3Alinda-xie" title="Reviewed Pull Requests">👀</a> <a href="#content-linda-xie" title="Content">🖋</a></td>
+    <td align="center"><a href="https://github.com/IanEck"><img src="https://avatars2.githubusercontent.com/u/5863338?v=4" width="100px;" alt=""/><br /><sub><b>Ian Eck</b></sub></a><br /><a href="https://github.com/ethereum/ethereum-org-website/pulls?q=is%3Apr+reviewed-by%3AIanEck" title="Reviewed Pull Requests">👀</a> <a href="#content-IanEck" title="Content">🖋</a></td>
+    <td align="center"><a href="http://wwaves.co"><img src="https://avatars2.githubusercontent.com/u/106938?v=4" width="100px;" alt=""/><br /><sub><b>Chris Waring</b></sub></a><br /><a href="https://github.com/ethereum/ethereum-org-website/commits?author=cwaring" title="Code">💻</a></td>
+  </tr>
 </table>
 
 <!-- markdownlint-enable -->
 <!-- prettier-ignore-end -->
 <!-- ALL-CONTRIBUTORS-LIST:END -->
 
 This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!
+
+**A note on emojis**
+We use [Twemoji](https://twemoji.twitter.com/), an open-source emoji set created by Twitter. These are hosted by us, and used to provide a consistent experience across operating systems.

docs/.vuepress/components/BuildPage.vue

@@ -17,10 +17,10 @@
         </Button>
       </div>
       <div class="mt-4">
-        <img src="/ethereum-studio.gif" class="w-100" />
+        <img :src="$withBase('/ethereum-studio.gif')" class="w-100" />
       </div>
       <p class="l5 tc-text100 center">
-        <!-- TODO how to include links within translations? -->
+        <!-- TODO translate string -->
         Powered by
         <a
           href="https://superblocks.com"
@@ -43,7 +43,7 @@
         v-for="template in templates"
         class="feature mt-4 mr-1 ml-1 flex flex-column"
       >
-        <span class="l1 ma-0">{{ template.icon }}</span>
+        <span class="l1 ma-0" v-html="inlineMd(template.icon)" />
         <div class="box">
           <h3 class="l4 ma-0 tc-text400">{{ template.title }}</h3>
           <p class="l7 tc-text200">{{ template.description }}</p>
@@ -79,7 +79,7 @@
             class="hide-icon"
           >
             <img
-              :src="resource.img.src"
+              :src="$withBase(resource.img.src)"
               :alt="resource.img.alt || resource.title"
             />
           </a>
@@ -122,9 +122,14 @@
 
 <script>
 import { translate } from '../theme/utils/translations'
+const { inlineMd } = require('../theme/utils/inline-md')
 
 export default {
   methods: {
+    inlineMd: function(str) {
+      return inlineMd(str)
+    },
+
     translateString: function(str) {
       return translate(str, this.$lang)
     },
@@ -145,7 +150,7 @@ export default {
             url: 'https://studio.ethereum.org/1',
             text: this.translateString('page-build-hello-world-link-text')
           },
-          icon: '👋'
+          icon: ':wave:'
         },
         {
           title: this.translateString('page-build-coin-contract-title'),
@@ -156,7 +161,7 @@ export default {
             url: 'https://studio.ethereum.org/2',
             text: this.translateString('page-build-coin-contract-link-text')
           },
-          icon: '🗝️'
+          icon: ':key:'
         },
         {
           title: this.translateString('page-build-crypto-pizza-title'),
@@ -167,7 +172,7 @@ export default {
             url: 'https://studio.ethereum.org/3',
             text: this.translateString('page-build-crypto-pizza-link-text')
           },
-          icon: '🍕'
+          icon: ':pizza:'
         }
       ]
     },

docs/.vuepress/components/Card.vue

@@ -10,6 +10,7 @@
       :level="level"
       :hero="hero"
       :header="header"
+      :headerIsEmoji="headerIsEmoji"
       :leftimg="leftimg"
       :title="title"
       :content="content"
@@ -64,6 +65,11 @@ export default {
       required: false,
       type: String
     },
+    headerIsEmoji: {
+      required: false,
+      type: Boolean,
+      default: false
+    },
     leftimg: {
       required: false,
       type: Boolean

docs/.vuepress/components/CardInner.vue

@@ -8,9 +8,11 @@
   >
     <template v-if="header">
       <!-- Emoji header -->
-      <div v-if="isEmoji" class="header l1 mt-0 mb-1 mr-1">
-        {{ header }}
-      </div>
+      <div
+        v-if="headerIsEmoji"
+        class="header l1 mt-0 mb-1 mr-1"
+        v-html="inlineMd(header)"
+      />
       <!-- Image header -->
       <div
         v-else
@@ -20,12 +22,15 @@
     </template>
 
     <div class="flex flex-column flex-1">
-      <h3 :is="itemTitleTag" class="l4 mb-05 mt-0 tc-text500">
-        {{ title }}
-      </h3>
-      <p class="l7 mb-1 mt-0 tc-text100 art-meta flex flex-center">
-        {{ content }}
-      </p>
+      <h3
+        :is="itemTitleTag"
+        class="l4 mb-05 mt-0 tc-text500"
+        v-html="inlineMd(title)"
+      />
+      <p
+        class="l7 mb-1 mt-0 tc-text100 art-meta flex flex-center"
+        v-html="inlineMd(content)"
+      />
 
       <div v-if="link" class="mt-auto mb-0">
         <template v-if="Array.isArray(link)">
@@ -41,20 +46,26 @@
           >
         </template>
         <template v-else-if="link.text">
-          <Button v-if="link.button" :to="link.to" class="inline-block">{{
-            link.text
-          }}</Button>
+          <Button
+            v-if="link.button"
+            :to="link.to"
+            class="inline-block"
+            v-html="inlineMd(link.text)"
+          />
           <a
             v-else-if="isExternal(link.to)"
             :href="link.to"
             target="_blank"
             rel="noopener noreferrer"
             class="mb-05 inline-block"
-            >{{ link.text }}</a
-          >
-          <router-link v-else :to="link.to" class="mb-05 inline-block">
-            {{ link.text }}
-          </router-link>
+            v-html="inlineMd(link.text)"
+          />
+          <router-link
+            v-else
+            :to="link.to"
+            class="mb-05 inline-block"
+            v-html="inlineMd(link.text)"
+          />
         </template>
       </div>
     </div>
@@ -63,6 +74,7 @@
 
 <script>
 import { isExternal, ensureExt } from '../theme/utils/util'
+const { inlineMd } = require('../theme/utils/inline-md')
 
 export default {
   name: 'CardInner',
@@ -79,6 +91,11 @@ export default {
       required: false,
       type: String
     },
+    headerIsEmoji: {
+      required: false,
+      type: Boolean,
+      default: false
+    },
     leftimg: {
       required: false,
       type: Boolean
@@ -100,18 +117,14 @@ export default {
     itemTitleTag() {
       return 'h' + this.level
     },
-    isEmoji() {
-      var emojiExp = /(?:[\u2700-\u27bf]|(?:\ud83c[\udde6-\uddff]){2}|[\ud800-\udbff][\udc00-\udfff]|[\u0023-\u0039]\ufe0f?\u20e3|\u3299|\u3297|\u303d|\u3030|\u24c2|\ud83c[\udd70-\udd71]|\ud83c[\udd7e-\udd7f]|\ud83c\udd8e|\ud83c[\udd91-\udd9a]|\ud83c[\udde6-\uddff]|\ud83c[\ude01-\ude02]|\ud83c\ude1a|\ud83c\ude2f|\ud83c[\ude32-\ude3a]|\ud83c[\ude50-\ude51]|\u203c|\u2049|[\u25aa-\u25ab]|\u25b6|\u25c0|[\u25fb-\u25fe]|\u00a9|\u00ae|\u2122|\u2139|\ud83c\udc04|[\u2600-\u26FF]|\u2b05|\u2b06|\u2b07|\u2b1b|\u2b1c|\u2b50|\u2b55|\u231a|\u231b|\u2328|\u23cf|[\u23e9-\u23f3]|[\u23f8-\u23fa]|\ud83c\udccf|\u2934|\u2935|[\u2190-\u21ff])/g
-      var t = this.header.match(emojiExp)
-      return t && t.length
-    },
     cardTag() {
       tag = false(this.link && isExternal(this.link.to)) && (tag = 'a')
       !this.clickable && (tag = 'div')
       return tag
     }
   },
   methods: {
+    inlineMd,
     isExternal,
     ensureExt
   }

docs/.vuepress/components/CardList.vue

@@ -5,6 +5,7 @@
       span="3"
       :hero="item.hero"
       :header="item.header"
+      :headerIsEmoji="item.headerIsEmoji"
       :leftimg="item.leftimg"
       :title="item.title"
       :content="item.content"

docs/.vuepress/components/HomePage.vue

@@ -22,9 +22,7 @@
         <ul class="tc-text500 ml-05">
           <li
             v-for="item in block.items"
-            :class="
-              `mb-05 ml-025 ${item.highlight && 'highlight highlight-small'}`
-            "
+            :class="`mb-05 ml-025 ${item.highlight && 'highlight'}`"
           >
             <router-link :to="item.to" class="tc-text300 tc-h-primary500">
               {{ translateString(item.text) }}

docs/.vuepress/config.js

@@ -1,3 +1,5 @@
+const fs = require('fs')
+const { parse } = require('twemoji-parser')
 const { translate } = require('./theme/utils/translations')
 const { renderHeaderWithExplicitAnchor } = require('./theme/utils/markdown')
 
@@ -87,6 +89,19 @@ module.exports = {
       return `<${token.tag} ${attrs}>`
     }
 
+    r.emoji = (token, idx) => {
+      // Get file name from parser
+      let file = parse(token[idx].content)
+        .find(({ url }) => url)
+        .url.split('/')
+        .pop()
+      // get svg file contents, remove xml tag, and add a class
+      let svg = fs.readFileSync('node_modules/twemoji/svg/' + file, 'utf8')
+      svg = svg.replace(/\<?[^)]+\?>/im, '')
+      svg = svg.replace(/<svg/g, '<svg class="twemoji-svg"')
+      return svg
+    }
+
     r.heading_open = (tokens, idx, options, env, slf) => {
       tkn = tokens[idx]
       const anchor =
@@ -607,6 +622,7 @@ module.exports = {
         hostname: 'https://ethereum.org',
         changefreq: 'weekly'
       }
-    ]
+    ],
+    ['vuepress-plugin-ipfs']
   ]
 }

docs/.vuepress/theme/components/Hero.vue

@@ -9,7 +9,7 @@
       alt="Ethereum.org - Light"
       width="380"
       height="380"
-      :src="videoSrc"
+      :src="$withBase(videoSrc)"
       playsinline
       autoplay
       loop