Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Feat] 타임 블록 구현 #50

Merged
merged 17 commits into from
Jul 9, 2024
Merged

Conversation

namdaeun
Copy link
Member

@namdaeun namdaeun commented Jul 9, 2024

해당 이슈 번호

closed #37


체크리스트

  • 🔀 PR 제목의 형식을 잘 작성했나요? e.g. [feat] PR을 등록한다.
  • 💯 테스트는 잘 통과했나요?
  • 🏗️ 빌드는 성공했나요?
  • 🧹 불필요한 코드는 제거했나요?
  • ✅ 컨벤션을 지켰나요?
  • 💭 이슈는 등록했나요?
  • 🏷️ 라벨은 등록했나요?
  • 💻 git rebase를 사용했나요?
  • 🙇‍♂️ 리뷰어를 지정했나요?
  • ✨ 저는 (common/shared)로 분리했어요.

📌 내가 알게 된 부분

  • 폴더명 바꾸다가 이슈가 좀 생겨서 변경된 파일들이 많은 점 이해 부탁드립니다...

타임 블록 구현

      <div css={[blockStyle, { width: `${width}rem` }]}>
        <Eclipse width={47} height={47} css={{ flexShrink: 0 }} />
        <span css={spanStyle}>{children}</span>
      </div>
  • 받아온 기간에 따라 타임 블록의 길이가 달라질 것이기 때문에 width를 인자로 받아와줬습니다.

📌 질문할 부분


📌스크린샷 (선택)

@namdaeun namdaeun self-assigned this Jul 9, 2024
@namdaeun namdaeun changed the title Feature/archiving/#37 timeblock [Feat] 타임 블록 구현 Jul 9, 2024
Copy link
Contributor

@wuzoo wuzoo left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM ~ 스타일 가이드 바뀐거 다 적용하시느라 고생많으셨네요 !

Copy link
Contributor

@Bowoon1216 Bowoon1216 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

정말 많은 파일이 바뀌었네요 ! 수고하셨습니다 ~~ 코멘트 확인 부탁드려용 💟

@@ -40,7 +39,7 @@ const Input = (
return (
<article css={containerStyle}>
{label && <Label id={label}>{label}</Label>}
<div css={[warpperStyle, variantStyle({ variant, isError }), sizeStyle(size)]}>
<div css={[warpperStyle, variantStyle(variant, isError), sizeStyle(size)]}>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

바꿔주셔서 감사합니다 ~~ !!

justifyContent: 'center',
alignItems: 'center',

borderRadius: '10rem',
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

radius는 px로 맞춰주시면 좋을거 같습니다~~ 👍

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

넵 !!

const TimeBlock = ({ children, width }: TimeBlockProps) => {
return (
<>
<div css={[blockStyle, { width: `${width}rem` }]}>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

blockStyle안에 width를 같이 하지 않은 이유가 있을까용?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

별다른 이유는 없었습니다! 보운님 코리보고 생각해보니 굳이 인라인으로 줄 필요가 없을 것 같아서 blockStyle의 인자로 전달해줬습니다. 감사합니다 :)

Copy link
Contributor

@cindy-chaewon cindy-chaewon left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

깔끔하게 잘 구현 하셨네요!! 고생많으셨습니다!!

return (
<>
<div css={[blockStyle, { width: `${width}rem` }]}>
<Eclipse width={47} height={47} css={{ flexShrink: 0 }} />
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

css flexShrink 속성은 처음 보네요! 알아갑니다!

Copy link
Contributor

@rtttr1 rtttr1 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@namdaeun namdaeun merged commit 37a8842 into develop Jul 9, 2024
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

타임 블록 구현
5 participants