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

✨ feat: label

Browse Source 
:%s
This commit is contained in:
unknown 2021-08-24 11:16:48 +07:00
parent 6fea2ecc35
commit aef26bb167
3 changed files with 12 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
pages/index.tsx
View File

@ -14,18 +14,18 @@ const dataTest = [{
},{ },{
text:6 text:6
}] }]
const test = (props:any)=><div className="h-64 bg-yellow-300">{props.text}</div> const test = (props:{text:string})=><div className="h-64 bg-yellow-300">{props.text}</div>
export default function Home() { export default function Home() {
return ( return (
<> <>
<CarouselCommon data={dataTest} Component={test} itemKey="test"/> <CarouselCommon data={dataTest} Component={test} itemKey="test"/>
<QuanittyInput size ="default" min={5} max={10} initValue={3}/> <QuanittyInput size ="default" min={5} max={10} initValue={3}/>
<QuanittyInput size ="small" min={3} step={10}/> <QuanittyInput size ="small" min={3} step={10}/>
<LabelCommon>SEEFOOT</LabelCommon> <LabelCommon type="default" shape="half" >SEEFOOT</LabelCommon>
<LabelCommon type="discount">-15%</LabelCommon> <LabelCommon type="discount" shape="round">-15%</LabelCommon>
<LabelCommon type="waiting">Waitting</LabelCommon> <LabelCommon type="waiting">Waitting</LabelCommon>
<LabelCommon type="delivering" >delivering</LabelCommon> <LabelCommon type="delivering" >Delivering</LabelCommon>
<LabelCommon type="delivered">delivered</LabelCommon> <LabelCommon type="delivered">Delivered</LabelCommon>
</> </>
) )
} }

2
src/components/common/CarouselCommon/CarouselCommon.tsx
View File

@ -6,7 +6,7 @@ import s from "./CaroucelCommon.module.scss"
interface CarouselCommonProps { interface CarouselCommonProps {
children?: React.ReactNode children?: React.ReactNode
data?: any[] data?: any[]
Component: React.ComponentType Component: React.ComponentType<any>
isArrow?:Boolean isArrow?:Boolean
itemKey:String itemKey:String
} }

7
src/components/common/LabelCommon/LabelCommon.module.scss
View File

@ -1,15 +1,20 @@
.labelCommonWarper{ .labelCommonWarper{
display: inline-flex; display: inline-flex;
align-items: flex-start;
font-weight: bold; font-weight: bold;
letter-spacing: 0.01em;
@apply text-white text-right;
&.defaultSize{ &.defaultSize{
max-height: 2rem; min-height: 2rem;
line-height: 2rem; line-height: 2rem;
font-size: 1.2rem; font-size: 1.2rem;
padding: 0 0.8rem;
} }
&.largeSize{ &.largeSize{
max-height: 2.4rem; max-height: 2.4rem;
line-height: 2.4rem; line-height: 2.4rem;
font-size: 1.6rem; font-size: 1.6rem;
padding: 0 1.8rem;
} }
&.defaultType{ &.defaultType{
@apply bg-positive-dark; @apply bg-positive-dark;