Skip to content

Commit

Permalink
change pure to ghost
Browse files Browse the repository at this point in the history
  • Loading branch information
chenshuai2144 committed Oct 14, 2019
1 parent cdc1ed1 commit 594baa8
Show file tree
Hide file tree
Showing 9 changed files with 15 additions and 13 deletions.
2 changes: 1 addition & 1 deletion components/config-provider/index.en-US.md
Expand Up @@ -43,4 +43,4 @@ Some component use dynamic style to support wave effect. You can config `csp` pr
| getPopupContainer | to set the container of the popup element. The default is to create a `div` element in `body`. | Function(triggerNode) | `() => document.body` | 3.11.0 |
| locale | language package setting, you can find the packages in [antd/es/locale](http://unpkg.com/antd/es/locale/) | object | 3.21.0 |
| prefixCls | set prefix class | string | ant | 3.12.0 |
| pageHeaderType | Unify the type of pageHeader | string | ant | 3.12.0 |
| pageHeader | Unify the type of pageHeader ,Ref [pageHeader](<(/components/page-header)> | { type: 'ghost'\|'default' } | 'default' | 3.24.0 |
1 change: 1 addition & 0 deletions components/config-provider/index.tsx
Expand Up @@ -73,6 +73,7 @@ class ConfigProvider extends React.Component<ConfigProviderProps> {
}

// set pageHeader type
// 防止设置为 null 报错
if (pageHeader && pageHeader.type) {
config.pageHeader = pageHeader;
}
Expand Down
2 changes: 1 addition & 1 deletion components/config-provider/index.zh-CN.md
Expand Up @@ -44,4 +44,4 @@ return (
| getPopupContainer | 弹出框(Select, Tooltip, Menu 等等)渲染父节点,默认渲染到 body 上。 | Function(triggerNode) | () => document.body | 3.11.0 |
| locale | 语言包配置,语言包可到 [antd/es/locale](http://unpkg.com/antd/es/locale/) 目录下寻找 | object | - | 3.21.0 |
| prefixCls | 设置统一样式前缀 | string | ant | 3.12.0 |
| pageHeaderType | 统一设置 pageHeader 的 type | string | ant | 3.12.0 |
| pageHeader | 统一设置 pageHeader 的 type,参考 [pageHeader](<(/components/page-header)>) | { type: 'ghost' \| 'default' } | 'default' | 3.24.0 |
Expand Up @@ -697,10 +697,10 @@ exports[`renders ./components/page-header/demo/content.md correctly 1`] = `

exports[`renders ./components/page-header/demo/pure.md correctly 1`] = `
<div
style="background-color:#eee;padding:24px"
style="background-color:#F5F5F5;padding:24px"
>
<div
class="ant-page-header pure"
class="ant-page-header ghost"
>
<div
class="ant-page-header-heading"
Expand Down
6 changes: 3 additions & 3 deletions components/page-header/demo/pure.md
Expand Up @@ -19,12 +19,12 @@ import { PageHeader, Button, Descriptions } from 'antd';
ReactDOM.render(
<div
style={{
backgroundColor: '#eee',
backgroundColor: '#F5F5F5',
padding: 24,
}}
>
<PageHeader
type="pure"
type="ghost"
onBack={() => window.history.back()}
title="Title"
subTitle="This is a subtitle"
Expand Down Expand Up @@ -55,6 +55,6 @@ ReactDOM.render(

<style>
#components-page-header-demo-pure .code-box-demo .ant-page-header {
border: 1px solid #1890ff;
border: 1px solid #ebedf0;
}
</style>
2 changes: 1 addition & 1 deletion components/page-header/index.en-US.md
Expand Up @@ -18,7 +18,7 @@ It can also be used as inter-page navigation when it is needed to make the user
| --- | --- | --- | --- | --- |
| title | custom title text | ReactNode | - | 3.14.0 |
| subTitle | custom subTitle text | ReactNode | - | 3.14.0 |
| type | pageHeader type, will change background color | `'default' | 'pure'` | 'default' | 3.24.0 |
| type | pageHeader type, will change background color | `'default' | 'ghost'` | 'default' | 3.24.0 |
| avatar | Avatar next to the title bar | [avatar props](/components/avatar/) | - | 3.22.0 |
| backIcon | custom back icon, if false the back icon will not be displayed | ReactNode | `<Icon type="arrow-left" />` | 3.14.0 |
| tags | Tag list next to title | [Tag](https://ant.design/components/tag-cn/)[] \| [Tag](https://ant.design/components/tag-cn/) | - | 3.14.0 |
Expand Down
7 changes: 4 additions & 3 deletions components/page-header/index.tsx
Expand Up @@ -22,7 +22,7 @@ export interface PageHeaderProps {
avatar?: AvatarProps;
onBack?: (e: React.MouseEvent<HTMLDivElement>) => void;
className?: string;
type?: 'pure' | 'default';
type?: 'ghost' | 'default';
}

const renderBack = (
Expand Down Expand Up @@ -90,7 +90,7 @@ const renderChildren = (prefixCls: string, children: React.ReactNode) => {

const PageHeader: React.SFC<PageHeaderProps> = props => (
<ConfigConsumer>
{({ getPrefixCls, pageHeaderType }: ConfigConsumerProps) => {
{({ getPrefixCls, pageHeader = { type: 'default' } }: ConfigConsumerProps) => {
const {
prefixCls: customizePrefixCls,
style,
Expand All @@ -106,7 +106,8 @@ const PageHeader: React.SFC<PageHeaderProps> = props => (
const className = classnames(prefixCls, customizeClassName, {
'has-breadcrumb': breadcrumbDom,
'has-footer': footer,
pure: type || pageHeaderType,
// 防止设置为 null 报错
ghost: type === 'ghost' || (pageHeader && pageHeader.type === 'ghost'),
});

return (
Expand Down
2 changes: 1 addition & 1 deletion components/page-header/index.zh-CN.md
Expand Up @@ -18,7 +18,7 @@ subtitle: 页头
| --- | --- | --- | --- | --- |
| title | 自定义标题文字 | ReactNode | - | 3.14.0 |
| subTitle | 自定义的二级标题文字 | ReactNode | - | 3.14.0 |
| type | pageHeader 的类型,将会改变背景颜色 | `'default' | 'pure'` | 'default' | 3.24.0 |
| type | pageHeader 的类型,将会改变背景颜色 | `'default' | 'ghost'` | 'default' | 3.24.0 |
| avatar | 标题栏旁的头像 | [avatar props](/components/avatar/) | - | 3.22.0 |
| backIcon | 自定义 back icon ,如果为 false 不渲染 back icon | ReactNode | `<Icon type="arrow-left" />` | 3.14.0 |
| tags | title 旁的 tag 列表 | [Tag](https://ant.design/components/tag-cn/)[] \| [Tag](https://ant.design/components/tag-cn/) | - | 3.14.0 |
Expand Down
2 changes: 1 addition & 1 deletion components/page-header/style/index.less
Expand Up @@ -9,7 +9,7 @@
padding: @page-header-padding-vertical @page-header-padding;
background-color: @component-background;

&.pure {
&.ghost {
background-color: inherit;
}

Expand Down

0 comments on commit 594baa8

Please sign in to comment.