dumi-theme-antd/dist/hooks/useSiteToken.js

Ant Design 5.0 官网风格类似的 dumi2 主题插件

import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
import { TinyColor } from '@ctrl/tinycolor';
import { theme } from 'antd';
import { ConfigContext } from 'antd/lib/config-provider';
import { useContext } from 'react';
import SiteContext from "dumi/theme/slots/SiteContext";
var useToken = theme.useToken;
var headerHeight = 64;
var boxShadowCard = "\n0 1px 2px -2px ".concat(new TinyColor('rgba(0, 0, 0, 0.16)').toRgbString(), ",\n0 3px 6px 0 ").concat(new TinyColor('rgba(0, 0, 0, 0.12)').toRgbString(), ",\n0 5px 12px 4px ").concat(new TinyColor('rgba(0, 0, 0, 0.09)').toRgbString(), "\n");
var useSiteToken = function useSiteToken() {
  var result = useToken();
  var _useContext = useContext(ConfigContext),
    getPrefixCls = _useContext.getPrefixCls,
    iconPrefixCls = _useContext.iconPrefixCls;
  var _useContext2 = useContext(SiteContext),
    siteTheme = _useContext2.theme;
  var rootPrefixCls = getPrefixCls();
  var token = result.token;
  var siteMarkdownCodeBg = token.colorFillTertiary;
  return _objectSpread(_objectSpread({}, result), {}, {
    token: _objectSpread(_objectSpread({}, token), {}, {
      headerHeight: headerHeight,
      menuItemBorder: 2,
      mobileMaxWidth: 767.99,
      siteMarkdownCodeBg: siteMarkdownCodeBg,
      antCls: ".".concat(rootPrefixCls),
      iconCls: ".".concat(iconPrefixCls),
      /** 56 */
      marginFarXS: token.marginXXL / 6 * 7,
      /** 80 */
      marginFarSM: token.marginXXL / 3 * 5,
      /** 96 */
      marginFar: token.marginXXL * 2,
      codeFamily: "'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace",
      contentMarginTop: 40,
      anchorTop: headerHeight + token.margin,
      boxShadowCard: boxShadowCard,
      siteTheme: siteTheme
    }),
    /** dumi-theme-antd 站点 class 前缀 */
    siteCls: 'dumi-antd'
  });
};
export default useSiteToken;