Jitsi Meetの通知を左下から左上に変えるパッチ


Jitsi Meetの通知の位置がコントロールと被る問題

リモートワークが話題になるよりも前から、別のドメイン1で友人とのビデオ会議用にJitsi Meet2を運用していたのですが3、最近友人から「通知が左下に出るんだけど、コントロールと被って使いづらい」という話を聞きました。私は正直気にならなかったのですが、確認してみると……。

通知がコントロールを隠してしまう

通知がコントロールを隠してしまう

フムム、これは確かに使いづらいかもしれない4。しかし、通知の位置を修正するくらいならササッとできそうね。

というわけでスタイルをインスペクタで確認しつつ、パッチを作ってみました。雑ですが、とりあえず位置を変更できるはず。
Jitsi Meetをインストールした環境で、以下のコマンドを実行すればパッチを適用できます。私は jitsi/web のコンテナ上で試しました。バージョンは4384-1で試しています。

sed -i 's/.cjMOOK{bottom:calc(calc(40px + 24px))!important}/.cjMOOK{bottom: auto !important;top: 20px;left: 20px !important}.mIBKA,.gpUwQx{bottom: auto !important}/g' /usr/share/jitsi-meet/css/all.css

あらあら、!importantがギラギラと光っていますね。
兎にも角にも、適用するとこうなります。

通知の改善後

通知の改善後

通知を左上に移動させました。また、左からの間隔も少し狭めに修正しています。
雑な改善なので、複数通知がある際は上図のように重なって若干見た目がおかしくなっていますが、まあ実用上は問題ないと思います5

同じような悩みをお持ちの方は是非お試しあれ。お時間がある方は、もうちょっと改善してみると綺麗な表示にできるかもしれませんね。


  1. *.clvs7.com ではないです。念の為。別のサーバーで稼働させています。 ↩︎

  2. 詳細は https://jitsi.org/jitsi-meet/ 。インターフェースのソースコードは https://github.com/jitsi/jitsi-meet 。ライセンスはApache License 2.0。 ↩︎

  3. 最近、Zoomの脆弱性が騒がれた結果「Jitsi Meetはいいぞ!」という風潮が一部で出てきているようですが、それよりも前から注目していただけに何か嬉しいような寂しいような……。とりあえず、えっへん。 ↩︎

  4. 私は無意識のうちにOKを押して消していたので気にならなかったっぽい。 ↩︎

  5. 多分ね。 ↩︎