From 02cd4844ca7ba24035b5871972d1a46316b8b69d Mon Sep 17 00:00:00 2001 From: Wako Date: Mon, 10 Dec 2018 23:40:43 -0600 Subject: [PATCH 01/23] feat(tables): it replicates the responsive tables from bootstrap --- index.html | 34 +++++++++++++++++++++++++++++++++- scss/elements/tables.scss | 5 +++++ 2 files changed, 38 insertions(+), 1 deletion(-) diff --git a/index.html b/index.html index efe01fd..d9f0bd6 100644 --- a/index.html +++ b/index.html @@ -152,40 +152,72 @@

Table

-
+
+ + + + + + + + + + + + + + +
Table.is-bordered Table.is-centeredTable.is-centeredTable.is-centeredTable.is-centeredTable.is-centeredTable.is-centered
Thou hast had a good morning Thou hast had a good afternoonThou hast had a good afternoonThou hast had a good afternoonThou hast had a good afternoonThou hast had a good afternoonThou hast had a good afternoon
Thou hast had a good morning Thou hast had a good afternoonThou hast had a good afternoonThou hast had a good afternoonThou hast had a good afternoonThou hast had a good afternoonThou hast had a good afternoon
+
+
+ + + + + + + + + + + + + + +
Table.is-dark Table.is-borderedTable.is-borderedTable.is-borderedTable.is-borderedTable.is-borderedTable.is-bordered
Thou hast had a good morning Thou hast had a good morningThou hast had a good morningThou hast had a good morningThou hast had a good morningThou hast had a good morningThou hast had a good morning
Thou hast had a good morning Thou hast had a good afternoonThou hast had a good afternoonThou hast had a good afternoonThou hast had a good afternoonThou hast had a good afternoonThou hast had a good afternoon
diff --git a/scss/elements/tables.scss b/scss/elements/tables.scss index fd35802..f3e7d32 100644 --- a/scss/elements/tables.scss +++ b/scss/elements/tables.scss @@ -1,3 +1,8 @@ +.nes-table-responsive { + @media (max-width: 768px) { + overflow-x: scroll; + } +} .nes-table { table-layout: fixed; background-color: $background-color; From 9352ea9ced03ef35a23e13573aa77c8c1f65fd4a Mon Sep 17 00:00:00 2001 From: Trezy Date: Mon, 10 Dec 2018 23:26:36 -0600 Subject: [PATCH 02/23] docs: Update README and add CONTRIBUTING I've moved all of the development information from `README.md` to `CONTRIBUTING.md`, plus added some information that I included in a lot of my other contributing instructions. --- CONTRIBUTING.md | 100 ++++++++++++++++++++++++++++++++++++++++++ README.md | 112 ++++++++++++++++++------------------------------ 2 files changed, 142 insertions(+), 70 deletions(-) create mode 100644 CONTRIBUTING.md diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md new file mode 100644 index 0000000..5ddada6 --- /dev/null +++ b/CONTRIBUTING.md @@ -0,0 +1,100 @@ +# Contributing + +You want to contribute to the project? Awesome! + +## Things to know + +This project adheres to the Contributor Covenant code of conduct. By participating, you are expected to uphold this code. Please see our [Code of Conduct][code-of-conduct] for details on reporting unacceptable behavior. + +**Working on your first Pull Request?** +[How to Contribute to an Open Source Project on GitHub][egghead] + +## How do + +* Project setup? + [We've got you covered!](#project-setup) + +* Found a bug? + [Let us know!][new-issue] + +* Patched a bug? + [Make a PR!][new-pr] + +* Adding a new feature? + Make sure to [open an issue][new-issue] describing your feature, then open a [new PR][new-pr] when you're ready for feedback! + +## Project setup + +We're really happy you want to contribute to the project! ❤️ The following steps will get you up and running: + +1. Fork and clone the repo +2. Install the required dependencies: + ```sh + $ npm install + ``` +3. Start up the dev server: + ```sh + $ npm run storybook + ``` + +### Directories +```sh +. +├── index.html: Demo page +├── style.css: Demo page style +├── css: Distribution files +├── docs: Storybook stories +└── scss: Source + ├── base + │ ├── reboot.scss: Don't change! (Bootstrap Reboot) + │ ├── generic.scss: Generic style and reboot.css + │ └── variables.scss: Common variables + ├── elements + ├── form + ├── icons: 16x16 icons + ├── pixel-arts: For icons other than 16x16. + └── utilities +``` + +> Tip: Keep your `master` branch pointing at the original repository and make pull requests from branches on your fork. To do this, run: +> +> ``` +> git remote add upstream https://github.com/nostalgic-css/NES.css.git +> git fetch upstream +> git branch --set-upstream-to=upstream/master master +> ``` +> +> This will add the original repository as a "remote" called "upstream," Then fetch the git information from that remote, then set your local `master` branch to use the upstream master branch whenever you run `git pull`. Then you can make all of your pull request branches based on this `master` branch. Whenever you want to update your version of `master`, do a regular `git pull`. + +## Contributing for members of the `nostalgic-css` organization + +Below are steps which must be followed by the members of the `nostalgic-css` organization. External collaborators only have to follow the above guidelines. + +### Steps for development + +1. Branch from `develop` using the formatting rules below. +2. Do the work required to satisfy the issue. If you identify work that is unrelated to the issue, please [create a new issue][new-issue] and do the work on a separate branch. +3. Submit your PRs to merge back into `develop`. + * Any change which would affect current development should be documented in the description. + * PRs with an issue should be include that issue's number in the title. IE: `[#33] Fix bug` + * Assign the PR to yourself. + * When the PR is ready to be merged, A review should be requested from the `nostalgic-css/NES.css` team. +4. Once the PR is approved, it is the responsibility of the **assignee** to merge the changes to the branch. + +### Commit formatting + +We use [Commitizen][commitizen] and [`commitlint`][commitlint] to make sure all of the commits to the project are easy to read, and [`semantic-release`][semantic-release] to ensure that our releases are automated, [unromantic, and unsentimental][sentimental-versioning]. + + + + + +[all-contributors]: https://github.com/kentcdodds/all-contributors +[code-of-conduct]: https://github.com/nostalgic-css/NES.css/blob/master/CODE_OF_CONDUCT.md +[commitizen]: https://github.com/commitizen/cz-cli +[commitlint]: [https://github.com/marionebl/commitlint] +[egghead]: https://egghead.io/series/how-to-contribute-to-an-open-source-project-on-github +[new-issue]: https://github.com/nostalgic-css/NES.css/issues/new +[new-pr]: https://github.com/nostalgic-css/NES.css/compare/develop...develop +[semantic-release]: https://github.com/semantic-release/semantic-release +[sentimental-versioning]: http://sentimentalversioning.org/ diff --git a/README.md b/README.md index d7aa5c8..2d1af23 100644 --- a/README.md +++ b/README.md @@ -1,16 +1,34 @@ -
- NES.css: NES-style CSS framework + NES.css is a **NES-style(8bit-like)** CSS Framework. -[![Gitter][gitter-badge]][gitter] [![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/) +[![Gitter][gitter-badge]][gitter] [![Commitizen friendly][commitizen-badge]][commitizen] -## Install +## Installation -### CDN +### Styles + +NES.css is available via either npm (preferred) or Yarn, or a CDN. + +#### via package manager + +```shell +npm install nes.css +# or +yarn add nes.css +``` + +Our `package.json` contains some additional metadata under the following keys: +* `sass` - path to our main Sass source file +* `style` - path to our non-minified CSS + +#### via CDN + +Import the CSS via a `` element: ```html @@ -19,29 +37,28 @@ NES.css is a **NES-style(8bit-like)** CSS Framework. ``` -OR +### Fonts -```html - - - - -``` +NES.css doesn't provide any fonts, but we do maintain the following list of fonts that we recommend for usage alongside the library. -### npm - -TODO: npm での使用方法を書く +| Language | Font | +|-----------|--------------------------------------------------------------------| +| (Default) | [Press Start 2P](https://fonts.google.com/specimen/Press+Start+2P) | +| English | [Kongtext](https://www.dafont.com/kongtext.font) | +| Japanese | [美咲フォント](http://www.geocities.jp/littlimi/misaki.htm) | +| Japanese | [Nu もち](http://kokagem.sakura.ne.jp/font/mochi/) | ## Usage NES.css only provides components. You will need to define your own layout. -The default font is [Press Start 2P](https://fonts.google.com/specimen/Press+Start+2P?selection.family=Press+Start+2P) which only supports English characters. When you're using this framework with any language except English, please use another font. Please follow the [instructions](https://developers.google.com/fonts/docs/getting_started) from Google Fonts about how to include them, or simply include it as below: +The recommended font for NES.css is [Press Start 2P][press-start-2p-font]. However, [Press Start 2P][press-start-2p-font] only supports English characters. When you're using this framework with any language other than English, please use another font. Follow the Google Fonts [instructions][google-fonts-guide] about how to include them, or simply include it as below: ```html + + +``` +## Sólo CSS -## CSS Only - -NES.css sólo requiere CSS y no depende de JavaScript. - +NES.css sólo requiere de CSS y no depende de JavaScript. ## Soporte de navegadores @@ -64,57 +81,23 @@ NES.css es compatible con las versiones más recientes de los siguientes navegad Sin probar * IE/Edge - -## Desarrollo - -### Comandos -```sh -git clone git@github.com:BcRikko/NES.css.git -cd NES.css - -npm i - -npm run watch -npm run build -``` - -#### Run Storybook -``` -npm run storybook -``` - -Linting, formatting and building se ejecutan automáticamente en el pre-commit hook. -TODO: ビルドはCIでするように変更したい - -### Directorios -```sh -. -├── index.html: Página demo -├── style.css: Estilo de página demo -├── css: Archivos de distribución -├── docs: Storybook stories -└── scss: Código fuente - ├── base - │ ├── reboot.scss: ¡No cambiar! (Bootstrap Reboot) - │ ├── generic.scss: Estilo genérico y reboot.css - │ └── variables.scss: Variables comunes - ├── elements - ├── form - ├── icons: 16x16 iconos - ├── pixel-arts: Para iconos que no son 16x16. - └── utilities -``` - - - ## Derechos de autor y licencia Código y documentación copyright 2018 [B.C.Rikko](https://github.com/BcRikko). Código publicado con Licencia MIT. Documentación publicada con Creative Commons. +## Desarrollo + +Si deseas colaborar con el proyecto ¡Recibimos todo tipo de contribuciones! ¡Revisa nuestro [`CONTRIBUTING-es.md`][contributing-document] para más información acerca de cómo puedes ayudar a hacer NES.css algo grandioso! + +[commitizen]: http://commitizen.github.io/cz-cli/ +[commitizen-badge]: https://img.shields.io/badge/commitizen-friendly-brightgreen.svg +[contributing-document]: https://github.com/nostalgic-css/NES.css/blob/master/CONTRIBUTING-es.md [gitter]: https://gitter.im/nostalgic-css/Lobby [gitter-badge]: https://img.shields.io/gitter/room/nostalgic-css/Lobby.svg +[google-fonts-guide]: https://developers.google.com/fonts/docs/getting_started +[press-start-2p-font]: https://fonts.google.com/specimen/Press+Start+2P?selection.family=Press+Start+2P From c21373184d57f3a1a2c9bf9a8a6f86df2cc52b45 Mon Sep 17 00:00:00 2001 From: BcRikko Date: Wed, 12 Dec 2018 22:26:29 +0900 Subject: [PATCH 13/23] docs(contributing-jp.md): add contributing-jp.md --- CONTRIBUTING-jp.md | 99 ++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 99 insertions(+) create mode 100644 CONTRIBUTING-jp.md diff --git a/CONTRIBUTING-jp.md b/CONTRIBUTING-jp.md new file mode 100644 index 0000000..12a7b0c --- /dev/null +++ b/CONTRIBUTING-jp.md @@ -0,0 +1,99 @@ +# 貢献する + +このプロジェクトに貢献したいですか?素晴らしい! + +## 知るべきこと + +このプロジェクトはコントリビューター行動規範に準拠しています。参加する場合、あなたにはこの規範を守ることが求められます。許容できない行為の報告の詳細については[行動規範][code-of-conduct]をご覧ください。 + +**はじめてのPull Requestに取り組んでいますか?** +[GitHubでオープンソースプロジェクトに貢献する方法][egghead] + +## どのように行うか + +* プロジェクトのセットアップは? + [サポートします!](#project-setup) + +* バグを見つけましたか? + [お知らせください！][new-issue] + +* バグを修正しましたか? + [PRをつくってください！][new-pr] + +* 新しい機能を追加しましたか? + 必ず機能を説明する[Issueを立てて][new-issue]ください。フィードバックの準備ができたら、[新しいPR][new-pr]を作成してください! + +## プロジェクトの設定 + +私たちはあなたがプロジェクトに貢献したいと思ってくれることを非常に嬉しく思います！ :heart: 以下の手順を実行すると準備ができます: + +1. リポジトリをフォークし、クローンする +2. 必要な依存関係をインストールする: + ```sh + $ npm install + ``` +3. 開発用サーバを起動する: + ```sh + $ npm run storybook + ``` + +### ディレクトリ +```sh +. +├── index.html: デモページ +├── style.css: デモページのスタイル +├── css: 配布用ファイル +├── docs: Storybookのストーリー +└── scss: ソースファイル + ├── base + │ ├── reboot.scss: 変更しないで! (Bootstrap Reboot) + │ ├── generic.scss: 一般的なスタイルとreboot.cssの上書き + │ └── variables.scss: 共通変数 + ├── elements + ├── form + ├── icons: 16x16のアイコン + ├── pixel-arts: 16x16以外のアイコン + └── utilities +``` + +> Tip: あなたの`master`ブランチは元のリポジトリを指すようにし、フォークしたブランチからPull Requestを作成します。これを行うには: +> +> ``` +> git remote add upstream https://github.com/nostalgic-css/NES.css.git +> git fetch upstream +> git branch --set-upstream-to=upstream/master master +> ``` +> +> これにより、元のリポジトリが"upstream"という名前の"remote"として追加されます。そのリモートからgitの情報を取得し、`git pull`を実行する度に`upstream/master`ブランチを使用するように、`master`ブランチを設定します。この時点で、この`master`ブランチからすべてのブランチを作成することができます。あなたの`master`のバージョンを更新したいときは、通常の`git pull`を行います。 + +## `nostalgic-css` Organizationのメンバーに貢献する + +以下は、`nostalgic-css` Organizationのメンバーが従わなければならない手順です。外部のコラボレーターは、上記のガイドラインに従うだけです。 + +### 開発手順 + +1. 以下の書式ルールで`develop`からブランチを切る。 +2. Issue対応に必要な作業。Issueに関係のない問題がある場合は、[新しいIssueを立てて][new-issue]別ブランチで作業してください。 +3. `develop`にマージするようPRを作成する + * 現在の開発に影響を与えるような変更は、その説明を文書化する必要があります。 + * PRのタイトルにIssue番号を含める必要があります。 IE: `[#33] Fix bug` + * 自分自身にPRをアサインします。 + * PRがマージできるようになったら、レビューは`nostalgic-css/NES.css`チームから依頼する必要があります。 +4. PRが承認されたら、変更をマージするのは**assignee**の仕事です。 + +### コミットフォーマット + +プロジェクトへのすべてのコミットは[Commitizen][commitizen]と[`commitlint`][commitlint]を使って読みやすいようにします。さらにリリースが自動化され、[ロマンティックでなく、センチメンタルでもない][sentimental-versioning]ことを保証するために[`semantic-release`]を使用します。 + + + + + +[code-of-conduct]: https://github.com/nostalgic-css/NES.css/blob/master/CODE_OF_CONDUCT.md +[commitizen]: https://github.com/commitizen/cz-cli +[commitlint]: [https://github.com/marionebl/commitlint] +[egghead]: https://egghead.io/series/how-to-contribute-to-an-open-source-project-on-github +[new-issue]: https://github.com/nostalgic-css/NES.css/issues/new +[new-pr]: https://github.com/nostalgic-css/NES.css/compare/develop...develop +[semantic-release]: https://github.com/semantic-release/semantic-release +[sentimental-versioning]: http://sentimentalversioning.org/ From e622e539fda6d87ff505982a21498df7ba79fa32 Mon Sep 17 00:00:00 2001 From: BcRikko Date: Wed, 12 Dec 2018 22:47:09 +0900 Subject: [PATCH 14/23] docs(code_of_conduct-jp.md): add code_of_conduct-jp.md --- CODE_OF_CONDUCT-jp.md | 53 +++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 53 insertions(+) create mode 100644 CODE_OF_CONDUCT-jp.md diff --git a/CODE_OF_CONDUCT-jp.md b/CODE_OF_CONDUCT-jp.md new file mode 100644 index 0000000..b8ba9cb --- /dev/null +++ b/CODE_OF_CONDUCT-jp.md @@ -0,0 +1,53 @@ +# コントリビューター行動規範 + +## 私たちの約束 + +私たちはオープンかつ友好的なコミュニティーを育成するために、コントリビューターやメンテナーとして、年齢、体型、障碍、民族性、性自認および性別表現、経験レベル、国籍、個人の容姿、人種、信仰、性的同一性および指向に関わりなく、私たちのプロジェクトやコミュニティーへの参加を誰にとっても嫌がらせのない体験にすることを誓います。 + +## 私たちの標準 + +前向きな環境を作り上げることに貢献する振る舞いの例: + +* 友好的かつ男女包括用語の使用 +* 異なる観点や経験の尊重 +* 建設的批判の率直な受容 +* コミュニティーにとっての最善への集中 +* 他のコミュニティーメンバーへの共感 + +参加者による容認できない行動の例: + +* 性的な意味を含む言葉や画像、相手の意思に反した性的関心や接近 +* あおり、侮辱的または軽蔑的なコメント、個人攻撃や政治攻撃 +* 公的または私的な嫌がらせ +* 住所、メールアドレスなど、他者のプライベート情報の明示的な許可なき公開 +* 職場において合理的に不適切であると考えられる他の行為 + +## 私たちの責任 + +プロジェクトのメンテナーは、許容できる行動の基準を明確にすることに責任があります。また、何かしらの許容できない行動に対応する、適切かつ公平な是正処置をとることが期待されています。 + +プロジェクトのメンテナーは、この行動規範に沿っていない、コメント、コミット、コード、wiki編集、issue、その他の貢献を削除、編集、拒否する権利と義務を有します。また、他の不適切、脅迫的、攻撃的、嫌がらせと考えられる行動を取ったコントリビューターを一時的もしくは恒久的に追放する権利と義務を有します。 + +## 適用範囲 + +この行動規範は、個人がプロジェクトやそのコミュニティーを代表するとき、プロジェクト内と公共空間の両方において適用されます。プロジェクトやコミュニティーを代表する例として、プロジェクトの公式メールアドレスの使用、ソーシャルメディアの公式アカウント経由の投稿、指名された代表としてのオンラインやオフラインのイベントにおける行動があります。プロジェクトを代表することは、プロジェクトのメンテナーにより、さらに定義され明確化される可能性があります。 + +## 執行 + +暴言、嫌がらせ、またはそれ以外の受け入れられない行動は、[support@nostalgi.cc][support-email]に連絡して、プロジェクトチームに報告される可能性があります。プロジェクトチームに連絡することが望ましくない場合は、以下のいずれかにお気軽にお問い合わせください: + +* B.C.Rikko <[b.c.rikko@gmail.com](mailto:b.c.rikko@gmail.com)> +* Igor Guastalla <[limaguastallaigor@gmail.com](mailto:limaguastallaigor@gmail.com)> +* Trezy <[tre@trezy.com](mailto:tre@trezy.com)> + +すべての苦情は、レビュー、調査され、必要かつ適切と判断された対応がとられます。プロジェクトチームは、事象の報告者に関する守秘義務があります。具体的な執行に関する詳細が別途設定されているかもしれません。 + +この行動規範に誠意を持って従うまたは執行することができないプロジェクトのメンテナーは、プロジェクトをリードしている他のメンバーの判断により、一時的または恒久的な影響を受けることがあります。 + +## 帰属 + +この行動規範は[http://contributor-covenant.org/version/1/4][version]にある[Contributor Covenant][homepage]に バージョン1.4 に適合しています。 + +[homepage]: http://contributor-covenant.org +[support-email]: mailto:support@nostalgi.cc +[version]: http://contributor-covenant.org/version/1/4/ From aeafeed94aba3b678755dd715287c77bf1b9bc49 Mon Sep 17 00:00:00 2001 From: BcRikko Date: Wed, 12 Dec 2018 22:48:31 +0900 Subject: [PATCH 15/23] docs(code_of_conduct): fix my email address and nickname --- CODE_OF_CONDUCT-pt-BR.md | 2 +- CODE_OF_CONDUCT.md | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/CODE_OF_CONDUCT-pt-BR.md b/CODE_OF_CONDUCT-pt-BR.md index 5473580..7c8addc 100644 --- a/CODE_OF_CONDUCT-pt-BR.md +++ b/CODE_OF_CONDUCT-pt-BR.md @@ -36,7 +36,7 @@ Este Código de Conduta aplica-se dentro dos espaços do projeto ou qualquer esp Comportamento abusivo, de assédio ou de outros tipos pode ser comunicado contatando a equipe do projeto [support@nostalgi.cc][support-email]. If contacting the full project team is not desirable, feel free to contact any of them individually: -* B. C. Rikko <[bcrikko@example.com](mailto:b.c.rikko@gmail.com)> +* B.C.Rikko <[b.c.rikko@gmail.com](mailto:b.c.rikko@gmail.com)> * Igor Guastalla <[limaguastallaigor@gmail.com](mailto:limaguastallaigor@gmail.com)> * Trezy <[tre@trezy.com](mailto:tre@trezy.com)> diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md index 5acbccb..646d9ad 100644 --- a/CODE_OF_CONDUCT.md +++ b/CODE_OF_CONDUCT.md @@ -36,7 +36,7 @@ This Code of Conduct applies both within project spaces and in public spaces whe Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team at [support@nostalgi.cc][support-email]. If contacting the full project team is not desirable, feel free to contact any of them individually: -* B. C. Rikko <[bcrikko@example.com](mailto:b.c.rikko@gmail.com)> +* B.C.Rikko <[b.c.rikko@gmail.com](mailto:b.c.rikko@gmail.com)> * Igor Guastalla <[limaguastallaigor@gmail.com](mailto:limaguastallaigor@gmail.com)> * Trezy <[tre@trezy.com](mailto:tre@trezy.com)> From 4dcb94e146a5d56d9a07bd13d1bea9aae553aa0c Mon Sep 17 00:00:00 2001 From: Wako Date: Wed, 12 Dec 2018 13:47:02 -0600 Subject: [PATCH 16/23] docs(add): it adds contriburing-es --- CONTRIBUTING-es.md | 99 ++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 99 insertions(+) create mode 100644 CONTRIBUTING-es.md diff --git a/CONTRIBUTING-es.md b/CONTRIBUTING-es.md new file mode 100644 index 0000000..d1d422c --- /dev/null +++ b/CONTRIBUTING-es.md @@ -0,0 +1,99 @@ +# Contribución + +¿Quieres contribuir al proyecto? ¡Genial! + +## Cosas que tienes que saber + +Este proyecto se apega al Código de Conducta convenido para Contribuyentes. Al participar, se espera que te apegues a este código. Por favor, revisa nuestro [Código de Conducta][code-of-conduct] para más información acerca de reportar comportamiento no apropiado. + +**¿Trabajando en tu primer Pull Request?** +[Cómo contribuir a un proyecto de código abierto en GitHub][egghead] + +## Cómo + +* ¿Configuración del proyecto? + [¡Te tenemos cubierto!](#project-setup) + +* ¿Encontraste un bug? + [¡Házlono saber!][new-issue] + +* ¿Arreglaste un bug? + [¡Haz un PR!][new-pr] + +* ¿Agregando una nueva característica? + Asegúrate de [abrir un issue][new-issue] describiendo tu característica o mejora, ¡Después abre un [nuevo PR][new-pr] cuando estés listo para recibir retroalimentación! + +## Configuración del proyecto + +¡Estamos muy felices porque quieras contribuir al proyecto! ❤️ Los siguientes pasos te ayudarán a poner el proyecto en marcha: + +1. Haz un Fork y Clon del repositorio. +2. Instala las dependencias necesarias: + ```sh + $ npm install + ``` +3. Ejecuta el servidor de desarrollo: + ```sh + $ npm run storybook + ``` + +### Directorios +```sh +. +├── index.html: Página demo +├── style.css: Estilo de la página demo +├── css: Archivos de distribución +├── docs: Storybook stories +└── scss: Código fuente + ├── base + │ ├── reboot.scss: ¡No cambiar! (Bootstrap Reboot) + │ ├── generic.scss: Estilo general y reboot.css + │ └── variables.scss: Variables comunes + ├── elements + ├── form + ├── icons: Iconos 16x16 + ├── pixel-arts: Para iconos que no son 16x16. + └── utilities +``` + +> Tip: Manten tu rama `master` apuntando al repositorio original y haz pull request de las ramas en tu fork. Para hacer esto, ejecuta: +> +> ``` +> git remote add upstream https://github.com/nostalgic-css/NES.css.git +> git fetch upstream +> git branch --set-upstream-to=upstream/master master +> ``` +> +> Esto añadirá el repositorio original como un "remoto" llamado "upstream", *fetch* la información de git desde el remoto, y configura tu rama local `master` para utilizar la rama `upstream/master` cuando ejecutes `git pull`. En este punto, tú puedes crear todas tus ramas desde esta rama `master`. Cuando quieras actualizar tu versión de `master`, haz un `git pull`. + +## Contribución para miembros de la organización `nostalgic-css` + +Debajo hay pasos, los cuales deben ser seguidos por los miembros de `nostalgic-css`. Colaboradores externos sólo tienen que seguir los pasos anteriores. + +### Pasos para desarrollo + +1. Haz una rama desde `develop` utilizando las siguientes reglas de tomato. +2. Haz el trabajo para resolver el *issue*. Si identificas trabajo que no está relacionado con el *issue*, por favor [crea un nuevo issue][new-issue] y haz el trabajo en una rama independiente. +3. Envía tus PRs a hacer *merge* en `develop`. + * Todo cambio que pueda afectar el desarrollo actual deberá ser documentado en la descripción. + * PRs con un *issue* deberán incluir en el título el número del *issue*. E.g. `[#33] Arregla bug` + * Asígnate el PR. + * Cuando el PR esté listo mara ser unido, se deberá solicitar una revisión por parte el equipo de `nostalgic-css/NES.css´. +4. Una vez que el PR sea aprobado, será responsabilidad de la persona **encargada** de unir los cambios a la rama. + +### Formatos de commit + +Utilizamos [Commitizen][commitizen] and [`commitlint`][commitlint] para asegurarnos que nuestros lanzamientos sean automáticos, [unromantic, and unsentimental][sentimental-versioning]. + + + + + +[code-of-conduct]: https://github.com/nostalgic-css/NES.css/blob/master/CODE_OF_CONDUCT.md +[commitizen]: https://github.com/commitizen/cz-cli +[commitlint]: [https://github.com/marionebl/commitlint] +[egghead]: https://egghead.io/series/how-to-contribute-to-an-open-source-project-on-github +[new-issue]: https://github.com/nostalgic-css/NES.css/issues/new +[new-pr]: https://github.com/nostalgic-css/NES.css/compare/develop...develop +[semantic-release]: https://github.com/semantic-release/semantic-release +[sentimental-versioning]: http://sentimentalversioning.org/ From efebca14545df7603bbde45367981389c8343b13 Mon Sep 17 00:00:00 2001 From: Trezy Date: Thu, 13 Dec 2018 12:00:58 -0600 Subject: [PATCH 17/23] docs: Move non-default docs to `.github` directory I've moved all of the docs to the `.github` directory as requested by @BcRikko. I've also removed redundant links from the README files, i.e. the translation files no longer link to themselves. #137 --- CODE_OF_CONDUCT-es.md => .github/CODE_OF_CONDUCT-es.md | 8 ++++---- CODE_OF_CONDUCT-jp.md => .github/CODE_OF_CONDUCT-jp.md | 0 .../CODE_OF_CONDUCT-pt-BR.md | 0 CONTRIBUTING-es.md => .github/CONTRIBUTING-es.md | 0 CONTRIBUTING-jp.md => .github/CONTRIBUTING-jp.md | 0 CONTRIBUTING-pt-BR.md => .github/CONTRIBUTING-pt-BR.md | 0 README-es.md => .github/README-es.md | 2 +- README-jp.md => .github/README-jp.md | 2 +- README-pt-BR.md => .github/README-pt-BR.md | 4 ++-- 9 files changed, 8 insertions(+), 8 deletions(-) rename CODE_OF_CONDUCT-es.md => .github/CODE_OF_CONDUCT-es.md (98%) rename CODE_OF_CONDUCT-jp.md => .github/CODE_OF_CONDUCT-jp.md (100%) rename CODE_OF_CONDUCT-pt-BR.md => .github/CODE_OF_CONDUCT-pt-BR.md (100%) rename CONTRIBUTING-es.md => .github/CONTRIBUTING-es.md (100%) rename CONTRIBUTING-jp.md => .github/CONTRIBUTING-jp.md (100%) rename CONTRIBUTING-pt-BR.md => .github/CONTRIBUTING-pt-BR.md (100%) rename README-es.md => .github/README-es.md (96%) rename README-jp.md => .github/README-jp.md (96%) rename README-pt-BR.md => .github/README-pt-BR.md (93%) diff --git a/CODE_OF_CONDUCT-es.md b/.github/CODE_OF_CONDUCT-es.md similarity index 98% rename from CODE_OF_CONDUCT-es.md rename to .github/CODE_OF_CONDUCT-es.md index a1f38a5..4217380 100644 --- a/CODE_OF_CONDUCT-es.md +++ b/.github/CODE_OF_CONDUCT-es.md @@ -2,7 +2,7 @@ ## Nuestro compromiso -En el interés de fomentar una comunidad abierta y acogedora, nosotros como contribuyentes y administradores nos comprometemos a hacer de la participación en nuestro proyecto y nuestra comunidad una experiencia libre de acoso para todos, independientemente de la edad, dimensión corporal, discapacidad, etnia, identidad y expresión de género, nivel de experiencia, nacionalidad, apariencia física, raza, religión, identidad u orientación sexual. +En el interés de fomentar una comunidad abierta y acogedora, nosotros como contribuyentes y administradores nos comprometemos a hacer de la participación en nuestro proyecto y nuestra comunidad una experiencia libre de acoso para todos, independientemente de la edad, dimensión corporal, discapacidad, etnia, identidad y expresión de género, nivel de experiencia, nacionalidad, apariencia física, raza, religión, identidad u orientación sexual. ## Nuestros estándares @@ -24,14 +24,14 @@ Ejemplos de comportamiento inaceptable por participantes: ## Nuestras responsabilidades -Los administradores del proyecto son responsables de clarificar los estándares de comportamiento aceptable y se espera que tomen medidas correctivas y apropiadas en respuesta a situaciones de conducta inaceptable. +Los administradores del proyecto son responsables de clarificar los estándares de comportamiento aceptable y se espera que tomen medidas correctivas y apropiadas en respuesta a situaciones de conducta inaceptable. Los administradores del proyecto tienen el derecho y la responsabilidad de eliminar, editar o rechazar comentarios, *commits*, código, ediciones de documentación, *issues*, y otras contribuciones que no estén alineadas con este Código de Conducta, o de prohibir temporal o permanentemente a cualquier colaborador cuyo comportamiento sea inapropiado, amenazante, ofensivo o perjudicial. ## Alcance Este código de conducta aplica tanto a espacios del proyecto como a espacios públicos donde un individuo esté en representación del proyecto o comunidad. Ejemplos de esto incluye el uso de la cuenta oficial de correo electrónico, publicaciones a través de las redes sociales oficiales, o presentaciones con personas designadas en eventos *online* u *offline*. La representación del proyecto puede ser clarificada explicitamente por los administradores del proyecto. - + ## Aplicación Ejemplos de abuso, acoso u otro tipo de comportamiento inaceptable puede ser reportado al equipo del proyecto en [support@nostalgi.cc][support-email]. Si no deseas contactar a todo el equipo, siéntete libre de contartar a cualquiera de manera individual: @@ -42,7 +42,7 @@ Ejemplos de abuso, acoso u otro tipo de comportamiento inaceptable puede ser rep Todas los reportes serán revisadas e investigadas, lo que resultará en una respuesta adecuada a las necesidades y circunstancias. El equipo del proyecto está obligado a mantener confidencialidad de la persona que reportó el incidente. Detalles específicos acerca de las políticas de aplicación pueden ser publicadas por separado. -Administradores que no sigan o que no hagan cumplir este Código de Conducta pueden ser eliminados de forma temporal o permanente del equipo administrador. +Administradores que no sigan o que no hagan cumplir este Código de Conducta pueden ser eliminados de forma temporal o permanente del equipo administrador. ## Atribución diff --git a/CODE_OF_CONDUCT-jp.md b/.github/CODE_OF_CONDUCT-jp.md similarity index 100% rename from CODE_OF_CONDUCT-jp.md rename to .github/CODE_OF_CONDUCT-jp.md diff --git a/CODE_OF_CONDUCT-pt-BR.md b/.github/CODE_OF_CONDUCT-pt-BR.md similarity index 100% rename from CODE_OF_CONDUCT-pt-BR.md rename to .github/CODE_OF_CONDUCT-pt-BR.md diff --git a/CONTRIBUTING-es.md b/.github/CONTRIBUTING-es.md similarity index 100% rename from CONTRIBUTING-es.md rename to .github/CONTRIBUTING-es.md diff --git a/CONTRIBUTING-jp.md b/.github/CONTRIBUTING-jp.md similarity index 100% rename from CONTRIBUTING-jp.md rename to .github/CONTRIBUTING-jp.md diff --git a/CONTRIBUTING-pt-BR.md b/.github/CONTRIBUTING-pt-BR.md similarity index 100% rename from CONTRIBUTING-pt-BR.md rename to .github/CONTRIBUTING-pt-BR.md diff --git a/README-es.md b/.github/README-es.md similarity index 96% rename from README-es.md rename to .github/README-es.md index 6154971..fe26fe3 100644 --- a/README-es.md +++ b/.github/README-es.md @@ -1,7 +1,7 @@ NES.css is a **NES-style(8bit-like)** CSS Framework. diff --git a/README-jp.md b/.github/README-jp.md similarity index 96% rename from README-jp.md rename to .github/README-jp.md index db7324b..f8c2018 100644 --- a/README-jp.md +++ b/.github/README-jp.md @@ -1,7 +1,7 @@ NES.cssは **ファミコン風(8bit ライク)** なCSSフレームワークです。 diff --git a/README-pt-BR.md b/.github/README-pt-BR.md similarity index 93% rename from README-pt-BR.md rename to .github/README-pt-BR.md index 2c41d31..d60ea4f 100644 --- a/README-pt-BR.md +++ b/.github/README-pt-BR.md @@ -1,7 +1,7 @@ NES.css é um Framework CSS, no **estilo NES(8bit)**. @@ -95,7 +95,7 @@ Se você quiser nos ajudar com o projeto, nós agradecemos contribuições de to [commitizen]: http://commitizen.github.io/cz-cli/ [commitizen-badge]: https://img.shields.io/badge/commitizen-friendly-brightgreen.svg -[contributing-document]: https://github.com/nostalgic-css/NES.css/blob/master/CONTRIBUTING-pt-BR.md +[contributing-document]: CONTRIBUTING-pt-BR.md [gitter]: https://gitter.im/nostalgic-css/Lobby [gitter-badge]: https://img.shields.io/gitter/room/nostalgic-css/Lobby.svg [google-fonts-guide]: https://developers.google.com/fonts/docs/getting_started From abe4760502f1e50eadb9689169a9234d84e928a9 Mon Sep 17 00:00:00 2001 From: Trezy Date: Thu, 13 Dec 2018 12:03:33 -0600 Subject: [PATCH 18/23] docs(readme): Fix CONTRIBUTING links #137 --- .github/README-es.md | 2 +- .github/README-pt-BR.md | 2 +- README.md | 4 ++-- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/.github/README-es.md b/.github/README-es.md index fe26fe3..29c5ff3 100644 --- a/.github/README-es.md +++ b/.github/README-es.md @@ -96,7 +96,7 @@ Si deseas colaborar con el proyecto ¡Recibimos todo tipo de contribuciones! ¡R [commitizen]: http://commitizen.github.io/cz-cli/ [commitizen-badge]: https://img.shields.io/badge/commitizen-friendly-brightgreen.svg -[contributing-document]: https://github.com/nostalgic-css/NES.css/blob/master/CONTRIBUTING-es.md +[contributing-document]: .github/CONTRIBUTING-es.md [gitter]: https://gitter.im/nostalgic-css/Lobby [gitter-badge]: https://img.shields.io/gitter/room/nostalgic-css/Lobby.svg [google-fonts-guide]: https://developers.google.com/fonts/docs/getting_started diff --git a/.github/README-pt-BR.md b/.github/README-pt-BR.md index d60ea4f..126dd12 100644 --- a/.github/README-pt-BR.md +++ b/.github/README-pt-BR.md @@ -95,7 +95,7 @@ Se você quiser nos ajudar com o projeto, nós agradecemos contribuições de to [commitizen]: http://commitizen.github.io/cz-cli/ [commitizen-badge]: https://img.shields.io/badge/commitizen-friendly-brightgreen.svg -[contributing-document]: CONTRIBUTING-pt-BR.md +[contributing-document]: .github/CONTRIBUTING-pt-BR.md [gitter]: https://gitter.im/nostalgic-css/Lobby [gitter-badge]: https://img.shields.io/gitter/room/nostalgic-css/Lobby.svg [google-fonts-guide]: https://developers.google.com/fonts/docs/getting_started diff --git a/README.md b/README.md index ddb75e4..ec2b157 100644 --- a/README.md +++ b/README.md @@ -1,7 +1,7 @@ NES.css is a **NES-style(8bit-like)** CSS Framework. @@ -95,7 +95,7 @@ If you'd like to help us out with the project, we welcome contributions of all t [commitizen]: http://commitizen.github.io/cz-cli/ [commitizen-badge]: https://img.shields.io/badge/commitizen-friendly-brightgreen.svg -[contributing-document]: https://github.com/nostalgic-css/NES.css/blob/master/CONTRIBUTING.md +[contributing-document]: CONTRIBUTING.md [gitter]: https://gitter.im/nostalgic-css/Lobby [gitter-badge]: https://img.shields.io/gitter/room/nostalgic-css/Lobby.svg [google-fonts-guide]: https://developers.google.com/fonts/docs/getting_started From ff2a285f51ad373c1bc58647ba777b7adea37e96 Mon Sep 17 00:00:00 2001 From: Trezy Date: Thu, 13 Dec 2018 12:10:38 -0600 Subject: [PATCH 19/23] docs: Add cross links to all documents I've added translation links to all of the documents, so anybody that pulls up any of our docs will have links to all of the other available translations. #137 --- .github/CODE_OF_CONDUCT-es.md | 3 +++ .github/CODE_OF_CONDUCT-jp.md | 3 +++ .github/CODE_OF_CONDUCT-pt-BR.md | 3 +++ .github/CONTRIBUTING-es.md | 3 +++ .github/CONTRIBUTING-jp.md | 3 +++ .github/CONTRIBUTING-pt-BR.md | 3 +++ CODE_OF_CONDUCT.md | 3 +++ CONTRIBUTING.md | 5 ++++- 8 files changed, 25 insertions(+), 1 deletion(-) diff --git a/.github/CODE_OF_CONDUCT-es.md b/.github/CODE_OF_CONDUCT-es.md index 4217380..a2990a0 100644 --- a/.github/CODE_OF_CONDUCT-es.md +++ b/.github/CODE_OF_CONDUCT-es.md @@ -1,5 +1,8 @@ # Código de Conducta convenido para Contribuyentes +Ver este documento en otro idioma: +[English](CONTRIBUTING.md) / [日本語](.github/CONTRIBUTING-jp.md) / [Português](.github/CONTRIBUTING-pt-BR.md) + ## Nuestro compromiso En el interés de fomentar una comunidad abierta y acogedora, nosotros como contribuyentes y administradores nos comprometemos a hacer de la participación en nuestro proyecto y nuestra comunidad una experiencia libre de acoso para todos, independientemente de la edad, dimensión corporal, discapacidad, etnia, identidad y expresión de género, nivel de experiencia, nacionalidad, apariencia física, raza, religión, identidad u orientación sexual. diff --git a/.github/CODE_OF_CONDUCT-jp.md b/.github/CODE_OF_CONDUCT-jp.md index b8ba9cb..286d80d 100644 --- a/.github/CODE_OF_CONDUCT-jp.md +++ b/.github/CODE_OF_CONDUCT-jp.md @@ -1,5 +1,8 @@ # コントリビューター行動規範 +このドキュメントを別の言語で表示する： +[English](CONTRIBUTING.md) / [Español](.github/CONTRIBUTING-es.md) / [Português](.github/CONTRIBUTING-pt-BR.md) + ## 私たちの約束 私たちはオープンかつ友好的なコミュニティーを育成するために、コントリビューターやメンテナーとして、年齢、体型、障碍、民族性、性自認および性別表現、経験レベル、国籍、個人の容姿、人種、信仰、性的同一性および指向に関わりなく、私たちのプロジェクトやコミュニティーへの参加を誰にとっても嫌がらせのない体験にすることを誓います。 diff --git a/.github/CODE_OF_CONDUCT-pt-BR.md b/.github/CODE_OF_CONDUCT-pt-BR.md index 7c8addc..99b3231 100644 --- a/.github/CODE_OF_CONDUCT-pt-BR.md +++ b/.github/CODE_OF_CONDUCT-pt-BR.md @@ -1,5 +1,8 @@ # Código de Conduta para Colaboradores +Veja este documento em outro idioma: +[English](CONTRIBUTING.md) / [日本語](.github/CONTRIBUTING-jp.md) / [Español](.github/CONTRIBUTING-es.md) + ## Nossa promessa Com o interesse de fomentar uma comunidade aberta e acolhedora, nós, como colaboradores e administradores deste projeto, comprometemo-nos a fazer a participação deste projeto uma experiência livre de assédio para todos, independentemente da aparência pessoal, deficiência, etnia, gênero, idade, identidade ou expressão de gênero, identidade ou orientação sexual, nacionalidade, nível de experiência, porte físico, raça ou religião. diff --git a/.github/CONTRIBUTING-es.md b/.github/CONTRIBUTING-es.md index d1d422c..fb6ceab 100644 --- a/.github/CONTRIBUTING-es.md +++ b/.github/CONTRIBUTING-es.md @@ -1,5 +1,8 @@ # Contribución +Ver este documento en otro idioma: +[English](CONTRIBUTING.md) / [日本語](.github/CONTRIBUTING-jp.md) / [Português](.github/CONTRIBUTING-pt-BR.md) + ¿Quieres contribuir al proyecto? ¡Genial! ## Cosas que tienes que saber diff --git a/.github/CONTRIBUTING-jp.md b/.github/CONTRIBUTING-jp.md index 12a7b0c..dc154f5 100644 --- a/.github/CONTRIBUTING-jp.md +++ b/.github/CONTRIBUTING-jp.md @@ -1,5 +1,8 @@ # 貢献する +このドキュメントを別の言語で表示する： +[English](CONTRIBUTING.md) / [Español](.github/CONTRIBUTING-es.md) / [Português](.github/CONTRIBUTING-pt-BR.md) + このプロジェクトに貢献したいですか?素晴らしい! ## 知るべきこと diff --git a/.github/CONTRIBUTING-pt-BR.md b/.github/CONTRIBUTING-pt-BR.md index da844b7..b09ed5f 100644 --- a/.github/CONTRIBUTING-pt-BR.md +++ b/.github/CONTRIBUTING-pt-BR.md @@ -1,5 +1,8 @@ # Contribuindo +Veja este documento em outro idioma: +[English](CONTRIBUTING.md) / [日本語](.github/CONTRIBUTING-jp.md) / [Español](.github/CONTRIBUTING-es.md) + Quer contribuir para este projeto? Legal! ## Coisas para saber diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md index 646d9ad..0d9bb4b 100644 --- a/CODE_OF_CONDUCT.md +++ b/CODE_OF_CONDUCT.md @@ -1,5 +1,8 @@ # Contributor Covenant Code of Conduct +View this document in another language: +[日本語](.github/CONTRIBUTING-jp.md) / [Español](.github/CONTRIBUTING-es.md) / [Português](.github/CONTRIBUTING-pt-BR.md) + ## Our Pledge In the interest of fostering an open and welcoming environment, we as contributors and maintainers pledge to making participation in our project and our community a harassment-free experience for everyone, regardless of age, body size, disability, ethnicity, gender identity and expression, level of experience, nationality, personal appearance, race, religion, or sexual identity and orientation. diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 52ad97f..0447936 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -1,5 +1,8 @@ # Contributing +View this document in another language: +[日本語](.github/CONTRIBUTING-jp.md) / [Español](.github/CONTRIBUTING-es.md) / [Português](.github/CONTRIBUTING-pt-BR.md) + You want to contribute to the project? Awesome! ## Things to know @@ -89,7 +92,7 @@ We use [Commitizen][commitizen] and [`commitlint`][commitlint] to make sure all -[code-of-conduct]: https://github.com/nostalgic-css/NES.css/blob/master/CODE_OF_CONDUCT.md +[code-of-conduct]: CODE_OF_CONDUCT.md [commitizen]: https://github.com/commitizen/cz-cli [commitlint]: [https://github.com/marionebl/commitlint] [egghead]: https://egghead.io/series/how-to-contribute-to-an-open-source-project-on-github From 3de6a15bb040516493ecb05883030b7bcd557bb1 Mon Sep 17 00:00:00 2001 From: KOREAN139 Date: Fri, 14 Dec 2018 04:08:15 +0900 Subject: [PATCH 20/23] docs: add NES-style Korean font in README.md add NES-style Korean font in REAMD.md, at Installation-Fonts table for users who want to use Korean with this AWESOME css framework --- .github/README-es.md | 1 + .github/README-jp.md | 1 + .github/README-pt-BR.md | 1 + README.md | 1 + 4 files changed, 4 insertions(+) diff --git a/.github/README-es.md b/.github/README-es.md index 29c5ff3..e5b4414 100644 --- a/.github/README-es.md +++ b/.github/README-es.md @@ -47,6 +47,7 @@ NES.css no contiene ninguna tipografía, pero recomendamos la siguiente lista de | Inglés | [Kongtext](https://www.dafont.com/kongtext.font) | | Japonés | [美咲フォント](http://www.geocities.jp/littlimi/misaki.htm) | | Japonés | [Nu もち](http://kokagem.sakura.ne.jp/font/mochi/) | +| Coreano | [둥근모꼴](http://cactus.tistory.com/193) | ## Uso diff --git a/.github/README-jp.md b/.github/README-jp.md index f8c2018..a4b545a 100644 --- a/.github/README-jp.md +++ b/.github/README-jp.md @@ -59,6 +59,7 @@ NES.cssはコンポーネントのスタイルのみを提供しています。 |英語|[Kongtext](https://www.dafont.com/kongtext.font)| |日本語|[美咲フォント](http://www.geocities.jp/littlimi/misaki.htm)| |日本語|[Nu もち](http://kokagem.sakura.ne.jp/font/mochi/)| +|韓國語|[둥근모꼴](http://cactus.tistory.com/193)| ## CSS Only diff --git a/.github/README-pt-BR.md b/.github/README-pt-BR.md index 126dd12..06f1f14 100644 --- a/.github/README-pt-BR.md +++ b/.github/README-pt-BR.md @@ -47,6 +47,7 @@ NES.css não fornece nenhuma fonte, mas nós mantemos uma lista de fontes recome | Inglês | [Kongtext](https://www.dafont.com/kongtext.font) | | Japonês | [美咲フォント](http://www.geocities.jp/littlimi/misaki.htm) | | Japonês | [Nu もち](http://kokagem.sakura.ne.jp/font/mochi/) | +| Coreano | [둥근모꼴](http://cactus.tistory.com/193) | ## Utilização diff --git a/README.md b/README.md index ec2b157..4bfc883 100644 --- a/README.md +++ b/README.md @@ -47,6 +47,7 @@ NES.css doesn't provide any fonts, but we do maintain the following list of font | English | [Kongtext](https://www.dafont.com/kongtext.font) | | Japanese | [美咲フォント](http://www.geocities.jp/littlimi/misaki.htm) | | Japanese | [Nu もち](http://kokagem.sakura.ne.jp/font/mochi/) | +| Korean | [둥근모꼴](http://cactus.tistory.com/193) | ## Usage From 12be67a212f738aeda0c1b605774f90e4fa9a936 Mon Sep 17 00:00:00 2001 From: BcRikko Date: Fri, 14 Dec 2018 08:21:04 +0900 Subject: [PATCH 21/23] docs(readme-jp.md): translate readme --- .github/README-jp.md | 117 +++++++++++++++++-------------------------- 1 file changed, 47 insertions(+), 70 deletions(-) diff --git a/.github/README-jp.md b/.github/README-jp.md index a4b545a..eadf3c0 100644 --- a/.github/README-jp.md +++ b/.github/README-jp.md @@ -1,16 +1,34 @@ NES.cssは **ファミコン風(8bit ライク)** なCSSフレームワークです。 -[![Gitter][gitter-badge]][gitter] [![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/) +[![Gitter][gitter-badge]][gitter] [![Commitizen friendly][commitizen-badge]][commitizen] -## Install +## インストール -### CDN +### スタイル + +NES.cssはnpm(推奨)、またはYarn、CDNのいずれかを介して利用できます。 + +#### パッケージマネージャの場合 + +```shell +npm install nes.css +# or +yarn add nes.css +``` + +私たちの`package.json`には、以下のキーの配下にいくつかの追加のメタデータが含まれています: +* `sass` - メインのSassソースファイルへのパス +* `style` - 非圧縮のCSSへのパス + +#### CDNの場合 + +``要素を使ってCSSをインポートする: ```html @@ -19,30 +37,29 @@ NES.cssは **ファミコン風(8bit ライク)** なCSSフレームワークで ``` -OR +### フォント -```html - - - - -``` +NES.cssはいかなるフォントも提供していませんが、ライブラリと一緒に使用をお勧めするフォントリストを整備しています。 -### npm +| 言語 | フォント | +|-----------|--------------------------------------------------------------------| +| (デフォルト) | [Press Start 2P](https://fonts.google.com/specimen/Press+Start+2P) | +| 英語 | [Kongtext](https://www.dafont.com/kongtext.font) | +| 日本語 | [美咲フォント](http://www.geocities.jp/littlimi/misaki.htm) | +| 日本語 | [Nu もち](http://kokagem.sakura.ne.jp/font/mochi/) | +| 韓国語 | [둥근모꼴](http://cactus.tistory.com/193) | -TODO: npm での使用方法を書く - - -## Usage +## 使い方 NES.cssはコンポーネントのスタイルのみを提供しています。レイアウトはみなさんが好きなように定義してください。 -デフォルトのフォントは[Press Start 2P](https://fonts.google.com/specimen/Press+Start+2P?selection.family=Press+Start+2P)を使っています。英語以外（日本語など）で利用される場合は、別途フォントを読み込んで使ってください。 フォントを読み込む方法は、Google Fontsの[Get Started](https://developers.google.com/fonts/docs/getting_started)を参照するか、または以下のように読み込んでください。 +NES.cssの推奨フォントは[Press Start 2P][press-start-2p-font]です。ただし、[Press Start 2P][press-start-2p-font]は英語の文字のみをサポートしています。英語以外の言語でこのフレームワークを使用する場合は、別のフォントを使用してください。それらを読み込む方法は方法はGoogle Fontsの[指示][google-fonts-guide]に従うか、以下のように読み込んでください。 ```html +