Translate faq-styling.md #104

Naturalclar · 2019-02-09T16:39:53Z

This PR is part of #4
Translated faq-styling.md to Japanese.

smikitky

よろしくお願いします。

smikitky · 2019-02-09T16:44:09Z

content/docs/faq-styling.md

@@ -1,22 +1,22 @@
 ---
 id: faq-styling
-title: Styling and CSS
+title: CSSとスタイルの使用


Suggested change

title: CSSとスタイルの使用

title: CSS とスタイルの使用

smikitky · 2019-02-09T16:45:35Z

content/docs/faq-styling.md


-Pass a string as the `className` prop:
+このようにクラス名を string として `className` prop に与えてください。


Suggested change

このようにクラス名を string として `className` prop に与えてください。

このようにクラス名を文字列として `className` プロパティに与えてください。

一応具体的な prop に言及するときのみ「プロパティ」を使うという決まりになっています（このルールが本当に正しいかどうかは議論の余地があると思いますが）

確かに、そこは少し気になっていました。Reactのpropsに関する記述であればpropsをそのまま使う方がわかりやすいと少し感じます、が統一性を重視します:bow:

smikitky · 2019-02-09T16:47:07Z

content/docs/faq-styling.md


-CSS classes are generally better for performance than inline styles.
+パフォーマンス観点から言えば、基本的に CSS クラスを使う方が、インラインスタイルを用いるよりもパフォーマンスは優れています。


Suggested change

パフォーマンス観点から言えば、基本的に CSS クラスを使う方が、インラインスタイルを用いるよりもパフォーマンスは優れています。

パフォーマンス観点から言えば、基本的に CSS クラスを使う方が、インラインスタイルを用いるよりも優れています。

「パフォーマンス」を2回言うのは冗長なので整理

どうしようか迷っていました、ありがとうございます:bow:

smikitky · 2019-02-09T16:48:17Z

content/docs/faq-styling.md


-"CSS-in-JS" refers to a pattern where CSS is composed using JavaScript instead of defined in external files. Read a comparison of CSS-in-JS libraries [here](https://github.com/MicheleBertoli/css-in-js).
+"CSS-in-JS" とは外部ファイルでスタイルを定義するのとは違い、 JS を用いて CSS を生成するパターンのことを指します。数々の CSS-in-JS ライブラリの比較については[この資料](https://github.com/MicheleBertoli/css-in-js)をご覧ください。


Suggested change

"CSS-in-JS" とは外部ファイルでスタイルを定義するのとは違い、 JS を用いて CSS を生成するパターンのことを指します。数々の CSS-in-JS ライブラリの比較については[この資料](https://github.com/MicheleBertoli/css-in-js)をご覧ください。

"CSS-in-JS" とは外部ファイルでスタイルを定義するのとは違い、JavaScript を用いて CSS を生成するパターンのことを指します。数々の CSS-in-JS ライブラリの比較については[この資料](https://github.com/MicheleBertoli/css-in-js)をご覧ください。

smikitky · 2019-02-09T16:50:45Z

content/docs/faq-styling.md


-_Note that this functionality is not a part of React, but provided by third-party libraries._ React does not have an opinion about how styles are defined; if in doubt, a good starting point is to define your styles in a separate `*.css` file as usual and refer to them using [`className`](/docs/dom-elements.html#classname).
+_注意：この機能は React の一部ではありません。サードパーティに提供されたライブラリ郡です。_ React はスタイルがどのように定義されているかには関心を持ちません。疑うのであれば、まずはいままでどおり別の `*.css` にスタイルを定義して、[`className`](/docs/dom-elements.html#classname) を使って参照するところからはじめると良いでしょう。 


Suggested change

_注意：この機能は React の一部ではありません。サードパーティに提供されたライブラリ郡です。_ React はスタイルがどのように定義されているかには関心を持ちません。疑うのであれば、まずはいままでどおり別の `*.css` にスタイルを定義して、[`className`](/docs/dom-elements.html#classname) を使って参照するところからはじめると良いでしょう。

_注意：この機能は React の一部ではありません。サードパーティのライブラリ群により提供される機能です。_React はスタイルがどのように定義されているかには関心を持ちません。判断に困った場合は、まずは別の `*.css` にスタイルを定義して、[`className`](/docs/dom-elements.html#classname) を使って参照するところからはじめると良いでしょう。

郡 → 群

smikitky · 2019-02-09T16:53:41Z

content/docs/faq-styling.md


-### Can I do animations in React? {#can-i-do-animations-in-react}
+### React で animation は使えますか？ {#can-i-do-animations-in-react}


Suggested change

### React で animation は使えますか？ {#can-i-do-animations-in-react}

### React でアニメーションは使えますか？ {#can-i-do-animations-in-react}

いわゆるCSS Animations技術のことを指しているなら英語のままでもいいかもしれませんが、リンクされているライブラリは別にそれ特化のものではないような気がしました（ちょっと眺めただけですが）ので、一般名詞のアニメーションでよいと思います。

たしかに、css の animationとはまた別の文脈ですね。アニメーションに変更しました。

smikitky · 2019-02-09T16:53:58Z

content/docs/faq-styling.md


-React can be used to power animations. See [React Transition Group](https://reactcommunity.org/react-transition-group/) and [React Motion](https://github.com/chenglou/react-motion), for example.
+React を使って animations を動かすことは可能です。例として、[React Transition Group](https://reactcommunity.org/react-transition-group/) や [React Motion](https://github.com/chenglou/react-motion) をご覧ください。


Suggested change

React を使って animations を動かすことは可能です。例として、[React Transition Group](https://reactcommunity.org/react-transition-group/) や [React Motion](https://github.com/chenglou/react-motion) をご覧ください。

React を使ってアニメーションを動かすことは可能です。例として、[React Transition Group](https://reactcommunity.org/react-transition-group/) や [React Motion](https://github.com/chenglou/react-motion) をご覧ください。

potato4d

@Naturalclar
追加で一点、こちらも修正お願いいたします 🙏

content/docs/faq-styling.md

Naturalclar · 2019-02-12T02:56:06Z

レビューありがとうございます！指摘箇所を修正いたしました:bow:

smikitky · 2019-02-12T03:15:51Z

ありがとうございます！

Naturalclar · 2019-02-13T02:23:59Z

ルール改正されたTextLintを走らせました:bow:

potato4d

よさそうです！ありがとうございます

docs:translate faq-styling.md

Verified

This commit was signed with the committer’s verified signature.

zeripath

GPG key ID: 3CDE74631F13A748

Verified
Learn about vigilant mode

2a4ebad

tesseralis mentioned this pull request Feb 9, 2019

Japanese Translation Progress #4

Closed

90 tasks

smikitky self-requested a review February 9, 2019 16:47

smikitky added the 🚫 in intial review label Feb 9, 2019

smikitky requested changes Feb 9, 2019

View reviewed changes

smikitky removed the 🚫 in intial review label Feb 9, 2019

potato4d requested changes Feb 10, 2019

View reviewed changes

content/docs/faq-styling.md Outdated Show resolved Hide resolved

doc: apply fix to reviewed section

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.

GPG key ID: 4AEE18F83AFDEB23
Expired

Verified
Learn about vigilant mode

8d55664

smikitky approved these changes Feb 12, 2019

View reviewed changes

Naturalclar and others added 2 commits February 13, 2019 11:10

Merge branch 'master' into translate/faq-styling

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.

GPG key ID: 4AEE18F83AFDEB23
Expired

Verified
Learn about vigilant mode

8d998b8

doc: apply textlint

Verified

This commit was signed with the committer’s verified signature.

zeripath

GPG key ID: 3CDE74631F13A748

Verified
Learn about vigilant mode

f0cb8a3

Naturalclar and others added 3 commits February 13, 2019 13:03

Merge branch 'master' into translate/faq-styling

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.

GPG key ID: 4AEE18F83AFDEB23
Expired

Verified
Learn about vigilant mode

5bb7b5d

Merge branch 'master' into translate/faq-styling

3b26f9b

Merge branch 'master' into translate/faq-styling

3d310d0

potato4d approved these changes Feb 14, 2019

View reviewed changes

potato4d merged commit 6a5b30f into reactjs:master Feb 14, 2019

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Translate faq-styling.md #104

Translate faq-styling.md #104

Naturalclar commented Feb 9, 2019

smikitky left a comment

smikitky Feb 9, 2019

smikitky Feb 9, 2019

Naturalclar Feb 12, 2019

smikitky Feb 9, 2019

Naturalclar Feb 12, 2019

smikitky Feb 9, 2019

smikitky Feb 9, 2019

smikitky Feb 9, 2019

smikitky Feb 9, 2019

Naturalclar Feb 12, 2019

smikitky Feb 9, 2019

potato4d left a comment

Naturalclar commented Feb 12, 2019

smikitky commented Feb 12, 2019

Naturalclar commented Feb 13, 2019

potato4d left a comment

	title: CSSとスタイルの使用
	title: CSS とスタイルの使用


		Pass a string as the `className` prop:
		このようにクラス名を string として `className` prop に与えてください。

	このようにクラス名を string として `className` prop に与えてください。
	このようにクラス名を文字列として `className` プロパティに与えてください。


		CSS classes are generally better for performance than inline styles.
		パフォーマンス観点から言えば、基本的に CSS クラスを使う方が、インラインスタイルを用いるよりもパフォーマンスは優れています。


		"CSS-in-JS" refers to a pattern where CSS is composed using JavaScript instead of defined in external files. Read a comparison of CSS-in-JS libraries [here](https://github.com/MicheleBertoli/css-in-js).
		"CSS-in-JS" とは外部ファイルでスタイルを定義するのとは違い、 JS を用いて CSS を生成するパターンのことを指します。数々の CSS-in-JS ライブラリの比較については[この資料](https://github.com/MicheleBertoli/css-in-js)をご覧ください。

	"CSS-in-JS" とは外部ファイルでスタイルを定義するのとは違い、 JS を用いて CSS を生成するパターンのことを指します。数々の CSS-in-JS ライブラリの比較については[この資料](https://github.com/MicheleBertoli/css-in-js)をご覧ください。
	"CSS-in-JS" とは外部ファイルでスタイルを定義するのとは違い、JavaScript を用いて CSS を生成するパターンのことを指します。数々の CSS-in-JS ライブラリの比較については[この資料](https://github.com/MicheleBertoli/css-in-js)をご覧ください。


		_Note that this functionality is not a part of React, but provided by third-party libraries._ React does not have an opinion about how styles are defined; if in doubt, a good starting point is to define your styles in a separate `*.css` file as usual and refer to them using [`className`](/docs/dom-elements.html#classname).
		_注意：この機能は React の一部ではありません。サードパーティに提供されたライブラリ郡です。_ React はスタイルがどのように定義されているかには関心を持ちません。疑うのであれば、まずはいままでどおり別の `*.css` にスタイルを定義して、[`className`](/docs/dom-elements.html#classname) を使って参照するところからはじめると良いでしょう。


		### Can I do animations in React? {#can-i-do-animations-in-react}
		### React で animation は使えますか？ {#can-i-do-animations-in-react}

	### React で animation は使えますか？ {#can-i-do-animations-in-react}
	### React でアニメーションは使えますか？ {#can-i-do-animations-in-react}


		React can be used to power animations. See [React Transition Group](https://reactcommunity.org/react-transition-group/) and [React Motion](https://github.com/chenglou/react-motion), for example.
		React を使って animations を動かすことは可能です。例として、[React Transition Group](https://reactcommunity.org/react-transition-group/) や [React Motion](https://github.com/chenglou/react-motion) をご覧ください。

	React を使って animations を動かすことは可能です。例として、[React Transition Group](https://reactcommunity.org/react-transition-group/) や [React Motion](https://github.com/chenglou/react-motion) をご覧ください。
	React を使ってアニメーションを動かすことは可能です。例として、[React Transition Group](https://reactcommunity.org/react-transition-group/) や [React Motion](https://github.com/chenglou/react-motion) をご覧ください。

Translate faq-styling.md #104

Translate faq-styling.md #104

Conversation

Naturalclar commented Feb 9, 2019

smikitky left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

potato4d left a comment

Choose a reason for hiding this comment

Naturalclar commented Feb 12, 2019

smikitky commented Feb 12, 2019

Naturalclar commented Feb 13, 2019

potato4d left a comment

Choose a reason for hiding this comment