From 2faeb7ed3ed7cb613895bbadcd862304e0eafaf5 Mon Sep 17 00:00:00 2001 From: yamanoku <0910yama@gmail.com> Date: Sat, 16 Jan 2021 18:18:41 +0900 Subject: [PATCH 1/4] settings: ja locale config --- src/.vuepress/config.js | 3 +- src/.vuepress/config/languages/jp/blog.js | 40 +++++++- .../config/languages/jp/localeConfig.js | 2 +- .../config/languages/jp/sidebarStructure.js | 97 ++++++++++++++++++- .../config/languages/jp/themeLocaleConfig.js | 82 +++++++++++++++- src/.vuepress/config/plugins.js | 9 +- src/.vuepress/config/themeConfig.js | 3 +- 7 files changed, 223 insertions(+), 13 deletions(-) diff --git a/src/.vuepress/config.js b/src/.vuepress/config.js index c88d25e7..f9d7938c 100644 --- a/src/.vuepress/config.js +++ b/src/.vuepress/config.js @@ -12,7 +12,8 @@ module.exports = { postcss: require('./config/postcss'), locales: { '/': require('./config/languages/en/localeConfig'), - '/pt/': require('./config/languages/pt/localeConfig') + '/pt/': require('./config/languages/pt/localeConfig'), + '/jp/': require('./config/languages/jp/localeConfig') }, themeConfig: require('./config/themeConfig'), markdown: { diff --git a/src/.vuepress/config/languages/jp/blog.js b/src/.vuepress/config/languages/jp/blog.js index 2df1ab74..2dd28d0e 100644 --- a/src/.vuepress/config/languages/jp/blog.js +++ b/src/.vuepress/config/languages/jp/blog.js @@ -1,6 +1,42 @@ -const posts = {} +const posts = { + id: 'post', + title: 'すべての投稿', + layout: 'Posts', + itemLayout: 'Post', + dirname: 'jp/posts', + path: '/jp/posts/', + itemPermalink: '/posts/:slug', + frontmatter: { + meta: [ + { + name: 'description', + content: 'Vue.js 開発を中心としたアクセシビリティに関するコミュニティの投稿' + } + ] + }, + pagination: { + layout: 'Posts', + prevText: '<<', + nextText: '>>', + getPaginationPageTitle (pageNumber) { + return `すべての投稿 - ${pageNumber}ページ目` + } + } +} -const categories = {} +const categories = { + id: 'categories', + keys: ['category', 'categories'], + title: 'カテゴリ', + scopeLayout: 'Posts', + path: '/jp/category/', + pagination: { + layout: 'Posts', + getPaginationPageTitle (pageNumber, key) { + return `カテゴリ: ${key} - ${pageNumber}ページ目` + } + } +} module.exports = { posts, diff --git a/src/.vuepress/config/languages/jp/localeConfig.js b/src/.vuepress/config/languages/jp/localeConfig.js index 4bef5d20..03bc2cc0 100644 --- a/src/.vuepress/config/languages/jp/localeConfig.js +++ b/src/.vuepress/config/languages/jp/localeConfig.js @@ -1,5 +1,5 @@ module.exports = { lang: 'ja', title: 'Vue A11y', - description: '' + description: 'Web アクセシビリティ向上のための Vue.js コミュニティの取り組み' } diff --git a/src/.vuepress/config/languages/jp/sidebarStructure.js b/src/.vuepress/config/languages/jp/sidebarStructure.js index dd6f8a2c..cb4befdc 100644 --- a/src/.vuepress/config/languages/jp/sidebarStructure.js +++ b/src/.vuepress/config/languages/jp/sidebarStructure.js @@ -1,5 +1,96 @@ module.exports = { - project: [], - posts: [], - recipes: [] + project: [ + { + title: 'プロジェクト', + children: [ + ['はじめに', ''], + ['ロードマップ', 'https://github.com/vue-a11y/vue-a11y.com/projects/2'], + ['参加者', 'people'], + ['コントリビュート', 'how-to-contribute'], + ] + }, + { + title: 'アクセシビリティ', + children: [ + ['リソース', 'resources'], + ['Vue A11Y チェックリスト', 'vue-a11y-checklist'], + ] + }, + { + title: 'コミュニティ', + children: [ + ['パッケージ', 'https://github.com/vue-a11y/awesome-a11y-vue#components-and-plugins'], + ['UI プロジェクト', 'https://github.com/vue-a11y/awesome-a11y-vue#accessible-libraries'], + ['Awesome', 'https://github.com/vue-a11y/awesome-a11y-vue'] + ] + } + ], + + posts: [ + { + title: 'カテゴリ', + type: 'manual', + children: [ + ['ニュース', '/jp/category/news/'], + ['HTML', '/jp/category/html/'], + ['ARIA', '/jp/category/aria/'], + ['WCAG', '/jp/category/wcag/'], + ['ツール', '/jp/category/tools/'], + ['パッケージ', '/jp/category/packages/'], + ['Single Page App', '/jp/category/spa/'] + ] + }, + // SOON + // { + // title: '24 Vue A11y', + // type: 'manual', + // children: [ + // ['2020', '/category/24-vue-a11y-2020/'] + // ] + // }, + { + title: 'Twitter でフォローする', + children: [ + ['Sarah Drasner', 'https://twitter.com/sarah_edo'], + ['Maria Lamardo', 'https://twitter.com/MariaLamardo'], + ['Alan Ktquez', 'https://twitter.com/ktquez'], + ['Jinjiang', 'https://twitter.com/zhaojinjiang'], + ['Marcus Herrmann', 'https://twitter.com/_marcusherrmann'], + ['Austin Gil', 'https://twitter.com/Stegosource'], + ['Callum Macrae', 'https://twitter.com/callumacrae'], + ['Kevin Deisz', 'https://twitter.com/kddeisz'], + ['Victoria Bergquist', 'https://twitter.com/vicbergquist'] + ] + } + ], + + recipes: [ + { + title: 'レシピ', + children: [ + ['はじめに', ''] + ] + }, + { + title: 'ウィジェット', + children: [ + ['アコーディオン', 'widgets/accordion'], + ['アラート', 'widgets/alert'], + ['パンくず', 'widgets/breadcrumbs'], + ['カード', 'widgets/card'], + ['カルーセル', 'widgets/carousel'], + ['ダイアログ', 'widgets/dialog'], + ['モバイルナビゲーション', 'widgets/mobile-navigation'], + ['スキップリンク', 'widgets/skip-links'], + ['タブ', 'widgets/tabs'], + ['トースト', 'widgets/toast'] + ] + }, + { + title: 'ヒント', + children: [ + ['Vue における ARIA 属性', 'tips/aria-attributes-in-vue'] + ] + } + ] } diff --git a/src/.vuepress/config/languages/jp/themeLocaleConfig.js b/src/.vuepress/config/languages/jp/themeLocaleConfig.js index 15a31e2e..cea9d5ff 100644 --- a/src/.vuepress/config/languages/jp/themeLocaleConfig.js +++ b/src/.vuepress/config/languages/jp/themeLocaleConfig.js @@ -1,5 +1,83 @@ +const sidebar = require('./sidebarStructure') + module.exports = { - enabled: false, + enabled: true, label: '日本語', - nav: [] + editLinkText: 'GitHub で編集する', + lastUpdatedText: '最終更新', + backToTopText: 'ページトップに戻る', + backToText: '戻る', + shareLinksText: 'シェア', + externalLinkText: '新しいタブで開く', + skipTo: { + label: 'コンテンツにスキップする', + to: '#main' + }, + newsletter: { + title: 'ニュースレターを購読する', + label: 'Eメールアドレス', + description: 'メールアドレスを入力すると、記事、ビデオ、アップデート、イベントの情報を Vue.js アクセシビリティコミュニティから受け取ることができます。', + textButton: '購読する' + }, + toc: { + title: '目次' + }, + nav: [ + { + text: 'プロジェクト', + link: '/jp/project/' + }, + { + text: '投稿', + link: '/jp/posts/' + }, + { + text: 'レシピ', + link: '/jp/recipes/' + }, + { + text: '設定', + link: '/jp/settings/' + } + ], + sidebar: { + '/jp/project/': sidebar.project, + '/jp/posts/': sidebar.posts, + '/jp/category/': '/jp/posts/', + '/jp/recipes/': sidebar.recipes + }, + a11y: { + codeSnippet: { + copy: { + text: 'クリップボードにコピーしました', + ariaLabel: 'コードスニペットをクリップボードにコピー', + textCopied: 'コードをコピーしました!' + }, + skip: { + text: 'スキップ', + ariaLabel: 'スニペットコードをスキップ' + } + }, + labels: { + menuButton: { + open: 'サブナビゲーションを開く', + close: 'サブナビゲーションを閉じる' + } + }, + settings: { + theme: { + altText: 'ブラウザテーマのイラスト' + } + }, + landmarks: { + nav: { + main: 'メインナビゲーション', + secondary: 'サブナビゲーション' + }, + post: { + summary: 'Summary', + content: 'Content post' + } + } + } } diff --git a/src/.vuepress/config/plugins.js b/src/.vuepress/config/plugins.js index c8db8cb2..8730a317 100644 --- a/src/.vuepress/config/plugins.js +++ b/src/.vuepress/config/plugins.js @@ -3,7 +3,8 @@ const resolve = pathName => path.join(__dirname, pathName) const blogConfig = { en: require('./languages/en/blog'), - pt: require('./languages/pt/blog') + pt: require('./languages/pt/blog'), + jp: require('./languages/jp/blog'), } const customBlock = { @@ -45,11 +46,13 @@ module.exports = [ }, directories: [ blogConfig.en.posts, - blogConfig.pt.posts + blogConfig.pt.posts, + blogConfig.jp.posts ], frontmatters: [ blogConfig.en.categories, - blogConfig.pt.categories + blogConfig.pt.categories, + blogConfig.jp.categories ] } ], diff --git a/src/.vuepress/config/themeConfig.js b/src/.vuepress/config/themeConfig.js index 4ed1b301..fd0badc9 100644 --- a/src/.vuepress/config/themeConfig.js +++ b/src/.vuepress/config/themeConfig.js @@ -48,6 +48,7 @@ module.exports = { authors: require('./authors'), locales: { '/': require('./languages/en/themeLocaleConfig'), - '/pt/': require('./languages/pt/themeLocaleConfig') + '/pt/': require('./languages/pt/themeLocaleConfig'), + '/jp/': require('./languages/jp/themeLocaleConfig'), } } From 2f8a80de6151203f57be404097535efdfabcaadd Mon Sep 17 00:00:00 2001 From: yamanoku <0910yama@gmail.com> Date: Sat, 16 Jan 2021 18:18:53 +0900 Subject: [PATCH 2/4] init: jp contents --- src/jp/index.md | 22 ++ src/jp/posts/2020-09-01-post-test.md | 56 +++++ src/jp/project/how-to-contribute.md | 76 ++++++ src/jp/project/index.md | 21 ++ src/jp/project/people.md | 11 + src/jp/project/posts-guide.md | 216 ++++++++++++++++++ src/jp/project/resources.md | 11 + src/jp/project/supporting.md | 10 + src/jp/project/tools-testing.md | 11 + src/jp/project/vue-a11y-checklist.md | 11 + src/jp/recipes/contribute.md | 11 + src/jp/recipes/index.md | 14 ++ src/jp/recipes/tips/aria-attributes-in-vue.md | 7 + src/jp/recipes/widgets/accordion.md | 7 + src/jp/recipes/widgets/alert.md | 7 + src/jp/recipes/widgets/breadcrumbs.md | 7 + src/jp/recipes/widgets/card.md | 7 + src/jp/recipes/widgets/dialog.md | 7 + src/jp/recipes/widgets/mobile-navigation.md | 7 + src/jp/recipes/widgets/skip-links.md | 7 + src/jp/recipes/widgets/tabs.md | 7 + src/jp/settings/index.md | 59 +++++ 22 files changed, 592 insertions(+) create mode 100644 src/jp/index.md create mode 100644 src/jp/posts/2020-09-01-post-test.md create mode 100644 src/jp/project/how-to-contribute.md create mode 100644 src/jp/project/index.md create mode 100644 src/jp/project/people.md create mode 100644 src/jp/project/posts-guide.md create mode 100644 src/jp/project/resources.md create mode 100644 src/jp/project/supporting.md create mode 100644 src/jp/project/tools-testing.md create mode 100644 src/jp/project/vue-a11y-checklist.md create mode 100644 src/jp/recipes/contribute.md create mode 100644 src/jp/recipes/index.md create mode 100644 src/jp/recipes/tips/aria-attributes-in-vue.md create mode 100644 src/jp/recipes/widgets/accordion.md create mode 100644 src/jp/recipes/widgets/alert.md create mode 100644 src/jp/recipes/widgets/breadcrumbs.md create mode 100644 src/jp/recipes/widgets/card.md create mode 100644 src/jp/recipes/widgets/dialog.md create mode 100644 src/jp/recipes/widgets/mobile-navigation.md create mode 100644 src/jp/recipes/widgets/skip-links.md create mode 100644 src/jp/recipes/widgets/tabs.md create mode 100644 src/jp/settings/index.md diff --git a/src/jp/index.md b/src/jp/index.md new file mode 100644 index 00000000..4da73561 --- /dev/null +++ b/src/jp/index.md @@ -0,0 +1,22 @@ +--- +layout: Full +view: Home + +actionText: Get Started +actionLink: /project/ + +heroImage: /hero-accessibility.svg +heroImageAlternativeText: Illustration of a visually impaired man standing and a woman in a wheelchair + +sponsorsText: Sponsors +supportersText: Supporters + +features: +- title: Examples + details: Several examples of how to apply ARIA, the techniques of WCAG and the best practices in your Vue.js components. +- title: Packages + details: Developing and helping the most used Vue.js components to keep their components accessible. +- title: A11y contents + details: Useful links, articles, videos, Web accessibility events, both in the context of Vue.js and in others. + +--- \ No newline at end of file diff --git a/src/jp/posts/2020-09-01-post-test.md b/src/jp/posts/2020-09-01-post-test.md new file mode 100644 index 00000000..adf8484b --- /dev/null +++ b/src/jp/posts/2020-09-01-post-test.md @@ -0,0 +1,56 @@ +--- +title: 'Example post: The first post' +description: Description test page +summary: Summary test page + +categories: [news, aria, wcag, tools, packages, spa, html] +author: ktquez + +date: 2020-09-01 16:00:00 +--- + +## Test post (please ignore) + +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer risus nulla, viverra a porttitor eu, euismod eget nisl. Pellentesque pharetra diam orci, id blandit metus pretium ac. + +Suspendisse rhoncus mauris a sapien gravida, ut pulvinar urna ultrices. Aenean semper nisi vitae laoreet semper. Sed convallis massa ut commodo gravida. + +Praesent vehicula pharetra tincidunt. Proin nec elit volutpat, lobortis dui eu, hendrerit sapien. Donec sapien quam, dictum sit amet neque eu, malesuada ultrices libero. Morbi blandit augue in turpis porttitor porta. + +:::: fig code +::: headerCode index.html +```html + + + Creative Commons Attribution Share-alike license + + +``` +::: +::: figcap +Using <small> around a [Creative Commons license](http://creativecommons.org/choose/) link with `rel="license"` +::: +:::: + +Nullam aliquet quam a eros mollis, eu rhoncus magna imperdiet. Donec quis scelerisque nulla. + +Donec auctor, neque eget imperdiet consequat, sapien massa suscipit orci, quis condimentum dolor nisl dapibus nisl. + +:::: fig bq +::: bq +VuePress is composed of two parts: a minimalistic static site generator with a Vue-powered theming system and Plugin API, and a default theme optimized for writing technical documentation. +::: +::: figcap +[W3C, HTML draft documentation 2020](https://google.com) +::: +:::: + +Praesent mollis ornare felis vel egestas. Ut sit amet ex imperdiet, suscipit urna vel, vestibulum ex. + +Nam iaculis nisl at diam suscipit tincidunt. Nam sit amet magna vitae velit sodales feugiat. + +Donec feugiat sagittis metus, non rutrum turpis. Fusce turpis dolor, feugiat sit amet interdum nec, ultrices eget metus. + +::: alert warning +This is a warning +::: \ No newline at end of file diff --git a/src/jp/project/how-to-contribute.md b/src/jp/project/how-to-contribute.md new file mode 100644 index 00000000..a61a5e29 --- /dev/null +++ b/src/jp/project/how-to-contribute.md @@ -0,0 +1,76 @@ +--- +description: Find out how to contribute to Vue Accessibility project +--- + + +# How to contribute + +First of all, happy that you are here on this page and thinking about contributing to the project. + +## Development + +To contribute to the development of the site, you can initially open an issue on Github and report an error or propose a new feature. + +If you are willing to develop, there is no mystery, just open a Pull Request following the template. + +This website uses [Vuepress](https://vuepress.vuejs.org/), [TailwindCSS](https://tailwindcss.com/), and [Vue composition API](https://composition-api.vuejs.org/). + +::: alert tip +Try to follow the [official style guide for Vue.js](https://vuejs.org/v2/style-guide/) as much as possible. +::: + +## Writing + +We will love to hear your content idea, so the first step is to open an issue using the specific template. + +You can open an issue: + +- [New Post/Article](https://github.com/vue-a11y/vue-a11y.com/issues/new?labels=Post&template=new-post.md&title=Post%2FArticle%3A+%5BYour+title%5D) +- [New Widget (Recipe)](https://github.com/vue-a11y/vue-a11y.com/issues/new?labels=Recipe,Widget&template=new-widget.md&title=Recipe%28widget%29%3A+%5BYour+title%5D) +- [New Tip (Recipe)](https://github.com/vue-a11y/vue-a11y.com/issues/new?labels=Recipe,Tip&template=new-tip.md&title=Recipe%28Tip%29%3A+%5BYour+title%5D) + +We also have an [issue](https://github.com/vue-a11y/vue-a11y.com/issues/14) with several content ideas, feel free to add other subjects that you want to see as content on the site. + +Our intention is to reward the creator for each content published on the site, we will soon achieve this feat. + +::: alert warning +We created a guide with tips for creating posts, recipes, or tips. [Posts guide](/project/posts-guide.html#posts-guide) +::: + +## Answering questions + +In our [GitHub Problem Tracker](https://github.com/vue-a11y/vue-a11y.com/issues), we are open to answering questions from people of all levels of knowledge. + +We will be grateful to receive your help by answering questions and also sharing your experience with us. + +We are also daily answering questions in the Vue.js community on Discord ([Vue Land](https://discord.gg/vue)), join us. + +## Sharing + +When you share, you are helping the web community to understand more about accessibility through content. + +[Vue a11y](/) focuses specifically on helping the Vue.js community by creating content, plugins, and components that make it easier on a daily basis. + +We count on your support and the support of the community to make it reach your friends and other developers. + +## Supporting + +The project is supported by people who love Vue.js and accessibility, and who know the importance of the web being more inclusive. + +Your support is very important so that we can devote more time to creating content, keeping plugins and components up to date, in addition to funding content creators for their time dedicated to creating robust and well-tested posts. + +

+We have separated some rewards for our Open Collective supporters. +
+ + Donate to our collective (opens in a new tab) + +

+ +--- + +
+ +::: alert Work in progress. +[Follow the issue on Github](https://github.com/vue-a11y/vue-a11y.com/issues/15) +::: \ No newline at end of file diff --git a/src/jp/project/index.md b/src/jp/project/index.md new file mode 100644 index 00000000..2fdd3ec7 --- /dev/null +++ b/src/jp/project/index.md @@ -0,0 +1,21 @@ +--- +description: Vue A11y is an open-source community project, where the main objective is to create content focused on Vue.js and bringing maximum accessibility +--- + +# Introduction + +**Vue A11y** is an open-source community project, where the main objective is to create content focused on Vue.js and bringing maximum accessibility. + +The project is open, so anyone who wants to participate is very welcome. + +Accessibility is super important! We believe that if we join efforts to centralize content that is easy to understand, through recipes, tips, and blog posts, we can help developers and creators of Vue.js libraries to have consistent and more inclusive code. + +Feel invited to **[contribute](/project/how-to-contribute.html)** in the development, in the creation of posts, recipes and tips, or by giving an incentive **[supporting](/project/how-to-contribute.html#supporting)** the project. + +--- + +
+ +::: alert Updates +We are just getting started. We will always keep you updated through [issues on Github](https://github.com/vue-a11y/vue-a11y.com/issues) and our [Twitter account](https://twitter.com/vue_a11y). +::: diff --git a/src/jp/project/people.md b/src/jp/project/people.md new file mode 100644 index 00000000..cf8f7b68 --- /dev/null +++ b/src/jp/project/people.md @@ -0,0 +1,11 @@ +--- +description: Find out who are the people who make the vue-a11y project happen +--- + +# Who make it happen. + +
+ +::: alert Work in progress. +Coming soon +::: \ No newline at end of file diff --git a/src/jp/project/posts-guide.md b/src/jp/project/posts-guide.md new file mode 100644 index 00000000..1cbf3c8b --- /dev/null +++ b/src/jp/project/posts-guide.md @@ -0,0 +1,216 @@ +--- +description: Guidelines for creating content for Vue.js A11y (posts, recipes and tips). +--- +# Posts guide + +## How to begin + +First of all, do a brief search to see if your post idea does not yet exist on the site. + +If you are looking for ideas, we have an [issue](https://github.com/vue-a11y/vue-a11y.com/issues/14) with several post ideas, feel free to reserve a subject. + +After checking, reserve your post by opening an issue using some of our templates: + +- [New Post/Article](https://github.com/vue-a11y/vue-a11y.com/issues/new?labels=Post&template=new-post.md&title=Post%2FArticle%3A+%5BYour+title%5D) +- [New Widget (Recipe)](https://github.com/vue-a11y/vue-a11y.com/issues/new?labels=Recipe,Widget&template=new-widget.md&title=Recipe%28widget%29%3A+%5BYour+title%5D) +- [New Tip (Recipe)](https://github.com/vue-a11y/vue-a11y.com/issues/new?labels=Recipe,Tip&template=new-tip.md&title=Recipe%28Tip%29%3A+%5BYour+title%5D) + +After booking a subject, fork the repository, follow the steps in our [README](https://github.com/vue-a11y/vue-a11y.com/blob/master/README.md) for installation. + +Create a markdown file in the specific post type directory and in the language in which the post will be written. + +For example in the English language: + +- `src/posts`: For blog posts; +- `src/recipes/widgets`: For posting widgets; +- `src/recipes/tips`: For quick tip posts; + +::: alert warning +Follow the structure `2020-05-12-my-post.md` +::: + +After completing, create a PR and request review from members for the latest adjustments and merge your post. + +## Frontmatter + +### Blog posts + +::: headerCode 2020-05-12-my-post.md +```yaml +--- +title: Post title # (Required) - between 50-65 characters +description: Description of the post # (Required) - up to 155 characters +summary: Summary of the post or tl;dr # (Optional) +categories: Array of categories that match the post # (Required) +tag: Array of tags that match the post # (Optional) +author: author's nickname # (Optional) +date: YYYY/MM/DD HH:ii:ss # (Required) +--- +``` +::: + +::: alert warning +Available categories: `[news, aria, wcag, tools, packages, spa, html]`. +::: + +::: alert warning +The tags have no limitations, you can create as many tags as you want `[screen-reader, form, ...]`. +::: + +::: alert tip +Add your author information `src/config/authors.json`, soon we will have a page dedicated to the authors of the site. +::: + +## Best pratices + +- Use a correct hierarchy of headings; +- Add the lang to the code blocks (highlight code); +- Alternative text in images; +- Write simply and understandably; +- [Avoid wall of text](https://axesslab.com/accessibility-according-to-pwd/#wall-of-text); +- Use lazy-load for iframes (IntersectObserver Component) + +## Using custom blocks + +### Figure + Blockquote + Figcaption + +::::: headerCode +``` +:::: fig bq +::: bq +VuePress is composed of two parts: a minimalistic static site generator with a Vue-powered theming system and Plugin API, and a default theme optimized for writing technical documentation. +::: +::: figcap +[Vuepress documentation](https://vuepress.vuejs.org/) +::: +:::: +``` +::::: + +:::: fig bq +::: bq +VuePress is composed of two parts: a minimalistic static site generator with a Vue-powered theming system and Plugin API, and a default theme optimized for writing technical documentation. +::: +::: figcap +[Vuepress documentation](https://vuepress.vuejs.org/) +::: +:::: + +### Tip, Note, Warning, Danger + +:::: headerCode +``` +::: alert tip +This is a tip +::: + +::: alert note +This is a note +::: + +::: alert warning +This is a warning +::: + +::: alert danger +This is a danger +::: +``` +:::: + +::: alert tip +This is a tip +::: + +::: alert note +This is a note +::: + +::: alert warning +This is a warning +::: + +::: alert danger +This is a danger +::: + +### Figure + HeaderCode + Code block + Figcaption + +::::: headerCode +``` +:::: fig code +::: headerCode +main.js +::: +``js +import Vue from 'vue' +import VueAnnouncer from '@vue-a11y/announcer' + +Vue.use(VueAnnouncer) +`` +::: figcap +Basic usage of Vue announcer +::: +:::: +``` +::::: + +:::: fig code +::: headerCode main.js +```js +import Vue from 'vue' +import VueAnnouncer from '@vue-a11y/announcer' + +Vue.use(VueAnnouncer) +``` +::: +::: figcap +Basic usage of Vue announcer +::: +:::: + +### headerCode + Code block + +:::: headerCode +``` +::: headerCode main.js +```js +import Vue from 'vue' +import VueAnnouncer from '@vue-a11y/announcer' + +Vue.use(VueAnnouncer) +`` +::: +``` +:::: + +::: headerCode main.js +```js +import Vue from 'vue' +import VueAnnouncer from '@vue-a11y/announcer' + +Vue.use(VueAnnouncer) +``` +::: + +## Vue in markdown + +### IntersectionObserver component + +Use this component for lazy-load of iframes, images, among other media. + +::: headerCode +```vue + + + +``` +::: \ No newline at end of file diff --git a/src/jp/project/resources.md b/src/jp/project/resources.md new file mode 100644 index 00000000..9ae0d2c7 --- /dev/null +++ b/src/jp/project/resources.md @@ -0,0 +1,11 @@ +--- +description: Essential resources to help you develop and make your Vue app much more accessible. Accessibility tips, posts, vídeos, packages, online tools, and more. +--- + +# Resources + +
+ +::: alert Work in progress. +[Follow the issue on Github](https://github.com/vue-a11y/vue-a11y.com/issues/4) +::: \ No newline at end of file diff --git a/src/jp/project/supporting.md b/src/jp/project/supporting.md new file mode 100644 index 00000000..8e91d49e --- /dev/null +++ b/src/jp/project/supporting.md @@ -0,0 +1,10 @@ +--- +description: Essential resources to help you develop and make your Vue app much more accessible. Accessibility tips, posts, vídeos, packages, online tools, and more. +--- +# Supporting + +
+ +::: alert Work in progress. +Coming soon +::: \ No newline at end of file diff --git a/src/jp/project/tools-testing.md b/src/jp/project/tools-testing.md new file mode 100644 index 00000000..463bcbab --- /dev/null +++ b/src/jp/project/tools-testing.md @@ -0,0 +1,11 @@ +--- +description: ... +--- + +# Tools and Testing + +
+ +::: alert Work in progress. +[Follow the issue on Github](https://github.com/vue-a11y/vue-a11y.com/issues/5) +::: \ No newline at end of file diff --git a/src/jp/project/vue-a11y-checklist.md b/src/jp/project/vue-a11y-checklist.md new file mode 100644 index 00000000..583d579b --- /dev/null +++ b/src/jp/project/vue-a11y-checklist.md @@ -0,0 +1,11 @@ +--- +description: A checklist based on the WCAG principles (POUR) with explanations, links, tips and packages to help you not forget any accessible development techniques. +--- + +# Vue A11y Checklist + +
+ +::: alert Work in progress. +[Follow the issue on Github](https://github.com/vue-a11y/vue-a11y.com/issues/6) +::: \ No newline at end of file diff --git a/src/jp/recipes/contribute.md b/src/jp/recipes/contribute.md new file mode 100644 index 00000000..41561c1e --- /dev/null +++ b/src/jp/recipes/contribute.md @@ -0,0 +1,11 @@ +--- +description: +--- + +# Contribute + +
+ +::: alert Work in progress. +[Follow the issue on Github](https://github.com/vue-a11y/vue-a11y.com/issues/15) +::: diff --git a/src/jp/recipes/index.md b/src/jp/recipes/index.md new file mode 100644 index 00000000..1ec1f9a6 --- /dev/null +++ b/src/jp/recipes/index.md @@ -0,0 +1,14 @@ +--- +description: Tutorials with practical examples, explanations, tests with screen readers, support, and more, to make your Vue.js components even more accessible. +--- + +# Introduction + +
+ +::: alert Work in progress. +We are just getting started. We will always keep you updated through [issues on Github](https://github.com/vue-a11y/vue-a11y.com/issues) and our [Twitter account](https://twitter.com/vue_a11y). +
+**Your contribution is welcome.** + +::: \ No newline at end of file diff --git a/src/jp/recipes/tips/aria-attributes-in-vue.md b/src/jp/recipes/tips/aria-attributes-in-vue.md new file mode 100644 index 00000000..5b67ff51 --- /dev/null +++ b/src/jp/recipes/tips/aria-attributes-in-vue.md @@ -0,0 +1,7 @@ +# How to use ARIA attributes in Vue.js + +
+ +::: alert Work in progress. +[Follow the issue on Github](https://github.com/vue-a11y/vue-a11y.com/issues/13) +::: \ No newline at end of file diff --git a/src/jp/recipes/widgets/accordion.md b/src/jp/recipes/widgets/accordion.md new file mode 100644 index 00000000..1a316fc6 --- /dev/null +++ b/src/jp/recipes/widgets/accordion.md @@ -0,0 +1,7 @@ +# Accordion + +
+ +::: alert Work in progress. +[Follow the issue on Github](https://github.com/vue-a11y/vue-a11y.com/issues/12) +::: \ No newline at end of file diff --git a/src/jp/recipes/widgets/alert.md b/src/jp/recipes/widgets/alert.md new file mode 100644 index 00000000..310f4e3f --- /dev/null +++ b/src/jp/recipes/widgets/alert.md @@ -0,0 +1,7 @@ +# Alert + +
+ +::: alert Work in progress. +[Follow the issue on Github](https://github.com/vue-a11y/vue-a11y.com/issues/12) +::: diff --git a/src/jp/recipes/widgets/breadcrumbs.md b/src/jp/recipes/widgets/breadcrumbs.md new file mode 100644 index 00000000..1c1e9fa7 --- /dev/null +++ b/src/jp/recipes/widgets/breadcrumbs.md @@ -0,0 +1,7 @@ +# Breadcrumb + +
+ +::: alert Work in progress. +[Follow the issue on Github](https://github.com/vue-a11y/vue-a11y.com/issues/12) +::: \ No newline at end of file diff --git a/src/jp/recipes/widgets/card.md b/src/jp/recipes/widgets/card.md new file mode 100644 index 00000000..a81f8c4d --- /dev/null +++ b/src/jp/recipes/widgets/card.md @@ -0,0 +1,7 @@ +# Card + +
+ +::: alert Work in progress. +[Follow the issue on Github](https://github.com/vue-a11y/vue-a11y.com/issues/12) +::: \ No newline at end of file diff --git a/src/jp/recipes/widgets/dialog.md b/src/jp/recipes/widgets/dialog.md new file mode 100644 index 00000000..1ff39def --- /dev/null +++ b/src/jp/recipes/widgets/dialog.md @@ -0,0 +1,7 @@ +# Dialog (Modals) + +
+ +::: alert Work in progress. +[Follow the issue on Github](https://github.com/vue-a11y/vue-a11y.com/issues/12) +::: diff --git a/src/jp/recipes/widgets/mobile-navigation.md b/src/jp/recipes/widgets/mobile-navigation.md new file mode 100644 index 00000000..cadeec54 --- /dev/null +++ b/src/jp/recipes/widgets/mobile-navigation.md @@ -0,0 +1,7 @@ +# Mobile navigation + +
+ +::: alert Work in progress. +[Follow the issue on Github](https://github.com/vue-a11y/vue-a11y.com/issues/12) +::: \ No newline at end of file diff --git a/src/jp/recipes/widgets/skip-links.md b/src/jp/recipes/widgets/skip-links.md new file mode 100644 index 00000000..376e5dfc --- /dev/null +++ b/src/jp/recipes/widgets/skip-links.md @@ -0,0 +1,7 @@ +# Skip links + +
+ +::: alert Work in progress. +[Follow the issue on Github](https://github.com/vue-a11y/vue-a11y.com/issues/12) +::: \ No newline at end of file diff --git a/src/jp/recipes/widgets/tabs.md b/src/jp/recipes/widgets/tabs.md new file mode 100644 index 00000000..a3bd839f --- /dev/null +++ b/src/jp/recipes/widgets/tabs.md @@ -0,0 +1,7 @@ +# Tabs + +
+ +::: alert Work in progress. +[Follow the issue on Github](https://github.com/vue-a11y/vue-a11y.com/issues/12) +::: \ No newline at end of file diff --git a/src/jp/settings/index.md b/src/jp/settings/index.md new file mode 100644 index 00000000..a25e61af --- /dev/null +++ b/src/jp/settings/index.md @@ -0,0 +1,59 @@ +--- +layout: Full +view: Settings + +title: Settings +description: You can configure your preferences to use the Vue A11y. +note: 'NOTE: We use localStorage to store your preferences.' + +language: + title: Display Language + locale: /jp/ + +theme: + title: Themes + successText: '"Theme" modified successfully!' + items: + - label: Light + value: light + + - label: Dark + value: dark + + - label: System config. + value: system + + - label: Sepia + value: sepia + +reading: + title: Reading font + successText: '"Reading font" modified successfully!' + items: + - label: Sans Serif (DM Sans) + value: set-sans-serif + + - label: Serif + value: set-serif + + - label: Monospace + value: set-monospace + + - label: Open dyslexic + value: set-open-dyslexic + +vision: + title: Vision + successText: '"Vision" option modified successfully!' + items: + - label: Increase color contrast + value: set-color-contrast + +motion: + title: Motion + successText: '"Motion" modified successfully!' + items: + - label: Reduce Motion + value: set-reduce-motion + +--- \ No newline at end of file From 8a361eb7e24f75cbfdc4da00a756542fe44df8d3 Mon Sep 17 00:00:00 2001 From: yamanoku <0910yama@gmail.com> Date: Sat, 16 Jan 2021 20:18:25 +0900 Subject: [PATCH 3/4] fix: index title --- src/.vuepress/config/languages/jp/sidebarStructure.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/.vuepress/config/languages/jp/sidebarStructure.js b/src/.vuepress/config/languages/jp/sidebarStructure.js index cb4befdc..9013841c 100644 --- a/src/.vuepress/config/languages/jp/sidebarStructure.js +++ b/src/.vuepress/config/languages/jp/sidebarStructure.js @@ -3,7 +3,7 @@ module.exports = { { title: 'プロジェクト', children: [ - ['はじめに', ''], + '', ['ロードマップ', 'https://github.com/vue-a11y/vue-a11y.com/projects/2'], ['参加者', 'people'], ['コントリビュート', 'how-to-contribute'], @@ -68,7 +68,7 @@ module.exports = { { title: 'レシピ', children: [ - ['はじめに', ''] + '' ] }, { From e3e92912cd292f0cc3baf3838432101f9c91d2e8 Mon Sep 17 00:00:00 2001 From: yamanoku <0910yama@gmail.com> Date: Tue, 19 Jan 2021 23:07:25 +0900 Subject: [PATCH 4/4] fix: review --- src/.vuepress/config/languages/jp/blog.js | 2 +- src/jp/index.md | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/.vuepress/config/languages/jp/blog.js b/src/.vuepress/config/languages/jp/blog.js index 2dd28d0e..92b26f98 100644 --- a/src/.vuepress/config/languages/jp/blog.js +++ b/src/.vuepress/config/languages/jp/blog.js @@ -1,5 +1,5 @@ const posts = { - id: 'post', + id: 'jpPost', title: 'すべての投稿', layout: 'Posts', itemLayout: 'Post', diff --git a/src/jp/index.md b/src/jp/index.md index 4da73561..a7fed926 100644 --- a/src/jp/index.md +++ b/src/jp/index.md @@ -3,7 +3,7 @@ layout: Full view: Home actionText: Get Started -actionLink: /project/ +actionLink: /jp/project/ heroImage: /hero-accessibility.svg heroImageAlternativeText: Illustration of a visually impaired man standing and a woman in a wheelchair