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

fix: SearchInputのwrapperであるlabel要素に対してwidthを指定する #4961

Merged
merged 3 commits into from
Oct 6, 2024

Conversation

AtsushiM
Copy link
Member

@AtsushiM AtsushiM commented Sep 30, 2024

関連URL

概要

  • Clusterなどの中でSearchInputに対してwitdh propsを指定した場合、正常に幅指定がされない問題があったので修正したい

変更内容

  • SearchInput内にあるlabel要素に対してwidhtを指定、その場合、子要素となるinputなどにはwidth 100% を指定するように修正
    • これは width: 50% などが指定された場合の対応

確認方法

  • diffとCIを確認する

Copy link

pkg-pr-new bot commented Sep 30, 2024

Open in Stackblitz

pnpm add https://pkg.pr.new/kufu/smarthr-ui@4961

commit: 618f8c3

@yagimushi yagimushi force-pushed the fix-search-input-width-in-cluster branch from f010d4d to ac10bfb Compare September 30, 2024 01:12
@AtsushiM AtsushiM marked this pull request as ready for review September 30, 2024 01:42
@AtsushiM AtsushiM requested a review from a team as a code owner September 30, 2024 01:42
@AtsushiM AtsushiM requested review from Qs-F and masa0527 and removed request for a team September 30, 2024 01:42
Copy link
Collaborator

@uknmr uknmr left a comment

Choose a reason for hiding this comment

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

Cluster と幅指定を組み合わせても手元の環境では問題が見えませんでした。基本的に幅は何文字分かを em で指定することを推奨します。

@AtsushiM AtsushiM requested a review from uknmr October 4, 2024 06:15
@AtsushiM
Copy link
Member Author

AtsushiM commented Oct 4, 2024

Cluster と幅指定を組み合わせても手元の環境では問題が見えませんでした。基本的に幅は何文字分かを em で指定することを推奨します。

  • 根本的にSearchInputは%指定する必要が薄いが、現在指定することができ、特定の状況下でただしく動作しないため、このPRでの対応自体は行う
  • そもそも%指定できることによるプロダクト間でのブレを防ぐための対策は別途検討する

となりました。

@AtsushiM AtsushiM requested a review from uknmr October 4, 2024 06:50
Copy link
Contributor

@s-sasaki-0529 s-sasaki-0529 left a comment

Choose a reason for hiding this comment

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

👍️ width を引き伸ばせることを確認しました!

@AtsushiM AtsushiM merged commit 7d6aea3 into master Oct 6, 2024
16 checks passed
@AtsushiM AtsushiM deleted the fix-search-input-width-in-cluster branch October 6, 2024 22:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants