feat: dark palette preview

[ycjcl868]

遗留问题

1. 站点 iframe 里的主题切换（需要改 Bisheng，提供一个 postMessage 通信）
2. Card grid hover 有白底闪烁
3. Drawer/Modal 下的 Table 样式，需要单独提供一套

全局主题切换

运行站点前，先执行一下 node scripts/generateColorLess.js，使用 less 模拟 webpack 模块依赖 resolve，编译出一份 dark.css。

然后切换直接动态加 dark.css

局部主题切换

不使用此方案，因为在 Modal、Drawer 等组件，脱离局部容器展示，主题将不 work

1. 启动 site 前，先 npm run dist 下，编译出 antd.dark.css
2. 在官网全局样式中引入

// static/common.less
// 用 data-* 属性是为了将 theme 样式优先级 < 容器定制样式
[data-theme='dark'] {
  @import (less) '../../../dist/antd.dark.css';
}

1. 点击切换，设置局部的容器 div/section 属性为 data-theme={theme}，添加对应的样式

// demo.less
.code-box {
  &[data-theme='dark'] {
    // dark less vars
    @import (less) '../../../components/style/themes/dark.less';
    .code-box-title {
      &,
      a {
        background: @component-background;
        color: @text-color;
      }
    }
  }
}

就可以进行局部切换：

不好的点

1. 官网 dev 调试时，无法调试暗色主题。（好像不是特别强需求）
2. 开发和部署官网时，得先编译 lib、再编译 dist，最后再 run site，因为依赖了 dist 和 lib 目录。
3. Modal、Drawer 不 work

期待解决

1. 局部切换先用这个方案，整站切换时换 @chenshuai2144 的 webpack 插件。

🤔 This is a ...

• New feature
• Bug fix
• Site / document update
• Component style update
• TypeScript definition update
• Refactoring
• Code style optimization
• Test Case
• Branch merge
• Other (about what?)

🔗 Related issue link

💡 Background and solution

📝 Changelog

Language	Changelog
🇺🇸 English
🇨🇳 Chinese

☑️ Self Check before Merge

• Doc is updated/provided or not needed
• Demo is updated/provided or not needed
• TypeScript definition is updated/provided or not needed
• Changelog is provided or not needed

[netlify]

Deploy preview for ant-design ready!

Built with commit 090f258

https://deploy-preview-20281--ant-design.netlify.com

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 090f258:

Sandbox	Source
antd reproduction template	Configuration

[codecov]

Codecov Report

Merging #20281 into 4.0-prepare will decrease coverage by 0.02%.
The diff coverage is 66.66%.

@@               Coverage Diff               @@
##           4.0-prepare   #20281      +/-   ##
===============================================
- Coverage        97.57%   97.54%   -0.03%     
===============================================
  Files              295      295              
  Lines             6771     6773       +2     
  Branches          1869     1871       +2     
===============================================
  Hits              6607     6607              
- Misses             164      166       +2

Impacted Files	Coverage Δ
components/progress/Steps.tsx	87.5% <66.66%> (-12.5%)	⬇️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update abf215a...090f258. Read the comment docs.

[zombieJ]

作为临时方案我觉得是足够了

[ycjcl868]

run site / start 前就是得先 run compile 再 run dist

[zombieJ]

package.json 里更新一下 site，让它做一下 dark 的编译工作。

[zombieJ]

加一个暗色主题的 bundle size 检测：https://github.com/ant-design/ant-design/blob/4.0-prepare/package.json#L255