crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-07-13 16:01:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

✨ feat: Collection Heading

Browse Source
This commit is contained in:
quocsonnguyen 2021-08-26 14:13:52 +07:00
parent 3a0cb30b78
commit 4c890414b3
2 changed files with 6 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/common/CollectionHeading/CollectionHeading.module.scss
View File

@ -1,7 +1,5 @@
@import '../../../styles/utilities'; @import '../../../styles/utilities';
.subtitle { .subtitle {
@apply spacing-horizontal-left; @apply spacing-horizontal-left collection-subtitle;
font-size: var(--font-size);
line-height: var(--line-height);
} }

11
src/components/common/CollectionHeading/CollectionHeading.tsx
View File

@ -1,19 +1,18 @@
import React from 'react' import React from 'react'
// import classNames from 'classnames'
import s from './CollectionHeading.module.scss' import s from './CollectionHeading.module.scss'
import HeadingCommon from '../HeadingCommon/HeadingCommon' import HeadingCommon from '../HeadingCommon/HeadingCommon'
interface CollectionHeadingProps { interface CollectionHeadingProps {
headingType?: 'default' | 'highlight' | 'light' type?: 'default' | 'highlight' | 'light';
headingText: string; children: string;
subtitle: string subtitle: string;
} }
const CollectionHeading = ({ headingType='default', headingText, subtitle }: CollectionHeadingProps) => { const CollectionHeading = ({ type='default', children, subtitle }: CollectionHeadingProps) => {
return ( return (
<section className="collectionHeading"> <section className="collectionHeading">
<HeadingCommon headingType={headingType} headingText={headingText}/> <HeadingCommon type={type} children={children}/>
<div className={s.subtitle}>{subtitle}</div> <div className={s.subtitle}>{subtitle}</div>
</section> </section>
) )