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

refactor: format code

Browse Source
This commit is contained in:
unknown
2021-09-07 13:12:51 +07:00
parent f67fd17a10
commit 670343c06c
2 changed files with 20 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
src/components/common/SelectCommon/SelectCommon.module.scss
View File

@@ -1,70 +1,70 @@
@import "../../../styles/utilities"; @import "../../../styles/utilities";
.select{ .select {
background-color: var(--white); background-color: var(--white);
&.base{ &.base {
width: 20.6rem; width: 20.6rem;
.selectTrigger{ .selectTrigger {
width: 20.6rem; width: 20.6rem;
padding: 1.2rem 1.6rem; padding: 1.2rem 1.6rem;
} }
} }
&.large{ &.large {
width: 34.25rem; width: 34.25rem;
.selectTrigger{ .selectTrigger {
width: 34.25rem; width: 34.25rem;
padding: 1.6rem 1.6rem; padding: 1.6rem 1.6rem;
} }
} }
&.default{ &.default {
.selectTrigger{ .selectTrigger {
@apply border-solid border border-current; @apply border-solid border border-current;
} }
} }
&.custom{ &.custom {
.selectTrigger{ .selectTrigger {
@apply border-2; @apply border-2;
border-color: var(--border-line); border-color: var(--border-line);
color: var(--text-label); color: var(--text-label);
} }
} }
&:hover{ &:hover {
cursor: pointer; cursor: pointer;
.hoverWrapper{ .hoverWrapper {
@apply block; @apply block;
animation: SelectAnimation 0.2s ease-out; animation: SelectAnimation 0.2s ease-out;
} }
} }
} }
.selectTrigger{ .selectTrigger {
@apply outline-none flex justify-between; @apply outline-none flex justify-between;
color: var(--text-active); color: var(--text-active);
border-radius: 0.8rem; border-radius: 0.8rem;
} }
.hoverWrapper{ .hoverWrapper {
@apply hidden outline-none absolute z-10; @apply hidden outline-none absolute z-10;
padding-top: 0.6rem; padding-top: 0.6rem;
.selectOptionWrapper{ .selectOptionWrapper {
border-radius: 0.8rem; border-radius: 0.8rem;
background-color: var(--white); background-color: var(--white);
padding: 0.4rem 0rem 0.4rem 0rem; padding: 0.4rem 0rem 0.4rem 0rem;
&.base{ &.base {
width: 20.6rem; width: 20.6rem;
} }
&.large{ &.large {
width: 34.25rem; width: 34.25rem;
} }
&.default{ &.default {
@apply border-solid border border-current; @apply border-solid border border-current;
} }
&.custom{ &.custom {
@apply border-2; @apply border-2;
border-color: var(--border-line); border-color: var(--border-line);
color: var(--text-label); color: var(--text-label);
} }
} }
&:hover{ &:hover {
@apply block; @apply block;
} }
} }

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

@@ -44,7 +44,7 @@ const SelectCommon = ({ type = 'default', size = 'base', option, placeholder, on
> >
{ {
option.map(item => option.map(item =>
<SelectOption itemName={item.name} value={item.value} onClick={changeSelectedName} size={size} selected={(selectedValue === item.value) ? true : false} /> <SelectOption itemName={item.name} value={item.value} onClick={changeSelectedName} size={size} selected={(selectedValue === item.value)} />
) )
} }
</div> </div>