add some translation for Chinese(simple) (#3001)

src/docs/src/translation/zh_hans.json

@@ -242,7 +242,7 @@
   "Code mockup": "代码模型",
   "Phone mockup": "手机模型",
   "Window mockup": "视窗模型",
-  "File Input": "文件输入框",
+  "File Input": "File Input 文件输入框",
   "Text Input": "文字输入框",
   "Range slider": "范围滑块",
   "Tabs": "Tabs",
@@ -444,7 +444,7 @@
   "These CSS variables are being used internally. You can customize them in your custom theme in `tailwind.config.js` or you can even customize them with a class name like `[--animation-btn:0]`": "这些 CSS 变量正在内部使用。您可以在 `tailwind.config.js` 中的自定义主题中对其进行自定义，或者甚至可以使用类名对其进行自定义，例如 `[--animation-btn:0]`",
   "Component specific CSS variables": "组件特定的 CSS 变量",
   "These CSS variables are being used internally for a specific component": "这些 CSS 变量正在内部使用于特定的组件",
-  "Theme Controller": "主题控制器",
+  "Theme Controller": "Theme Controller 主题控制器",
   "If a checked checkbox input or a checked radio input with theme-controller class exists in the page, The page will have the same theme as that input's value.": "如果页面中存在带有 theme-controller 类的选中复选框输入或选中的单选框输入，则页面将具有与该输入值相同的主题。",
   "Theme Controller changes the theme using CSS only. You can then use JS to save the input state in the server or localStorage if you want it to persist on page refresh. <br/>Here's a React example to save checkbox state in local storage:": "主题控制器仅使用 CSS 更改主题。然后，您可以使用 JS 将输入状态保存在服务器或 localStorage 中，如果要在页面刷新时保持状态。 <br/>这里是一个 React 示例，用于将复选框状态保存在本地存储中：",
   "Diff": "Diff 对比",
@@ -489,5 +489,28 @@
   "Button block": "Block 按钮",
   "Button with loading spinner": "加载状态按钮",
   "Button with loading spinner and text": "加载状态并带有文案按钮",
-  "Button without click animation": "没有点击动画的按钮"
-}
+  "Button without click animation": "没有点击动画的按钮",
+  "Dropdown menu using <details> tag": "使用 <details> 标签的下拉菜单",
+  "Stays open until gets clicked again. Or you can close it using JS by removing the `open` attribute": "通过js删除元素上的`open`属性，或者再次点击来关闭下拉菜单。",
+  "Click outside to close": "点击外部关闭",
+  "Dropdown menu": "下拉菜单",
+  "opens on click using ID.showModal() method. can be closed using ID.close() method": "使用 ID.showModal() 方法打开Dialog Modal，使用 ID.close() 方法关闭Dialog Modal。",
+  "there is a second form with 'modal-backdrop' class and it covers the screen so we can close the modal when clicked outside": "通过使用 <form> 元素并添加 'modal-backdrop' 类名覆盖屏幕，所以我们可以通过点击外部来关闭Modal。",
+  "Dialog modal with custom width": "Dialog modal 自定义宽度",
+  "You can use any w-* and max-w-* utility class to customize the width": "使用工具类 w-* 和 max-w-* 来自定义宽度。",
+  "Modal goes bottom on mobile screen and goes middle on desktop": "在手机端Modal显示在屏幕底部，在桌面端显示在中间。",
+  "Modal works with a hidden checkbox and labels can toggle the checkbox so we can use another label tag with 'modal-backdrop' class that covers the screen so we can close the modal when clicked outside": "使用一个隐藏的 checkbox 控制Modal ，label 可以切换 checkbox 的选中状态。所以我们可以通过使用另一个带 'modal-backdrop' 类名的 label 标签来覆盖屏幕，这样我们就可以点击外部来关闭Modal。",
+  "Anchor links might not work well on some SPA frameworks so if there are problems, use the first example": "在一些 SPA 的框架中，<a> 标签可能不能正常工作。当你遇到这个问题时，请使用第一个示例。",
+  "Modal that closes when clicked outside": "Modal 通过点击外部关闭",
+  "Modal using anchor link": "Modal 使用 <a> 标签控制",
+  "Modal using label + hidden checkbox": "Modal 使用 label 和一个隐藏的 checkbox 控制",
+  "Dialog modal with a close button at corner": "Dialog modal 带有关闭图标",
+  "Instead of working with click, it shows swap-on item if you add swap-active class name. You can add or remove swap-active class using JS": "除了通过点击来控制，我们还可以通过类名 'swap-active' ，有类名 'swap-active' 的元素会被展示，可以使用JS添加或者删除 'swap-active' 类名控制显示。",
+  "to join the items together and handle border radius automatically": "使用 'join' 类名组合使用元素，这样可以自动控制 border。",
+  "This collapse works with focus. When div loses focus, it gets closed": "通过div的focus控制collapse展开，当div失去focus将会被关闭。",
+  "This collapse works with checkbox instead of focus. It needs to get clicked again to get closed.": "使用 checkbox 替代 focus 控制 collapse，需要通过再次点击来关闭。",
+  "`collapse-open` and `collapse-close` doesn't work with this method. You can add/remove `open` attribute to the <details> instead": "使用这种方法时，`collapse-open` 和 `collapse-close` 不再生效，需要给 <details> 标签添加或者删除 `open` 属性来代替。",
+  "Use Tailwind CSS `group` and `group-focus` utilities to apply style when parent div is focused": "使用 Tailwind Css 中的`group` 和 `group-focus` 工具类来让样式在父元素被focused时生效。",
+  "Use Tailwind CSS `peer` and `peer-checked` utilities to apply style when sibling checkbox is checked": "使用 Tailwind Css 中的`peer` 和 `peer-checked` 工具类来让样式在兄弟 checkbox 元素被checked时生效。",
+  "If you set max-width or the list gets larger than the container it will scroll": "当你设置了 max-width 或者 列表比容器大时将会开启滚动。"
+}