misskey-dev / misskey

🌎 A completely free and open interplanetary microblogging platform 🚀
https://misskey-hub.net/
GNU Affero General Public License v3.0
9.99k stars 1.36k forks source link

スクロールエリアがタイムラインに限定されるのを以前のようにするオプション? #10974

Open saschanaz opened 1 year ago

saschanaz commented 1 year ago

Summary

マウスでもちょっと不便ですが、Surfaceとかタッチスクリーンでスクリールする時一番不便です

たぶんどうでもいいでしょうが、こういうものもあります

  1. Ctrl+Fで単語検索してもスクロールバーのハイライトが現れない
  2. Ctrl+Pで全体プリントができない

(https://p1.a9z.dev/@saschanaz/pages/1686241646979 vs https://misskey.io/@saschanaz/pages/1686241519536)

acid-chicken commented 1 year ago

Related to #10964

acid-chicken commented 1 year ago

iPad Safari でマジで不便している

syuilo commented 1 year ago

解決策募集中

syuilo commented 1 year ago

おそらくDiscordとかSlackとかもbodyスクロールではないと思うけど、それらはどう解決してるんだろう

syuilo commented 1 year ago

Surfaceとかタッチスクリーンでスクリールする時一番不便です

iPadで使ってるけどUX的には以前と全く変わりないように感じてるんだけどどのように不便?

tamaina commented 1 year ago

iPad Safari でマジで不便している

具体的に何ができなくて?

acid-chicken commented 1 year ago

iPad Safari でマジで不便している

具体的に何ができなくて?

など挙げたらきりがない

saschanaz commented 1 year ago

タブレットで操作

image

こう持ってたら問題ない

image

でもこう持ってたら問題しかない(握ってる両手でスクロールできず、片手を中央に移動する必要がある)

ということで、範囲の問題が大きいです

syuilo commented 1 year ago

でもこう持ってたら問題しかない(握ってる両手でスクロールできず、片手を中央に移動する必要がある)

サイドバーをアイコンのみ表示にしたらいいかも

acid-chicken commented 1 year ago

おそらくDiscordとかSlackとかもbodyスクロールではないと思うけど、それらはどう解決してるんだろう

別にそれらで快適とは思わない(し、それを承知でネイティブアプリが使われるのであまり影響がないだけでは)

saschanaz commented 1 year ago

bodyスクロールでどんな問題がありましたか?(bisectしてない)

syuilo commented 1 year ago

いくつかレイアウト設計上の問題があるけど、一例を挙げると「ウィジェットをTLのスクロールと連動しないようにして」という要望があるからウィジェットを独立したスクロールにしたいんだけど、そうするとbodyスクロールだとスクロールバーが右に二重に表示されることになり分かりづらい、とか image

acid-chicken commented 1 year ago

ウィジェットをTLのスクロールと連動しないようにして

これの実現のためだとしたら対価が重すぎる気がする

syuilo commented 1 year ago

デザインしているとbodyスクロール縛りは今後より厳しくなってきそうな感じがしている

acid-chicken commented 1 year ago

基本的に body スクロール = メイン要素のスクロールにしておかないとむしろ問題を引き起こしやすいと自身の経験則で感じている(例えば iOS Safari の dvh 変化などは body スクロールを無効にしてもそこに overscroll があるような挙動をしがちだったりとかするため)

syuilo commented 1 year ago

モバイルとデスクトップでuniversal.vue分割するか

acid-chicken commented 1 year ago

スクロールバー位置については、一応 body のスクロールバーを隠してメイン領域にスクロール専用の要素を置いてバインドさせるとかは考えられる(分割でうまくいくならそれでも)

syuilo commented 1 year ago

モバイルとデスクトップでuniversal.vue分割するか

分割ちょっと大変で最終手段にしたいからそれ以外でいい感じにするPR募集中

saschanaz commented 1 year ago

いくつかレイアウト設計上の問題があるけど、一例を挙げると「ウィジェットをTLのスクロールと連動しないようにして」という要望があるからウィジェットを独立したスクロールにしたいんだけど、そうするとbodyスクロールだとスクロールバーが右に二重に表示されることになり分かりづらい、とか

この点はウィジェットにoverlay scrollbar適用したらbodyスクロールのままでよさそうです

tamaina commented 1 year ago

基本的に body スクロール = メイン要素のスクロールにしておかないとむしろ問題を引き起こしやすいと自身の経験則で感じている

これはすごいわかる

tamaina commented 1 year ago

overlay scrollbar

Firefoxにoverflow: overlayないじゃん

saschanaz commented 1 year ago

overlay scrollbar

Firefoxにoverflow: overlayないじゃん

👀(というかChrome以外はFirefox/Safariは基本overlayですので) image

Edit: Edgeは基本overlayじゃなかったです(Chrome/Edge両方にflagはある)

tamaina commented 1 year ago

overlayだとしても、メインのスクロールバーがウィジェットを挟んだ位置にある、もしくはウィジェットのスクロールバーと被さってるとかになるはずなので、微妙

saschanaz commented 1 year ago

メインのスクロールバーがウィジェットを挟んだ位置にある

margin-right: 5pxとかでなんとかなりません?

tamaina commented 1 year ago

(えっどういうハック?)(あんまり手を動かす気になってない)