diff --git a/packages/arcodesign/components/context-provider/demo/index.md b/packages/arcodesign/components/context-provider/demo/index.md
index bd764be6..2d7efe40 100644
--- a/packages/arcodesign/components/context-provider/demo/index.md
+++ b/packages/arcodesign/components/context-provider/demo/index.md
@@ -24,3 +24,10 @@ export default function ContextProviderDemo() {
);
}
```
+
+```less
+.arco-cell-group {
+ .rem(border-radius, 8);
+ overflow: hidden;
+}
+```
\ No newline at end of file
diff --git a/packages/arcodesign/components/context-provider/demo/style/mobile.less b/packages/arcodesign/components/context-provider/demo/style/mobile.less
index d1b98d9f..c6074655 100644
--- a/packages/arcodesign/components/context-provider/demo/style/mobile.less
+++ b/packages/arcodesign/components/context-provider/demo/style/mobile.less
@@ -6,7 +6,5 @@
padding: 0;
background: transparent;
.rem(margin, 0, 12);
- .rem(border-radius, 8);
- overflow: hidden;
}
}
diff --git a/packages/arcodesign/components/context-provider/demo/theme.md b/packages/arcodesign/components/context-provider/demo/theme.md
new file mode 100644
index 00000000..a65430d3
--- /dev/null
+++ b/packages/arcodesign/components/context-provider/demo/theme.md
@@ -0,0 +1,47 @@
+## 动态主题 @en{Dynamic theme}
+
+#### 2
+
+如果需要动态主题切换,需要配置 less 选项`@use-css-vars: 1`以启用 css 变量([详情见【快速上手 - 主题变量定制 & 动态切换】](/#/doc/readme))。@en{If there is a need for dynamic theme switching, you need to configure the less option `@use-css-vars: 1` to enable css variable([For details, see [Quick Start - Theme variable customization & dynamic switching]](/#/doc/readme)).}
+
+请注意,由于 css variable 存在兼容性问题(查看兼容性),请自行判断使用风险@en{Please note that due to the compatibility issues of css variables(Check compatibility), please use it at your own risk.}
+
+```js
+import { ContextProvider, Button, Cell, Switch } from '@arco-design/mobile-react';
+
+export default function ContextProviderDemo() {
+ const [checked, setChecked] = React.useState(true);
+ const theme = React.useMemo(() => {
+ if (checked) {
+ return {
+ 'button-primary-background': '#34C759',
+ 'button-primary-clicked-background': '#00B42A',
+ };
+ }
+ return null;
+ }, [checked]);
+ return (
+
+
+ {
+ setChecked(value);
+ }}
+ />
+ |
+
+
+ );
+}
+```
+
+```less
+.arco-cell {
+ .rem(border-radius, 8);
+}
+.context-button {
+ margin-top: 10px;
+}
+```
diff --git a/scripts/sites/plugins/SiteGeneratePlugin/generate-components.js b/scripts/sites/plugins/SiteGeneratePlugin/generate-components.js
index a68eece0..8d9e0b59 100644
--- a/scripts/sites/plugins/SiteGeneratePlugin/generate-components.js
+++ b/scripts/sites/plugins/SiteGeneratePlugin/generate-components.js
@@ -78,6 +78,7 @@ function generateComponents({
// 渲染文档站 demo 内容部分
const demoPath = path.join(compSrcPath, comp, 'demo');
+ const docPath = path.join(compPagePath, comp);
const { demoSource = [], lessSources = {} } =
renderComponentsDemos({
demoSrcPath: demoPath,
@@ -124,7 +125,6 @@ function generateComponents({
);
}`);
- const docPath = path.join(compPagePath, comp);
fs.mkdirpSync(docPath);
fs.writeFile(path.join(docPath, `index${tsxFileSuffix}.tsx`), entry, () => {
resolve(`>>> Write sites file finished: ${comp}`);