Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Code refactor with CardHeaderTitle component. 

This component will be used in other components later.

(cherry picked from commit 995fb7e02d)
This commit is contained in:
Gan Eng Chin 2022-12-09 19:30:24 +08:00
parent 3f56382cf1
commit 0fe028d8c2
No known key found for this signature in database
GPG Key ID: 94D5D972860ADB01
6 changed files with 22 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
plugins/woocommerce-admin/client/marketing/components/CardHeaderTitle/CardHeaderTitle.scss Normal file
View File

@ -0,0 +1,6 @@
.woocommerce-marketing-card-header-title {
font-size: 20px;
font-weight: 400;
line-height: 28px;
letter-spacing: 0;
}

12
plugins/woocommerce-admin/client/marketing/components/CardHeaderTitle/CardHeaderTitle.tsx Normal file
View File

@ -0,0 +1,12 @@
/**
* Internal dependencies
*/
import './CardHeaderTitle.scss';
export const CardHeaderTitle: React.FC = ( { children } ) => {
return (
<div className="woocommerce-marketing-card-header-title">
{ children }
</div>
);
};

1
plugins/woocommerce-admin/client/marketing/components/CardHeaderTitle/index.ts Normal file
View File

@ -0,0 +1 @@
export { CardHeaderTitle } from './CardHeaderTitle';

4
plugins/woocommerce-admin/client/marketing/components/CollapsibleCard/CollapsibleCard.scss
View File

@ -1,9 +1,5 @@
.woocommerce-collapsible-card {
.components-card-header {
font-size: 20px;
font-weight: 400;
line-height: 28px;
letter-spacing: 0;
cursor: pointer;
}
}

3
plugins/woocommerce-admin/client/marketing/components/CollapsibleCard/CollapsibleCard.tsx
View File

@ -17,6 +17,7 @@ import classnames from 'classnames';
/**
* Internal dependencies
*/
import { CardHeaderTitle } from '~/marketing/components';
import './CollapsibleCard.scss';
type CollapsibleCardProps = {
@ -48,7 +49,7 @@ const CollapsibleCard: React.FC< CollapsibleCardProps > = ( {
) }
>
<CardHeader onClick={ handleClick }>
<div>{ header }</div>
<CardHeaderTitle>{ header }</CardHeaderTitle>
<Button
isSmall
icon={ collapsed ? chevronDown : chevronUp }

1
plugins/woocommerce-admin/client/marketing/components/index.js
View File

@ -5,4 +5,5 @@ export { default as Slider } from './slider';
export { default as ReadBlogMessage } from './ReadBlogMessage';
export { CollapsibleCard, CardBody, CardDivider } from './CollapsibleCard';
export { PluginCardBody } from './PluginCardBody';
export { CardHeaderTitle } from './CardHeaderTitle';
export { CenteredSpinner } from './CenteredSpinner';