Merge pull request #163 from vuejs/jinjiang/update

sync: #26964a5

Author: veaba

.github/pull_request_template.md

@@ -1,9 +1,5 @@
-# ⚠️⚠️⚠️ DISCLAIMER ⚠️⚠️⚠️:
+## Description of Problem
 
-Thanks for your interest in submitting a PR! At this time, because the docs are in beta, the team is currently in the midst of changes. As a result, **we are not ready for additional contributions yet**.
+## Proposed Solution
 
-## How can I provide feedback?
-
-To be respectful of your time and ideas, **please [create an issue](https://github.com/vuejs/docs-next/issues/new) instead of a pull request**. Otherwise, we will have to simply close your pull request at this time.
-
-Thanks for your understanding!
+## Additional Information

assets/transitions-diagram.ai.zip

@@ -3,7 +3,7 @@
     "@vuepress/plugin-pwa": "^1.5.4",
     "node-sass": "^4.13.1",
     "sass-loader": "^8.0.2",
-    "vuepress": "^1.3.0"
+    "vuepress": "^1.5.4"
   },
   "scripts": {
     "dev": "yarn serve",

package.json

@@ -1,11 +1,7 @@
 <template>
   <ClientOnly>
-    <aside class="beta-banner" v-if="shouldShow">
-      <p>
-        <span class="hide-sm">⚠️ Beta Version:</span>
-        Docs
-        <span class="hide-sm">are</span> in development and subject to change.
-      </p>
+    <aside class="app-banner" v-if="shouldShow">
+      <slot></slot>
       <button ref="closeButton" @click="close">Close</button>
     </aside>
   </ClientOnly>
@@ -39,7 +35,7 @@ export default {
 <style lang="scss" scoped>
 @import '../theme/styles/mixins.scss';
 
-.beta-banner {
+.app-banner {
   position: fixed;
   z-index: 21;
   top: 0;

src/.vuepress/components/BetaBanner.vue renamed to src/.vuepress/components/AppBanner.vue

@@ -11,14 +11,15 @@
           target="_blank"
           rel="sponsored noopener"
           title="Vue.js Courses on Vue Mastery"
-        >Vue Mastery</a>.
-        Watch Vue Mastery’s free
+          >Vue Mastery</a
+        >. Watch Vue Mastery’s free
         <a
-          href="https://www.vuemastery.com/courses/intro-to-vue-js/vue-instance/"
+          href="https://www.vuemastery.com/courses/intro-to-vue-3/intro-to-vue3"
           target="_blank"
           rel="sponsored noopener"
           title="Vue.js Courses on Vue Mastery"
-        >Intro to Vue course</a>.
+          >Intro to Vue course</a
+        >.
       </p>
     </div>
   </div>
@@ -60,7 +61,7 @@ export default {
     }
   },
 
-  mounted () {
+  mounted() {
     if (typeof window !== 'undefined') {
       this.initVideoModal()
     }
@@ -69,7 +70,7 @@ export default {
 </script>
 
 <style lang="scss">
-@import "@theme/styles/_settings.scss";
+@import '@theme/styles/_settings.scss';
 
 .modal {
   box-sizing: border-box;

src/.vuepress/components/common/vuemastery-video-modal.vue

@@ -1,10 +1,13 @@
 const sidebar = {
-  cookbook: [{
-    title: 'Cookbook',
-    collapsable: false,
-    children: ['/cookbook/', '/cookbook/editable-svg-icons']
-  }],
-  guide: [{
+  cookbook: [
+    {
+      title: 'Cookbook',
+      collapsable: false,
+      children: ['/cookbook/', '/cookbook/editable-svg-icons']
+    }
+  ],
+  guide: [
+    {
       title: '基础',
       collapsable: false,
       children: [
@@ -60,7 +63,8 @@ const sidebar = {
     {
       title: '高阶指南',
       collapsable: false,
-      children: [{
+      children: [
+        {
           title: '响应性',
           children: [
             '/guide/reactivity',
@@ -88,7 +92,8 @@ const sidebar = {
       children: [
         '/guide/single-file-component',
         '/guide/testing',
-        '/guide/typescript-support'
+        '/guide/typescript-support',
+        '/guide/mobile'
       ]
     },
     {
@@ -177,21 +182,23 @@ const sidebar = {
     },
     '/api/composition-api'
   ],
-  examples: [{
-    title: '示例',
-    collapsable: false,
-    children: [
-      '/examples/markdown',
-      '/examples/commits',
-      '/examples/grid-component',
-      '/examples/tree-view',
-      '/examples/svg',
-      '/examples/modal',
-      '/examples/elastic-header',
-      '/examples/select2',
-      '/examples/todomvc'
-    ]
-  }]
+  examples: [
+    {
+      title: '示例',
+      collapsable: false,
+      children: [
+        '/examples/markdown',
+        '/examples/commits',
+        '/examples/grid-component',
+        '/examples/tree-view',
+        '/examples/svg',
+        '/examples/modal',
+        '/examples/elastic-header',
+        '/examples/select2',
+        '/examples/todomvc'
+      ]
+    }
+  ]
 }
 
 module.exports = {
@@ -201,22 +208,27 @@ module.exports = {
     [
       'link',
       {
-        href: 'https://fonts.googleapis.com/css?family=Inter:300,400,500,600|Open+Sans:400,600;display=swap',
+        href:
+          'https://fonts.googleapis.com/css?family=Inter:300,400,500,600|Open+Sans:400,600;display=swap',
         rel: 'stylesheet'
       }
     ],
     [
       'link',
       {
-        href: 'https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css',
+        href:
+          'https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css',
         rel: 'stylesheet'
       }
     ],
-    ['link', {
-      rel: 'icon',
-      href: '/logo.png'
-    }],
-     ['link', { rel: 'manifest', href: '/manifest.json' }],
+    [
+      'link',
+      {
+        rel: 'icon',
+        href: '/logo.png'
+      }
+    ],
+    ['link', { rel: 'manifest', href: '/manifest.json' }],
     ['meta', { name: 'theme-color', content: '#3eaf7c' }],
     ['meta', { name: 'apple-mobile-web-app-capable', content: 'yes' }],
     [
@@ -248,10 +260,12 @@ module.exports = {
   ],
   themeConfig: {
     logo: '/logo.png',
-    nav: [{
+    nav: [
+      {
         text: '文档',
         ariaLabel: '文档菜单',
-        items: [{
+        items: [
+          {
             text: '教程',
             link: '/guide/introduction'
           },
@@ -279,10 +293,12 @@ module.exports = {
       },
       {
         text: '生态系统',
-        items: [{
+        items: [
+          {
             text: '社区',
             ariaLabel: '社区菜单',
-            items: [{
+            items: [
+              {
                 text: '团队',
                 link: '/community/team/'
               },
@@ -302,7 +318,8 @@ module.exports = {
           },
           {
             text: '官方项目',
-            items: [{
+            items: [
+              {
                 text: 'Vue Router',
                 link: 'https://next.router.vuejs.org/'
               },
@@ -316,7 +333,8 @@ module.exports = {
               },
               {
                 text: 'Vue Test Utils',
-                link: 'https://vuejs.github.io/vue-test-utils-next-docs/guide/introduction.html'
+                link:
+                  'https://vuejs.github.io/vue-test-utils-next-docs/guide/introduction.html'
               },
               {
                 text: 'Devtools',
@@ -333,7 +351,8 @@ module.exports = {
       {
         text: '支持 Vue',
         link: '/support-vuejs/',
-        items: [{
+        items: [
+          {
             text: '一次性捐款',
             link: '/support-vuejs/#one-time-donations'
           },