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

リアクションをホバーしたときに拡大して表示 #4434

Open
wants to merge 20 commits into
base: master
Choose a base branch
from

Conversation

UnABC
Copy link

@UnABC UnABC commented Jan 4, 2025

リアクションをホバーしたときに拡大して表示して欲しい #4433

Copy link

github-actions bot commented Jan 4, 2025

Copy link
Contributor

@Pugma Pugma left a comment

Choose a reason for hiding this comment

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

僕も a11y に詳しいわけではないので、どのように対応するのがいいかについてはっきりということはできないんですが、とりあえずここで示した部分について改めて調べて取り組んでみてほしいです…!

Copy link
Contributor

@Pugma Pugma left a comment

Choose a reason for hiding this comment

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

image

実際に動作確認をしてみたところ、どうやらポップアップの大きさを超える文字列になると表示が壊れてそうです
ここの対応もお願いします…!

@UnABC
Copy link
Author

UnABC commented Jan 6, 2025

対応完了しました
確認のほどよろしくお願いします

@Pugma
Copy link
Contributor

Pugma commented Jan 7, 2025

確認したんですが、今の状態でも 2 列に収まらない場合はそれ以降のスタンプを押した人の名前が表示されなくなってそうです (本番環境で確認しました)
これまでの title 属性による tooltip は全部表示していたみたいだけど、今回みたいに表示が大きくなっているなら「ほか n 人」みたいな感じで圧縮した表示にしちゃってもいいと思います 👍
三角マークを押せば全数見ること自体はできるので

@UnABC
Copy link
Author

UnABC commented Jan 12, 2025

リアクションした人数が3人を超過した場合に「他n人」と圧縮表示するよう変更しました
また、リアクションした人の名前の表示形式はDiscordに合わせました
名前が長すぎたり、リアクションの位置が画面端だったときなどはスタンプを押した人の名前が消える場合がありますが仕様です

Copy link
Contributor

@Pugma Pugma left a comment

Choose a reason for hiding this comment

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

色々対応してくれてありがとうございます!
もう少し改善できそうなところを挙げてみたので、もう少し対応してもらえればと思います :pray-nya:

Copy link

codecov bot commented Jan 18, 2025

Codecov Report

Attention: Patch coverage is 0% with 112 lines in your changes missing coverage. Please review.

Project coverage is 8.80%. Comparing base (8718f87) to head (b84cbfa).

Files with missing lines Patch % Lines
...inView/MessageElement/StampScaledDetailElement.vue 0.00% 43 Missing ⚠️
...ents/Main/MainView/MessageElement/StampElement.vue 0.00% 35 Missing ⚠️
...ain/MainView/MessageElement/StampScaledElement.vue 0.00% 33 Missing ⚠️
.../Main/MainView/MessageElement/MessageStampList.vue 0.00% 1 Missing ⚠️
Additional details and impacted files
@@            Coverage Diff            @@
##           master   #4434      +/-   ##
=========================================
- Coverage    8.83%   8.80%   -0.04%     
=========================================
  Files         671     673       +2     
  Lines       29444   29549     +105     
  Branches      524     524              
=========================================
  Hits         2601    2601              
- Misses      26837   26942     +105     
  Partials        6       6              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@UnABC UnABC changed the title Issue4299 リアクションをホバーしたときに拡大して表示 Jan 27, 2025
Copy link
Contributor

@Pugma Pugma left a comment

Choose a reason for hiding this comment

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

大変お待たせしました…!
概ねデザインもできてきたと思うんですが、もう少し細かいところもご対応いただけるとありがたいです

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.

リアクションをホバーしたときに拡大して表示して欲しい
2 participants