Skip to content

New Crowdin updates #10

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 7 commits into
base: main
Choose a base branch
from
Open

New Crowdin updates #10

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
398534c
New translations README.md (Chinese Simplified)
jamiebuilds Feb 28, 2022
03b808a
New translations README.md (Chinese Simplified)
jamiebuilds Mar 6, 2022
4266832
New translations README.md (Chinese Simplified)
jamiebuilds Aug 23, 2022
0228268
New translations README.md (Chinese Simplified)
jamiebuilds Jan 16, 2023
4955a3b
New translations README.md (Chinese Simplified)
jamiebuilds Jan 16, 2023
8a5f496
New translations README.md (Chinese Simplified)
jamiebuilds Jan 17, 2023
3ea5dfc
New translations README.md (Chinese Simplified)
jamiebuilds Jan 17, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
80 changes: 40 additions & 40 deletions docs/zh/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,7 @@ module.exports = {

#### 更改动画方向

Use the `direction-{keyword}` utilities to control an element’s `animation-delay`.
使用 `direction-{keyword}` 标签控制元素的`animation-delay`.

```html
<button class="animate-bounce direction-normal ...">Button A</button>
Expand All @@ -89,11 +89,11 @@ Use the `direction-{keyword}` utilities to control an element’s `animation-del
<button class="animate-bounce direction-alternate-reverse ...">Button C</button>
```

Learn more in the [animation direction](/docs/animation-direction.md) documentation.
查看更多与 [animation direction](/docs/animation-direction.md) 相关的文档

#### Changing animation duration
#### 更改动画持续时间

Use the `duration-{amount}` utilities to control an element’s `animation-duration`.
使用 `delay-{amount}` 标签控制元素的 `animation-delay`.

```html
<button class="animate-bounce duration-150 ...">Button A</button>
Expand All @@ -103,9 +103,9 @@ Use the `duration-{amount}` utilities to control an element’s `animation-durat

Learn more in the [animation duration](/docs/animation-duration.md) documentation.

#### Changing animation fill mode
#### 更改动画不播放时要应用到元素的样式（animation-fill-mode）

Use the `fill-mode-{keyword}` utilities to control an element’s `animation-fill-mode`.
使用 `direction-{keyword}` 标签控制元素的`animation-delay`.

```html
<button class="animate-bounce fill-mode-none ...">Button A</button>
Expand All @@ -114,11 +114,11 @@ Use the `fill-mode-{keyword}` utilities to control an element’s `animation-fil
<button class="animate-bounce fill-mode-both ...">Button C</button>
```

Learn more in the [animation fill mode](/docs/animation-fill-mode.md) documentation.
查看更多与 [animation fill mode](/docs/animation-fill-mode.md) 相关的文档

#### Changing animation iteration count
#### 更改动画重复次数

Use the `repeat-{amount}` utilities to control an element’s `animation-iteration-count`.
使用 `delay-{amount}` 标签控制元素的 `animation-delay`.

```html
<button class="animate-bounce repeat-0 ...">Button A</button>
Expand All @@ -128,9 +128,9 @@ Use the `repeat-{amount}` utilities to control an element’s `animation-iterati

Learn more in the [animation iteration count](/docs/animation-iteration-count.md) documentation.

#### Changing animation play state
#### 更改动画播放状态

Use the `running` and `paused` utilities to control an element’s `animation-play-state`.
使用 `direction-{keyword}` 标签控制元素的`animation-delay`.

```html
<button class="animate-bounce running ...">Button B</button>
Expand All @@ -139,9 +139,9 @@ Use the `running` and `paused` utilities to control an element’s `animation-pl

Learn more in the [animation play state](/docs/animation-play-state.md) documentation.

#### Changing animation timing function
#### 更改动画速度曲线

Use the `ease-{keyword}` utilities to control an element’s `animation-timing-function`.
使用 `direction-{keyword}` 标签控制元素的`animation-delay`.

```html
<button class="animate-bounce ease-linear ...">Button A</button>
Expand All @@ -152,19 +152,19 @@ Use the `ease-{keyword}` utilities to control an element’s `animation-timing-f

Learn more in the [animation timing function](/docs/animation-timing-function.md) documentation.

#### Prefers-reduced-motion
#### 减少运动媒体查询

For situations where the user has specified that they prefer reduced motion, you can conditionally apply animations and transitions using the `motion-safe` and `motion-reduce` variants:
如果用户指定他们喜欢减少动作， 您可以使用 `motion-safe` 和 `motion-reduc` 变量来有条件地应用动画和过渡：

```html
<button class="motion-safe:animate-bounce ...">Button B</button>
```

### Enter & Exit Animations
### 进入以及退出动画

### Adding enter animations
### 添加进入动画

To give an element an enter animation, use the `animate-in` utility, in combination with some [`fade-in`](/docs/enter-animation-scale.md), [`spin-in`](/docs/enter-animation-rotate.md), [`zoom-in`](/docs/enter-animation-scale.md), and [`slide-in-from`](/docs/enter-animation-translate.md) utilities.
要给元素定义进入动画，请使用 `animate-in` ，并结合一些 [`fade-in`](/docs/enter-animation-scale.md), [`spin-in`](/docs/enter-animation-rotate.md) [`zoom-in`](/docs/enter-animation-scale.md), 和 [`slide-in-from`](/docs/enter-animation-translate.md)

```html
<button class="animate-in fade-in ...">Button A</button>
Expand All @@ -176,9 +176,9 @@ To give an element an enter animation, use the `animate-in` utility, in combinat

Learn more in the [enter animation](/docs/enter-animation.md) documentation.

### Adding exit animations
### 添加退出动画

To give an element an exit animation, use the `animate-out` utility, in combination with some [`fade-out`](/docs/exit-animation-scale.md), [`spin-out`](/docs/exit-animation-rotate.md), [`zoom-out`](/docs/exit-animation-scale.md), and [`slide-out-from`](/docs/exit-animation-translate.md) utilities.
要给元素定义进入动画，请使用 `animate-in` ，并结合一些 [`fade-in`](/docs/enter-animation-scale.md), [`spin-in`](/docs/enter-animation-rotate.md) [`zoom-in`](/docs/enter-animation-scale.md), 和 [`slide-in-from`](/docs/enter-animation-translate.md)

```html
<button class="animate-out fade-out ...">Button A</button>
Expand All @@ -190,9 +190,9 @@ To give an element an exit animation, use the `animate-out` utility, in combinat

Learn more in the [exit animation](/docs/exit-animation.md) documentation.

#### Changing enter animation starting opacity
#### 更改进入动画时的不透明度

Set the starting opacity of an animation using the `fade-in-{amount}` utilities.
使用 `fade-in-{amount}` 设置动画的初始不透明度

```html
<button class="animate-in fade-in ...">Button A</button>
Expand All @@ -203,7 +203,7 @@ Set the starting opacity of an animation using the `fade-in-{amount}` utilities.

Learn more in the [enter animation opacity](/docs/enter-animation-opacity.md) documentation.

#### Changing enter animation starting rotation
#### 更改进入动画时的旋转角度

Set the starting rotation of an animation using the `spin-in-{amount}` utilities.

Expand All @@ -216,7 +216,7 @@ Set the starting rotation of an animation using the `spin-in-{amount}` utilities

Learn more in the [enter animation rotate](/docs/enter-animation-rotate.md) documentation.

#### Changing enter animation starting scale
#### 更改进入动画时的缩放

Set the starting scale of an animation using the `zoom-in-{amount}` utilities.

Expand All @@ -229,22 +229,22 @@ Set the starting scale of an animation using the `zoom-in-{amount}` utilities.

Learn more in the [enter animation scale](/docs/enter-animation-scale.md) documentation.

#### Changing enter animation starting translate
#### 更改进入动画时的位移

Set the starting translate of an animation using the `slide-in-from-{direction}-{amount}` utilities.
使用 `slide-in-from-{direction}-{amount}` 设置动画开始的位移

```html
<button class="animate-in slide-in-from-top ...">Button A</button>
<button class="animate-in slide-in-from-bottom-50 ...">Button B</button>
<button class="animate-in slide-in-from-left-75 ...">Button C</button>
<button class="animate-in slide-in-from-right-95 ...">Button C</button>
<button class="animate-in slide-in-from-bottom-48 ...">Button B</button>
<button class="animate-in slide-in-from-left-72 ...">Button C</button>
<button class="animate-in slide-in-from-right-96 ...">Button C</button>
```

Learn more in the [enter animation translate](/docs/enter-animation-translate.md) documentation.

#### Changing exit animation ending opacity
#### 更改退出动画时的不透明度

Set the ending opacity of an animation using the `fade-out-{amount}` utilities.
使用 `fade-out-{amount}` 设置动画结束时的不透明度

```html
<button class="animate-out fade-out ...">Button A</button>
Expand All @@ -255,9 +255,9 @@ Set the ending opacity of an animation using the `fade-out-{amount}` utilities.

Learn more in the [exit animation opacity](/docs/exit-animation-opacity.md) documentation.

#### Changing exit animation ending rotation
#### 更改退出动画时的旋转

Set the ending rotation of an animation using the `spin-out-{amount}` utilities.
使用 `spin-out-{amount}`设置动画结束时的旋转角度

```html
<button class="animate-out spin-out-1 ...">Button A</button>
Expand All @@ -268,9 +268,9 @@ Set the ending rotation of an animation using the `spin-out-{amount}` utilities.

Learn more in the [exit animation rotate](/docs/exit-animation-rotate.md) documentation.

#### Changing exit animation ending scale
#### 更改退出动画时的缩放

Set the ending scale of an animation using the `zoom-out-{amount}` utilities.
使用 `zoom-out-{amount}`设置动画结束时的缩放

```html
<button class="animate-out zoom-out ...">Button A</button>
Expand All @@ -281,15 +281,15 @@ Set the ending scale of an animation using the `zoom-out-{amount}` utilities.

Learn more in the [exit animation scale](/docs/exit-animation-scale.md) documentation.

#### Changing exit animation ending translate
#### 更改退出动画时的位移

Set the ending translate of an animation using the `slide-out-to-{direction}-{amount}` utilities.
使用 `slide-out-to-{direction}-{amount}` 设置动画结束时的位移

```html
<button class="animate-out slide-out-to-top ...">Button A</button>
<button class="animate-out slide-out-to-bottom-50 ...">Button B</button>
<button class="animate-out slide-out-to-left-75 ...">Button C</button>
<button class="animate-out slide-out-to-right-95 ...">Button C</button>
<button class="animate-out slide-out-to-bottom-48 ...">Button B</button>
<button class="animate-out slide-out-to-left-72 ...">Button C</button>
<button class="animate-out slide-out-to-right-96 ...">Button C</button>
```

Learn more in the [exit animation translate](/docs/exit-animation-translate.md) documentation.
Loading