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.

Sign up for GitHub

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

Jump to bottom

fix(Select): border 유무에 따라 size가 변형되지 않도록 수정합니다. #183

Open
wants to merge 2 commits into
base: main
Choose a base branch
from
Open

fix(Select): border 유무에 따라 size가 변형되지 않도록 수정합니다. #183

wants to merge 2 commits into from
+6 −1

Conversation

jungwoo3490
Copy link
Member

@jungwoo3490 jungwoo3490 commented Oct 26, 2024 •
edited
Loading

변경사항

close #182

#174 에 설명되어있듯이, triggerContent에 대한 focus style을 별도로 정의하게 되면서 S.input 스타일을 가져다가 사용하지 않게 되었고, S.input에 정의되어 있는 border: 1px solid transparent가 적용되지 않아서 border 유무에 따라 size가 변형되어 다른 요소가 밀리는 이슈가 발생했어요.

이를 해결하기 위해 별도로 정의한 focus style에 정의되어 있던 border를 box-shadow inset으로 변경하여 테두리가 생기더라도 요소의 size가 변형되지 않도록 하여 문제를 해결했어요.

  • 논의하고 싶은 점
    이렇게 되면 Select에서 Input의 공통 style을 참조하고 있지 않는데, Select를 Input으로 묶기보다 별도로 분리하는 건 어떤지에 대한 의견을 들어보고 싶어요!!

링크

https://sopt-makers.slack.com/lists/T040QGZF77H/F07LCJ586TS?record_id=Rec07T75VU4T1

시급한 정도

🏃‍♂️ 보통 : 최대한 빠르게 리뷰 부탁드립니다.

@jungwoo3490 jungwoo3490 self-assigned this Oct 26, 2024
@height Height
Copy link

height bot commented Oct 26, 2024

Link Height tasks by mentioning a task ID in the pull request title or commit messages, or description and comments with the keyword link (e.g. "Link T-123").

💡Tip: You can also use "Close T-X" to automatically close a task when the pull request is merged.

@changeset-bot changeset-bot
Copy link

changeset-bot bot commented Oct 26, 2024

⚠️ No Changeset found

Latest commit: c27e0cc

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@Brokyeom
Copy link
Member

이렇게 되면 Select에서 Input의 공통 style을 참조하고 있지 않는데, Select를 Input으로 묶기보다 별도로 분리하는 건 어떤지에 대한 의견을 들어보고 싶어요!!

저도 Select의 스타일은 분리하는게 좋겠다는 생각입니다. 이전에는 비슷한 레이아웃을 공유하기때문에 공통 스타일로 묶은 감이 있는데 달라진다면 분리하는게 맞다고 생각해요!

Brokyeom
Brokyeom approved these changes Oct 27, 2024
View reviewed changes
Copy link
Member

@Brokyeom Brokyeom left a comment

Choose a reason for hiding this comment

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

LGTM !!

suwonthugger
suwonthugger approved these changes Oct 27, 2024
View reviewed changes
Copy link
Member

@suwonthugger suwonthugger left a comment

Choose a reason for hiding this comment

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

LGTM

논의하고 싶은 점
이렇게 되면 Select에서 Input의 공통 style을 참조하고 있지 않는데, Select를 Input으로 묶기보다 별도로 분리하는 건 어떤지에 대한 의견을 > 들어보고 싶어요!!

저도 공통적으로 쓰이는 스타일링이 없다면 Input과 분리하는게 좋을것 같습니다! 의미적으로도 분리하는게 맞을것 같아요!

추가적으로 css reset을 만들어서 스타일링을 어느정도 통일감있게 가져가는게 좋지 않을까 싶습니다. box-size border box 등을 적용하면 크기 관련 문제가 더 줄어들것 같아요

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@Brokyeom Brokyeom Brokyeom approved these changes

@suwonthugger suwonthugger suwonthugger approved these changes

@sohee-K sohee-K Awaiting requested review from sohee-K sohee-K is a code owner

Assignees

@jungwoo3490 jungwoo3490

Labels
size/XS
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

fix(Select): border 유무에 따라 size가 변형되지 않도록 수정합니다.
3 participants
@jungwoo3490 @Brokyeom @suwonthugger