From 7d8a22cdf56759fcdd9ed03a3d02bf2537760ee0 Mon Sep 17 00:00:00 2001 From: zelmazhou <72006584+zuiaiwanqian@users.noreply.github.com> Date: Fri, 19 Apr 2024 10:21:53 +0800 Subject: [PATCH] =?UTF-8?q?=20TDesign=20=E5=BE=AE=E4=BF=A1=E5=B0=8F?= =?UTF-8?q?=E7=A8=8B=E5=BA=8F=E7=BB=84=E4=BB=B6=E5=BA=93=E6=8F=90=E4=BE=9B?= =?UTF-8?q?=E5=8E=9F=E7=94=9F=E6=B7=B1=E8=89=B2=E6=A8=A1=E5=BC=8F=E9=80=82?= =?UTF-8?q?=E9=85=8D=20(#2636)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * feat: 暗黑模式配置完成 * feat: 修改button组件的颜色变量 * fix: divider颜色变量修改 * fix: link适配深色模式 * feat: 部分组件完成深色模式适配 * feat: 导航模块下组件完成深色模式适配 * feat: 完成输入类型组件深色模式适配 * feat: 完成数据展示类别深色模式适配 * feat: 反馈类别组件适应深色模式 * feat: 修改示例导航栏为自定义导航栏 * feat: 删除app.json无用navbar配置 * feat: 修改grid的border示例 * feat: 文档深色模式预览完成 * feat: 优化文档深色模式代码 * fix: 修复自定义导航栏的样式bug * feat: 修复navbar在navbar示例中的bug * fix: 优化代码 * fix: 调整dark引用位置 * fix: 修改mobile小白条显示 * fix: 修复样式bug至sidebar * fix: 修复深色模式问题 * feat: 修改无承载token组件颜色 * fix: 修改tabbar自定义样式 * fix: dark的token全部提到app.less * fix: 修复mac暗黑模式不行的问题 * feat: 监听预览器路由跳转更新dark * fix: 修复mr问题 * fix: 修改mr问题 * fix: 修复自定义导航栏导致的交互问题 * fix: 删除globalData，解决side-bar可滑动问题 * test: update snapshots * fix: dark mode style bug * feat: 解决官网路由切换问题 * chore: restore vscode setting.json --------- Co-authored-by: anlyyao Co-authored-by: wenkang --- example/app.json | 9 +- example/app.less | 44 +- example/assets/TDesign-logo_dark.png | Bin 0 -> 2934 bytes example/assets/TDesign-logo_light.png | Bin 0 -> 2914 bytes example/assets/TDesignLogo@2x.png | Bin 10893 -> 0 bytes example/components/demo-block/index.less | 6 +- example/components/pull-down-list/index.less | 9 +- example/components/pull-down-list/index.ts | 1 - example/components/pull-down-list/index.wxml | 2 +- example/pages/home/home.json | 5 +- example/pages/home/home.less | 6 +- example/pages/home/home.ts | 2 + example/pages/home/home.wxml | 8 +- site/app.vue | 21 + site/plugin-tdoc/component.vue | 23 +- site/theme/dark.ts | 220 ++++++++ src/action-sheet/_example/action-sheet.wxml | 1 + src/action-sheet/action-sheet.less | 14 +- src/avatar/_example/avatar.wxml | 1 + .../_example/character-avatar/index.wxss | 4 +- src/back-top/_example/back-top.wxml | 1 + src/back-top/back-top.less | 2 +- src/badge/_example/badge.wxml | 1 + src/badge/badge.less | 2 + src/button/_example/button.json | 1 - src/button/_example/button.wxml | 1 + src/button/button.less | 6 +- src/calendar/_example/calendar.wxml | 1 + src/calendar/calendar.less | 10 +- src/cascader/_example/cascader.wxml | 1 + src/cascader/cascader.less | 13 +- src/cell-group/_example/cell-group.wxml | 1 + src/cell-group/cell-group.less | 2 +- src/cell/_example/cell.wxml | 1 + src/cell/cell.less | 8 +- src/check-tag/check-tag.less | 4 +- src/checkbox/_example/checkbox.wxml | 1 + src/checkbox/_example/horizontal/index.wxss | 2 +- src/checkbox/_example/special/index.wxss | 12 +- src/checkbox/checkbox.less | 12 +- src/col/_example/col.wxml | 1 + src/collapse-panel/collapse-panel.less | 14 +- src/collapse/_example/collapse.wxml | 1 + src/common/style/_variables.less | 2 + src/common/style/theme/_dark.less | 156 ++++++ src/common/style/theme/_index.less | 1 + src/count-down/_example/base/index.wxss | 2 +- src/count-down/_example/count-down.wxml | 1 + src/count-down/_example/size/index.wxss | 2 +- src/count-down/count-down.less | 4 +- .../_example/date-time-picker.wxml | 1 + src/dialog/_example/dialog.wxml | 1 + src/dialog/_example/with-input/index.wxss | 9 +- src/dialog/dialog.less | 10 +- src/divider/_example/base/index.wxss | 6 +- src/divider/_example/divider.wxml | 1 + src/divider/divider.less | 2 +- src/drawer/_example/drawer.wxml | 1 + src/drawer/drawer.less | 5 +- src/dropdown-menu/_example/dropdown-menu.wxml | 1 + src/dropdown-menu/dropdown-menu.less | 4 +- src/empty/_example/empty.wxml | 1 + src/empty/empty.less | 4 +- src/fab/_example/fab.wxml | 1 + src/footer/_example/footer.wxml | 1 + src/footer/_example/logo/index.js | 9 + src/footer/footer.less | 5 +- src/grid-item/grid-item.less | 4 +- .../__test__/__snapshots__/demo.test.js.snap | 4 +- src/grid/_example/border/index.js | 2 +- src/grid/_example/grid.wxml | 1 + src/icon/_example/icon.wxml | 1 + src/image-viewer/_example/image-viewer.wxml | 1 + src/image/_example/base/index.wxss | 4 +- src/image/_example/image.less | 2 +- src/image/_example/image.wxml | 1 + src/image/_example/status/index.wxss | 6 +- src/image/image.less | 4 +- src/indexes-anchor/indexes-anchor.less | 2 +- .../__test__/__snapshots__/demo.test.js.snap | 471 +++++++++--------- src/indexes/_example/base/index.js | 14 + src/indexes/_example/base/index.wxml | 5 +- src/indexes/_example/custom/index.js | 14 + src/indexes/_example/custom/index.wxml | 37 +- src/indexes/_example/custom/index.wxss | 15 +- src/indexes/_example/indexes.wxml | 1 + src/indexes/indexes.less | 2 +- .../__test__/__snapshots__/demo.test.js.snap | 2 +- src/input/_example/bordered/index.js | 2 +- src/input/_example/bordered/index.wxss | 5 +- src/input/_example/input.wxml | 1 + src/input/_example/special/index.wxss | 7 +- src/input/input.less | 12 +- src/link/_example/content/index.wxss | 2 +- src/link/_example/disabled/index.wxss | 2 +- src/link/_example/link.wxml | 1 + src/link/_example/prefix/index.wxss | 2 +- src/link/_example/size/index.wxss | 2 +- src/link/_example/suffix/index.wxss | 2 +- src/link/_example/theme/index.wxss | 2 +- src/link/_example/underline/index.wxss | 2 +- src/link/link.less | 2 +- src/loading/_example/loading.wxml | 1 + src/loading/loading.less | 4 +- src/message/_example/base/index.js | 10 +- src/message/_example/message.wxml | 1 + src/message/_example/theme/index.js | 8 +- src/message/message-item/message.less | 4 +- .../__test__/__snapshots__/demo.test.js.snap | 2 +- src/navbar/_example/img/index.js | 10 +- src/navbar/_example/img/index.wxss | 2 +- src/navbar/_example/left-title/index.wxss | 6 +- src/navbar/_example/navbar.less | 10 +- src/navbar/_example/navbar.wxml | 1 + src/navbar/navbar.less | 4 +- src/notice-bar/_example/custom/index.wxss | 12 +- src/notice-bar/_example/notice-bar.wxml | 1 + src/notice-bar/notice-bar.less | 4 +- src/overlay/_example/overlay.wxml | 1 + src/picker-item/picker-item.less | 4 +- src/picker/_example/picker.wxml | 1 + src/picker/picker.less | 8 +- src/popup/_example/base/index.wxss | 5 +- src/popup/_example/custom-close/index.wxss | 4 +- src/popup/_example/popup.wxml | 1 + src/popup/_example/with-title/index.wxss | 7 +- src/progress/_example/progress.wxml | 1 + src/progress/progress.wxml | 2 +- .../_example/base/index.wxss | 6 +- .../_example/pull-down-refresh.wxml | 1 + src/pull-down-refresh/pull-down-refresh.less | 2 +- src/radio/_example/horizontal/index.wxss | 2 +- src/radio/_example/radio.wxml | 1 + src/radio/_example/special/index.wxss | 12 +- src/radio/radio.less | 12 +- src/rate/_example/action/index.wxss | 7 +- src/rate/_example/base/index.wxss | 7 +- src/rate/_example/color/index.wxss | 8 +- src/rate/_example/count/index.wxss | 7 +- src/rate/_example/custom-prefix/index.wxss | 7 +- src/rate/_example/custom/index.wxss | 7 +- src/rate/_example/rate.wxml | 1 + src/rate/_example/show-text/index.wxss | 8 +- src/rate/_example/size/index.wxss | 8 +- src/rate/_example/special/index.wxss | 9 +- src/rate/_example/un-filled/index.wxss | 8 +- src/rate/rate.less | 8 +- src/result/_example/result.wxml | 1 + src/result/result.less | 4 +- src/search/_example/action/index.wxss | 2 +- src/search/_example/base/index.wxss | 2 +- src/search/_example/maxlength/index.wxss | 2 +- src/search/_example/other/index.wxss | 2 +- src/search/_example/search.wxml | 1 + src/search/_example/shape/index.wxss | 2 +- src/search/search.less | 10 +- src/side-bar-item/side-bar-item.less | 8 +- .../__test__/__snapshots__/demo.test.js.snap | 36 ++ src/side-bar/_example/base/index.js | 17 +- src/side-bar/_example/base/index.wxml | 5 +- src/side-bar/_example/base/index.wxss | 3 +- src/side-bar/_example/custom/index.js | 16 +- src/side-bar/_example/custom/index.wxml | 5 +- src/side-bar/_example/custom/index.wxss | 5 +- src/side-bar/_example/side-bar.wxml | 1 + src/side-bar/_example/switch/index.js | 14 + src/side-bar/_example/switch/index.wxml | 5 +- src/side-bar/_example/switch/index.wxss | 3 +- src/side-bar/_example/with-icon/index.js | 16 +- src/side-bar/_example/with-icon/index.wxml | 5 +- src/side-bar/_example/with-icon/index.wxss | 3 +- src/skeleton/_example/animation/index.wxss | 2 +- src/skeleton/_example/skeleton.wxml | 1 + src/skeleton/_example/theme/index.wxss | 2 +- src/skeleton/skeleton.less | 2 +- src/slider/_example/disabled/index.wxss | 4 +- src/slider/_example/label/index.wxss | 4 +- src/slider/_example/slider.less | 2 +- src/slider/_example/slider.wxml | 1 + src/slider/_example/step/index.wxss | 4 +- src/slider/_example/vertical/index.wxss | 4 +- src/slider/slider.less | 13 +- src/step-item/step-item.less | 10 +- src/stepper/_example/base/index.wxss | 2 +- src/stepper/_example/min-max/index.wxss | 2 +- src/stepper/_example/size/index.wxss | 2 +- src/stepper/_example/status/index.wxss | 2 +- src/stepper/_example/stepper.wxml | 1 + src/stepper/_example/theme/index.wxss | 2 +- src/stepper/stepper.less | 7 +- src/steps/_example/horizontal/index.wxss | 4 +- src/steps/_example/special/index.wxss | 4 +- src/steps/_example/status/index.wxss | 4 +- src/steps/_example/steps.wxml | 1 + src/steps/_example/vertical/index.wxss | 4 +- .../__test__/__snapshots__/demo.test.js.snap | 5 +- src/sticky/_example/base/index.js | 9 +- src/sticky/_example/base/index.wxml | 2 +- src/sticky/_example/container/index.js | 7 + src/sticky/_example/container/index.wxml | 2 +- src/sticky/_example/container/index.wxss | 2 +- src/sticky/_example/offset/index.js | 9 +- src/sticky/_example/offset/index.wxml | 2 +- src/sticky/_example/sticky.ts | 20 +- src/sticky/_example/sticky.wxml | 9 +- src/swipe-cell/_example/double/index.wxss | 4 +- src/swipe-cell/_example/icon/index.wxss | 4 +- src/swipe-cell/_example/left/index.wxss | 4 +- src/swipe-cell/_example/right/index.wxss | 4 +- src/swipe-cell/_example/swipe-cell.wxml | 1 + src/swiper/_example/cards/index.wxss | 8 +- src/swiper/_example/swiper.wxml | 1 + src/switch/_example/switch.wxml | 1 + src/switch/switch.less | 8 +- src/tab-bar-item/tab-bar-item.less | 2 +- src/tab-bar/_example/custom/index.wxss | 8 +- src/tab-bar/_example/tab-bar.wxml | 1 + src/tab-bar/tab-bar.less | 2 +- src/tabs/_example/tabs.wxml | 1 + src/tabs/_example/with-content/index.wxss | 1 + src/tabs/tabs.less | 6 +- src/tag/_example/checkable/index.wxss | 4 +- src/tag/_example/tag.wxml | 1 + src/tag/_example/type/index.wxss | 2 +- src/tag/tag.less | 6 +- src/textarea/_example/custom/index.wxss | 4 +- src/textarea/_example/textarea.wxml | 1 + src/textarea/textarea.less | 12 +- src/toast/_example/toast.less | 4 - src/toast/_example/toast.wxml | 1 + src/transition/_example/transition.wxml | 1 + src/tree-select/_example/tree-select.wxml | 1 + src/tree-select/tree-select.less | 2 + src/upload/_example/upload.less | 9 +- src/upload/_example/upload.wxml | 1 + src/upload/upload.less | 6 +- 236 files changed, 1363 insertions(+), 643 deletions(-) create mode 100644 example/assets/TDesign-logo_dark.png create mode 100644 example/assets/TDesign-logo_light.png delete mode 100644 example/assets/TDesignLogo@2x.png create mode 100644 site/theme/dark.ts create mode 100644 src/common/style/theme/_dark.less diff --git a/example/app.json b/example/app.json index 205142546..3be17798b 100644 --- a/example/app.json +++ b/example/app.json @@ -1,4 +1,5 @@ { + "darkmode": true, "pages": [ "pages/home/home", "pages/button/button", @@ -101,14 +102,12 @@ "usingComponents": { "t-demo": "./components/demo-block/index", "t-button": "tdesign-miniprogram/button/button", - "t-icon": "tdesign-miniprogram/icon/icon" + "t-icon": "tdesign-miniprogram/icon/icon", + "t-navbar": "tdesign-miniprogram/navbar/navbar" }, "window": { - "backgroundTextStyle": "light", - "navigationBarBackgroundColor": "#f6f6f6", - "backgroundColor": "#f6f6f6", "navigationBarTitleText": "TDesign", - "navigationBarTextStyle": "black" + "navigationStyle": "custom" }, "sitemapLocation": "sitemap.json" } diff --git a/example/app.less b/example/app.less index 05b867769..fab5e0ecf 100644 --- a/example/app.less +++ b/example/app.less @@ -1,25 +1,57 @@ @import '../src/common/style/_variables.less'; - +@import '../src/common/style/theme/_dark.less'; page { - background: #f6f6f6; // 和设计师确认过，统一改成这个颜色 + background-color: #f6f6f6; + --bg-color-demo-desc: #0009; + --bg-color-demo-title: #000000e6; + --bg-color-demo: #fff; + --bg-color-demo-border: #e7e7e7; + --bg-color-demo-secondary: #fff; + --td-navbar-bg-color: #f6f6f6; + --td-navbar-color: black; + --td-navbar-title-font-size: 26rpx; + --td-navbar-title-font-weight: 400; + --td-color-demo-notice-icon: rgba(0, 0, 0, 0.9); + --td-avatar-border-color: var(--bg-color-demo); + --td-progress-circle-inner-bg-color: var(--bg-color-demo); + --td-navbar-bg-color-example: @bg-color-container; + --td-navbar-color-example: @text-color-primary; + --td-grid-bg-color-example: @bg-color-container; + --td-grid-item-bg-color-example: @bg-color-container; + --td-input-border-color-example: rgba(220, 220, 220, 1); +} + +@media (prefers-color-scheme: dark) { + page { + background: #181818 !important; + --bg-color-demo-title: #fff; + --bg-color-demo-desc: #fff; + --bg-color-demo: #181818; + --bg-color-demo-border: #383838; + --bg-color-demo-secondary: #2c2c2c; + --td-navbar-bg-color: #181818; + --td-navbar-color: white; + --td-color-demo-notice-icon: rgba(255, 255, 255, 0.9); + --td-grid-bg-color-example: transparent; + --td-grid-item-bg-color-example: transparent; + --td-input-border-color-example: #5e5e5e; + } } .demo { padding-bottom: 56rpx; - // padding-bottom: env(safe-area-inset-bottom, 28px); 小程序真机渲染有bug - // padding-bottom: constant(safe-area-inset-bottom, 28px); &-title { font-size: 48rpx; font-weight: 700; line-height: 64rpx; margin: 48rpx 32rpx 0; - color: @font-gray-1; + color: var(--bg-color-demo-title); } &-desc { font-size: 28rpx; - color: @font-gray-2; + color: var(--bg-color-demo-desc); margin: 16rpx 32rpx 0; line-height: 44rpx; } diff --git a/example/assets/TDesign-logo_dark.png b/example/assets/TDesign-logo_dark.png new file mode 100644 index 0000000000000000000000000000000000000000..fbb0e6c8fee8ac5355ce4f033c658423e4a04bfc GIT binary patch literal 2934 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 literal 0 HcmV?d00001 diff --git a/example/assets/TDesignLogo@2x.png b/example/assets/TDesignLogo@2x.png deleted file mode 100644 index ab44a89295cd69875cde60d042b56f75b267b9d7..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 10893 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 diff --git a/example/components/demo-block/index.less b/example/components/demo-block/index.less index 8295155a2..56808bf60 100644 --- a/example/components/demo-block/index.less +++ b/example/components/demo-block/index.less @@ -1,10 +1,10 @@ -@import '../../../src/common/style/_variables.less'; +@import '../../../src/common/index.less'; .demo-block { margin: @spacer-4 0 0; &__header { - color: #000; + color: var(--bg-color-demo-title); margin: 0 @spacer-2; &-title { @@ -17,7 +17,7 @@ margin-top: @spacer; font-size: @font-size-base; white-space: pre-line; - color: @font-gray-2; + color: var(--bg-color-demo-desc); line-height: 22px; } } diff --git a/example/components/pull-down-list/index.less b/example/components/pull-down-list/index.less index 1062736e1..4e37ad28f 100644 --- a/example/components/pull-down-list/index.less +++ b/example/components/pull-down-list/index.less @@ -1,7 +1,9 @@ +@import '../../../src/common/style/_variables.less'; +@import '../../../src/common/style/theme/_dark.less'; .pullDownList { width: 100%; box-sizing: border-box; - background-color: #fff; + background-color: @bg-color-container; border-radius: 8rpx; margin-bottom: 12rpx * 2; overflow: hidden; @@ -14,7 +16,7 @@ padding: 0 16rpx * 2; font-size: 16rpx * 2; line-height: 24rpx * 2; - color: #333; + color: @text-color-secondary; } .name, @@ -41,7 +43,7 @@ .child { box-sizing: border-box; - border-bottom: 1rpx solid #e5e5e5; + border-bottom: 1rpx solid @component-stroke; height: 56rpx * 2; display: flex; justify-content: space-between; @@ -50,6 +52,7 @@ margin-right: 16rpx * 2; font-size: 16rpx * 2; opacity: 0.9; + color: @text-color-primary; &:last-of-type { border-bottom-color: transparent; diff --git a/example/components/pull-down-list/index.ts b/example/components/pull-down-list/index.ts index 004d49f12..381270dab 100644 --- a/example/components/pull-down-list/index.ts +++ b/example/components/pull-down-list/index.ts @@ -1,5 +1,4 @@ const itemHeight = 56 * 2; - Component({ data: { childBoxHeight: 0, diff --git a/example/components/pull-down-list/index.wxml b/example/components/pull-down-list/index.wxml index cf58f3b70..0231dadfc 100644 --- a/example/components/pull-down-list/index.wxml +++ b/example/components/pull-down-list/index.wxml @@ -6,7 +6,7 @@ {{ item.name }} {{ item.label }} - + diff --git a/example/pages/home/home.json b/example/pages/home/home.json index e2c250bf0..8505e4e2f 100644 --- a/example/pages/home/home.json +++ b/example/pages/home/home.json @@ -4,8 +4,5 @@ "t-footer": "tdesign-miniprogram/footer/footer", "trd-privacy": "/components/trd-privacy/privacy" }, - "navigationBarTitleText": "TDesign UI", - "navigationBarBackgroundColor": "#f6f6f6", - "navigationBarTextStyle": "black", - "backgroundColor": "#f6f6f6" + "navigationBarTitleText": "TDesign UI" } diff --git a/example/pages/home/home.less b/example/pages/home/home.less index cb366c147..52e6bd933 100644 --- a/example/pages/home/home.less +++ b/example/pages/home/home.less @@ -1,6 +1,4 @@ -page { - background-color: #f6f6f6; -} +@import '../../../src/common/style/_variables.less'; .main { width: 100%; @@ -38,7 +36,7 @@ page { } .desc { - color: rgba(0, 0, 0, 0.4); + color: @text-color-placeholder; margin-top: 16rpx * 2; font-size: 14rpx * 2; font-weight: 400; diff --git a/example/pages/home/home.ts b/example/pages/home/home.ts index 734d3aab3..c7bfb37b3 100644 --- a/example/pages/home/home.ts +++ b/example/pages/home/home.ts @@ -4,6 +4,7 @@ Page({ data: { list, currentYear: new Date().getFullYear(), + isDarkMode: false, }, onLoad(options) { const { path, q } = options; @@ -20,6 +21,7 @@ Page({ } this.trdPrivacy = this.selectComponent('#trdPrivacy'); + this.setData({ isDarkMode: wx.getSystemInfoSync().theme === 'dark' }); }, showPrivacyWin() { diff --git a/example/pages/home/home.wxml b/example/pages/home/home.wxml index ae6a607ca..f0b52ab8b 100644 --- a/example/pages/home/home.wxml +++ b/example/pages/home/home.wxml @@ -1,6 +1,12 @@ + - + TDesign 适配微信小程序的组件库 import siteConfig from './site.config'; +import { changeThemeMode } from './theme/dark'; import { defineComponent } from 'vue'; @@ -42,6 +43,25 @@ const docsMap = { en: sortDocs(enDocs), }; +function watchHtmlMode(callback = () => {}) { + const targetNode = document.documentElement; + const config = { attributes: true }; + + const observerCallback = (mutationsList) => { + for (const mutation of mutationsList) { + if (mutation.attributeName === 'theme-mode') { + const themeMode = mutation.target.getAttribute('theme-mode') || 'light'; + if (themeMode) callback(themeMode); + } + } + }; + + const observer = new MutationObserver(observerCallback); + observer.observe(targetNode, config); + + return observer; +} + export default defineComponent({ data() { return { @@ -68,6 +88,7 @@ export default defineComponent({ window.scrollTo(0, 0); }; this.$refs.tdDocSearch.docsearchInfo = { indexName: 'tdesign_doc_miniprogram' }; + watchHtmlMode(changeThemeMode); }, watch: { diff --git a/site/plugin-tdoc/component.vue b/site/plugin-tdoc/component.vue index 6b23ee58d..f48f5c497 100644 --- a/site/plugin-tdoc/component.vue +++ b/site/plugin-tdoc/component.vue @@ -15,7 +15,10 @@ frameborder="0" width="100%" height="100%" - style="box-sizing: border-box; border-radius: 0 0 6px 6px; overflow: hidden; border-top: 8px solid #f8f8f8" + class="mobile-iframe" + style="box-sizing: border-box; border-radius: 0 0 6px 6px; overflow: hidden" + @load="onIframeLoaded" + ref="parentIframe" > @@ -36,6 +39,7 @@ import { defineComponent } from 'vue'; import Prismjs from 'prismjs'; import 'prismjs/components/prism-bash.js'; import 'prismjs/components/prism-json.js'; +import { changeThemeMode, watchExampleRouterChange } from '../theme/dark'; import QrCode from '@components/qrcode.vue'; @@ -87,11 +91,28 @@ export default defineComponent({ this.$emit('loaded', () => { tdDocContent.pageStatus = 'show'; }); + if (this.$refs.parentIframe && this.$refs.parentIframe.onload) { + this.$refs.parentIframe.onload = () => { + watchExampleRouterChange(this.$refs.parentIframe); + }; + } + }, + + methods: { + onIframeLoaded() { + changeThemeMode(); + }, }, });