12.52.0

Update webpack 🚀
New Crowdin updates (#6766 )
2020-11-02 17:28:13 +09:00 · 2020-11-02 17:28:02 +09:00 · 2020-11-02 17:27:42 +09:00 · 2020-11-02 15:37:42 +09:00 · 2020-11-02 15:16:48 +09:00 · 2020-11-02 15:16:37 +09:00
138 changed files with 4767 additions and 913 deletions
--- a/locales/ar-SA.yml
+++ b/locales/ar-SA.yml
@ -1,5 +1,6 @@
 ---
 _lang_: "العربية"
+introMisskey: "اهلا بك! ميسكي هو منصة تدوين مصغر لا مركزية ومفتوحة المصدر.\nيمكنك مشاركة \"ملاحظات\" عن ما يجري حولك، وإخبار الجميع عن نفسك 📡\nتسمح لك \"الانفعالات\" بتعبير عن شعورك حول ملاحظات الآخرين 👍\nاكتشف عالمًا جديدًا 🚀"
 monthAndDay: "{day}/{month}"
 search: "البحث"
 notifications: "الإشعارات"
@ -32,6 +33,7 @@ favorite: "إضافة إلى المفضلة"
 favorites: "المفضلات"
 unfavorite: "إزالة من المفضلة"
 pin: "دبّسها على الصفحة الشخصية"
+unpin: "ألغ تثبيتها من ملفك الشخصي"
 copyContent: "انسخ المحتوى"
 copyLink: "انسخ الرابط"
 delete: "حذف"
@ -78,6 +80,7 @@ followRequest: "طلب اشتراك"
 followRequests: "طلبات الإشتراك"
 unfollow: "إلغاء الاشتراك"
 followRequestPending: "طلبات الإشتراك المعلّقة"
+enterEmoji: "أدخل إيموجي"
 unrenote: "إلغاء مشاركة الملاحظة"
 quote: "اقتبس"
 pinnedNote: "ملاحظة مدبسة"
@ -93,6 +96,8 @@ mute: "اكتم"
 unmute: "إلغاء الكتم"
 block: "احجب"
 unblock: "إلغاء الحجب"
+suspend: "علِق"
+unsuspend: "ألغ التعليق"
 blockConfirm: "أمتأكد من حجب هذا الحساب؟"
 unblockConfirm: "أمتأكد من إلغاء حجب هذا الحساب؟"
 selectList: "اختر قائمة"
@ -304,6 +309,7 @@ noteOf: "ملاحظات {user}"
 inviteToGroup: "دعوة إلى فريق"
 noMessagesYet: "ليس هناك رسائل بعد"
 newMessageExists: "لقد تلقيت رسالة جديدة"
+invitations: "دعوة"
 invitationCode: "رمز الدعوة"
 checking: "التحقق جارٍ"
 available: "متوفر"
@ -374,6 +380,8 @@ smtpHost: "المضيف"
 smtpUser: "اسم المستخدم"
 smtpPass: "الكلمة السرية"
 display: "المظهر"
+_reversi:
+  total: "المجموع"
 _channel:
  featured: "المتداوَلة"
 _sidebar:
--- a/locales/de-DE.yml
+++ b/locales/de-DE.yml
@ -18,7 +18,7 @@ instance: "Instanz"
 settings: "Einstellungen"
 basicSettings: "Allgemeine Einstellungen"
 otherSettings: "Andere Einstellungen"
-openInWindow: "In neuem Fenster öffnen"
+openInWindow: "In Fenster öffnen"
 profile: "Profil"
 timeline: "Chronik"
 noAccountDescription: "Dieser Nutzer hat seine Profilbeschreibung noch nicht ausgefüllt."
@ -412,6 +412,7 @@ noMessagesYet: "Noch keine Nachrichten"
 newMessageExists: "Du hast eine neue Nachricht"
 onlyOneFileCanBeAttached: "Es kann pro Nachricht nur eine Datei angehängt werden"
 signinRequired: "Anmeldung erforderlich"
+invitations: "Einladungen"
 invitationCode: "Einladungscode"
 checking: "Wird überprüft..."
 available: "Verfügbar"
@ -484,7 +485,7 @@ newNoteRecived: "Es gibt neue Notizen"
 sounds: "Töne"
 listen: "Anhören"
 none: "Keine"
-showInPage: "In Seiten anzeigen"
+showInPage: "In Seite anzeigen"
 popout: "Pop-Up"
 volume: "Lautstärke"
 details: "Details"
@ -593,6 +594,51 @@ fillAbuseReportDescription: "Bitte gib Details für diese Meldung an. Falls es s
 abuseReported: "Die Meldung wurde versendet. Vielen Dank."
 send: "Senden"
 abuseMarkAsResolved: "Meldung als gelöst markieren"
+openInNewTab: "In neuem Tab öffnen"
+openInSideView: "In Seitenansicht öffnen"
+defaultNavigationBehaviour: "Standardnavigationsverhalten"
+editTheseSettingsMayBreakAccount: "Bei Bearbeitung dieser Einstellungen besteht die Gefahr, dein Benutzerkonto zu beschädigen."
+instanceTicker: "Instanz-Informationen von Notizen"
+waitingFor: "Warte auf {x}"
+random: "Zufällig"
+system: "System"
+_reversi:
+  reversi: "Reversi"
+  gameSettings: "Spieleinstellungen"
+  chooseBoard: "Spielbrett auswählen"
+  blackOrWhite: "Schwarz/Weiß"
+  blackIs: "{name} spielt Schwarz"
+  rules: "Regeln"
+  botSettings: "Optionen des Computergegners"
+  thisGameIsStartedSoon: "Dieses Spiel beginnt in wenigen Sekunden"
+  waitingForOther: "Warte auf den Zug des Gegenspielers"
+  waitingForMe: "Warte auf deinen Zug"
+  waitingBoth: "Mach dich bereit"
+  ready: "Bereit"
+  cancelReady: "Nicht bereit"
+  opponentTurn: "Zug deines Gegners"
+  myTurn: "Dein Zug"
+  turnOf: "Zug von {name}"
+  pastTurnOf: "Zug von {name}"
+  surrender: "Aufgeben"
+  surrendered: "durch Aufgabe"
+  drawn: "Unentschieden"
+  won: "{name} hat gesiegt"
+  black: "Schwarz"
+  white: "Weiß"
+  total: "Gesamt"
+  turnCount: " Zug {count}"
+  myGames: "Meine Runden"
+  allGames: "Alle Runden"
+  ended: "Beendet"
+  playing: "Laufend"
+  isLlotheo: "Der mit weniger Steinen gewinnt (Llotheo)"
+  loopedMap: "Wiederholendes Spielbrett"
+  canPutEverywhere: "Steine können überall platziert werden"
+_instanceTicker:
+  none: "Nie anzeigen"
+  remote: "Für Benutzer fremder Instanzen anzeigen"
+  always: "Immer anzeigen"
 _serverDisconnectedBehavior:
  reload: "Automatisch aktualisieren"
  dialog: "Warnungsfenster zeigen"
--- a/locales/en-US.yml
+++ b/locales/en-US.yml
@ -18,7 +18,7 @@ instance: "Instance"
 settings: "Settings"
 basicSettings: "Basic Settings"
 otherSettings: "Other Settings"
-openInWindow: "Open in new window"
+openInWindow: "Open in window"
 profile: "Profile"
 timeline: "Timeline"
 noAccountDescription: "This user has not written their bio yet."
@ -405,13 +405,14 @@ next: "Next"
 retype: "Enter again"
 noteOf: "{user}'s notes"
 inviteToGroup: "Invite to group"
-maxNoteTextLength: "Character limit of the note"
+maxNoteTextLength: "Character limit of notes"
 quoteAttached: "Quoted"
 quoteQuestion: "Do you want to append a quote?"
 noMessagesYet: "No messages yet"
 newMessageExists: "You've got a new message"
 onlyOneFileCanBeAttached: "You can only attach one file to a message"
 signinRequired: "Please sign in"
+invitations: "Invitations"
 invitationCode: "Invitation code"
 checking: "Checking"
 available: "Available"
@ -484,7 +485,7 @@ newNoteRecived: "You've got a new note"
 sounds: "Sounds"
 listen: "Listen"
 none: "None"
-showInPage: "Show in Pages"
+showInPage: "Show in page"
 popout: "Pop-out"
 volume: "Volume"
 details: "Details"
@ -593,6 +594,51 @@ fillAbuseReportDescription: "Please fill in the report details. If it is about a
 abuseReported: "Your report has been sent. Thank you very much."
 send: "Send"
 abuseMarkAsResolved: "Mark report as resolved"
+openInNewTab: "Open in new tab"
+openInSideView: "Open in side view"
+defaultNavigationBehaviour: "Default navigation behavior"
+editTheseSettingsMayBreakAccount: "Editing these settings may damage your account."
+instanceTicker: "Instance information of notes"
+waitingFor: "Waiting for {x}"
+random: "Random"
+system: "System"
+_reversi:
+  reversi: "Reversi"
+  gameSettings: "Game settings"
+  chooseBoard: "Choose a board"
+  blackOrWhite: "Black/White"
+  blackIs: "{name} is playing Black"
+  rules: "Rules"
+  botSettings: "Bot options"
+  thisGameIsStartedSoon: "The game will start in a few seconds"
+  waitingForOther: "Waiting for the opponent's turn"
+  waitingForMe: "Waiting for your turn"
+  waitingBoth: "Get ready"
+  ready: "Ready"
+  cancelReady: "Cancel ready"
+  opponentTurn: "Opponent's turn"
+  myTurn: "Your turn"
+  turnOf: "{name}'s turn"
+  pastTurnOf: "{name}'s turn"
+  surrender: "Surrender"
+  surrendered: "By surrender"
+  drawn: "Draw"
+  won: "{name}'s win"
+  black: "Black"
+  white: "White"
+  total: "Total"
+  turnCount: "Turn {count}"
+  myGames: "My rounds"
+  allGames: "All rounds"
+  ended: "Ended"
+  playing: "Currently playing"
+  isLlotheo: "The one with fewer stones wins (Llotheo)"
+  loopedMap: "Looped map"
+  canPutEverywhere: "Tiles are placeable everywhere"
+_instanceTicker:
+  none: "Never show"
+  remote: "Show for remote users"
+  always: "Always show"
 _serverDisconnectedBehavior:
  reload: "Automatically reload"
  dialog: "Show warning dialog"
--- a/locales/es-ES.yml
+++ b/locales/es-ES.yml
@ -16,6 +16,9 @@ noNotes: "No hay notas"
 noNotifications: "No hay notificaciones"
 instance: "Instancia"
 settings: "Configuración"
+basicSettings: "Configuración Básica"
+otherSettings: "Configuración avanzada"
+openInWindow: "Abrir en una ventana"
 profile: "Perfil"
 timeline: "Linea de tiempo"
 noAccountDescription: "Este usuario no tiene una descripción"
@ -40,6 +43,7 @@ deleteAndEditConfirm: "¿Quieres borrar y editar este nota? Las reacciones, reno
 addToList: "Agregar a lista"
 sendMessage: "Énviar mensaje"
 copyUsername: "Copiar nombre de usuario"
+searchUser: "Búsqueda de usuarios"
 reply: "Responder"
 loadMore: "Ver más"
 youGotNewFollower: "te ha seguido"
@ -66,7 +70,11 @@ followers: "Seguidores"
 followsYou: "Te sigue"
 createList: "Crear lista"
 manageLists: "Administrar listas"
+error: "Error"
+somethingHappened: "Ocurrió un error"
 retry: "Reintentar"
+pageLoadError: "Error al leer la página"
+pageLoadErrorDescription: "Normalmente es debido a la red o al caché del navegador. Por favor limpie el caché o intente más tarde."
 enterListName: "Ingrese nombre de lista"
 privacy: "Privacidad"
 makeFollowManuallyApprove: "Aprobar manualmente las solicitudes de seguimiento"
@ -105,6 +113,8 @@ unsuspendConfirm: "¿Quiere dejar de suspender esta cuenta?"
 selectList: "Seleccione una lista"
 selectAntenna: "Seleccionar antena"
 selectWidget: "Seleccionar widget"
+editWidgets: "Editar widgets"
+editWidgetsExit: "Terminar edición"
 customEmojis: "Emojis personalizados"
 emoji: "Emoji"
 emojiName: "Nombre del emoji"
@ -402,6 +412,7 @@ noMessagesYet: "Aún no hay chat"
 newMessageExists: "Tienes un mensaje nuevo"
 onlyOneFileCanBeAttached: "Solo se puede añadir un archivo al mensaje"
 signinRequired: "Iniciar sesión"
+invitations: "Invitar"
 invitationCode: "Código de invitación"
 checking: "Comprobando"
 available: "Disponible"
@ -443,6 +454,7 @@ total: "Total"
 weekOverWeekChanges: "Dif semanal"
 dayOverDayChanges: "Dif diaria"
 appearance: "Apariencia"
+clientSettings: "Configuración del cliente"
 accountSettings: "Ajustes de cuenta"
 promotion: "Promovido"
 promote: "Promover"
@ -473,6 +485,8 @@ newNoteRecived: "Tienes una nota nuevo"
 sounds: "Sonidos"
 listen: "Escuchar"
 none: "Ninguna"
+showInPage: "Mostrar en la página"
+popout: "Popout"
 volume: "Volumen"
 details: "Detalles"
 chooseEmoji: "Elije un emoji"
@ -566,6 +580,27 @@ notificationSetting: "Ajustes de Notificaciones"
 notificationSettingDesc: "Por favor elija el tipo de notificación a mostrar"
 useGlobalSetting: "Usar ajustes globales"
 useGlobalSettingDesc: "Al activarse, se usará la configuración de notificaciones de la cuenta, al desactivarse se pueden hacer configuraciones particulares."
+other: "Otro"
+regenerateLoginToken: "Regenerar token de login"
+regenerateLoginTokenDescription: "Regenerar el token usado internamente durante el login. No siempre es necesario hacerlo. Al hacerlo de nuevo, se deslogueará en todos los dispositivos."
+setMultipleBySeparatingWithSpace: "Puedes añadir mas de uno, separado por espacios."
+fileIdOrUrl: "Id del archivo o URL"
+chatOpenBehavior: "Comportamiento al abrir el chat"
+sample: "Muestra"
+abuseReports: "Reportes"
+reportAbuse: "Reportar"
+reportAbuseOf: "Reportar a {name}"
+fillAbuseReportDescription: "Ingrese los detalles del reporte. Si hay una nota en particular, ingrese la URL de esta."
+abuseReported: "Se ha enviado el reporte. Muchas gracias."
+send: "Enviar"
+abuseMarkAsResolved: "Marcar reporte como resuelto"
+openInNewTab: "Abrir en una Nueva Pestaña"
+openInSideView: "Abrir en una vista al costado"
+defaultNavigationBehaviour: "Navegación por defecto"
+editTheseSettingsMayBreakAccount: "Editar estas configuraciones puede dañar su cuenta."
+random: "Aleatorio"
+_reversi:
+  total: "Total"
 _serverDisconnectedBehavior:
  reload: "Recargar automáticamente"
  dialog: "Mostrar diálogo de advertencia"
--- a/locales/fr-FR.yml
+++ b/locales/fr-FR.yml
@ -411,6 +411,7 @@ noMessagesYet: "Pas encore discuté"
 newMessageExists: "Vous avez un nouveau message"
 onlyOneFileCanBeAttached: "Vous ne pouvez joindre qu’un seul fichier au message"
 signinRequired: "Veuillez vous connecter"
+invitations: "Inviter"
 invitationCode: "Code d’invitation"
 checking: "Vérification"
 available: "Disponible"
@ -580,6 +581,9 @@ regenerateLoginToken: "Régénérer le jeton de connexion"
 setMultipleBySeparatingWithSpace: "Vous pouvez définir plus d’un, séparés par des espaces."
 fileIdOrUrl: "ID du fichier ou URL"
 chatOpenBehavior: "Comportement de la fenêtre de discussion lors de son ouverture"
+random: "Aléatoire"
+_reversi:
+  total: "Total"
 _serverDisconnectedBehavior:
  reload: "Rechargement automatique"
 _channel:
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@ -412,6 +412,7 @@ noMessagesYet: "まだチャットはありません"
 newMessageExists: "新しいメッセージがあります"
 onlyOneFileCanBeAttached: "メッセージに添付できるファイルはひとつです"
 signinRequired: "ログインしてください"
+invitations: "招待"
 invitationCode: "招待コード"
 checking: "確認しています"
 available: "利用できます"
@ -593,6 +594,53 @@ fillAbuseReportDescription: "通報理由の詳細を記入してください。
 abuseReported: "内容が送信されました。ご報告ありがとうございました。"
 send: "送信"
 abuseMarkAsResolved: "対応済みにする"
+openInNewTab: "新しいタブで開く"
+openInSideView: "サイドビューで開く"
+defaultNavigationBehaviour: "デフォルトのナビゲーション"
+editTheseSettingsMayBreakAccount: "これらの設定を編集するとアカウントが破損する可能性があります。"
+instanceTicker: "ノートのインスタンス情報"
+waitingFor: "{x}を待っています"
+random: "ランダム"
+system: "システム"
+
+_reversi:
+  reversi: "リバーシ"
+  gameSettings: "対局の設定"
+  chooseBoard: "ボードを選択"
+  blackOrWhite: "先行/後攻"
+  blackIs: "{name}が黒(先行)"
+  rules: "ルール"
+  botSettings: "Botのオプション"
+  thisGameIsStartedSoon: "対局は数秒後に開始されます"
+  waitingForOther: "相手の準備が完了するのを待っています"
+  waitingForMe: "あなたの準備が完了するのを待っています"
+  waitingBoth: "準備してください"
+  ready: "準備完了"
+  cancelReady: "準備を再開"
+  opponentTurn: "相手のターンです"
+  myTurn: "あなたのターンです"
+  turnOf: "{name}のターンです"
+  pastTurnOf: "{name}のターン"
+  surrender: "投了"
+  surrendered: "投了により"
+  drawn: "引き分け"
+  won: "{name}の勝ち"
+  black: "黒"
+  white: "白"
+  total: "合計"
+  turnCount: "{count}ターン目"
+  myGames: "自分の対局"
+  allGames: "みんなの対局"
+  ended: "終了"
+  playing: "対局中"
+  isLlotheo: "石の少ない方が勝ち(ロセオ)"
+  loopedMap: "ループマップ"
+  canPutEverywhere: "どこでも置けるモード"
+
+_instanceTicker:
+  none: "表示しない"
+  remote: "リモートユーザーに表示"
+  always: "常に表示"

 _serverDisconnectedBehavior:
  reload: "自動でリロード"
--- a/locales/ja-KS.yml
+++ b/locales/ja-KS.yml
@ -1,12 +1,12 @@
 ---
 _lang_: "日本語 (関西弁)"
-introMisskey: "ようこそ！Misskeyは、オープンソースの分散型マイクロブログサービスやねん。\n「ノート」を作成しぃ、いま起こっとることを共有したり、あんたについて皆に発信しよう📡\n「リアクション」機能で、皆のノートに素はよ反応を追加することもできます✌\n新しい世界を探検しよう🚀"
+introMisskey: "ようこそ！Misskeyってのは、オープンソースの分散型マイクロブログサービスやねん。\n「ノート」を作成し、いま起こっとることを共有したり、あんたんこととか皆に伝えていこう📡\n「リアクション」機能で、皆のノートに素はよ反応を追加することもできるんやで✌\n新しい世界を探検してみらん？🚀"
 monthAndDay: "{month}月 {day}日"
 search: "探す"
 notifications: "通知"
 username: "ユーザー名"
 password: "パスワード"
-fetchingAsApObject: "連合に照会中"
+fetchingAsApObject: "今ちと連合に照会しとるで"
 ok: "おっけー"
 gotIt: "ほい"
 cancel: "やめとくわ"
@ -16,35 +16,40 @@ noNotes: "ノートはあらへん"
 noNotifications: "通知はあらへん"
 instance: "インスタンス"
 settings: "設定"
+basicSettings: "基本設定"
+otherSettings: "その他の設定"
+openInWindow: "ウィンドウで開いてや"
 profile: "プロフィール"
 timeline: "タイムライン"
 noAccountDescription: "自己紹介はあらへん"
 login: "ログイン"
-loggingIn: "ログインしとります"
+loggingIn: "ログインしよるで"
 logout: "ログアウト"
 signup: "新規登録"
-uploading: "アップロードしとります"
-save: "保存"
+uploading: "アップロードしよるで"
+save: "とっとく"
 users: "ユーザー"
-addUser: "ユーザー増やす"
+addUser: "ユーザーを追加や"
 favorite: "お気に入り"
 favorites: "お気に入り"
-unfavorite: "お気に入りやめる"
-pin: "ピン留め"
-unpin: "ピン留めやめる"
+unfavorite: "やっぱ気に入らん"
+pin: "ピン留めしとく"
+unpin: "やっぱピン留めせん"
 copyContent: "内容をコピー"
 copyLink: "リンクをコピー"
 delete: "ほかす"
 deleteAndEdit: "ほかして直す"
-deleteAndEditConfirm: "このノートをほかしてもっかい直す？このノートへのリアクション、Remote、返信も全部消えんで"
+deleteAndEditConfirm: "このノートをほかしてもっかい直す？このノートへのリアクション、Renote、返信も全部消えるんやけどそれでもええん？"
 addToList: "リストに入れたる"
 sendMessage: "メッセージを送る"
 copyUsername: "ユーザー名をコピー"
+searchUser: "ユーザーを検索"
 reply: "返す"
 loadMore: "もっとあるやろ！"
 youGotNewFollower: "フォローされたで"
 receiveFollowRequest: "フォローリクエストされたで"
 followRequestAccepted: "フォローが承認されたで"
+mention: "メンション"
 mentions: "あんた宛て"
 directNotes: "ダイレクト投稿"
 importAndExport: "インポートとエクスポート"
@ -57,7 +62,7 @@ unfollowConfirm: "{name}のフォローを解除してもええんか？"
 exportRequested: "エクスポートしてな、ってリクエストしたけど、これ多分めっちゃ時間かかるで。エクスポート終わったら「ドライブ」に突っ込んどくで。"
 importRequested: "インポートしてな、ってリクエストしたけど、これ多分めっちゃ時間かかるで。"
 lists: "リスト"
-noLists: "リストはあらへん"
+noLists: "リストなんてあらへんで"
 note: "ノート"
 notes: "ノート"
 following: "フォロー"
@ -65,31 +70,35 @@ followers: "フォロワー"
 followsYou: "フォローされとるで"
 createList: "リスト作る"
 manageLists: "リストの管理"
-retry: "もっぺんやってみる"
+error: "エラー"
+somethingHappened: "なんかアカンことが起こったで"
+retry: "もっぺんやる？"
+pageLoadError: "ページの読み込みに失敗してしもうたで…"
+pageLoadErrorDescription: "これは普通、ネットワークかブラウザキャッシュが原因やからね。キャッシュをクリアするか、もうちっとだけ待ってくれへんか？"
 enterListName: "リスト名を入れてや"
-privacy: "プライバシーってなんや？オカンの年齢か？"
-makeFollowManuallyApprove: "他人のフォローは許可してからや！"
+privacy: "プライバシーってなんぞや？"
+makeFollowManuallyApprove: "他人からのフォローは自分が決める"
 defaultNoteVisibility: "もとからの公開範囲"
 follow: "フォロー"
-followRequest: "フォロー許してくれや！言うてみる"
-followRequests: "フォロー許してくれや！"
+followRequest: "フォローを頼む"
+followRequests: "フォローを頼む"
 unfollow: "フォローやめる"
 followRequestPending: "フォロー許してくれるん待っとる"
 enterEmoji: "絵文字を入れてや"
 renote: "Renote"
 unrenote: "Renoteやめる"
 quote: "引用"
-pinnedNote: "ピン留めされたノート"
+pinnedNote: "ピン留めされとるノート"
 you: "あんた"
-clickToShow: "押してみ、見せたるわ"
-sensitive: "見たらあかんで"
+clickToShow: "押したら見えるようになるで"
+sensitive: "ちょっとアカンやつやで"
 add: "増やす"
 reaction: "リアクション"
 reactionSettingDescription: "リアクションピッカーに出しとくリアクションを選んでや。"
 rememberNoteVisibility: "公開範囲覚えといて"
-attachCancel: "くっつけるのやめよか"
-markAsSensitive: "ちょっと見せられへんわ"
-unmarkAsSensitive: "別にええんじゃね？"
+attachCancel: "やっぱ添付やめてくれん？"
+markAsSensitive: "ちょっとこれはアカン"
+unmarkAsSensitive: "そこまでアカンことないやろ"
 enterFileName: "ファイル名を入れてや"
 mute: "ミュート"
 unmute: "ミュートやめたる"
@ -97,30 +106,35 @@ block: "ブロック"
 unblock: "ブロックやめたる"
 suspend: "凍結"
 unsuspend: "溶かす"
-blockConfirm: "ブロックしてしもうてええか？"
-unblockConfirm: "ブロックすんのやめるけどええか？"
+blockConfirm: "ブロックしてもええんか？"
+unblockConfirm: "ブロックやめたるってほんまか？"
 suspendConfirm: "凍結してしもうてええか？"
 unsuspendConfirm: "解凍するけどええか？"
 selectList: "リストを選ぶ"
+selectAntenna: "アンテナを選ぶ"
+selectWidget: "ウィジェットを選ぶ"
+editWidgets: "ウィジェットをいじる"
+editWidgetsExit: "編集終ったで"
 customEmojis: "カスタム絵文字"
+emoji: "絵文字"
 emojiName: "絵文字名"
 emojiUrl: "絵文字画像URL"
 addEmoji: "絵文字を追加"
 settingGuide: "ええ感じの設定"
 cacheRemoteFiles: "リモートのファイルをキャッシュする"
-cacheRemoteFilesDescription: "この設定をチャラにすると、リモートファイルをキャッシュせず直リンクするようになります。サーバーのストレージを節約できますが、サムネイルが生成されへんので通信量が増加します。"
-flagAsBot: "Botやでと言っとく"
-flagAsCat: "Catやでと言っとく"
-autoAcceptFollowed: "フォローしとるユーザーからのフォロリクは全部勝手にええでって言うで"
+cacheRemoteFilesDescription: "この設定を切っとくと、リモートファイルをキャッシュせず直リンクするようになってしまうんやで？　サーバーのストレージは節約できるんやけど、かわりにサムネイルが作られんくなるから通信量が増えるで？"
+flagAsBot: "Botやで"
+flagAsCat: "Catやで"
+autoAcceptFollowed: "フォローしとるユーザーからのフォローリクエストには勝手に許可しとくで。"
 addAcount: "アカウント追加"
-loginFailed: "ログインに失敗してん"
+loginFailed: "ログインに失敗してしもうた…"
 showOnRemote: "リモートで見る"
 general: "全般"
 wallpaper: "壁紙"
 setWallpaper: "壁紙を設定"
-removeWallpaper: "壁紙ほかす"
+removeWallpaper: "壁紙を削除"
 searchWith: "検索: {q}"
-youHaveNoLists: "リストはあらへん"
+youHaveNoLists: "リストがあらへんで？"
 followConfirm: "{name}をフォローしてええか？"
 proxyAccount: "プロキシアカウント"
 proxyAccountDescription: "プロキシアカウントは、代わりにフォローしてくれるアカウントや。例えば、551に豚まんが無いときやったり、ユーザーがリモートユーザーをアカウントに入れたとき、リストに入れられたユーザーが誰からもフォローされてないと寂しいやん。寂しいし、アクティビティも配達されへんから、プロキシアカウントがフォローしてくれるで。ええやつやん…"
@ -130,7 +144,7 @@ recipient: "宛先"
 annotation: "注釈"
 federation: "連合"
 instances: "インスタンス"
-registeredAt: "一見さんになった日"
+registeredAt: "初観測"
 latestRequestSentAt: "ちょっと前のリクエスト送信"
 latestRequestReceivedAt: "ちょっと前のリクエスト受信"
 latestStatus: "ちょっと前のステータス"
@ -257,7 +271,8 @@ copyUrl: "URLをコピー"
 rename: "名前を変えるで"
 avatar: "アイコン"
 banner: "バナー"
-nsfw: "見たらあかんで"
+nsfw: "ちょっとアカンやつやで"
+whenServerDisconnected: "サーバーとの接続が失くなってしもうたとき"
 disconnectedFromServer: "サーバーが機嫌悪いねん"
 reload: "リロード"
 doNothing: "何もせんとく"
@ -293,7 +308,19 @@ proxyRemoteFilesDescription: "この設定を入れると、保存しとらん
 driveCapacityPerLocalAccount: "ローカルユーザーひとりあたりのドライブ容量"
 driveCapacityPerRemoteAccount: "リモートユーザーひとりあたりのドライブ容量"
 inMb: "メガバイト単位"
+iconUrl: "アイコン画像のURL"
+bannerUrl: "バナー画像のURL"
+basicInfo: "基本情報"
+pinnedUsers: "ピン留めしたユーザー"
+pinnedUsersDescription: "「みつける」ページとかにピン留めしたいユーザーをここに書けばええんやで。他ん人との名前は改行で区切ればええんやで。"
+hcaptcha: "hCaptcha（キャプチャ）"
+enableHcaptcha: "hCaptcha（キャプチャ）をつけとく"
+hcaptchaSiteKey: "サイトキー"
+hcaptchaSecretKey: "シークレットキー"
 recaptcha: "reCAPTCHA"
+enableRecaptcha: "reCAPTCHA（リキャプチャ）を有効にする"
+recaptchaSiteKey: "サイトキー"
+recaptchaSecretKey: "シークレットキー"
 avoidMultiCaptchaConfirm: "ぎょうさんのCaptchaをつこてしまうと、仲良うせんことがあるんや。他のCaptchaをなおしとこか？別にキャンセルしてもろうたらCaptchaは消されへんで済むけど知らんで。"
 antennas: "アンテナ"
 manageAntennas: "アンテナいじる"
@ -346,10 +373,47 @@ unregister: "登録やめる"
 passwordLessLogin: "パスワード無くてもログインできるようにする"
 resetPassword: "パスワードをリセット"
 newPasswordIs: "今度のパスワードは「{password}」や"
+autoNoteWatch: "ノートを勝手に見張っとく"
+autoNoteWatchDescription: "あんたがリアクションや返信した他のユーザーのノートの通知をあんたも受け取れるようになるんやで。通知欄の流れがめっちゃ早くなるで。"
+reduceUiAnimation: "UIの動きやアニメーションを減らしてくれや。"
+share: "わけわけ"
+notFound: "見つからへんね"
 notFoundDescription: "指定されたURLに該当するページはあらへんやった。"
+uploadFolder: "とりあえずここへアップロード"
+cacheClear: "キャッシュをほかす"
+markAsReadAllNotifications: "通知はもう全て読んだわっ"
+markAsReadAllUnreadNotes: "投稿は全て読んだわっ"
+markAsReadAllTalkMessages: "チャットはもうぜんぶ読んだわっ"
+help: "ヘルプ"
+inputMessageHere: "ここにメッセージ書いてや"
 close: "さいなら"
+group: "グループ"
+groups: "グループ"
+createGroup: "グループを作るで"
+ownedGroups: "所有しとるグループ"
 joinedGroups: "参加しとるグループ"
 invites: "来てや"
+groupName: "グループ名"
+members: "メンバー"
+transfer: "譲渡"
+messagingWithUser: "ユーザーとチャット"
+messagingWithGroup: "グループでチャット"
+title: "タイトル"
+text: "テキスト"
+enable: "有効にするで"
+next: "次"
+retype: "もっかい入力"
+noteOf: "{user}のノート"
+inviteToGroup: "グループに招く"
+maxNoteTextLength: "ノートの文字数制限"
+quoteAttached: "引用付いとるで"
+quoteQuestion: "引用として添付してもええか？"
+noMessagesYet: "まだチャットはあらへんで"
+newMessageExists: "新しいメッセージがきたで"
+onlyOneFileCanBeAttached: "すまん、メッセージに添付できるファイルはひとつだけなんや。"
+invitations: "来てや"
+invitationCode: "招待コード"
+checking: "確認しとるで"
 smtpHost: "ホスト"
 smtpUser: "ユーザー名"
 smtpPass: "パスワード"
@ -357,6 +421,7 @@ _sidebar:
  icon: "アイコン"
 _theme:
  keys:
+    mention: "メンション"
    renote: "Renote"
 _sfx:
  note: "ノート"
@ -440,6 +505,7 @@ _notification:
  youWereFollowed: "フォローされたで"
  _types:
    follow: "フォロー"
+    mention: "メンション"
    renote: "Renote"
    quote: "引用"
    reaction: "リアクション"
--- a/locales/ko-KR.yml
+++ b/locales/ko-KR.yml
@ -401,6 +401,7 @@ noMessagesYet: "아직 대화가 없습니다"
 newMessageExists: "새 메시지가 있습니다"
 onlyOneFileCanBeAttached: "메시지에 첨부할 수 있는 파일은 하나까지입니다"
 signinRequired: "로그인 해주세요"
+invitations: "초대"
 invitationCode: "초대 코드"
 checking: "확인하는 중입니다"
 available: "사용 가능합니다"
@ -548,6 +549,9 @@ copy: "복사"
 logs: "로그"
 database: "데이터베이스"
 channel: "채널"
+random: "랜덤"
+_reversi:
+  total: "합계"
 _channel:
  create: "채널 생성"
  setBanner: "배너 설정"
--- a/locales/ru-RU.yml
+++ b/locales/ru-RU.yml
--- a/locales/uk-UA.yml
+++ b/locales/uk-UA.yml
@ -0,0 +1,133 @@
+---
+_lang_: "Українська"
+monthAndDay: "{month}/{day}"
+search: "Пошук"
+notifications: "Сповіщення"
+username: "Ім'я користувача"
+password: "Пароль"
+ok: "OK"
+gotIt: "Зрозуміло!"
+cancel: "Скасувати"
+enterUsername: "Введіть ім'я користувача"
+renotedBy: "Поширено {user}"
+noNotes: "Немає дописів"
+noNotifications: "Немає сповіщень"
+instance: "Інстанс"
+settings: "Налаштування"
+basicSettings: "Основні налаштування"
+otherSettings: "Інші налаштування"
+openInWindow: "Відкрити у вікні"
+profile: "Профіль"
+timeline: "Стрічка"
+noAccountDescription: "Цей користувач ще нічого не написав про себе"
+login: "Увійти"
+loggingIn: "Здійснюємо вхід..."
+logout: "Вийти"
+signup: "Реєстрація"
+uploading: "Завантаження..."
+save: "Зберегти"
+users: "Користувачі"
+addUser: "Додати користувача"
+favorite: "Обране"
+favorites: "Обране"
+unfavorite: "Видалити з обраного"
+pin: "Закріпити"
+unpin: "Відкріпити"
+copyContent: "Скопіювати контент"
+copyLink: "Скопіювати посилання"
+delete: "Видалити"
+addToList: "Додати до списку"
+sendMessage: "Надіслати повідомлення"
+copyUsername: "Скопіювати ім’я користувача"
+searchUser: "Пошук користувачів"
+reply: "Відповісти"
+loadMore: "Показати більше"
+mention: "Згадка"
+mentions: "Згадки"
+importAndExport: "Імпорт та експорт"
+import: "Імпорт"
+export: "Експорт"
+files: "Файли"
+download: "Завантажити"
+lists: "Списки"
+noLists: "Немає списків"
+following: "Підписки"
+followers: "Підписники"
+followsYou: "Підписаний(-а) на вас"
+error: "Помилка"
+somethingHappened: "Щось пішло не так"
+retry: "Спробувати знову"
+pageLoadError: "Помилка при завантаженні сторінки"
+privacy: "Приватність"
+follow: "Підписки"
+unfollow: "Відписатися"
+quote: "Цитата"
+you: "Ви"
+clickToShow: "Натисніть для перегляду"
+sensitive: "NSFW"
+add: "Додати"
+reaction: "Реакції"
+markAsSensitive: "Відмітити як NSFW"
+enterFileName: "Введіть ім'я файлу"
+mute: "Ігнорувати"
+unmute: "Показувати"
+block: "Заблокувати"
+unblock: "Розблокувати"
+instances: "Інстанс"
+remove: "Видалити"
+nsfw: "NSFW"
+userList: "Списки"
+smtpUser: "Ім'я користувача"
+smtpPass: "Пароль"
+_theme:
+  keys:
+    mention: "Згадка"
+_sfx:
+  notification: "Сповіщення"
+_widgets:
+  notifications: "Сповіщення"
+  timeline: "Стрічка"
+_cw:
+  show: "Показати більше"
+_visibility:
+  followers: "Підписники"
+_postForm:
+  replyPlaceholder: "Відповідь на допис..."
+_profile:
+  username: "Ім'я користувача"
+_exportOrImport:
+  followingList: "Підписки"
+  muteList: "Ігнорувати"
+  blockingList: "Заблокувати"
+  userLists: "Списки"
+_pages:
+  script:
+    categories:
+      list: "Списки"
+    blocks:
+      _join:
+        arg1: "Списки"
+      _randomPick:
+        arg1: "Списки"
+      _dailyRandomPick:
+        arg1: "Списки"
+      _seedRandomPick:
+        arg2: "Списки"
+      _pick:
+        arg1: "Списки"
+      _listLen:
+        arg1: "Списки"
+    types:
+      array: "Списки"
+_notification:
+  _types:
+    follow: "Підписки"
+    mention: "Згадка"
+    quote: "Цитата"
+    reaction: "Реакції"
+_deck:
+  _columns:
+    notifications: "Сповіщення"
+    tl: "Стрічка"
+    list: "Списки"
+    mentions: "Згадки"
--- a/locales/zh-CN.yml
+++ b/locales/zh-CN.yml
@ -412,6 +412,7 @@ noMessagesYet: "现在没有新的聊天"
 newMessageExists: "新信息"
 onlyOneFileCanBeAttached: "只能添加一个附件"
 signinRequired: "请先登录"
+invitations: "邀请"
 invitationCode: "邀请码"
 checking: "正在确认"
 available: "可用"
@ -593,6 +594,51 @@ fillAbuseReportDescription: "请填写举报的详细原因。如果有对方发
 abuseReported: "内容已发送。感谢您的报告。"
 send: "发送"
 abuseMarkAsResolved: "处理完毕"
+openInNewTab: "在新标签页中打开"
+openInSideView: "在侧边栏中打开"
+defaultNavigationBehaviour: "默认导航"
+editTheseSettingsMayBreakAccount: "编辑这些设置可以会损坏您的账号"
+instanceTicker: "帖子的实例信息"
+waitingFor: "等待{x}"
+random: "随机"
+system: "系统"
+_reversi:
+  reversi: "黑白棋"
+  gameSettings: "对局设置"
+  chooseBoard: "棋盘选择"
+  blackOrWhite: "先手/后手"
+  blackIs: "{name}执黑(先走)"
+  rules: "规则"
+  botSettings: "机器人设置"
+  thisGameIsStartedSoon: "对局在几秒后开始"
+  waitingForOther: "等待对手准备"
+  waitingForMe: "等待您的准备"
+  waitingBoth: "请准备"
+  ready: "准备就绪"
+  cancelReady: "重新准备"
+  opponentTurn: "对手的会合"
+  myTurn: "您的回合"
+  turnOf: "{name}的回合"
+  pastTurnOf: "{name}的回合"
+  surrender: "认输 "
+  surrendered: "对手认输"
+  drawn: "平局"
+  won: "{name}获胜"
+  black: "黑"
+  white: "白"
+  total: "总计"
+  turnCount: "{count}回合"
+  myGames: "我的对局"
+  allGames: "所有对局"
+  ended: "结束"
+  playing: "对局中"
+  isLlotheo: "棋子较少一方获胜(LLoTheO规则)"
+  loopedMap: "循环棋盘"
+  canPutEverywhere: "可以下在任意位置"
+_instanceTicker:
+  none: "不显示"
+  remote: "显示给远程用户"
+  always: "始终显示"
 _serverDisconnectedBehavior:
  reload: "自动重载"
  dialog: "对话框警告"
--- a/locales/zh-TW.yml
+++ b/locales/zh-TW.yml
@ -4,10 +4,10 @@ introMisskey: "歡迎！ Misskey是一個開源的去中心化的社群網站。
 monthAndDay: "{month}月 {day}日"
 search: "搜尋"
 notifications: "通知"
-username: "使用名稱"
+username: "使用者名稱"
 password: "密碼"
 fetchingAsApObject: "從 Fediverse 查詢中..."
-ok: "確定"
+ok: "OK"
 gotIt: "知道了"
 cancel: "取消"
 enterUsername: "輸入使用者名稱"
@ -99,8 +99,8 @@ attachCancel: "移除附件"
 markAsSensitive: "標記為敏感內容"
 unmarkAsSensitive: "取消標記為敏感內容"
 enterFileName: "請輸入檔案名稱"
-mute: "消音"
-unmute: "解除消音"
+mute: "靜音"
+unmute: "解除靜音"
 block: "封鎖"
 unblock: "解除封鎖"
 suspend: "凍結"
@ -121,9 +121,9 @@ emojiUrl: "表情符號URL"
 addEmoji: "新增表情符號"
 settingGuide: "推薦設定"
 cacheRemoteFiles: "緩存非遠程檔案"
-cacheRemoteFilesDescription: "如果禁用此設定，遠程文件將會被直接連結而非緩存。禁用將節省服務器上的存儲空間，但會因為沒有生成預覽圖而增加流量。"
-flagAsBot: "此帳戶是Bot"
-flagAsCat: "此帳戶是Cat"
+cacheRemoteFilesDescription: "禁用此設定會停止遠端檔案的緩存，從而節省儲存空間。但資料會因直接連線從而產生額外連接數據。"
+flagAsBot: "此使用者是機器人"
+flagAsCat: "此使用者是貓"
 autoAcceptFollowed: "自動許可追隨"
 addAcount: "新增帳號"
 loginFailed: "登入失敗"
@ -171,8 +171,8 @@ clearCachedFiles: "清除快取資料"
 clearCachedFilesConfirm: "確定要清除緩存資料嗎？"
 blockedInstances: "已封鎖的實例"
 blockedInstancesDescription: "請逐行輸入需要封鎖的實例。已封鎖的實例將無法與本實例進行通訊。"
-muteAndBlock: "禁言 / 封鎖"
-mutedUsers: "已禁言用戶"
+muteAndBlock: "靜音/封鎖"
+mutedUsers: "已靜音用戶"
 blockedUsers: "已封鎖用戶"
 noUsers: "無用戶"
 editProfile: "編輯個人檔案"
@ -227,6 +227,7 @@ messageRead: "已讀"
 noMoreHistory: "沒有更多歷史紀錄"
 startMessaging: "開始傳送訊息"
 nUsersRead: "{n}人已讀"
+agreeTo: "我同意{0}"
 tos: "使用條款"
 start: "開始"
 home: "首頁"
@ -408,6 +409,7 @@ noMessagesYet: "沒有訊息"
 newMessageExists: "有新的訊息"
 onlyOneFileCanBeAttached: "只能添加一個附件"
 signinRequired: "請先登入"
+invitations: "邀請"
 invitationCode: "邀請碼"
 checking: "確認中"
 available: "可用的"
@ -444,9 +446,22 @@ openImageInNewTab: "於新分頁中開啟圖片"
 local: "本地"
 remote: "遠端"
 total: "合計"
+weekOverWeekChanges: "與上週相比"
+dayOverDayChanges: "與前一日相比"
 appearance: "外觀"
-accountSettings: "帳戶設置"
+clientSettings: "用戶端設定"
+accountSettings: "帳號設定"
+promotion: "推廣貼文"
+promote: "推廣"
+numberOfDays: "有效天數"
+hideThisNote: "隱藏此貼文"
+showFeaturedNotesInTimeline: "在時間軸上顯示熱門推薦"
+objectStorageBaseUrl: "Base URL"
+objectStorageBucket: "儲存空間（Bucket）"
 objectStoragePrefix: "前綴"
+objectStorageEndpoint: "訪問網域名稱（Endpoint）"
+objectStorageEndpointDesc: "如要使用AWS S3，請留空。否則請根據伺服器要求以'<host>'或 '<host>:<port>'的形式設定訪問網域名稱（Endpoint）。"
+objectStorageRegion: "地域（Region）"
 objectStorageUseSSL: "使用SSL"
 objectStorageUseProxy: "使用網路代理"
 serverLogs: "伺服器日誌"
@ -512,24 +527,56 @@ tokenRequested: "允許訪問帳號"
 notificationType: "通知形式"
 edit: "編輯"
 useStarForReactionFallback: "以★代替未知的表情符號"
-emailConfig: "電郵服務器設定"
+emailConfig: "電子郵件伺服器設定"
 enableEmail: "啟用發送電郵功能"
 emailConfigInfo: "用於確認電郵地址及密碼重置"
 email: "電郵地址"
-smtpConfig: "SMTP服務器設定"
+smtpConfig: "SMTP伺服器設定"
 smtpHost: "主機"
 smtpPort: "端口"
-smtpUser: "使用名稱"
+smtpUser: "使用者名稱"
 smtpPass: "密碼"
+emptyToDisableSmtpAuth: "留空使用者名稱和密碼以禁用SMTP驗證。"
+testEmail: "郵件測試發送"
+wordMute: "靜音文字"
 display: "檢視"
 copy: "複製"
 metrics: "指標"
+overview: "概覽"
 logs: "日誌"
 delayed: "延遲"
 database: "資料庫"
 channel: "頻道"
 create: "新增"
-notificationSetting: "管理通知"
+notificationSetting: "通知設定"
+other: "其他"
+regenerateLoginTokenDescription: "再生用於登入的內部權杖。一般情況下是不需要這樣做的。一旦再生，所有裝置將會被登出。"
+sample: "範例 "
+abuseReports: "檢舉"
+reportAbuse: "檢舉"
+reportAbuseOf: "檢舉{name}"
+send: "發送"
+openInNewTab: "在新分頁中開啟"
+random: "隨機"
+system: "系統"
+_reversi:
+  reversi: "黑白棋"
+  gameSettings: "對弈設定"
+  chooseBoard: "選擇棋盤"
+  rules: "規則"
+  botSettings: "機器人設定"
+  opponentTurn: "對手回合"
+  myTurn: "你的回合"
+  turnOf: "{name}的回合"
+  pastTurnOf: "{name}的回合"
+  surrender: "認輸"
+  black: "黑"
+  white: "白"
+  total: "合計"
+  ended: "已結束"
+  playing: "正在對弈"
+_instanceTicker:
+  always: "總是顯示"
 _serverDisconnectedBehavior:
  reload: "自動重載"
  dialog: "以對話框警告"
@ -537,7 +584,7 @@ _serverDisconnectedBehavior:
 _channel:
  create: "建立頻道"
  edit: "編輯頻道"
-  setBanner: "設置封面圖"
+  setBanner: "設定橫幅"
  removeBanner: "移除封面圖"
  featured: "流行"
  owned: "管理中"
@ -549,16 +596,30 @@ _sidebar:
  hide: "隱藏"
 _wordMute:
  muteWords: "加入靜音文字"
+  mutedNotes: "已靜音的貼文"
 _theme:
+  constant: "常數"
+  defaultValue: "預設值"
  color: "顏色"
  func: "函数"
+  argument: "引數"
+  alpha: "透明度"
+  darken: "暗度"
+  lighten: "亮度"
  keys:
    bg: "背景"
+    fg: "文本"
+    shadow: "陰影"
+    link: "鏈接"
+    hashtag: "#tag"
    mention: "提及"
+    mentionMe: "提及我"
    renote: "轉發貼文"
    divider: "分割線"
    infoBg: "資訊背景"
    infoFg: "資訊內容"
+    infoWarnBg: "警告背景"
+    infoWarnFg: "警告字元"
 _sfx:
  note: "貼文"
  noteMy: "我的貼文"
@ -595,6 +656,7 @@ _tutorial:
  step4_1: "筆記發出去了嗎？"
  step4_2: "如果你的貼文有顯示在時間軸上，就代表已經發文成功。"
  step5_1: "現在試試看追隨其他人來讓你的時間軸變得更生動吧。"
+  step5_2: "你可以在{featured}上看到受歡迎的貼文，你也可以選擇從列表中追隨你喜歡的人，或者在{explore}上找到熱門使用者。"
  step5_3: "想要追隨其他人，只要點擊他們的頭像並按「追隨」即可。"
  step5_4: "如果使用者的名字旁有鎖頭的圖示，代表他們需要手動核准你的追隨請求。"
  step6_1: "現在你可以在時間軸上看到其他用戶的貼文"
@ -602,6 +664,8 @@ _tutorial:
  step6_3: "在他人的貼文按下「+」的圖示即可選擇想要的表情符號來進行「反應」。"
  step7_1: "以上為Misskey的基本操作說明，教學在此告一段落。辛苦了。"
  step7_2: "歡迎到{help}來瞭解更多Misskey相關介紹。"
+_2fa:
+  registerDevice: "註冊裝置"
 _permissions:
  "read:blocks": "已封鎖用戶名單"
  "write:blocks": "編輯已封鎖用戶名單"
@ -610,15 +674,32 @@ _permissions:
  "read:favorites": "瀏覽已收藏"
  "write:favorites": "編輯收藏清單"
  "write:following": "追隨/解除追隨"
+  "read:messaging": "顯示訊息"
+  "write:messaging": "撰寫或刪除私人訊息"
+  "read:mutes": "顯示已靜音列表"
+  "write:mutes": "編輯已靜音列表"
  "write:notes": "撰寫或刪除貼文"
  "read:notifications": "查看通知"
+  "write:notifications": "編輯通知"
  "read:reactions": "查看反應"
  "write:reactions": "編輯反應"
  "write:votes": "投票"
+  "read:pages": "顯示頁面"
+  "write:pages": "編輯頁面"
+  "read:page-likes": "顯示頁面的已喜歡"
+  "write:page-likes": "編輯頁面上喜歡"
+  "read:user-groups": "顯示使用者群組"
+  "write:user-groups": "編輯使用者群組"
  "read:channels": "已查看的頻道"
-  "write:channels": "操作頻道"
+  "write:channels": "編輯頻道"
+_auth:
+  shareAccess: "要授權「“{name}”」存取您的帳戶嗎？"
 _antennaSources:
  all: "全部貼文"
+  homeTimeline: "來自已追隨使用者的貼文"
+  users: "來自特定使用者的貼文"
+  userList: "來自特定清單中的貼文"
+  userGroup: "來自特定群組的貼文"
 _weekday:
  sunday: "週日"
  monday: "週一"
@ -648,68 +729,216 @@ _poll:
  noOnlyOneChoice: "至少需要兩個選項。"
  expiration: "期限"
  infinite: "無期限"
+  at: "結束時間"
  deadlineDate: "截止日期"
  deadlineTime: "小時"
+  duration: "時長"
  votesCount: "{n}票"
  totalVotes: "一共{n}票"
  vote: "投票"
  showResult: "顯示結果"
  voted: "已投票"
  closed: "已結束"
+  remainingDays: "{d}天{h}小時後結束"
 _visibility:
+  public: "公開"
  home: "首頁"
  followers: "追隨者"
+  specified: "指定使用者"
+  specifiedDescription: "僅發送至指定使用者"
  localOnly: "僅限本地"
+  localOnlyDescription: "對遠端使用者隱藏"
 _postForm:
+  replyPlaceholder: "回覆此貼文..."
+  quotePlaceholder: "引用此貼文..."
  channelPlaceholder: "發佈到頻道"
+  _placeholders:
+    a: "今天過得如何?"
+    b: "有什麼新鮮事嗎?"
+    c: "有什麼新鮮想法嗎？"
+    d: "想要發布些什麼嗎？"
+    e: "寫些什麼吧..."
+    f: "期待你發佈的內容..."
 _profile:
  name: "名稱"
-  username: "使用名稱"
+  username: "使用者名稱"
+  description: "關於我"
+  youCanIncludeHashtags: "你也可以在「關於我」中加上 #tag"
+  metadata: "更多資訊"
  metadataLabel: "標籤"
  metadataContent: "内容"
 _exportOrImport:
  allNotes: "全部貼文"
  followingList: "追隨中"
-  muteList: "消音"
+  muteList: "靜音"
  blockingList: "封鎖"
  userLists: "清單"
 _charts:
+  usersIncDec: "使用者増減"
+  usersTotal: "使用者合共"
+  activeUsers: "活躍使用者"
+  notesIncDec: "貼文増減"
+  localNotesIncDec: "本地貼文増減"
  remoteNotesIncDec: "非本地貼文的數目增减"
+  notesTotal: "貼文合共"
+  filesIncDec: "檔案増減"
+  filesTotal: "累計檔案"
+  storageUsageIncDec: "儲存空間的増減"
+  storageUsageTotal: "已使用的儲存空間合共"
 _instanceCharts:
+  requests: "請求"
+  users: "使用者増減"
+  usersTotal: "總計使用者"
+  notes: "貼文増減"
+  notesTotal: "累計貼文"
+  ff: "追隨/追隨者的増減"
+  ffTotal: "追隨/追隨者累計"
  cacheSize: "增加或減少快取用量"
  cacheSizeTotal: "快取大小總計"
+  files: "檔案數量的増減"
+  filesTotal: "檔案數量總計"
 _timelines:
  home: "首頁"
+  local: "本地"
+  social: "社群"
+  global: "全域"
 _rooms:
+  roomOf: "{user}的房間"
+  addFurniture: "擺放家具"
+  translate: "移動 "
+  rotate: "旋轉"
+  exit: "返回"
+  remove: "移除"
+  clear: "全部移除"
+  clearConfirm: "確定要移除全部家具嗎？"
+  leaveConfirm: "修改未儲存，是否要離開？"
+  chooseImage: "選擇圖像"
+  roomType: "房間種類"
+  carpetColor: "地板顏色"
  _roomType:
    default: "預設"
+    washitsu: "和室"
  _furnitures:
+    milk: "牛奶盒"
+    bed: "床"
+    low-table: "咖啡桌"
+    desk: "書桌"
+    chair: "椅子"
+    chair2: "椅子2"
+    fan: "通風機"
+    pc: "電腦"
+    plant: "觀葉植物"
+    plant2: "觀葉植物2"
+    eraser: "橡皮擦"
+    pencil: "鉛筆"
+    pudding: "布丁"
+    cardboard-box: "紙板箱"
+    cardboard-box2: "紙板箱2"
+    cardboard-box3: "紙板箱3"
+    book: "讀物"
+    book2: "讀物2"
+    piano: "鋼琴"
+    moon: "月亮"
+    corkboard: "木栓板"
+    mousepad: "滑鼠墊"
    monitor: "監視器"
    keyboard: "鍵盤"
+    carpet-stripe: "條紋地毯"
+    bin: "垃圾箱"
+    cup-noodle: "杯面"
+    holo-display: "投影機"
+    energy-drink: "能量飲料"
+    doll-ai: "小藍的人偶公仔"
+    banknote: "大疊鈔票"
 _pages:
+  newPage: "建立頁面"
+  editPage: "編輯頁面"
+  created: "頁面已建立"
+  updated: "頁面已更新"
  deleted: "頁面已被刪除"
+  editThisPage: "編輯此頁面"
+  viewSource: "檢視原始碼"
+  viewPage: "顯示頁面"
  like: "喜歡"
  unlike: "收回喜歡"
+  my: "我的頁面"
+  liked: "已喜歡的頁面"
+  inspector: "面板檢查"
+  variables: "變數"
+  title: "標題"
+  url: "頁面網址"
+  font: "字型"
+  fontSerif: "襯線體"
+  fontSansSerif: "無襯線體"
+  inputBlocks: "輸入"
  blocks:
+    text: "文本"
+    textarea: "文字區域"
+    section: "區段"
    image: "圖片"
+    button: "按鈕"
+    if: "如果"
+    _if:
+      variable: "變數"
    _post:
      text: "内容"
+      canvasId: "畫布ID"
+    textInput: "插入文字"
+    _textInput:
+      name: "變數名稱"
+      text: "標題"
+      default: "預設值"
+    textareaInput: "多行文字输入"
    _textareaInput:
      name: "變數名稱"
+      text: "標題"
+      default: "預設值"
    numberInput: "輸入數值"
    _numberInput:
      name: "變數名稱"
-    _canvas:
-      width: "寬度"
-    _counter:
      text: "標題"
+      default: "預設值"
+    canvas: "畫布"
+    _canvas:
+      id: "畫布ID"
+      width: "寬度"
+      height: "高度"
+    switch: "開關"
+    _switch:
+      name: "變數名稱"
+      text: "標題"
+      default: "預設值"
+    counter: "計數器"
+    _counter:
+      name: "變數名稱"
+      text: "標題"
+      inc: "増加値"
    _button:
      text: "標題"
+      colored: "彩色"
+      action: "按下按鈕後發生的行為"
      _action:
        _dialog:
          content: "内容"
+        resetRandom: "重設亂數"
+        pushEvent: "發送事件"
+        _pushEvent:
+          event: "事件名稱"
+          no-variable: "沒有"
+        callAiScript: "調用AiScript"
+        _callAiScript:
+          functionName: "函數名稱"
+    radioButton: "選項"
+    _radioButton:
+      name: "變數名稱"
+      title: "標題"
+      default: "預設值"
  script:
    categories:
+      logical: "邏輯運算"
+      operation: "計算"
+      comparison: "對比"
+      random: "隨機"
      value: "數值 "
      fn: "函数"
      text: "文本操作"
@ -719,6 +948,8 @@ _pages:
      text: "文本"
      multiLineText: "文本 (多行)"
      textList: "文本列表"
+      _strLen:
+        arg1: "文本"
      _strPick:
        arg1: "文本"
        arg2: "字元位置"
@ -732,18 +963,22 @@ _pages:
      _add:
        arg1: "A"
        arg2: "B"
+      subtract: "减去"
      _subtract:
        arg1: "A"
        arg2: "B"
+      multiply: "乘"
      _multiply:
        arg1: "A"
        arg2: "B"
+      divide: "除"
      _divide:
        arg1: "A"
        arg2: "B"
      _mod:
        arg1: "A"
        arg2: "B"
+      round: "四舍五入"
      _round:
        arg1: "數值"
      eq: "A和B相等"
@ -785,6 +1020,7 @@ _pages:
      not: "否"
      _not:
        arg1: "否"
+      random: "隨機"
      _random:
        arg1: "機率"
      rannum: "亂數"
@ -827,6 +1063,8 @@ _pages:
        arg1: "文字"
      _numberToString:
        arg1: "數值"
+      _splitStrByLine:
+        arg1: "文本"
      ref: "變數"
      aiScriptVar: "AiScript的變數"
      fn: "函数"
@ -842,6 +1080,7 @@ _pages:
      array: "清單"
      stringArray: "文本列表"
    enviromentVariables: "環境變數"
+    pageVariables: "頁面元素"
 _relayStatus:
  requesting: "等待核准"
  accepted: "已通過核准"
@ -853,15 +1092,31 @@ _notification:
  yourFollowRequestAccepted: "您的追隨請求已通過"
  youWereInvitedToGroup: "您有新的群組邀請"
  _types:
+    all: "全部 "
    follow: "追隨中"
    mention: "提及"
+    reply: "回覆"
    renote: "轉發貼文"
    quote: "引用"
    reaction: "反應"
+    receiveFollowRequest: "已收到追隨請求"
+    followRequestAccepted: "追隨請求已接受"
+    app: "應用程式通知"
 _deck:
+  alwaysShowMainColumn: "總是顯示主欄"
+  columnAlign: "對齊欄位"
+  addColumn: "新增欄位"
+  swapLeft: "向左移動"
+  swapRight: "向右移動"
+  swapUp: "往上移動"
+  swapDown: "往下移動"
+  stackLeft: "向左折疊"
+  popRight: "向右彈出"
  _columns:
+    widgets: "小工具"
    notifications: "通知"
    tl: "時間軸"
    antenna: "天線"
    list: "清單"
    mentions: "提及"
+    direct: "指定使用者"
--- a/migration/1603094348345-refine-abuse-user-report.ts
+++ b/migration/1603094348345-refine-abuse-user-report.ts
@ -11,7 +11,7 @@ export class refineAbuseUserReport1603094348345 implements MigrationInterface {
        await queryRunner.query(`ALTER TABLE "abuse_user_report" ADD "assigneeId" character varying(32)`);
        await queryRunner.query(`ALTER TABLE "abuse_user_report" ADD "resolved" boolean NOT NULL DEFAULT false`);
        await queryRunner.query(`ALTER TABLE "abuse_user_report" DROP COLUMN "comment"`);
-        await queryRunner.query(`ALTER TABLE "abuse_user_report" ADD "comment" character varying(2048) NOT NULL`);
+        await queryRunner.query(`ALTER TABLE "abuse_user_report" ADD "comment" character varying(2048) NOT NULL DEFAULT '{}'::varchar[]`);
        await queryRunner.query(`CREATE INDEX "IDX_2b15aaf4a0dc5be3499af7ab6a" ON "abuse_user_report" ("resolved") `);
        await queryRunner.query(`ALTER TABLE "abuse_user_report" ADD CONSTRAINT "FK_08b883dd5fdd6f9c4c1572b36de" FOREIGN KEY ("assigneeId") REFERENCES "user"("id") ON DELETE SET NULL ON UPDATE NO ACTION`);
    }
@ -20,7 +20,7 @@ export class refineAbuseUserReport1603094348345 implements MigrationInterface {
        await queryRunner.query(`ALTER TABLE "abuse_user_report" DROP CONSTRAINT "FK_08b883dd5fdd6f9c4c1572b36de"`);
        await queryRunner.query(`DROP INDEX "IDX_2b15aaf4a0dc5be3499af7ab6a"`);
        await queryRunner.query(`ALTER TABLE "abuse_user_report" DROP COLUMN "comment"`);
-        await queryRunner.query(`ALTER TABLE "abuse_user_report" ADD "comment" character varying(512) NOT NULL`);
+        await queryRunner.query(`ALTER TABLE "abuse_user_report" ADD "comment" character varying(512) NOT NULL DEFAULT '{}'::varchar[]`);
        await queryRunner.query(`ALTER TABLE "abuse_user_report" DROP COLUMN "resolved"`);
        await queryRunner.query(`ALTER TABLE "abuse_user_report" DROP COLUMN "assigneeId"`);
        await queryRunner.query(`ALTER TABLE "abuse_user_report" RENAME COLUMN "targetUserId" TO "userId"`);
--- a/migration/1603776877564-instance-theme-color.ts
+++ b/migration/1603776877564-instance-theme-color.ts
@ -0,0 +1,14 @@
+import {MigrationInterface, QueryRunner} from "typeorm";
+
+export class instanceThemeColor1603776877564 implements MigrationInterface {
+    name = 'instanceThemeColor1603776877564'
+
+    public async up(queryRunner: QueryRunner): Promise<void> {
+        await queryRunner.query(`ALTER TABLE "instance" ADD "themeColor" character varying(64) DEFAULT null`);
+    }
+
+    public async down(queryRunner: QueryRunner): Promise<void> {
+        await queryRunner.query(`ALTER TABLE "instance" DROP COLUMN "themeColor"`);
+    }
+
+}
--- a/migration/1603781553011-instance-favicon.ts
+++ b/migration/1603781553011-instance-favicon.ts
@ -0,0 +1,14 @@
+import {MigrationInterface, QueryRunner} from "typeorm";
+
+export class instanceFavicon1603781553011 implements MigrationInterface {
+    name = 'instanceFavicon1603781553011'
+
+    public async up(queryRunner: QueryRunner): Promise<void> {
+        await queryRunner.query(`ALTER TABLE "instance" ADD "faviconUrl" character varying(256) DEFAULT null`);
+    }
+
+    public async down(queryRunner: QueryRunner): Promise<void> {
+        await queryRunner.query(`ALTER TABLE "instance" DROP COLUMN "faviconUrl"`);
+    }
+
+}
--- a/package.json
+++ b/package.json
@ -1,7 +1,7 @@
 {
 	"name": "misskey",
 	"author": "syuilo <syuilotan@yahoo.co.jp>",
-	"version": "12.49.1",
+	"version": "12.52.0",
 	"codename": "indigo",
 	"repository": {
 		"type": "git",
@ -190,7 +190,7 @@
 		"parsimmon": "1.16.0",
 		"pg": "8.4.1",
 		"portscanner": "2.2.0",
-		"postcss": "8.1.2",
+		"postcss": "8.1.3",
 		"postcss-loader": "4.0.4",
 		"prismjs": "1.22.0",
 		"probe-image-size": "5.0.0",
@ -216,7 +216,7 @@
 		"rndstr": "1.0.0",
 		"s-age": "1.1.2",
 		"sass": "1.27.0",
-		"sass-loader": "10.0.3",
+		"sass-loader": "10.0.4",
 		"seedrandom": "3.0.5",
 		"sharp": "0.26.2",
 		"speakeasy": "2.0.0",
@ -224,7 +224,7 @@
 		"style-loader": "2.0.0",
 		"summaly": "2.4.0",
 		"syslog-pro": "1.0.0",
-		"systeminformation": "4.27.8",
+		"systeminformation": "4.27.10",
 		"syuilo-password-strength": "0.0.1",
 		"textarea-caret": "3.1.0",
 		"three": "0.117.1",
@ -253,7 +253,7 @@
 		"vuex": "4.0.0-beta.4",
 		"vuex-persistedstate": "3.1.0",
 		"web-push": "3.4.4",
-		"webpack": "5.1.3",
+		"webpack": "5.3.2",
 		"webpack-cli": "4.1.0",
 		"websocket": "1.0.32",
 		"ws": "7.3.1",
--- a/src/client/components/autocomplete.vue
+++ b/src/client/components/autocomplete.vue
@ -122,6 +122,7 @@ export default defineComponent({
 			users: [],
 			hashtags: [],
 			emojis: [],
+			items: [],
 			select: -1,
 			emojilist,
 			emojiDb: [] as EmojiDef[]
@ -129,10 +130,6 @@ export default defineComponent({
 	},

 	computed: {
-		items(): HTMLCollection {
-			return (this.$refs.suggests as Element).children;
-		},
-
 		useOsNativeEmojis(): boolean {
 			return this.$store.state.device.useOsNativeEmojis;
 		}
@ -148,6 +145,7 @@ export default defineComponent({

 	updated() {
 		this.setPosition();
+		this.items = (this.$refs.suggests as Element | undefined)?.children || [];
 	},

 	mounted() {
@ -371,6 +369,7 @@ export default defineComponent({

 		selectNext() {
 			if (++this.select >= this.items.length) this.select = 0;
+			if (this.items.length === 0) this.select = -1;
 			this.applySelect();
 		},

@ -384,8 +383,10 @@ export default defineComponent({
 				el.removeAttribute('data-selected');
 			}

+			if (this.select !== -1) {
 				this.items[this.select].setAttribute('data-selected', 'true');
 				(this.items[this.select] as any).focus();
+			}
 		},

 		chooseUser() {
--- a/src/client/components/avatar.vue
+++ b/src/client/components/avatar.vue
@ -2,9 +2,9 @@
 <span class="eiwwqkts" :class="{ cat }" :title="acct(user)" v-if="disableLink" v-user-preview="disablePreview ? undefined : user.id" @click="onClick">
 	<img class="inner" :src="url"/>
 </span>
-<router-link class="eiwwqkts" :class="{ cat }" :to="userPage(user)" :title="acct(user)" :target="target" v-else v-user-preview="disablePreview ? undefined : user.id">
+<MkA class="eiwwqkts" :class="{ cat }" :to="userPage(user)" :title="acct(user)" :target="target" v-else v-user-preview="disablePreview ? undefined : user.id">
 	<img class="inner" :src="url"/>
-</router-link>
+</MkA>
 </template>

 <script lang="ts">
--- a/src/client/components/channel-preview.vue
+++ b/src/client/components/channel-preview.vue
@ -1,6 +1,6 @@
 <template>
-<router-link :to="`/channels/${channel.id}`" class="eftoefju _panel" tabindex="-1">
-	<div class="banner" v-if="channel.bannerUrl" :style="`background-image: url('${channel.bannerUrl}')`">
+<MkA :to="`/channels/${channel.id}`" class="eftoefju _panel" tabindex="-1">
+	<div class="banner" :style="bannerStyle">
 		<div class="fade"></div>
 		<div class="name"><Fa :icon="faSatelliteDish"/> {{ channel.name }}</div>
 		<div class="status">
@ -30,7 +30,7 @@
 			{{ $t('updatedAt') }}: <MkTime :time="channel.lastNotedAt"/>
 		</span>
 	</footer>
-</router-link>
+</MkA>
 </template>

 <script lang="ts">
@ -45,6 +45,16 @@ export default defineComponent({
 		},
 	},

+	computed: {
+		bannerStyle() {
+			if (this.channel.bannerUrl) {
+				return { backgroundImage: `url(${this.channel.bannerUrl})` };
+			} else {
+				return { backgroundColor: '#4c5e6d' };
+			}
+		}
+	},
+
 	data() {
 		return {
 			faSatelliteDish, faUsers, faPencilAlt,
--- a/src/client/components/dialog.vue
+++ b/src/client/components/dialog.vue
@ -4,7 +4,7 @@
 		<div class="icon" v-if="icon">
 			<Fa :icon="icon"/>
 		</div>
-		<div class="icon" v-else-if="!input && !select && !user" :class="type">
+		<div class="icon" v-else-if="!input && !select" :class="type">
 			<Fa :icon="faCheck" v-if="type === 'success'"/>
 			<Fa :icon="faTimesCircle" v-if="type === 'error'"/>
 			<Fa :icon="faExclamationTriangle" v-if="type === 'warning'"/>
@ -12,11 +12,9 @@
 			<Fa :icon="faQuestionCircle" v-if="type === 'question'"/>
 			<Fa :icon="faSpinner" pulse v-if="type === 'waiting'"/>
 		</div>
-		<header v-if="title" v-html="title"></header>
-		<header v-if="title == null && user">{{ $t('enterUsername') }}</header>
-		<div class="body" v-if="text" v-html="text"></div>
+		<header v-if="title"><Mfm :text="title"/></header>
+		<div class="body" v-if="text"><Mfm :text="text"/></div>
 		<MkInput v-if="input" v-model:value="inputValue" autofocus :type="input.type || 'text'" :placeholder="input.placeholder" @keydown="onInputKeydown"></MkInput>
-		<MkInput v-if="user" v-model:value="userInputValue" autofocus @keydown="onInputKeydown"><template #prefix>@</template></MkInput>
 		<MkSelect v-if="select" v-model:value="selectedValue" autofocus>
 			<template v-if="select.items">
 				<option v-for="item in select.items" :value="item.value">{{ item.text }}</option>
@ -28,8 +26,8 @@
 			</template>
 		</MkSelect>
 		<div class="buttons" v-if="(showOkButton || showCancelButton) && !actions">
-			<MkButton inline @click="ok" v-if="showOkButton" primary :autofocus="!input && !select && !user" :disabled="!canOk">{{ (showCancelButton || input || select || user) ? $t('ok') : $t('gotIt') }}</MkButton>
-			<MkButton inline @click="cancel" v-if="showCancelButton || input || select || user">{{ $t('cancel') }}</MkButton>
+			<MkButton inline @click="ok" v-if="showOkButton" primary :autofocus="!input && !select">{{ (showCancelButton || input || select) ? $t('ok') : $t('gotIt') }}</MkButton>
+			<MkButton inline @click="cancel" v-if="showCancelButton || input || select">{{ $t('cancel') }}</MkButton>
 		</div>
 		<div class="buttons" v-if="actions">
 			<MkButton v-for="action in actions" inline @click="() => { action.callback(); close(); }" :primary="action.primary" :key="action.text">{{ action.text }}</MkButton>
@ -46,8 +44,6 @@ import MkModal from '@/components/ui/modal.vue';
 import MkButton from '@/components/ui/button.vue';
 import MkInput from '@/components/ui/input.vue';
 import MkSelect from '@/components/ui/select.vue';
-import parseAcct from '../../misc/acct/parse';
-import * as os from '@/os';

 export default defineComponent({
 	components: {
@ -77,9 +73,6 @@ export default defineComponent({
 		select: {
 			required: false
 		},
-		user: {
-			required: false
-		},
 		icon: {
 			required: false
 		},
@ -105,28 +98,12 @@ export default defineComponent({
 	data() {
 		return {
 			inputValue: this.input && this.input.default ? this.input.default : null,
-			userInputValue: null,
 			selectedValue: this.select ? this.select.default ? this.select.default : this.select.items ? this.select.items[0].value : this.select.groupedItems[0].items[0].value : null,
-			canOk: true,
 			faTimesCircle, faQuestionCircle, faSpinner, faInfoCircle, faExclamationTriangle, faCheck
 		};
 	},

-	watch: {
-		userInputValue() {
-			if (this.user) {
-				os.api('users/show', parseAcct(this.userInputValue)).then(u => {
-					this.canOk = u != null;
-				}).catch(() => {
-					this.canOk = false;
-				});
-			}
-		},
-	},
-
 	mounted() {
-		if (this.user) this.canOk = false;
-
 		document.addEventListener('keydown', this.onKeydown);
 	},

@ -141,21 +118,13 @@ export default defineComponent({
 		},

 		async ok() {
-			if (!this.canOk) return;
 			if (!this.showOkButton) return;

-			if (this.user) {
-				const user = await os.api('users/show', parseAcct(this.userInputValue));
-				if (user) {
-					this.done(false, user);
-				}
-			} else {
 			const result =
 				this.input ? this.inputValue :
 				this.select ? this.selectedValue :
 				true;
 			this.done(false, result);
-			}
 		},

 		cancel() {
@ -200,15 +169,15 @@ export default defineComponent({
 		font-size: 32px;

 		&.success {
-			color: var(--accent);
+			color: var(--success);
 		}

 		&.error {
-			color: #ec4137;
+			color: var(--error);
 		}

 		&.warning {
-			color: #ecb637;
+			color: var(--warn);
 		}

 		> * {
--- a/src/client/components/emoji-picker.vue
+++ b/src/client/components/emoji-picker.vue
@ -185,7 +185,7 @@ export default defineComponent({
 			transition: color 0.2s ease;

 			&:hover {
-				color: var(--textHighlighted);
+				color: var(--fgHighlighted);
 				transition: color 0s;
 			}

--- a/src/client/components/emoji.vue
+++ b/src/client/components/emoji.vue
@ -9,7 +9,6 @@
 import { defineComponent } from 'vue';
 import { getStaticImageUrl } from '@/scripts/get-static-image-url';
 import { twemojiSvgBase } from '../../misc/twemoji-base';
-import * as os from '@/os';

 export default defineComponent({
 	props: {
--- a/src/client/components/index.ts
+++ b/src/client/components/index.ts
@ -1,6 +1,7 @@
 import { App } from 'vue';

 import mfm from './misskey-flavored-markdown.vue';
+import a from './ui/a.vue';
 import acct from './acct.vue';
 import avatar from './avatar.vue';
 import emoji from './emoji.vue';
@ -10,10 +11,10 @@ import time from './time.vue';
 import url from './url.vue';
 import loading from './loading.vue';
 import error from './error.vue';
-import streamIndicator from './stream-indicator.vue';

 export default function(app: App) {
 	app.component('Mfm', mfm);
+	app.component('MkA', a);
 	app.component('MkAcct', acct);
 	app.component('MkAvatar', avatar);
 	app.component('MkEmoji', emoji);
@ -23,5 +24,4 @@ export default function(app: App) {
 	app.component('MkUrl', url);
 	app.component('MkLoading', loading);
 	app.component('MkError', error);
-	app.component('StreamIndicator', streamIndicator);
 }
--- a/src/client/components/instance-ticker.vue
+++ b/src/client/components/instance-ticker.vue
@ -0,0 +1,62 @@
+<template>
+<div class="hpaizdrt" :style="bg">
+	<img v-if="info.faviconUrl" class="icon" :src="info.faviconUrl"/>
+	<span class="name">{{ info.name }}</span>
+</div>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import { instanceName } from '@/config';
+
+export default defineComponent({
+	props: {
+		instance: {
+			type: Object,
+			required: false
+		},
+	},
+
+	data() {
+		return {
+			info: this.instance || {
+				faviconUrl: '/favicon.ico',
+				name: instanceName,
+				themeColor: (document.querySelector('meta[name="theme-color-orig"]') as HTMLMetaElement)?.content
+			}
+		}
+	},
+
+	computed: {
+		bg(): any {
+			const themeColor = this.info.themeColor || '#777777';
+			return {
+				background: `linear-gradient(90deg, ${themeColor}, ${themeColor + '00'})`
+			};
+		}
+	}
+});
+</script>
+
+<style lang="scss" scoped>
+.hpaizdrt {
+	$height: 1.1rem;
+
+	height: $height;
+	border-radius: 4px 0 0 4px;
+	overflow: hidden;
+	color: #fff;
+
+	> .icon {
+		height: 100%;
+	}
+
+	> .name {
+		margin-left: 4px;
+		line-height: $height;
+		font-size: 0.9em;
+		vertical-align: top;
+		font-weight: bold;
+	}
+}
+</style>
--- a/src/client/components/link.vue
+++ b/src/client/components/link.vue
@ -1,5 +1,5 @@
 <template>
-<component :is="self ? 'router-link' : 'a'" class="xlcxczvw _link" :[attr]="self ? url.substr(local.length) : url" :rel="rel" :target="target"
+<component :is="self ? 'MkA' : 'a'" class="xlcxczvw _link" :[attr]="self ? url.substr(local.length) : url" :rel="rel" :target="target"
 	@mouseover="onMouseover"
 	@mouseleave="onMouseleave"
 	:title="url"
--- a/src/client/components/media-list.vue
+++ b/src/client/components/media-list.vue
@ -32,8 +32,6 @@ export default defineComponent({
 		raw: {
 			default: false
 		},
-		// specify the parent element
-		parentElement: {}
 	},
 	data() {
 		return {
@ -66,7 +64,7 @@ export default defineComponent({

 				if (this.$refs.gridOuter) {
 					let height = 287;
-					const parent = this.parentElement || this.$parent.$el;
+					const parent = this.$parent.$el;

 					if (this.$refs.gridOuter.clientHeight) {
 						height = this.$refs.gridOuter.clientHeight;
@ -81,11 +79,6 @@ export default defineComponent({
 			});
 		}
 	},
-	watch: {
-		parentElement() {
-			this.size();
-		}
-	}
 });
 </script>

--- a/src/client/components/mention.vue
+++ b/src/client/components/mention.vue
@ -1,11 +1,11 @@
 <template>
-<router-link class="ldlomzub" :class="{ isMe }" :to="url" v-user-preview="canonical" v-if="url.startsWith('/')">
+<MkA class="ldlomzub" :class="{ isMe }" :to="url" v-user-preview="canonical" v-if="url.startsWith('/')">
 	<span class="me" v-if="isMe">{{ $t('you') }}</span>
 	<span class="main">
 		<span class="username">@{{ username }}</span>
 		<span class="host" v-if="(host != localHost) || $store.state.settings.showFullAcct">@{{ toUnicode(host) }}</span>
 	</span>
-</router-link>
+</MkA>
 <a class="ldlomzub" :href="url" target="_blank" rel="noopener" v-else>
 	<span class="main">
 		<span class="username">@{{ username }}</span>
--- a/src/client/components/mfm.ts
+++ b/src/client/components/mfm.ts
@ -9,8 +9,8 @@ import { concat } from '../../prelude/array';
 import MkFormula from './formula.vue';
 import MkCode from './code.vue';
 import MkGoogle from './google.vue';
+import MkA from './ui/a.vue';
 import { host } from '@/config';
-import { RouterLink } from 'vue-router';

 export default defineComponent({
 	props: {
@ -125,6 +125,18 @@ export default defineComponent({
 					}, genEl(token.children));
 				}

+				case 'twitch': {
+					return h('span', {
+						style: this.$store.state.device.animatedMfm ? 'display: inline-block; animation: anime-twitch 0.5s ease infinite;' : 'display: inline-block;'
+					}, genEl(token.children));
+				}
+
+				case 'shake': {
+					return h('span', {
+						style: this.$store.state.device.animatedMfm ? 'display: inline-block; animation: anime-shake 0.5s ease infinite;' : 'display: inline-block;'
+					}, genEl(token.children));
+				}
+
 				case 'url': {
 					return [h(MkUrl, {
 						key: Math.random(),
@ -150,7 +162,7 @@ export default defineComponent({
 				}

 				case 'hashtag': {
-					return [h(RouterLink, {
+					return [h(MkA, {
 						key: Math.random(),
 						to: this.isNote ? `/tags/${encodeURIComponent(token.node.props.hashtag)}` : `/explore/tags/${encodeURIComponent(token.node.props.hashtag)}`,
 						style: 'color:var(--hashtag);'
--- a/src/client/components/note-header.vue
+++ b/src/client/components/note-header.vue
@ -1,17 +1,17 @@
 <template>
 <header class="kkwtjztg">
-	<router-link class="name" :to="userPage(note.user)" v-user-preview="note.user.id">
+	<MkA class="name" :to="userPage(note.user)" v-user-preview="note.user.id">
 		<MkUserName :user="note.user"/>
-	</router-link>
+	</MkA>
 	<span class="is-bot" v-if="note.user.isBot">bot</span>
 	<span class="username"><MkAcct :user="note.user"/></span>
 	<span class="admin" v-if="note.user.isAdmin"><Fa :icon="faBookmark"/></span>
 	<span class="moderator" v-if="!note.user.isAdmin && note.user.isModerator"><Fa :icon="farBookmark"/></span>
 	<div class="info">
 		<span class="mobile" v-if="note.viaMobile"><Fa :icon="faMobileAlt"/></span>
-		<router-link class="created-at" :to="notePage(note)">
+		<MkA class="created-at" :to="notePage(note)">
 			<MkTime :time="note.createdAt"/>
-		</router-link>
+		</MkA>
 		<span class="visibility" v-if="note.visibility !== 'public'">
 			<Fa v-if="note.visibility === 'home'" :icon="faHome"/>
 			<Fa v-if="note.visibility === 'followers'" :icon="faUnlock"/>
--- a/src/client/components/note.vue
+++ b/src/client/components/note.vue
@ -18,9 +18,9 @@
 		<Fa :icon="faRetweet"/>
 		<i18n-t keypath="renotedBy" tag="span">
 			<template #user>
-				<router-link class="name" :to="userPage(note.user)" v-user-preview="note.userId">
+				<MkA class="name" :to="userPage(note.user)" v-user-preview="note.userId">
 					<MkUserName :user="note.user"/>
-				</router-link>
+				</MkA>
 			</template>
 		</i18n-t>
 		<div class="info">
@ -40,7 +40,8 @@
 		<MkAvatar class="avatar" :user="appearNote.user"/>
 		<div class="main">
 			<XNoteHeader class="header" :note="appearNote" :mini="true"/>
-			<div class="body" ref="noteBody">
+			<MkInstanceTicker v-if="showTicker" class="ticker" :instance="appearNote.user.instance"/>
+			<div class="body">
 				<p v-if="appearNote.cw != null" class="cw">
 					<Mfm v-if="appearNote.cw != ''" class="text" :text="appearNote.cw" :author="appearNote.user" :i="$store.state.i" :custom-emojis="appearNote.emojis"/>
 					<XCwButton v-model:value="showContent" :note="appearNote"/>
@ -48,18 +49,18 @@
 				<div class="content" v-show="appearNote.cw == null || showContent">
 					<div class="text">
 						<span v-if="appearNote.isHidden" style="opacity: 0.5">({{ $t('private') }})</span>
-						<router-link class="reply" v-if="appearNote.replyId" :to="`/notes/${appearNote.replyId}`"><Fa :icon="faReply"/></router-link>
+						<MkA class="reply" v-if="appearNote.replyId" :to="`/notes/${appearNote.replyId}`"><Fa :icon="faReply"/></MkA>
 						<Mfm v-if="appearNote.text" :text="appearNote.text" :author="appearNote.user" :i="$store.state.i" :custom-emojis="appearNote.emojis"/>
 						<a class="rp" v-if="appearNote.renote != null">RN:</a>
 					</div>
 					<div class="files" v-if="appearNote.files.length > 0">
-						<XMediaList :media-list="appearNote.files" :parent-element="noteBody"/>
+						<XMediaList :media-list="appearNote.files"/>
 					</div>
 					<XPoll v-if="appearNote.poll" :note="appearNote" ref="pollViewer" class="poll"/>
 					<MkUrlPreview v-for="url in urls" :url="url" :key="url" :compact="true" :detail="detail" class="url-preview"/>
 					<div class="renote" v-if="appearNote.renote"><XNotePreview :note="appearNote.renote"/></div>
 				</div>
-				<router-link v-if="appearNote.channel && !inChannel" class="channel" :to="`/channels/${appearNote.channel.id}`"><Fa :icon="faSatelliteDish"/> {{ appearNote.channel.name }}</router-link>
+				<MkA v-if="appearNote.channel && !inChannel" class="channel" :to="`/channels/${appearNote.channel.id}`"><Fa :icon="faSatelliteDish"/> {{ appearNote.channel.name }}</MkA>
 			</div>
 			<footer class="footer">
 				<XReactionsViewer :note="appearNote" ref="reactionsViewer"/>
@ -91,9 +92,9 @@
 <div v-else class="_panel muted" @click="muted = false">
 	<i18n-t keypath="userSaysSomething" tag="small">
 		<template #name>
-			<router-link class="name" :to="userPage(appearNote.user)" v-user-preview="appearNote.userId">
+			<MkA class="name" :to="userPage(appearNote.user)" v-user-preview="appearNote.userId">
 				<MkUserName :user="appearNote.user"/>
-			</router-link>
+			</MkA>
 		</template>
 	</i18n-t>
 </div>
@ -139,12 +140,13 @@ export default defineComponent({
 		XCwButton,
 		XPoll,
 		MkUrlPreview: defineAsyncComponent(() => import('@/components/url-preview.vue')),
+		MkInstanceTicker: defineAsyncComponent(() => import('@/components/instance-ticker.vue')),
 	},

 	inject: {
 		inChannel: {
 			default: null
-		}
+		},
 	},

 	props: {
@ -174,7 +176,6 @@ export default defineComponent({
 			showContent: false,
 			isDeleted: false,
 			muted: false,
-			noteBody: this.$refs.noteBody,
 			faEdit, faBolt, faTimes, faBullhorn, faPlus, faMinus, faRetweet, faReply, faReplyAll, faEllipsisH, faHome, faUnlock, faEnvelope, faThumbtack, faBan, faBiohazard, faPlug, faSatelliteDish
 		};
 	},
@ -258,6 +259,12 @@ export default defineComponent({
 			} else {
 				return null;
 			}
+		},
+
+		showTicker() {
+			if (this.$store.state.device.instanceTicker === 'always') return true;
+			if (this.$store.state.device.instanceTicker === 'remote' && this.appearNote.user.instance) return true;
+			return false;
 		}
 	},

@ -301,8 +308,6 @@ export default defineComponent({
 		if (this.$store.getters.isSignedIn) {
 			this.connection.on('_connected_', this.onStreamConnected);
 		}
-
-		this.noteBody = this.$refs.noteBody;
 	},

 	beforeUnmount() {
@ -581,11 +586,6 @@ export default defineComponent({
 				});

 				menu = [{
-					type: 'link',
-					icon: faInfoCircle,
-					text: this.$t('details'),
-					to: '/notes/' + this.appearNote.id
-				}, null, {
 					icon: faCopy,
 					text: this.$t('copyContent'),
 					action: this.copyContent
--- a/src/client/components/notification.vue
+++ b/src/client/components/notification.vue
@ -18,34 +18,34 @@
 	</div>
 	<div class="tail">
 		<header>
-			<router-link v-if="notification.user" class="name" :to="userPage(notification.user)" v-user-preview="notification.user.id"><MkUserName :user="notification.user"/></router-link>
+			<MkA v-if="notification.user" class="name" :to="userPage(notification.user)" v-user-preview="notification.user.id"><MkUserName :user="notification.user"/></MkA>
 			<span v-else>{{ notification.header }}</span>
-			<MkTime :time="notification.createdAt" v-if="withTime"/>
+			<MkTime :time="notification.createdAt" v-if="withTime" class="time"/>
 		</header>
-		<router-link v-if="notification.type === 'reaction'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
+		<MkA v-if="notification.type === 'reaction'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
 			<Fa :icon="faQuoteLeft"/>
 			<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.emojis"/>
 			<Fa :icon="faQuoteRight"/>
-		</router-link>
-		<router-link v-if="notification.type === 'renote'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note.renote)">
+		</MkA>
+		<MkA v-if="notification.type === 'renote'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note.renote)">
 			<Fa :icon="faQuoteLeft"/>
 			<Mfm :text="getNoteSummary(notification.note.renote)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.renote.emojis"/>
 			<Fa :icon="faQuoteRight"/>
-		</router-link>
-		<router-link v-if="notification.type === 'reply'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
+		</MkA>
+		<MkA v-if="notification.type === 'reply'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
 			<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.emojis"/>
-		</router-link>
-		<router-link v-if="notification.type === 'mention'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
+		</MkA>
+		<MkA v-if="notification.type === 'mention'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
 			<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.emojis"/>
-		</router-link>
-		<router-link v-if="notification.type === 'quote'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
+		</MkA>
+		<MkA v-if="notification.type === 'quote'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
 			<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.emojis"/>
-		</router-link>
-		<router-link v-if="notification.type === 'pollVote'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
+		</MkA>
+		<MkA v-if="notification.type === 'pollVote'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
 			<Fa :icon="faQuoteLeft"/>
 			<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.emojis"/>
 			<Fa :icon="faQuoteRight"/>
-		</router-link>
+		</MkA>
 		<span v-if="notification.type === 'follow'" class="text" style="opacity: 0.6;">{{ $t('youGotNewFollower') }}<div v-if="full"><MkFollowButton :user="notification.user" :full="true"/></div></span>
 		<span v-if="notification.type === 'followRequestAccepted'" class="text" style="opacity: 0.6;">{{ $t('followRequestAccepted') }}</span>
 		<span v-if="notification.type === 'receiveFollowRequest'" class="text" style="opacity: 0.6;">{{ $t('receiveFollowRequest') }}<div v-if="full && !followRequestDone"><button class="_textButton" @click="acceptFollowRequest()">{{ $t('accept') }}</button> | <button class="_textButton" @click="rejectFollowRequest()">{{ $t('reject') }}</button></div></span>
@ -260,7 +260,7 @@ export default defineComponent({
 				overflow: hidden;
 			}

-			> .mk-time {
+			> .time {
 				margin-left: auto;
 				font-size: 0.9em;
 			}
--- a/src/client/components/page-preview.vue
+++ b/src/client/components/page-preview.vue
@ -1,5 +1,5 @@
 <template>
-<router-link :to="`/@${page.user.username}/pages/${page.name}`" class="vhpxefrj" tabindex="-1">
+<MkA :to="`/@${page.user.username}/pages/${page.name}`" class="vhpxefrj" tabindex="-1">
 	<div class="thumbnail" v-if="page.eyeCatchingImage" :style="`background-image: url('${page.eyeCatchingImage.thumbnailUrl}')`"></div>
 	<article>
 		<header>
@ -11,7 +11,7 @@
 			<p>{{ userName(page.user) }}</p>
 		</footer>
 	</article>
-</router-link>
+</MkA>
 </template>

 <script lang="ts">
--- a/src/client/components/page-window.vue
+++ b/src/client/components/page-window.vue
@ -1,11 +1,18 @@
 <template>
-<XWindow ref="window" :initial-width="400" :initial-height="500" :can-resize="true" @closed="$emit('closed')">
+<XWindow ref="window"
+	:initial-width="400"
+	:initial-height="500"
+	:can-resize="true"
+	:close-right="true"
+	:contextmenu="contextmenu"
+	@closed="$emit('closed')"
+>
 	<template #header>
 		<XHeader :info="pageInfo" :with-back="false"/>
 	</template>
 	<template #buttons>
-		<button class="_button" @click="expand" v-tooltip="$t('showInPage')"><Fa :icon="faExpandAlt"/></button>
-		<button class="_button" @click="popout" v-tooltip="$t('popout')"><Fa :icon="faExternalLinkAlt"/></button>
+		<button class="_button" @click="back()" v-if="history.length > 0"><Fa :icon="faChevronLeft"/></button>
+		<button class="_button" style="pointer-events: none;" v-else><!-- マージンのバランスを取るためのダミー --></button>
 	</template>
 	<div class="yrolvcoq" style="min-height: 100%; background: var(--bg);">
 		<component :is="component" v-bind="props" :ref="changePage"/>
@ -14,11 +21,13 @@
 </template>

 <script lang="ts">
-import { defineComponent, markRaw } from 'vue';
-import { faExternalLinkAlt, faExpandAlt } from '@fortawesome/free-solid-svg-icons';
+import { defineComponent } from 'vue';
+import { faExternalLinkAlt, faExpandAlt, faLink, faChevronLeft, faColumns } from '@fortawesome/free-solid-svg-icons';
 import XWindow from '@/components/ui/window.vue';
 import XHeader from '@/ui/_common_/header.vue';
 import { popout } from '@/scripts/popout';
+import copyToClipboard from '@/scripts/copy-to-clipboard';
+import { resolve } from '@/router';

 export default defineComponent({
 	components: {
@ -26,6 +35,20 @@ export default defineComponent({
 		XHeader,
 	},

+	inject: {
+		sideViewHook: {
+			default: null
+		}
+	},
+
+	provide() {
+		return {
+			navHook: (url) => {
+				this.navigate(url);
+			}
+		};
+	},
+
 	props: {
 		initialUrl: {
 			type: String,
@ -38,7 +61,7 @@ export default defineComponent({
 		initialProps: {
 			type: Object,
 			required: false,
-			default: {},
+			default: () => {},
 		},
 	},

@ -50,18 +73,46 @@ export default defineComponent({
 			url: this.initialUrl,
 			component: this.initialComponent,
 			props: this.initialProps,
-			faExternalLinkAlt, faExpandAlt,
+			history: [],
+			faChevronLeft,
 		};
 	},

-	provide() {
-		return {
-			navHook: (url, component, props) => {
-				this.url = url;
-				this.component = markRaw(component);
-				this.props = props;
+	computed: {
+		contextmenu() {
+			return [{
+				type: 'label',
+				text: this.url,
+			}, {
+				icon: faExpandAlt,
+				text: this.$t('showInPage'),
+				action: this.expand
+			}, this.sideViewHook ? {
+				icon: faColumns,
+				text: this.$t('openInSideView'),
+				action: () => {
+					this.sideViewHook(this.url);
+					this.$refs.window.close();
 				}
-		};
+			} : undefined, {
+				icon: faExternalLinkAlt,
+				text: this.$t('popout'),
+				action: this.popout
+			}, null, {
+				icon: faExternalLinkAlt,
+				text: this.$t('openInNewTab'),
+				action: () => {
+					window.open(this.url, '_blank');
+					this.$refs.window.close();
+				}
+			}, {
+				icon: faLink,
+				text: this.$t('copyLink'),
+				action: () => {
+					copyToClipboard(this.url);
+				}
+			}];
+		},
 	},

 	methods: {
@ -72,6 +123,18 @@ export default defineComponent({
 			}
 		},

+		navigate(url, record = true) {
+			if (record) this.history.push(this.url);
+			this.url = url;
+			const { component, props } = resolve(url);
+			this.component = component;
+			this.props = props;
+		},
+
+		back() {
+			this.navigate(this.history.pop(), false);
+		},
+
 		expand() {
 			this.$router.push(this.url);
 			this.$refs.window.close();
--- a/src/client/components/post-form.vue
+++ b/src/client/components/post-form.vue
@ -562,6 +562,10 @@ export default defineComponent({
 				});
 			}).catch(err => {
 				this.posting = false;
+				os.dialog({
+					type: 'error',
+					text: err.message + '\n' + (err as any).id,
+				});
 			});
 		},

--- a/src/client/components/reactions-viewer.details.vue
+++ b/src/client/components/reactions-viewer.details.vue
@ -3,7 +3,7 @@
 	<div class="bqxuuuey">
 		<div class="info">
 			<div>{{ reaction.replace('@.', '') }}</div>
-			<XReactionIcon :reaction="reaction" :custom-emojis="emojis" class="icon"/>
+			<XReactionIcon :reaction="reaction" :custom-emojis="emojis" class="icon" :no-style="true"/>
 		</div>
 		<template v-if="users.length <= 10">
 			<b v-for="u in users" :key="u.id" style="margin-right: 12px;">
@ -66,7 +66,6 @@ export default defineComponent({
 		> .icon {
 			display: block;
 			width: 60px;
-			height: 60px;
 			margin: 0 auto;
 		}
 	}
--- a/src/client/components/sidebar.vue
+++ b/src/client/components/sidebar.vue
@ -17,12 +17,12 @@
 				<button class="item _button index active" @click="top()" v-if="$route.name === 'index'">
 					<Fa :icon="faHome" fixed-width/><span class="text">{{ $store.getters.isSignedIn ? $t('timeline') : $t('home') }}</span>
 				</button>
-				<router-link class="item index" active-class="active" to="/" exact v-else>
+				<MkA class="item index" active-class="active" to="/" exact v-else>
 					<Fa :icon="faHome" fixed-width/><span class="text">{{ $store.getters.isSignedIn ? $t('timeline') : $t('home') }}</span>
-				</router-link>
+				</MkA>
 				<template v-for="item in menu">
 					<div v-if="item === '-'" class="divider"></div>
-					<component v-else-if="menuDef[item] && (menuDef[item].show !== false)" :is="menuDef[item].to ? 'router-link' : 'button'" class="item _button" :class="item" active-class="active" v-on="menuDef[item].action ? { click: menuDef[item].action } : {}" :to="menuDef[item].to">
+					<component v-else-if="menuDef[item] && (menuDef[item].show !== false)" :is="menuDef[item].to ? 'MkA' : 'button'" class="item _button" :class="item" active-class="active" v-on="menuDef[item].action ? { click: menuDef[item].action } : {}" :to="menuDef[item].to">
 						<Fa :icon="menuDef[item].icon" fixed-width/><span class="text">{{ $t(menuDef[item].title) }}</span>
 						<i v-if="menuDef[item].indicated"><Fa :icon="faCircle"/></i>
 					</component>
@ -35,9 +35,9 @@
 					<Fa :icon="faEllipsisH" fixed-width/><span class="text">{{ $t('more') }}</span>
 					<i v-if="otherNavItemIndicated"><Fa :icon="faCircle"/></i>
 				</button>
-				<router-link class="item" active-class="active" to="/settings">
+				<MkA class="item" active-class="active" to="/settings">
 					<Fa :icon="faCog" fixed-width/><span class="text">{{ $t('settings') }}</span>
-				</router-link>
+				</MkA>
 			</div>
 		</nav>
 	</transition>
@ -246,7 +246,7 @@ export default defineComponent({
 				icon: faQuestionCircle,
 			}, {
 				type: 'link',
-				text: this.$t('aboutX', { x: instanceName || host }),
+				text: this.$t('aboutX', { x: instanceName }),
 				to: '/about',
 				icon: faInfoCircle,
 			}, {
@ -422,9 +422,9 @@ export default defineComponent({
 			> .item {
 				position: relative;
 				display: block;
-				padding-left: 32px;
+				padding-left: 24px;
 				font-size: $ui-font-size;
-				line-height: 3.2rem;
+				line-height: 3rem;
 				text-overflow: ellipsis;
 				overflow: hidden;
 				white-space: nowrap;
--- a/src/client/components/signin-dialog.vue
+++ b/src/client/components/signin-dialog.vue
@ -7,9 +7,7 @@
 >
 	<template #header>{{ $t('login') }}</template>

-	<div class="_section">
 	<MkSignin :auto-set="autoSet" @login="onLogin"/>
-	</div>
 </XModalWindow>
 </template>

--- a/src/client/components/signin.vue
+++ b/src/client/components/signin.vue
@ -1,5 +1,6 @@
 <template>
 <form class="eppvobhk" :class="{ signing, totpLogin }" @submit.prevent="onSubmit">
+	<div class="auth _section">
 		<div class="avatar" :style="{ backgroundImage: user ? `url('${ user.avatarUrl }')` : null }" v-show="withAvatar"></div>
 		<div class="normal-signin" v-if="!totpLogin">
 			<MkInput v-model:value="username" type="text" pattern="^[a-zA-Z0-9_]+$" spellcheck="false" autofocus required @update:value="onUsernameChange">
@ -12,9 +13,6 @@
 				<template #prefix><Fa :icon="faLock"/></template>
 			</MkInput>
 			<MkButton type="submit" primary :disabled="signing" style="margin: 0 auto;">{{ signing ? $t('loggingIn') : $t('login') }}</MkButton>
-		<a class="_panelButton" style="margin: 8px auto;" v-if="meta && meta.enableTwitterIntegration" :href="`${apiUrl}/signin/twitter`"><Fa :icon="faTwitter" style="margin-right: 4px;"/>{{ $t('signinWith', { x: 'Twitter' }) }}</a>
-		<a class="_panelButton" style="margin: 8px auto;" v-if="meta && meta.enableGithubIntegration"  :href="`${apiUrl}/signin/github`"><Fa :icon="faGithub" style="margin-right: 4px;"/>{{ $t('signinWith', { x: 'GitHub' }) }}</a>
-		<a class="_panelButton" style="margin: 8px auto;" v-if="meta && meta.enableDiscordIntegration" :href="`${apiUrl}/signin/discord`"><Fa :icon="faDiscord" style="margin-right: 4px;"/>{{ $t('signinWith', { x: 'Discord' }) }}</a>
 		</div>
 		<div class="2fa-signin" v-if="totpLogin" :class="{ securityKeys: user && user.securityKeys }">
 			<div v-if="user && user.securityKeys" class="twofa-group tap-group">
@ -39,6 +37,12 @@
 				<MkButton type="submit" :disabled="signing" primary style="margin: 0 auto;">{{ signing ? $t('loggingIn') : $t('login') }}</MkButton>
 			</div>
 		</div>
+	</div>
+	<div class="social _section">
+		<a class="_borderButton _vMargin" v-if="meta && meta.enableTwitterIntegration" :href="`${apiUrl}/signin/twitter`"><Fa :icon="faTwitter" style="margin-right: 4px;"/>{{ $t('signinWith', { x: 'Twitter' }) }}</a>
+		<a class="_borderButton _vMargin" v-if="meta && meta.enableGithubIntegration" :href="`${apiUrl}/signin/github`"><Fa :icon="faGithub" style="margin-right: 4px;"/>{{ $t('signinWith', { x: 'GitHub' }) }}</a>
+		<a class="_borderButton _vMargin" v-if="meta && meta.enableDiscordIntegration" :href="`${apiUrl}/signin/discord`"><Fa :icon="faDiscord" style="margin-right: 4px;"/>{{ $t('signinWith', { x: 'Discord' }) }}</a>
+	</div>
 </form>
 </template>

@ -203,6 +207,7 @@ export default defineComponent({

 <style lang="scss" scoped>
 .eppvobhk {
+	> .auth {
 		> .avatar {
 			margin: 0 auto 0 auto;
 			width: 64px;
@ -212,5 +217,6 @@ export default defineComponent({
 			background-size: cover;
 			border-radius: 100%;
 		}
+	}
 }
 </style>
--- a/src/client/components/sub-note-content.vue
+++ b/src/client/components/sub-note-content.vue
@ -3,9 +3,9 @@
 	<div class="body">
 		<span v-if="note.isHidden" style="opacity: 0.5">({{ $t('private') }})</span>
 		<span v-if="note.deletedAt" style="opacity: 0.5">({{ $t('deleted') }})</span>
-		<router-link class="reply" v-if="note.replyId" :to="`/notes/${note.replyId}`"><Fa :icon="faReply"/></router-link>
+		<MkA class="reply" v-if="note.replyId" :to="`/notes/${note.replyId}`"><Fa :icon="faReply"/></MkA>
 		<Mfm v-if="note.text" :text="note.text" :author="note.user" :i="$store.state.i" :custom-emojis="note.emojis"/>
-		<router-link class="rp" v-if="note.renoteId" :to="`/notes/${note.renoteId}`">RN: ...</router-link>
+		<MkA class="rp" v-if="note.renoteId" :to="`/notes/${note.renoteId}`">RN: ...</MkA>
 	</div>
 	<details v-if="note.files.length > 0">
 		<summary>({{ $t('withNFiles', { n: note.files.length }) }})</summary>
--- a/src/client/components/tab.vue
+++ b/src/client/components/tab.vue
@ -1,6 +1,6 @@
 <template>
 <div class="pxhvhrfw" v-size="{ max: [500] }">
-	<button v-for="item in items" class="_button" @click="$emit('update:value', item.value)" :class="{ active: value === item.value }" :key="item.value"><Fa v-if="item.icon" :icon="item.icon" class="icon"/>{{ item.label }}</button>
+	<button v-for="item in items" class="_button" @click="$emit('update:value', item.value)" :class="{ active: value === item.value }" :disabled="value === item.value" :key="item.value"><Fa v-if="item.icon" :icon="item.icon" class="icon"/>{{ item.label }}</button>
 </div>
 </template>

@ -23,19 +23,26 @@ export default defineComponent({
 <style lang="scss" scoped>
 .pxhvhrfw {
 	display: flex;
-	max-width: var(--baseContentWidth);
-	margin: 0 auto;

 	> button {
 		flex: 1;
 		padding: 15px 12px 12px 12px;
 		border-bottom: solid 3px transparent;

+		&:disabled {
+			opacity: 1 !important;
+			cursor: default;
+		}
+
 		&.active {
 			color: var(--accent);
 			border-bottom-color: var(--accent);
 		}

+		&:not(.active):hover {
+			color: var(--fgHighlighted);
+		}
+
 		> .icon {
 			margin-right: 6px;
 		}
--- a/src/client/components/taskmanager.api-window.vue
+++ b/src/client/components/taskmanager.api-window.vue
@ -0,0 +1,70 @@
+<template>
+<XWindow ref="window"
+	:initial-width="370"
+	:initial-height="450"
+	:can-resize="true"
+	@close="$refs.window.close()"
+	@closed="$emit('closed')"
+>
+	<template #header>Req Viewer</template>
+
+	<div class="rlkneywz">
+		<MkTab v-model:value="tab" :items="[{ label: 'Request', value: 'req', }, { label: 'Response', value: 'res', }]" style="border-bottom: solid 1px var(--divider);"/>
+
+		<code v-if="tab === 'req'">{{ reqStr }}</code>
+		<code v-if="tab === 'res'">{{ resStr }}</code>
+	</div>
+</XWindow>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import * as JSON5 from 'json5';
+import XWindow from '@/components/ui/window.vue';
+import MkTab from '@/components/tab.vue';
+
+export default defineComponent({
+	components: {
+		XWindow,
+		MkTab,
+	},
+
+	props: {
+		req: {
+			required: true,
+		}
+	},
+
+	emits: ['closed'],
+
+	data() {
+		return {
+			tab: 'req',
+			reqStr: JSON5.stringify(this.req.req, null, '\t'),
+			resStr: JSON5.stringify(this.req.res, null, '\t'),
+		}
+	},
+
+	methods: {
+	}
+});
+</script>
+
+<style lang="scss" scoped>
+.rlkneywz {
+	display: flex;
+	flex-direction: column;
+	height: 100%;
+
+	> code {
+		display: block;
+		flex: 1;
+		padding: 8px;
+		overflow: auto;
+		font-size: 0.9em;
+		tab-size: 2;
+		white-space: pre;
+		font-family: Fira code, Fira Mono, Consolas, Menlo, Courier, monospace;
+	}
+}
+</style>
--- a/src/client/components/taskmanager.vue
+++ b/src/client/components/taskmanager.vue
@ -0,0 +1,231 @@
+<template>
+<XWindow ref="window" :initial-width="650" :initial-height="420" :can-resize="true" @closed="$emit('closed')">
+	<template #header>
+		<Fa :icon="faTerminal" style="margin-right: 0.5em;"/>Task Manager
+	</template>
+	<div class="qljqmnzj">
+		<MkTab v-model:value="tab" :items="[{ label: 'Windows', value: 'windows', }, { label: 'Stream', value: 'stream', }, { label: 'Stream (Pool)', value: 'streamPool', }, { label: 'API', value: 'api', }]" style="border-bottom: solid 1px var(--divider);"/>
+
+		<div class="content">
+			<div v-if="tab === 'windows'" class="windows" v-follow>
+				<div class="header">
+					<div>#ID</div>
+					<div>Component</div>
+					<div>Action</div>
+				</div>
+				<div v-for="p in popups">
+					<div>#{{ p.id }}</div>
+					<div>{{ p.component.name ? p.component.name : '<anonymous>' }}</div>
+					<div><button class="_textButton" @click="killPopup(p)">Kill</button></div>
+				</div>
+			</div>
+			<div v-if="tab === 'stream'" class="stream" v-follow>
+				<div class="header">
+					<div>#ID</div>
+					<div>Ch</div>
+					<div>Handle</div>
+					<div>In</div>
+					<div>Out</div>
+				</div>
+				<div v-for="c in connections">
+					<div>#{{ c.id }}</div>
+					<div>{{ c.channel }}</div>
+					<div v-if="c.users !== null">(shared)<span v-if="c.name">{{ ' ' + c.name }}</span></div>
+					<div v-else>{{ c.name ? c.name : '<anonymous>' }}</div>
+					<div>{{ c.in }}</div>
+					<div>{{ c.out }}</div>
+				</div>
+			</div>
+			<div v-if="tab === 'streamPool'" class="streamPool" v-follow>
+				<div class="header">
+					<div>#ID</div>
+					<div>Ch</div>
+					<div>Users</div>
+				</div>
+				<div v-for="p in pools">
+					<div>#{{ p.id }}</div>
+					<div>{{ p.channel }}</div>
+					<div>{{ p.users }}</div>
+				</div>
+			</div>
+			<div v-if="tab === 'api'" class="api" v-follow>
+				<div class="header">
+					<div>#ID</div>
+					<div>Endpoint</div>
+					<div>State</div>
+				</div>
+				<div v-for="req in apiRequests" @click="showReq(req)">
+					<div>#{{ req.id }}</div>
+					<div>{{ req.endpoint }}</div>
+					<div class="state" :class="req.state">{{ req.state }}</div>
+				</div>
+			</div>
+		</div>
+
+		<footer>
+			<div><span class="label">Windows</span>{{ popups.length }}</div>
+			<div><span class="label">Stream</span>{{ connections.length }}</div>
+			<div><span class="label">Stream (Pool)</span>{{ pools.length }}</div>
+		</footer>
+	</div>
+</XWindow>
+</template>
+
+<script lang="ts">
+import { defineComponent, markRaw, onBeforeUnmount, ref, shallowRef } from 'vue';
+import { faTerminal } from '@fortawesome/free-solid-svg-icons';
+import XWindow from '@/components/ui/window.vue';
+import MkTab from '@/components/tab.vue';
+import MkButton from '@/components/ui/button.vue';
+import follow from '@/directives/follow-append';
+import * as os from '@/os';
+
+export default defineComponent({
+	components: {
+		XWindow,
+		MkTab,
+		MkButton,
+	},
+
+	directives: {
+		follow
+	},
+
+	props: {
+	},
+
+	emits: ['closed'],
+
+	setup() {
+		const connections = shallowRef([]);
+		const pools = shallowRef([]);
+		const refreshStreamInfo = () => {
+			console.log(os.stream.sharedConnectionPools, os.stream.sharedConnections, os.stream.nonSharedConnections);
+			const conn = os.stream.sharedConnections.map(c => ({
+				id: c.id, name: c.name, channel: c.channel, users: c.pool.users, in: c.inCount, out: c.outCount,
+			})).concat(os.stream.nonSharedConnections.map(c => ({
+				id: c.id, name: c.name, channel: c.channel, users: null, in: c.inCount, out: c.outCount,
+			})));
+			conn.sort((a, b) => (a.id > b.id) ? 1 : -1);
+			connections.value = conn;
+			pools.value = os.stream.sharedConnectionPools;
+		};
+		const interval = setInterval(refreshStreamInfo, 1000);
+		onBeforeUnmount(() => {
+			clearInterval(interval);
+		});
+
+		const killPopup = p => {
+			os.popups.value = os.popups.value.filter(x => x !== p);
+		};
+
+		const showReq = async req => {
+			os.popup(await import('./taskmanager.api-window.vue'), {
+				req: req
+			}, {
+			}, 'closed');
+		};
+
+		return {
+			tab: ref('stream'),
+			popups: os.popups,
+			apiRequests: os.apiRequests,
+			connections,
+			pools,
+			killPopup,
+			showReq,
+			faTerminal,
+		};
+	},
+});
+</script>
+
+<style lang="scss" scoped>
+.qljqmnzj {
+	display: flex;
+	flex-direction: column;
+	height: 100%;
+	font-family: Fira code, Fira Mono, Consolas, Menlo, Courier, monospace;
+
+	> .content {
+		flex: 1;
+		overflow: auto;
+
+		> div {
+			display: table;
+			width: 100%;
+			padding: 16px;
+			box-sizing: border-box;
+
+			> div {
+				display: table-row;
+
+				&:nth-child(even) {
+					//background: rgba(0, 0, 0, 0.1);
+				}
+
+				&.header {
+					opacity: 0.7;
+				}
+
+				> div {
+					display: table-cell;
+					white-space: nowrap;
+
+					&:not(:last-child) {
+						padding-right: 8px;
+					}
+				}
+			}
+
+			&.api {
+				> div {
+					&:not(.header) {
+						cursor: pointer;
+
+						&:hover {
+							color: var(--accent);
+						}
+					}
+
+					> .state {
+						&.pending {
+							color: var(--warn);
+						}
+
+						&.success {
+							color: var(--success);
+						}
+
+						&.failed {
+							color: var(--error);
+						}
+					}
+				}
+			}
+		}
+	}
+
+	> footer {
+		display: flex;
+		width: 100%;
+		padding: 8px 16px;
+		box-sizing: border-box;
+		border-top: solid 1px var(--divider);
+		font-size: 0.9em;
+
+		> div {
+			flex: 1;
+
+			> .label {
+				opacity: 0.7;
+				margin-right: 0.5em;
+
+				&:after {
+					content: ":";
+				}
+			}
+		}
+	}
+}
+</style>
--- a/src/client/components/time.vue
+++ b/src/client/components/time.vue
@ -1,5 +1,5 @@
 <template>
-<time class="mk-time" :title="absolute">
+<time :title="absolute">
 	<template v-if="mode == 'relative'">{{ relative }}</template>
 	<template v-else-if="mode == 'absolute'">{{ absolute }}</template>
 	<template v-else-if="mode == 'detail'">{{ absolute }} ({{ relative }})</template>
--- a/src/client/components/ui/a.vue
+++ b/src/client/components/ui/a.vue
@ -0,0 +1,115 @@
+<template>
+<a :href="to" :class="active ? activeClass : null" @click.prevent="nav" @contextmenu.prevent.stop="onContextmenu">
+	<slot></slot>
+</a>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import { faExpandAlt, faColumns, faExternalLinkAlt, faLink, faWindowMaximize } from '@fortawesome/free-solid-svg-icons';
+import * as os from '@/os';
+import copyToClipboard from '@/scripts/copy-to-clipboard';
+import { router } from '@/router';
+import { deckmode, url } from '@/config';
+
+export default defineComponent({
+	inject: {
+		navHook: {
+			default: null
+		},
+		sideViewHook: {
+			default: null
+		}
+	},
+
+	props: {
+		to: {
+			type: String,
+			required: true,
+		},
+		activeClass: {
+			type: String,
+			required: false,
+		},
+		behavior: {
+			type: String,
+			required: false,
+		},
+	},
+
+	computed: {
+		active() {
+			if (this.activeClass == null) return false;
+			const resolved = router.resolve(this.to);
+			if (resolved.path == this.$route.path) return true;
+			if (resolved.name == null) return false;
+			if (this.$route.name == null) return false;
+			return resolved.name == this.$route.name;
+		}
+	},
+
+	methods: {
+		onContextmenu(e) {
+			if (window.getSelection().toString() !== '') return;
+			os.contextMenu([{
+				type: 'label',
+				text: this.to,
+			}, {
+				icon: faWindowMaximize,
+				text: this.$t('openInWindow'),
+				action: () => {
+					os.pageWindow(this.to);
+				}
+			}, this.sideViewHook ? {
+				icon: faColumns,
+				text: this.$t('openInSideView'),
+				action: () => {
+					this.sideViewHook(this.to);
+				}
+			} : undefined, {
+				icon: faExpandAlt,
+				text: this.$t('showInPage'),
+				action: () => {
+					this.$router.push(this.to);
+				}
+			}, null, {
+				icon: faExternalLinkAlt,
+				text: this.$t('openInNewTab'),
+				action: () => {
+					window.open(this.to, '_blank');
+				}
+			}, {
+				icon: faLink,
+				text: this.$t('copyLink'),
+				action: () => {
+					copyToClipboard(`${url}${this.to}`);
+				}
+			}], e);
+		},
+
+		nav() {
+			if (this.behavior) {
+				if (this.behavior === 'window') {
+					os.pageWindow(this.to);
+					return;
+				}
+			}
+
+			if (this.navHook) {
+				this.navHook(this.to);
+			} else {
+				if (this.$store.state.device.defaultSideView && this.sideViewHook && this.to !== '/') {
+					this.sideViewHook(this.to);
+					return;
+				}
+				if (this.$store.state.device.deckNavWindow && deckmode && this.to !== '/') {
+					os.pageWindow(this.to);
+					return;
+				}
+
+				this.$router.push(this.to);
+			}
+		}
+	}
+});
+</script>
--- a/src/client/components/ui/context-menu.vue
+++ b/src/client/components/ui/context-menu.vue
@ -1,7 +1,9 @@
 <template>
-<div class="nvlagfpb">
+<transition :name="$store.state.device.animation ? 'fade' : ''" appear>
+	<div class="nvlagfpb" @contextmenu.prevent.stop="() => {}">
 		<MkMenu :items="items" @close="$emit('closed')" class="_popup _shadow" :align="'left'"/>
-</div>
+	</div>
+</transition>
 </template>

 <script lang="ts">
@ -35,8 +37,30 @@ export default defineComponent({
 		},
 	},
 	mounted() {
-		this.$el.style.top = this.ev.pageY + 'px';
-		this.$el.style.left = this.ev.pageX + 'px';
+		let left = this.ev.pageX + 1; // 間違って右ダブルクリックした場合に意図せずアイテムがクリックされるのを防ぐため + 1
+		let top = this.ev.pageY + 1; // 間違って右ダブルクリックした場合に意図せずアイテムがクリックされるのを防ぐため + 1
+
+		const width = this.$el.offsetWidth;
+		const height = this.$el.offsetHeight;
+
+		if (left + width - window.pageXOffset > window.innerWidth) {
+			left = window.innerWidth - width + window.pageXOffset;
+		}
+
+		if (top + height - window.pageYOffset > window.innerHeight) {
+			top = window.innerHeight - height + window.pageYOffset;
+		}
+
+		if (top < 0) {
+			top = 0;
+		}
+
+		if (left < 0) {
+			left = 0;
+		}
+
+		this.$el.style.top = top + 'px';
+		this.$el.style.left = left + 'px';

 		for (const el of Array.from(document.querySelectorAll('body *'))) {
 			el.addEventListener('mousedown', this.onMousedown);
@ -60,4 +84,14 @@ export default defineComponent({
 	position: absolute;
 	z-index: 65535;
 }
+
+.fade-enter-active, .fade-leave-active {
+	transition: opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1), transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
+	transform-origin: left top;
+}
+
+.fade-enter-from, .fade-leave-to {
+	opacity: 0;
+	transform: scale(0.9);
+}
 </style>
--- a/src/client/components/ui/folder.vue
+++ b/src/client/components/ui/folder.vue
@ -132,7 +132,7 @@ export default defineComponent({
 	&.max-width_500px {
 		> header {
 			> .title {
-				padding: 8px 10px;
+				padding: 8px 10px 8px 0;
 			}
 		}
 	}
--- a/src/client/components/ui/menu.vue
+++ b/src/client/components/ui/menu.vue
@ -12,12 +12,12 @@
 		<span v-else-if="item.type === 'pending'" :tabindex="i" class="pending item">
 			<span><MkEllipsis/></span>
 		</span>
-		<router-link v-else-if="item.type === 'link'" :to="item.to" @click.passive="close()" :tabindex="i" class="_button item">
+		<MkA v-else-if="item.type === 'link'" :to="item.to" @click.passive="close()" :tabindex="i" class="_button item">
 			<Fa v-if="item.icon" :icon="item.icon" fixed-width/>
 			<MkAvatar v-if="item.avatar" :user="item.avatar" class="avatar"/>
 			<span>{{ item.text }}</span>
 			<i v-if="item.indicate"><Fa :icon="faCircle"/></i>
-		</router-link>
+		</MkA>
 		<a v-else-if="item.type === 'a'" :href="item.href" :target="item.target" :download="item.download" @click="close()" :tabindex="i" class="_button item">
 			<Fa v-if="item.icon" :icon="item.icon" fixed-width/>
 			<span>{{ item.text }}</span>
--- a/src/client/components/ui/modal.vue
+++ b/src/client/components/ui/modal.vue
@ -175,7 +175,7 @@ export default defineComponent({
 }

 .modal-popup-content-enter-active, .modal-popup-content-leave-active {
-	transition: opacity 0.3s, transform 0.3s !important;
+	transition: opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1), transform 0.5s cubic-bezier(0.16, 1, 0.3, 1) !important;
 }
 .modal-popup-content-enter-from, .modal-popup-content-leave-to {
 	pointer-events: none;
--- a/src/client/components/ui/radio.vue
+++ b/src/client/components/ui/radio.vue
@ -51,7 +51,8 @@ export default defineComponent({
 .novjtctn {
 	position: relative;
 	display: inline-block;
-	margin: 0 32px 0 0;
+	margin: 16px 32px 0 0;
+	text-align: left;
 	cursor: pointer;
 	transition: all 0.3s;

--- a/src/client/components/ui/textarea.vue
+++ b/src/client/components/ui/textarea.vue
@ -2,12 +2,13 @@
 <div class="adhpbeos" :class="{ focused, filled, tall, pre }">
 	<div class="input">
 		<span class="label" ref="label"><slot></slot></span>
-		<textarea ref="input"
+		<textarea ref="input" :class="{ code }"
 			:value="value"
 			:required="required"
 			:readonly="readonly"
 			:pattern="pattern"
 			:autocomplete="autocomplete"
+			:spellcheck="!code"
 			@input="onInput"
 			@focus="focused = true"
 			@blur="focused = false"
@ -20,7 +21,6 @@

 <script lang="ts">
 import { defineComponent } from 'vue';
-import * as os from '@/os';

 export default defineComponent({
 	props: {
@ -43,6 +43,10 @@ export default defineComponent({
 			type: String,
 			required: false
 		},
+		code: {
+			type: Boolean,
+			required: false
+		},
 		tall: {
 			type: Boolean,
 			required: false,
@ -159,6 +163,11 @@ export default defineComponent({
 			outline: none;
 			box-shadow: none;
 			color: var(--fg);
+
+			&.code {
+				tab-size: 2;
+				font-family: Fira code, Fira Mono, Consolas, Menlo, Courier, monospace;
+			}
 		}
 	}

--- a/src/client/components/ui/window.vue
+++ b/src/client/components/ui/window.vue
@ -2,14 +2,16 @@
 <transition :name="$store.state.device.animation ? 'window' : ''" appear @after-leave="$emit('closed')">
 	<div class="ebkgocck" v-if="showing">
 		<div class="body _popup _shadow _narrow_" @mousedown="onBodyMousedown" @keydown="onKeydown">
-			<div class="header">
-				<button class="_button" @click="close()"><Fa :icon="faTimes"/></button>
+			<div class="header" @contextmenu.prevent.stop="onContextmenu">
+				<slot v-if="closeRight" name="buttons"><button class="_button" style="pointer-events: none;"></button></slot>
+				<button v-else class="_button" @click="close()"><Fa :icon="faTimes"/></button>
+
 				<span class="title" @mousedown.prevent="onHeaderMousedown" @touchstart.prevent="onHeaderMousedown">
 					<slot name="header"></slot>
 				</span>
-				<slot name="buttons">
-					<button class="_button" style="pointer-events: none;"></button>
-				</slot>
+
+				<button v-if="closeRight" class="_button" @click="close()"><Fa :icon="faTimes"/></button>
+				<slot v-else name="buttons"><button class="_button" style="pointer-events: none;"></button></slot>
 			</div>
 			<div class="body" v-if="padding">
 				<div class="_section">
@ -85,6 +87,15 @@ export default defineComponent({
 			required: false,
 			default: false,
 		},
+		closeRight: {
+			type: Boolean,
+			required: false,
+			default: false,
+		},
+		contextmenu: {
+			type: Array,
+			required: false,
+		}
 	},

 	emits: ['closed'],
@ -108,6 +119,9 @@ export default defineComponent({
 			z: Number(document.defaultView.getComputedStyle(this.$el, null).zIndex)
 		});

+		// 他のウィンドウ内のボタンなどを押してこのウィンドウが開かれた場合、親が最前面になろうとするのでそれに隠されないようにする
+		this.top();
+
 		window.addEventListener('resize', this.onBrowserResize);
 	},

@ -129,6 +143,12 @@ export default defineComponent({
 			}
 		},

+		onContextmenu(e) {
+			if (this.contextmenu) {
+				os.contextMenu(this.contextmenu, e);
+			}
+		},
+
 		// 最前面へ移動
 		top() {
 			let z = 0;
--- a/src/client/components/url-preview.vue
+++ b/src/client/components/url-preview.vue
@ -8,7 +8,7 @@
 </div>
 <div v-else class="mk-url-preview" v-size="{ max: [400, 350] }">
 	<transition name="zoom" mode="out-in">
-		<component :is="self ? 'router-link' : 'a'" :class="{ compact }" :[attr]="self ? url.substr(local.length) : url" rel="nofollow noopener" :target="target" :title="url" v-if="!fetching">
+		<component :is="self ? 'MkA' : 'a'" :class="{ compact }" :[attr]="self ? url.substr(local.length) : url" rel="nofollow noopener" :target="target" :title="url" v-if="!fetching">
 			<div class="thumbnail" v-if="thumbnail" :style="`background-image: url('${thumbnail}')`">
 				<button class="_button" v-if="!playerEnabled && player.url" @click.prevent="playerEnabled = true" :title="$t('enablePlayer')"><Fa :icon="faPlayCircle"/></button>
 			</div>
--- a/src/client/components/url.vue
+++ b/src/client/components/url.vue
@ -1,5 +1,5 @@
 <template>
-<component :is="self ? 'router-link' : 'a'" class="ieqqeuvs _link" :[attr]="self ? url.substr(local.length) : url" :rel="rel" :target="target"
+<component :is="self ? 'MkA' : 'a'" class="ieqqeuvs _link" :[attr]="self ? url.substr(local.length) : url" :rel="rel" :target="target"
 	@mouseover="onMouseover"
 	@mouseleave="onMouseleave"
 >
--- a/src/client/components/user-info.vue
+++ b/src/client/components/user-info.vue
@ -3,7 +3,7 @@
 	<div class="banner" :style="user.bannerUrl ? `background-image: url(${user.bannerUrl})` : ''"></div>
 	<MkAvatar class="avatar" :user="user" :disable-preview="true"/>
 	<div class="title">
-		<router-link class="name" :to="userPage(user)"><MkUserName :user="user" :nowrap="false"/></router-link>
+		<MkA class="name" :to="userPage(user)"><MkUserName :user="user" :nowrap="false"/></MkA>
 		<p class="username"><MkAcct :user="user"/></p>
 	</div>
 	<div class="description">
@ -96,7 +96,7 @@ export default defineComponent({
 			margin: 0;
 			line-height: 16px;
 			font-size: 0.8em;
-			color: var(--text);
+			color: var(--fg);
 			opacity: 0.7;
 		}
 	}
@ -125,7 +125,7 @@ export default defineComponent({
 			> p {
 				margin: 0;
 				font-size: 0.7em;
-				color: var(--text);
+				color: var(--fg);
 			}

 			> span {
--- a/src/client/components/user-preview.vue
+++ b/src/client/components/user-preview.vue
@ -5,7 +5,7 @@
 			<div class="banner" :style="user.bannerUrl ? `background-image: url(${user.bannerUrl})` : ''"></div>
 			<MkAvatar class="avatar" :user="user" :disable-preview="true"/>
 			<div class="title">
-				<router-link class="name" :to="userPage(user)"><MkUserName :user="user" :nowrap="false"/></router-link>
+				<MkA class="name" :to="userPage(user)"><MkUserName :user="user" :nowrap="false"/></MkA>
 				<p class="username"><MkAcct :user="user"/></p>
 			</div>
 			<div class="description">
@ -151,7 +151,7 @@ export default defineComponent({
 				margin: 0;
 				line-height: 16px;
 				font-size: 0.8em;
-				color: var(--text);
+				color: var(--fg);
 				opacity: 0.7;
 			}
 		}
@ -159,7 +159,7 @@ export default defineComponent({
 		> .description {
 			padding: 0 16px;
 			font-size: 0.8em;
-			color: var(--text);
+			color: var(--fg);
 		}

 		> .status {
@ -172,7 +172,7 @@ export default defineComponent({
 				> p {
 					margin: 0;
 					font-size: 0.7em;
-					color: var(--text);
+					color: var(--fg);
 				}

 				> span {
--- a/src/client/components/users-dialog.vue
+++ b/src/client/components/users-dialog.vue
@ -6,13 +6,13 @@
 	</div>

 	<div class="users">
-		<router-link v-for="item in items" class="user" :key="item.id" :to="userPage(extract ? extract(item) : item)">
+		<MkA v-for="item in items" class="user" :key="item.id" :to="userPage(extract ? extract(item) : item)">
 			<MkAvatar :user="extract ? extract(item) : item" class="avatar" :disable-link="true"/>
 			<div class="body">
 				<MkUserName :user="extract ? extract(item) : item" class="name"/>
 				<MkAcct :user="extract ? extract(item) : item" class="acct"/>
 			</div>
-		</router-link>
+		</MkA>
 	</div>
 	<button class="more _button" v-appear="$store.state.device.enableInfiniteScroll ? fetchMore : null" @click="fetchMore" v-show="more" :disabled="moreFetching">
 		<template v-if="!moreFetching">{{ $t('loadMore') }}</template>
--- a/src/client/config.ts
+++ b/src/client/config.ts
@ -12,5 +12,6 @@ export const lang = localStorage.getItem('lang');
 export const langs = _LANGS_;
 export const getLocale = async () => Object.fromEntries((await entries(clientDb.i18n)) as [string, string][]);
 export const version = _VERSION_;
-export const instanceName = siteName === 'Misskey' ? null : siteName;
+export const instanceName = siteName === 'Misskey' ? host : siteName;
 export const deckmode = localStorage.getItem('deckmode') === 'true';
+export const debug = localStorage.getItem('debug') === 'true';
--- a/src/client/directives/follow-append.ts
+++ b/src/client/directives/follow-append.ts
@ -0,0 +1,25 @@
+import { Directive } from 'vue';
+import { getScrollContainer, getScrollPosition } from '@/scripts/scroll';
+
+export default {
+	mounted(src, binding, vn) {
+		const ro = new ResizeObserver((entries, observer) => {
+			const pos = getScrollPosition(src);
+			const container = getScrollContainer(src);
+			const viewHeight = container.clientHeight;
+			const height = container.scrollHeight;
+			if (pos + viewHeight > height - 32) {
+				container.scrollTop = height;
+			}
+		});
+
+		ro.observe(src);
+
+		// TODO: 新たにプロパティを作るのをやめMapを使う
+		src._ro_ = ro;
+	},
+
+	unmounted(src, binding, vn) {
+		src._ro_.unobserve(src);
+	}
+} as Directive;
--- a/src/client/init.ts
+++ b/src/client/init.ts
@ -4,14 +4,13 @@

 import '@/style.scss';

-import { createApp } from 'vue';
+import { createApp, defineAsyncComponent } from 'vue';
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';

-import Root from './root.vue';
 import widgets from './widgets';
 import directives from './directives';
 import components from '@/components';
-import { version, apiUrl } from '@/config';
+import { version, apiUrl, deckmode } from '@/config';
 import { store } from './store';
 import { router } from './router';
 import { applyTheme } from '@/scripts/theme';
@ -152,7 +151,12 @@ store.dispatch('instance/fetch').then(() => {

 stream.init(store.state.i);

-const app = createApp(Root);
+const app = createApp(await (
+	window.location.search === '?zen' ? import('@/ui/zen.vue') :
+	!store.getters.isSignedIn         ? import('@/ui/visitor.vue') :
+	deckmode                          ? import('@/ui/deck.vue') :
+	import('@/ui/default.vue')
+).then(x => x.default));

 if (_DEV_) {
 	app.config.performance = true;
@ -248,7 +252,7 @@ if (store.getters.isSignedIn) {
 		}
 	}

-	const main = stream.useSharedConnection('main');
+	const main = stream.useSharedConnection('main', 'System');

 	// 自分の情報が更新されたとき
 	main.on('meUpdated', i => {
--- a/src/client/os.ts
+++ b/src/client/os.ts
@ -2,38 +2,41 @@ import { Component, defineAsyncComponent, markRaw, reactive, Ref, ref } from 'vu
 import { EventEmitter } from 'eventemitter3';
 import Stream from '@/scripts/stream';
 import { store } from '@/store';
-import { apiUrl } from '@/config';
+import { apiUrl, debug } from '@/config';
 import MkPostFormDialog from '@/components/post-form-dialog.vue';
 import MkWaitingDialog from '@/components/waiting-dialog.vue';
+import { resolve } from '@/router';

 const ua = navigator.userAgent.toLowerCase();
 export const isMobile = /mobile|iphone|ipad|android/.test(ua);

-export const stream = new Stream();
+export const stream = markRaw(new Stream());

 export const pendingApiRequestsCount = ref(0);
+let apiRequestsCount = 0; // for debug
+export const apiRequests = ref([]); // for debug

 export const windows = new Map();

 export function api(endpoint: string, data: Record<string, any> = {}, token?: string | null | undefined) {
 	pendingApiRequestsCount.value++;

-	if (_DEV_) {
-		performance.mark(_PERF_PREFIX_ + 'api:begin');
-	}
-
 	const onFinally = () => {
 		pendingApiRequestsCount.value--;
-
-		if (_DEV_) {
-			performance.mark(_PERF_PREFIX_ + 'api:end');
-
-			performance.measure(_PERF_PREFIX_ + 'api',
-				_PERF_PREFIX_ + 'api:begin',
-				_PERF_PREFIX_ + 'api:end');
-		}
 	};

+	const log = debug ? reactive({
+		id: ++apiRequestsCount,
+		endpoint,
+		req: markRaw(data),
+		res: null,
+		state: 'pending',
+	}) : null;
+	if (debug) {
+		apiRequests.value.push(log);
+		if (apiRequests.value.length > 128) apiRequests.value.shift();
+	}
+
 	const promise = new Promise((resolve, reject) => {
 		// Append a credential
 		if (store.getters.isSignedIn) (data as any).i = store.state.i.token;
@ -50,10 +53,21 @@ export function api(endpoint: string, data: Record<string, any> = {}, token?: st

 			if (res.status === 200) {
 				resolve(body);
+				if (debug) {
+					log.res = markRaw(body);
+					log.state = 'success';
+				}
 			} else if (res.status === 204) {
 				resolve();
+				if (debug) {
+					log.state = 'success';
+				}
 			} else {
 				reject(body.error);
+				if (debug) {
+					log.res = markRaw(body.error);
+					log.state = 'failed';
+				}
 			}
 		}).catch(reject);
 	});
@ -74,7 +88,7 @@ export function apiWithDialog(
 	promiseDialog(promise, onSuccess, onFailure ? onFailure : (e) => {
 		dialog({
 			type: 'error',
-			text: e.message + '<br>' + (e as any).id,
+			text: e.message + '\n' + (e as any).id,
 		});
 	});

@ -126,6 +140,7 @@ function isModule(x: any): x is typeof import('*.vue') {
 	return x.default != null;
 }

+let popupIdCount = 0;
 export const popups = ref([]) as Ref<{
 	id: any;
 	component: any;
@ -136,7 +151,7 @@ export function popup(component: Component | typeof import('*.vue'), props: Reco
 	if (isModule(component)) component = component.default;
 	markRaw(component);

-	const id = Math.random().toString(); // TODO: uuidとか使う
+	const id = ++popupIdCount;
 	const dispose = () => {
 		if (_DEV_) console.log('os:popup close', id, component, props, events);
 		// このsetTimeoutが無いと挙動がおかしくなる(autocompleteが閉じなくなる)。Vueのバグ？
@ -162,7 +177,8 @@ export function popup(component: Component | typeof import('*.vue'), props: Reco
 	};
 }

-export function pageWindow(url: string, component: Component | typeof import('*.vue'), props: Record<string, any>) {
+export function pageWindow(url: string) {
+	const { component, props } = resolve(url);
 	popup(defineAsyncComponent(() => import('@/components/page-window.vue')), {
 		initialUrl: url,
 		initialComponent: markRaw(component),
--- a/src/client/pages/api-console.vue
+++ b/src/client/pages/api-console.vue
@ -0,0 +1,96 @@
+<template>
+<div>
+<section class="_section">
+	<MkInput v-model:value="endpoint" :datalist="endpoints" @update:value="onEndpointChange()">
+		<span>Endpoint</span>
+	</MkInput>
+	<MkTextarea v-model:value="body" code>
+		<span>Params (JSON or JSON5)</span>
+	</MkTextarea>
+	<MkSwitch v-model:value="withCredential">
+		With credential
+	</MkSwitch>
+	<MkButton primary full @click="send" :disabled="sending">
+		<template v-if="sending"><MkEllipsis/></template>
+		<template v-else><Fa :icon="faPaperPlane"/> Send</template>
+	</MkButton>
+</section>
+<section class="_section" v-if="res">
+	<MkTextarea v-model:value="res" code readonly tall>
+		<span>Response</span>
+	</MkTextarea>
+</section>
+</div>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import { faTerminal, faPaperPlane } from '@fortawesome/free-solid-svg-icons';
+import * as JSON5 from 'json5';
+import MkButton from '@/components/ui/button.vue';
+import MkInput from '@/components/ui/input.vue';
+import MkTextarea from '@/components/ui/textarea.vue';
+import MkSwitch from '@/components/ui/switch.vue';
+import * as os from '@/os';
+
+export default defineComponent({
+	components: {
+		MkButton, MkInput, MkTextarea, MkSwitch,
+	},
+
+	data() {
+		return {
+			INFO: {
+				header: [{
+					title: 'API console',
+					icon: faTerminal
+				}]
+			},
+
+			endpoint: '',
+			body: '{}',
+			res: null,
+			sending: false,
+			endpoints: [],
+			withCredential: true,
+
+			faPaperPlane
+		};
+	},
+
+	created() {
+		os.api('endpoints').then(endpoints => {
+			this.endpoints = endpoints;
+		});
+	},
+
+	methods: {
+		send() {
+			this.sending = true;
+			os.api(this.endpoint, JSON5.parse(this.body)).then(res => {
+				this.sending = false;
+				this.res = JSON5.stringify(res, null, 2);
+			}, err => {
+				this.sending = false;
+				this.res = JSON5.stringify(err, null, 2);
+			});
+		},
+
+		onEndpointChange() {
+			os.api('endpoint', { endpoint: this.endpoint }, this.withCredential ? undefined : null).then(endpoint => {
+				const body = {};
+				for (const p of endpoint.params) {
+					body[p.name] =
+						p.type === 'String' ? '' :
+						p.type === 'Number' ? 0 :
+						p.type === 'Boolean' ? false :
+						p.type === 'Array' ? [] :
+						p.type === 'Object' ? {} :
+						null;
+				}
+				this.body = JSON5.stringify(body, null, 2);
+			});
+		}
+	}
+});
+</script>
--- a/src/client/pages/docs.vue
+++ b/src/client/pages/docs.vue
@ -4,7 +4,7 @@
 		<div class="_content">
 			<ul>
 				<li v-for="doc in docs" :key="doc.path">
-					<router-link :to="`/docs/${doc.path}`">{{ doc.title }}</router-link>
+					<MkA :to="`/docs/${doc.path}`">{{ doc.title }}</MkA>
 				</li>
 			</ul>
 		</div>
--- a/src/client/pages/explore.vue
+++ b/src/client/pages/explore.vue
@ -38,8 +38,8 @@
 			<template #header><Fa :icon="faHashtag" fixed-width style="margin-right: 0.5em;"/>{{ $t('popularTags') }}</template>

 			<div class="vxjfqztj">
-				<router-link v-for="tag in tagsLocal" :to="`/explore/tags/${tag.tag}`" :key="'local:' + tag.tag" class="local">{{ tag.tag }}</router-link>
-				<router-link v-for="tag in tagsRemote" :to="`/explore/tags/${tag.tag}`" :key="'remote:' + tag.tag">{{ tag.tag }}</router-link>
+				<MkA v-for="tag in tagsLocal" :to="`/explore/tags/${tag.tag}`" :key="'local:' + tag.tag" class="local">{{ tag.tag }}</MkA>
+				<MkA v-for="tag in tagsRemote" :to="`/explore/tags/${tag.tag}`" :key="'remote:' + tag.tag">{{ tag.tag }}</MkA>
 			</div>
 		</MkFolder>

--- a/src/client/pages/follow-requests.vue
+++ b/src/client/pages/follow-requests.vue
@ -12,7 +12,7 @@
 				<MkAvatar class="avatar" :user="req.follower"/>
 				<div class="body">
 					<div class="name">
-						<router-link class="name" :to="userPage(req.follower)" v-user-preview="req.follower.id"><MkUserName :user="req.follower"/></router-link>
+						<MkA class="name" :to="userPage(req.follower)" v-user-preview="req.follower.id"><MkUserName :user="req.follower"/></MkA>
 						<p class="acct">@{{ acct(req.follower) }}</p>
 					</div>
 					<div class="description" v-if="req.follower.description" :title="req.follower.description">
--- a/src/client/pages/instance/files.vue
+++ b/src/client/pages/instance/files.vue
@ -42,7 +42,8 @@
 							<small style="opacity: 0.7;">{{ file.name }}</small>
 						</div>
 						<div>
-							<MkAcct :user="file.user"/>
+							<MkAcct v-if="file.user" :user="file.user"/>
+							<div v-else>{{ $t('system') }}</div>
 						</div>
 						<div>
 							<span style="margin-right: 1em;">{{ file.type }}</span>
--- a/src/client/pages/messaging/index.vue
+++ b/src/client/pages/messaging/index.vue
@ -4,30 +4,29 @@
 		<MkButton @click="start" primary class="start"><Fa :icon="faPlus"/> {{ $t('startMessaging') }}</MkButton>

 		<div class="history" v-if="messages.length > 0">
-			<router-link v-for="(message, i) in messages"
+			<MkA v-for="(message, i) in messages"
 				class="message _panel"
 				:class="{ isMe: isMe(message), isRead: message.groupId ? message.reads.includes($store.state.i.id) : message.isRead }"
 				:to="message.groupId ? `/my/messaging/group/${message.groupId}` : `/my/messaging/${getAcct(isMe(message) ? message.recipient : message.user)}`"
 				:data-index="i"
 				:key="message.id"
-				@click.prevent="go(message)"
 			>
 				<div>
 					<MkAvatar class="avatar" :user="message.groupId ? message.user : isMe(message) ? message.recipient : message.user"/>
 					<header v-if="message.groupId">
 						<span class="name">{{ message.group.name }}</span>
-						<MkTime :time="message.createdAt"/>
+						<MkTime :time="message.createdAt" class="time"/>
 					</header>
 					<header v-else>
 						<span class="name"><MkUserName :user="isMe(message) ? message.recipient : message.user"/></span>
 						<span class="username">@{{ acct(isMe(message) ? message.recipient : message.user) }}</span>
-						<MkTime :time="message.createdAt"/>
+						<MkTime :time="message.createdAt" class="time"/>
 					</header>
 					<div class="body">
 						<p class="text"><span class="me" v-if="isMe(message)">{{ $t('you') }}:</span>{{ message.text }}</p>
 					</div>
 				</div>
-			</router-link>
+			</MkA>
 		</div>
 		<div class="_fullinfo" v-if="!fetching && messages.length == 0">
 			<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
@ -51,8 +50,6 @@ export default defineComponent({
 		MkButton
 	},

-	inject: ['navHook'],
-
 	data() {
 		return {
 			INFO: {
@ -90,18 +87,6 @@ export default defineComponent({
 	},

 	methods: {
-		go(message) {
-			const url = message.groupId ? `/my/messaging/group/${message.groupId}` : `/my/messaging/${getAcct(this.isMe(message) ? message.recipient : message.user)}`;
-			if (this.navHook) {
-				this.navHook(url, defineAsyncComponent(() => import('@/pages/messaging/messaging-room.vue')), {
-					userAcct: message.groupId ? null : getAcct(this.isMe(message) ? message.recipient : message.user),
-					groupId: message.groupId
-				});
-			} else {
-				this.$router.push(url);
-			}
-		},
-
 		getAcct,

 		isMe(message) {
@ -258,7 +243,7 @@ export default defineComponent({
 						margin: 0 8px;
 					}

-					> .mk-time {
+					> .time {
 						margin: 0 0 0 auto;
 					}
 				}
--- a/src/client/pages/messaging/messaging-room.vue
+++ b/src/client/pages/messaging/messaging-room.vue
@ -317,7 +317,7 @@ const Component = defineComponent({
 				text: this.$t('openInWindow'),
 				icon: faWindowMaximize,
 				action: () => {
-					os.pageWindow(url, Component, this.$props);
+					os.pageWindow(url);
 					this.$router.back();
 				},
 			}, this.inWindow ? undefined : {
--- a/src/client/pages/my-groups/index.vue
+++ b/src/client/pages/my-groups/index.vue
@ -10,7 +10,7 @@

 			<MkPagination :pagination="ownedPagination" #default="{items}" ref="owned">
 				<div class="_card" v-for="group in items" :key="group.id">
-					<div class="_title"><router-link :to="`/my/groups/${ group.id }`" class="_link">{{ group.name }}</router-link></div>
+					<div class="_title"><MkA :to="`/my/groups/${ group.id }`" class="_link">{{ group.name }}</MkA></div>
 					<div class="_content"><MkAvatars :user-ids="group.userIds"/></div>
 				</div>
 			</MkPagination>
--- a/src/client/pages/my-lists/index.vue
+++ b/src/client/pages/my-lists/index.vue
@ -4,7 +4,7 @@

 	<MkPagination :pagination="pagination" #default="{items}" class="lists _content" ref="list">
 		<div class="list _panel" v-for="(list, i) in items" :key="list.id">
-			<router-link :to="`/my/lists/${ list.id }`">{{ list.name }}</router-link>
+			<MkA :to="`/my/lists/${ list.id }`">{{ list.name }}</MkA>
 		</div>
 	</MkPagination>
 </div>
--- a/src/client/pages/note.vue
+++ b/src/client/pages/note.vue
@ -42,6 +42,12 @@ export default defineComponent({
 		MkRemoteCaution,
 		MkButton,
 	},
+	props: {
+		noteId: {
+			type: String,
+			required: true
+		}
+	},
 	data() {
 		return {
 			INFO: computed(() => this.note ? {
@ -77,7 +83,7 @@ export default defineComponent({
 		};
 	},
 	watch: {
-		$route: 'fetch'
+		noteId: 'fetch'
 	},
 	created() {
 		this.fetch();
@ -86,7 +92,7 @@ export default defineComponent({
 		fetch() {
 			Progress.start();
 			os.api('notes/show', {
-				noteId: this.$route.params.note
+				noteId: this.noteId
 			}).then(note => {
 				Promise.all([
 					os.api('users/notes', {
--- a/src/client/pages/page-editor/page-editor.vue
+++ b/src/client/pages/page-editor/page-editor.vue
@ -12,7 +12,7 @@
 			</header>

 			<section>
-				<router-link class="view" v-if="pageId" :to="`/@${ author.username }/pages/${ currentName }`"><Fa :icon="faExternalLinkSquareAlt"/> {{ $t('_pages.viewPage') }}</router-link>
+				<MkA class="view" v-if="pageId" :to="`/@${ author.username }/pages/${ currentName }`"><Fa :icon="faExternalLinkSquareAlt"/> {{ $t('_pages.viewPage') }}</MkA>

 				<MkInput v-model:value="title">
 					<span>{{ $t('_pages.title') }}</span>
--- a/src/client/pages/page.vue
+++ b/src/client/pages/page.vue
@ -20,9 +20,9 @@
 	</div>
 	<div class="_section links">
 		<div class="_content">
-			<router-link :to="`./${page.name}/view-source`" class="link">{{ $t('_pages.viewSource') }}</router-link>
+			<MkA :to="`./${page.name}/view-source`" class="link">{{ $t('_pages.viewSource') }}</MkA>
 			<template v-if="$store.getters.isSignedIn && $store.state.i.id === page.userId">
-				<router-link :to="`/my/pages/edit/${page.id}`" class="link">{{ $t('_pages.editThisPage') }}</router-link>
+				<MkA :to="`/my/pages/edit/${page.id}`" class="link">{{ $t('_pages.editThisPage') }}</MkA>
 				<button v-if="$store.state.i.pinnedPageId === page.id" @click="pin(false)" class="link _textButton">{{ $t('unpin') }}</button>
 				<button v-else @click="pin(true)" class="link _textButton">{{ $t('pin') }}</button>
 			</template>
--- a/src/client/pages/reversi/game.board.vue
+++ b/src/client/pages/reversi/game.board.vue
@ -0,0 +1,472 @@
+<template>
+<div class="xqnhankfuuilcwvhgsopeqncafzsquya">
+	<header><b><MkA :to="userPage(blackUser)"><MkUserName :user="blackUser"/></MkA></b>({{ $t('_reversi.black') }}) vs <b><MkA :to="userPage(whiteUser)"><MkUserName :user="whiteUser"/></MkA></b>({{ $t('_reversi.white') }})</header>
+
+	<div style="overflow: hidden; line-height: 28px;">
+		<p class="turn" v-if="!iAmPlayer && !game.isEnded">
+			<Mfm :key="'turn:' + turnUser().name" :text="$t('_reversi.turnOf', { name: turnUser().name })" :plain="true" :custom-emojis="turnUser().emojis"/>
+			<MkEllipsis/>
+		</p>
+		<p class="turn" v-if="logPos != logs.length">
+			<Mfm :key="'past-turn-of:' + turnUser().name" :text="$t('_reversi.pastTurnOf', { name: turnUser().name })" :plain="true" :custom-emojis="turnUser().emojis"/>
+		</p>
+		<p class="turn1" v-if="iAmPlayer && !game.isEnded && !isMyTurn()">{{ $t('_reversi.opponentTurn') }}<MkEllipsis/></p>
+		<p class="turn2" v-if="iAmPlayer && !game.isEnded && isMyTurn()" style="animation: anime-tada 1s linear infinite both;">{{ $t('_reversi.myTurn') }}</p>
+		<p class="result" v-if="game.isEnded && logPos == logs.length">
+			<template v-if="game.winner">
+				<Mfm :key="'won'" :text="$t('_reversi.won', { name: game.winner.name })" :plain="true" :custom-emojis="game.winner.emojis"/>
+				<span v-if="game.surrendered != null"> ({{ $t('_reversi.surrendered') }})</span>
+			</template>
+			<template v-else>{{ $t('_reversi.drawn') }}</template>
+		</p>
+	</div>
+
+	<div class="board">
+		<div class="labels-x" v-if="$store.state.settings.gamesReversiShowBoardLabels">
+			<span v-for="i in game.map[0].length">{{ String.fromCharCode(64 + i) }}</span>
+		</div>
+		<div class="flex">
+			<div class="labels-y" v-if="$store.state.settings.gamesReversiShowBoardLabels">
+				<div v-for="i in game.map.length">{{ i }}</div>
+			</div>
+			<div class="cells" :style="cellsStyle">
+				<div v-for="(stone, i) in o.board"
+					:class="{ empty: stone == null, none: o.map[i] == 'null', isEnded: game.isEnded, myTurn: !game.isEnded && isMyTurn(), can: turnUser() ? o.canPut(turnUser().id == blackUser.id, i) : null, prev: o.prevPos == i }"
+					@click="set(i)"
+					:title="`${String.fromCharCode(65 + o.transformPosToXy(i)[0])}${o.transformPosToXy(i)[1] + 1}`"
+				>
+					<template v-if="$store.state.settings.gamesReversiUseAvatarStones || true">
+						<img v-if="stone === true" :src="blackUser.avatarUrl" alt="black">
+						<img v-if="stone === false" :src="whiteUser.avatarUrl" alt="white">
+					</template>
+					<template v-else>
+						<fa v-if="stone === true" :icon="fasCircle"/>
+						<fa v-if="stone === false" :icon="farCircle"/>
+					</template>
+				</div>
+			</div>
+			<div class="labels-y" v-if="$store.state.settings.gamesReversiShowBoardLabels">
+				<div v-for="i in game.map.length">{{ i }}</div>
+			</div>
+		</div>
+		<div class="labels-x" v-if="$store.state.settings.gamesReversiShowBoardLabels">
+			<span v-for="i in game.map[0].length">{{ String.fromCharCode(64 + i) }}</span>
+		</div>
+	</div>
+
+	<p class="status"><b>{{ $t('_reversi.turnCount', { count: logPos }) }}</b> {{ $t('_reversi.black') }}:{{ o.blackCount }} {{ $t('_reversi.white') }}:{{ o.whiteCount }} {{ $t('_reversi.total') }}:{{ o.blackCount + o.whiteCount }}</p>
+
+	<div class="actions" v-if="!game.isEnded && iAmPlayer">
+		<MkButton @click="surrender">{{ $t('_reversi.surrender') }}</MkButton>
+	</div>
+
+	<div class="player" v-if="game.isEnded">
+		<span>{{ logPos }} / {{ logs.length }}</span>
+		<!-- TODO <ui-horizon-group> -->
+			<MkButton @click="logPos = 0" :disabled="logPos == 0"><fa :icon="faAngleDoubleLeft"/></MkButton>
+			<MkButton @click="logPos--" :disabled="logPos == 0"><fa :icon="faAngleLeft"/></MkButton>
+			<MkButton @click="logPos++" :disabled="logPos == logs.length"><fa :icon="faAngleRight"/></MkButton>
+			<MkButton @click="logPos = logs.length" :disabled="logPos == logs.length"><fa :icon="faAngleDoubleRight"/></MkButton>
+		<!-- TODO </ui-horizon-group> -->
+	</div>
+
+	<div class="info">
+		<p v-if="game.isLlotheo">{{ $t('_reversi.isLlotheo') }}</p>
+		<p v-if="game.loopedBoard">{{ $t('_reversi.loopedMap') }}</p>
+		<p v-if="game.canPutEverywhere">{{ $t('_reversi.canPutEverywhere') }}</p>
+	</div>
+</div>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import { faAngleDoubleLeft, faAngleLeft, faAngleRight, faAngleDoubleRight } from '@fortawesome/free-solid-svg-icons';
+import { faCircle as fasCircle } from '@fortawesome/free-solid-svg-icons';
+import { faCircle as farCircle } from '@fortawesome/free-regular-svg-icons';
+import * as CRC32 from 'crc-32';
+import Reversi, { Color } from '../../../games/reversi/core';
+import { url } from '@/config';
+import MkButton from '@/components/ui/button.vue';
+import { userPage } from '@/filters/user';
+import * as os from '@/os';
+
+export default defineComponent({
+	components: {
+		MkButton
+	},
+
+	props: {
+		initGame: {
+			type: Object,
+			require: true
+		},
+		connection: {
+			type: Object,
+			require: true
+		},
+	},
+
+	data() {
+		return {
+			game: JSON.parse(JSON.stringify(this.initGame)),
+			o: null as Reversi,
+			logs: [],
+			logPos: 0,
+			pollingClock: null,
+			faAngleDoubleLeft, faAngleLeft, faAngleRight, faAngleDoubleRight, fasCircle, farCircle
+		};
+	},
+
+	computed: {
+		iAmPlayer(): boolean {
+			if (!this.$store.getters.isSignedIn) return false;
+			return this.game.user1Id == this.$store.state.i.id || this.game.user2Id == this.$store.state.i.id;
+		},
+
+		myColor(): Color {
+			if (!this.iAmPlayer) return null;
+			if (this.game.user1Id == this.$store.state.i.id && this.game.black == 1) return true;
+			if (this.game.user2Id == this.$store.state.i.id && this.game.black == 2) return true;
+			return false;
+		},
+
+		opColor(): Color {
+			if (!this.iAmPlayer) return null;
+			return this.myColor === true ? false : true;
+		},
+
+		blackUser(): any {
+			return this.game.black == 1 ? this.game.user1 : this.game.user2;
+		},
+
+		whiteUser(): any {
+			return this.game.black == 1 ? this.game.user2 : this.game.user1;
+		},
+
+		cellsStyle(): any {
+			return {
+				'grid-template-rows': `repeat(${this.game.map.length}, 1fr)`,
+				'grid-template-columns': `repeat(${this.game.map[0].length}, 1fr)`
+			};
+		}
+	},
+
+	watch: {
+		logPos(v) {
+			if (!this.game.isEnded) return;
+			const o = new Reversi(this.game.map, {
+				isLlotheo: this.game.isLlotheo,
+				canPutEverywhere: this.game.canPutEverywhere,
+				loopedBoard: this.game.loopedBoard
+			});
+			for (const log of this.logs.slice(0, v)) {
+				o.put(log.color, log.pos);
+			}
+			this.o = o;
+			//this.$forceUpdate();
+		}
+	},
+
+	created() {
+		this.o = new Reversi(this.game.map, {
+			isLlotheo: this.game.isLlotheo,
+			canPutEverywhere: this.game.canPutEverywhere,
+			loopedBoard: this.game.loopedBoard
+		});
+
+		for (const log of this.game.logs) {
+			this.o.put(log.color, log.pos);
+		}
+
+		this.logs = this.game.logs;
+		this.logPos = this.logs.length;
+
+		// 通信を取りこぼしてもいいように定期的にポーリングさせる
+		if (this.game.isStarted && !this.game.isEnded) {
+			this.pollingClock = setInterval(() => {
+				if (this.game.isEnded) return;
+				const crc32 = CRC32.str(this.logs.map(x => x.pos.toString()).join(''));
+				this.connection.send('check', {
+					crc32: crc32
+				});
+			}, 3000);
+		}
+	},
+
+	mounted() {
+		this.connection.on('set', this.onSet);
+		this.connection.on('rescue', this.onRescue);
+		this.connection.on('ended', this.onEnded);
+	},
+
+	beforeUnmount() {
+		this.connection.off('set', this.onSet);
+		this.connection.off('rescue', this.onRescue);
+		this.connection.off('ended', this.onEnded);
+
+		clearInterval(this.pollingClock);
+	},
+
+	methods: {
+		userPage,
+
+		// this.o がリアクティブになった折にはcomputedにできる
+		turnUser(): any {
+			if (this.o.turn === true) {
+				return this.game.black == 1 ? this.game.user1 : this.game.user2;
+			} else if (this.o.turn === false) {
+				return this.game.black == 1 ? this.game.user2 : this.game.user1;
+			} else {
+				return null;
+			}
+		},
+
+		// this.o がリアクティブになった折にはcomputedにできる
+		isMyTurn(): boolean {
+			if (!this.iAmPlayer) return false;
+			if (this.turnUser() == null) return false;
+			return this.turnUser().id == this.$store.state.i.id;
+		},
+
+		set(pos) {
+			if (this.game.isEnded) return;
+			if (!this.iAmPlayer) return;
+			if (!this.isMyTurn()) return;
+			if (!this.o.canPut(this.myColor, pos)) return;
+
+			this.o.put(this.myColor, pos);
+
+			// サウンドを再生する
+			if (this.$store.state.device.enableSounds) {
+				const sound = new Audio(`${url}/assets/reversi-put-me.mp3`);
+				sound.volume = this.$store.state.device.soundVolume;
+				sound.play();
+			}
+
+			this.connection.send('set', {
+				pos: pos
+			});
+
+			this.checkEnd();
+
+			this.$forceUpdate();
+		},
+
+		onSet(x) {
+			this.logs.push(x);
+			this.logPos++;
+			this.o.put(x.color, x.pos);
+			this.checkEnd();
+			this.$forceUpdate();
+
+			// サウンドを再生する
+			if (this.$store.state.device.enableSounds && x.color != this.myColor) {
+				const sound = new Audio(`${url}/assets/reversi-put-you.mp3`);
+				sound.volume = this.$store.state.device.soundVolume;
+				sound.play();
+			}
+		},
+
+		onEnded(x) {
+			this.game = JSON.parse(JSON.stringify(x.game));
+		},
+
+		checkEnd() {
+			this.game.isEnded = this.o.isEnded;
+			if (this.game.isEnded) {
+				if (this.o.winner === true) {
+					this.game.winnerId = this.game.black == 1 ? this.game.user1Id : this.game.user2Id;
+					this.game.winner = this.game.black == 1 ? this.game.user1 : this.game.user2;
+				} else if (this.o.winner === false) {
+					this.game.winnerId = this.game.black == 1 ? this.game.user2Id : this.game.user1Id;
+					this.game.winner = this.game.black == 1 ? this.game.user2 : this.game.user1;
+				} else {
+					this.game.winnerId = null;
+					this.game.winner = null;
+				}
+			}
+		},
+
+		// 正しいゲーム情報が送られてきたとき
+		onRescue(game) {
+			this.game = JSON.parse(JSON.stringify(game));
+
+			this.o = new Reversi(this.game.map, {
+				isLlotheo: this.game.isLlotheo,
+				canPutEverywhere: this.game.canPutEverywhere,
+				loopedBoard: this.game.loopedBoard
+			});
+
+			for (const log of this.game.logs) {
+				this.o.put(log.color, log.pos, true);
+			}
+
+			this.logs = this.game.logs;
+			this.logPos = this.logs.length;
+
+			this.checkEnd();
+			this.$forceUpdate();
+		},
+
+		surrender() {
+			os.api('games/reversi/games/surrender', {
+				gameId: this.game.id
+			});
+		},
+	}
+});
+</script>
+
+<style lang="scss" scoped>
+.xqnhankfuuilcwvhgsopeqncafzsquya {
+	text-align: center;
+
+	> .go-index {
+		position: absolute;
+		top: 0;
+		left: 0;
+		z-index: 1;
+		width: 42px;
+		height :42px;
+	}
+
+	> header {
+		padding: 8px;
+		border-bottom: dashed 1px var(--divider);
+	}
+
+	> .board {
+		width: calc(100% - 16px);
+		max-width: 500px;
+		margin: 0 auto;
+
+		$label-size: 16px;
+		$gap: 4px;
+
+		> .labels-x {
+			height: $label-size;
+			padding: 0 $label-size;
+			display: flex;
+
+			> * {
+				flex: 1;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				font-size: 0.8em;
+
+				&:first-child {
+					margin-left: -($gap / 2);
+				}
+
+				&:last-child {
+					margin-right: -($gap / 2);
+				}
+			}
+		}
+
+		> .flex {
+			display: flex;
+
+			> .labels-y {
+				width: $label-size;
+				display: flex;
+				flex-direction: column;
+
+				> * {
+					flex: 1;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					font-size: 12px;
+
+					&:first-child {
+						margin-top: -($gap / 2);
+					}
+
+					&:last-child {
+						margin-bottom: -($gap / 2);
+					}
+				}
+			}
+
+			> .cells {
+				flex: 1;
+				display: grid;
+				grid-gap: $gap;
+
+				> div {
+					background: transparent;
+					border-radius: 6px;
+					overflow: hidden;
+
+					* {
+						pointer-events: none;
+						user-select: none;
+					}
+
+					&.empty {
+						border: solid 2px var(--divider);
+					}
+
+					&.empty.can {
+						border-color: var(--accent);
+					}
+
+					&.empty.myTurn {
+						border-color: var(--divider);
+
+						&.can {
+							border-color: var(--accent);
+							cursor: pointer;
+
+							&:hover {
+								background: var(--accent);
+							}
+						}
+					}
+
+					&.prev {
+						box-shadow: 0 0 0 4px var(--accent);
+					}
+
+					&.isEnded {
+						border-color: var(--divider);
+					}
+
+					&.none {
+						border-color: transparent !important;
+					}
+
+					> svg, > img {
+						display: block;
+						width: 100%;
+						height: 100%;
+					}
+				}
+			}
+		}
+	}
+
+	> .status {
+		margin: 0;
+		padding: 16px 0;
+	}
+
+	> .actions {
+		padding-bottom: 16px;
+	}
+
+	> .player {
+		padding: 0 16px 32px 16px;
+		margin: 0 auto;
+		max-width: 500px;
+
+		> span {
+			display: inline-block;
+			margin: 0 8px;
+			min-width: 70px;
+		}
+	}
+}
+</style>
--- a/src/client/pages/reversi/game.setting.vue
+++ b/src/client/pages/reversi/game.setting.vue
@ -0,0 +1,393 @@
+<template>
+<div class="urbixznjwwuukfsckrwzwsqzsxornqij">
+	<header><b><MkUserName :user="game.user1"/></b> vs <b><MkUserName :user="game.user2"/></b></header>
+
+	<div>
+		<p>{{ $t('_reversi.gameSettings') }}</p>
+
+		<div class="card map _panel">
+			<header>
+				<select v-model="mapName" :placeholder="$t('_reversi.chooseBoard')" @change="onMapChange">
+					<option label="-Custom-" :value="mapName" v-if="mapName == '-Custom-'"/>
+					<option :label="$t('random')" :value="null"/>
+					<optgroup v-for="c in mapCategories" :key="c" :label="c">
+						<option v-for="m in Object.values(maps).filter(m => m.category == c)" :key="m.name" :label="m.name" :value="m.name">{{ m.name }}</option>
+					</optgroup>
+				</select>
+			</header>
+
+			<div>
+				<div class="random" v-if="game.map == null"><fa icon="dice"/></div>
+				<div class="board" v-else :style="{ 'grid-template-rows': `repeat(${ game.map.length }, 1fr)`, 'grid-template-columns': `repeat(${ game.map[0].length }, 1fr)` }">
+					<div v-for="(x, i) in game.map.join('')" :class="{ none: x == ' ' }" @click="onPixelClick(i, x)">
+						<fa v-if="x == 'b'" :icon="fasCircle"/>
+						<fa v-if="x == 'w'" :icon="farCircle"/>
+					</div>
+				</div>
+			</div>
+		</div>
+
+		<div class="card _panel">
+			<header>
+				<span>{{ $t('_reversi.blackOrWhite') }}</span>
+			</header>
+
+			<div>
+				<MkRadio v-model="game.bw" value="random" @update:modelValue="updateSettings('bw')">{{ $t('random') }}</MkRadio>
+				<MkRadio v-model="game.bw" :value="'1'" @update:modelValue="updateSettings('bw')">
+					<i18n-t keypath="_reversi.blackIs" tag="span">
+						<template #name>
+							<b><MkUserName :user="game.user1"/></b>
+						</template>
+					</i18n-t>
+				</MkRadio>
+				<MkRadio v-model="game.bw" :value="'2'" @update:modelValue="updateSettings('bw')">
+					<i18n-t keypath="_reversi.blackIs" tag="span">
+						<template #name>
+							<b><MkUserName :user="game.user2"/></b>
+						</template>
+					</i18n-t>
+				</MkRadio>
+			</div>
+		</div>
+
+		<div class="card _panel">
+			<header>
+				<span>{{ $t('_reversi.rules') }}</span>
+			</header>
+
+			<div>
+				<MkSwitch v-model:value="game.isLlotheo" @update:value="updateSettings('isLlotheo')">{{ $t('_reversi.isLlotheo') }}</MkSwitch>
+				<MkSwitch v-model:value="game.loopedBoard" @update:value="updateSettings('loopedBoard')">{{ $t('_reversi.loopedMap') }}</MkSwitch>
+				<MkSwitch v-model:value="game.canPutEverywhere" @update:value="updateSettings('canPutEverywhere')">{{ $t('_reversi.canPutEverywhere') }}</MkSwitch>
+			</div>
+		</div>
+
+		<div class="card form _panel" v-if="form">
+			<header>
+				<span>{{ $t('_reversi.botSettings') }}</span>
+			</header>
+
+			<div>
+				<template v-for="item in form">
+					<MkSwitch v-if="item.type == 'switch'" v-model:value="item.value" :key="item.id" @change="onChangeForm(item)">{{ item.label || item.desc || '' }}</MkSwitch>
+
+					<div class="card" v-if="item.type == 'radio'" :key="item.id">
+						<header>
+							<span>{{ item.label }}</span>
+						</header>
+
+						<div>
+							<MkRadio v-for="(r, i) in item.items" :key="item.id + ':' + i" v-model="item.value" :value="r.value" @update:modelValue="onChangeForm(item)">{{ r.label }}</MkRadio>
+						</div>
+					</div>
+
+					<div class="card" v-if="item.type == 'slider'" :key="item.id">
+						<header>
+							<span>{{ item.label }}</span>
+						</header>
+
+						<div>
+							<input type="range" :min="item.min" :max="item.max" :step="item.step || 1" v-model="item.value" @change="onChangeForm(item)"/>
+						</div>
+					</div>
+
+					<div class="card" v-if="item.type == 'textbox'" :key="item.id">
+						<header>
+							<span>{{ item.label }}</span>
+						</header>
+
+						<div>
+							<input v-model="item.value" @change="onChangeForm(item)"/>
+						</div>
+					</div>
+				</template>
+			</div>
+		</div>
+	</div>
+
+	<footer class="_acrylic">
+		<p class="status">
+			<template v-if="isAccepted && isOpAccepted">{{ $t('_reversi.thisGameIsStartedSoon') }}<MkEllipsis/></template>
+			<template v-if="isAccepted && !isOpAccepted">{{ $t('_reversi.waitingForOther') }}<MkEllipsis/></template>
+			<template v-if="!isAccepted && isOpAccepted">{{ $t('_reversi.waitingForMe') }}</template>
+			<template v-if="!isAccepted && !isOpAccepted">{{ $t('_reversi.waitingBoth') }}<MkEllipsis/></template>
+		</p>
+
+		<div class="actions">
+			<MkButton inline @click="exit">{{ $t('cancel') }}</MkButton>
+			<MkButton inline primary @click="accept" v-if="!isAccepted">{{ $t('_reversi.ready') }}</MkButton>
+			<MkButton inline primary @click="cancel" v-if="isAccepted">{{ $t('_reversi.cancelReady') }}</MkButton>
+		</div>
+	</footer>
+</div>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import { faCircle as fasCircle } from '@fortawesome/free-solid-svg-icons';
+import { faCircle as farCircle } from '@fortawesome/free-regular-svg-icons';
+import * as maps from '../../../games/reversi/maps';
+import MkButton from '@/components/ui/button.vue';
+import MkSwitch from '@/components/ui/switch.vue';
+import MkRadio from '@/components/ui/radio.vue';
+
+export default defineComponent({
+	components: {
+		MkButton,
+		MkSwitch,
+		MkRadio,
+	},
+
+	props: {
+		initGame: {
+			type: Object,
+			require: true
+		},
+		connection: {
+			type: Object,
+			require: true
+		},
+	},
+
+	data() {
+		return {
+			game: this.initGame,
+			o: null,
+			isLlotheo: false,
+			mapName: maps.eighteight.name,
+			maps: maps,
+			form: null,
+			messages: [],
+			fasCircle, farCircle
+		};
+	},
+
+	computed: {
+		mapCategories(): string[] {
+			const categories = Object.values(maps).map(x => x.category);
+			return categories.filter((item, pos) => categories.indexOf(item) == pos);
+		},
+		isAccepted(): boolean {
+			if (this.game.user1Id == this.$store.state.i.id && this.game.user1Accepted) return true;
+			if (this.game.user2Id == this.$store.state.i.id && this.game.user2Accepted) return true;
+			return false;
+		},
+		isOpAccepted(): boolean {
+			if (this.game.user1Id != this.$store.state.i.id && this.game.user1Accepted) return true;
+			if (this.game.user2Id != this.$store.state.i.id && this.game.user2Accepted) return true;
+			return false;
+		}
+	},
+
+	created() {
+		this.connection.on('changeAccepts', this.onChangeAccepts);
+		this.connection.on('updateSettings', this.onUpdateSettings);
+		this.connection.on('initForm', this.onInitForm);
+		this.connection.on('message', this.onMessage);
+
+		if (this.game.user1Id != this.$store.state.i.id && this.game.form1) this.form = this.game.form1;
+		if (this.game.user2Id != this.$store.state.i.id && this.game.form2) this.form = this.game.form2;
+	},
+
+	beforeUnmount() {
+		this.connection.off('changeAccepts', this.onChangeAccepts);
+		this.connection.off('updateSettings', this.onUpdateSettings);
+		this.connection.off('initForm', this.onInitForm);
+		this.connection.off('message', this.onMessage);
+	},
+
+	methods: {
+		exit() {
+
+		},
+
+		accept() {
+			this.connection.send('accept', {});
+		},
+
+		cancel() {
+			this.connection.send('cancelAccept', {});
+		},
+
+		onChangeAccepts(accepts) {
+			this.game.user1Accepted = accepts.user1;
+			this.game.user2Accepted = accepts.user2;
+		},
+
+		updateSettings(key: string) {
+			this.connection.send('updateSettings', {
+				key: key,
+				value: this.game[key]
+			});
+		},
+
+		onUpdateSettings({ key, value }) {
+			this.game[key] = value;
+			if (this.game.map == null) {
+				this.mapName = null;
+			} else {
+				const found = Object.values(maps).find(x => x.data.join('') == this.game.map.join(''));
+				this.mapName = found ? found.name : '-Custom-';
+			}
+		},
+
+		onInitForm(x) {
+			if (x.userId == this.$store.state.i.id) return;
+			this.form = x.form;
+		},
+
+		onMessage(x) {
+			if (x.userId == this.$store.state.i.id) return;
+			this.messages.unshift(x.message);
+		},
+
+		onChangeForm(item) {
+			this.connection.send('updateForm', {
+				id: item.id,
+				value: item.value
+			});
+		},
+
+		onMapChange() {
+			if (this.mapName == null) {
+				this.game.map = null;
+			} else {
+				this.game.map = Object.values(maps).find(x => x.name == this.mapName).data;
+			}
+			this.updateSettings('map');
+		},
+
+		onPixelClick(pos, pixel) {
+			const x = pos % this.game.map[0].length;
+			const y = Math.floor(pos / this.game.map[0].length);
+			const newPixel =
+				pixel == ' ' ? '-' :
+				pixel == '-' ? 'b' :
+				pixel == 'b' ? 'w' :
+				' ';
+			const line = this.game.map[y].split('');
+			line[x] = newPixel;
+			this.game.map[y] = line.join('');
+			this.updateSettings('map');
+		}
+	}
+});
+</script>
+
+<style lang="scss" scoped>
+.urbixznjwwuukfsckrwzwsqzsxornqij {
+	text-align: center;
+	background: var(--bg);
+
+	> header {
+		padding: 8px;
+		border-bottom: dashed 1px #c4cdd4;
+	}
+
+	> div {
+		padding: 0 16px;
+
+		> .card {
+			margin: 0 auto 16px auto;
+
+			&.map {
+				> header {
+					> select {
+						width: 100%;
+						padding: 12px 14px;
+						background: var(--face);
+						border: 1px solid var(--inputBorder);
+						border-radius: 4px;
+						color: var(--fg);
+						cursor: pointer;
+						transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+						-webkit-appearance: none;
+						-moz-appearance: none;
+						appearance: none;
+
+						&:focus,
+						&:active {
+							border-color: var(--accent);
+						}
+					}
+				}
+
+				> div {
+					> .random {
+						padding: 32px 0;
+						font-size: 64px;
+						color: var(--fg);
+						opacity: 0.7;
+					}
+
+					> .board {
+						display: grid;
+						grid-gap: 4px;
+						width: 300px;
+						height: 300px;
+						margin: 0 auto;
+						color: var(--fg);
+
+						> div {
+							background: transparent;
+							border: solid 2px var(--divider);
+							border-radius: 6px;
+							overflow: hidden;
+							cursor: pointer;
+
+							* {
+								pointer-events: none;
+								user-select: none;
+								width: 100%;
+								height: 100%;
+							}
+
+							&.none {
+								border-color: transparent;
+							}
+						}
+					}
+				}
+			}
+
+			&.form {
+				> div {
+					> .card + .card {
+						margin-top: 16px;
+					}
+
+					input[type='range'] {
+						width: 100%;
+					}
+				}
+			}
+		}
+
+		.card {
+			max-width: 400px;
+
+			> header {
+				padding: 18px 20px;
+				border-bottom: 1px solid var(--divider);
+			}
+
+			> div {
+				padding: 20px;
+				color: var(--fg);
+			}
+		}
+	}
+
+	> footer {
+		position: sticky;
+		bottom: 0;
+		padding: 16px;
+		border-top: solid 1px var(--divider);
+
+		> .status {
+			margin: 0 0 16px 0;
+		}
+	}
+}
+</style>
--- a/src/client/pages/reversi/game.vue
+++ b/src/client/pages/reversi/game.vue
@ -0,0 +1,78 @@
+<template>
+<div v-if="game == null"><MkLoading/></div>
+<GameSetting v-else-if="!game.isStarted" :init-game="game" :connection="connection"/>
+<GameBoard v-else :init-game="game" :connection="connection"/>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import GameSetting from './game.setting.vue';
+import GameBoard from './game.board.vue';
+import * as os from '@/os';
+import { faGamepad } from '@fortawesome/free-solid-svg-icons';
+
+export default defineComponent({
+	components: {
+		GameSetting,
+		GameBoard,
+	},
+
+	props: {
+		gameId: {
+			type: String,
+			required: true
+		},
+	},
+
+	data() {
+		return {
+			INFO: {
+				header: [{
+					title: this.$t('_reversi.reversi'),
+					icon: faGamepad
+				}]
+			},
+			game: null,
+			connection: null,
+		};
+	},
+
+	watch: {
+		gameId() {
+			this.fetch();
+		}
+	},
+
+	mounted() {
+		this.fetch();
+	},
+
+	beforeUnmount() {
+		if (this.connection) {
+			this.connection.dispose();
+		}
+	},
+
+	methods: {
+		fetch() {
+			os.api('games/reversi/games/show', {
+				gameId: this.gameId
+			}).then(game => {
+				this.game = game;
+
+				if (this.connection) {
+					this.connection.dispose();
+				}
+				this.connection = os.stream.connectToChannel('gamesReversiGame', {
+					gameId: this.game.id
+				});
+				this.connection.on('started', this.onStarted);
+			});
+		},
+
+		onStarted(game) {
+			Object.assign(this.game, game);
+		},
+	}
+});
+</script>
--- a/src/client/pages/reversi/index.vue
+++ b/src/client/pages/reversi/index.vue
@ -0,0 +1,281 @@
+<template>
+<div class="bgvwxkhb" v-if="!matching">
+	<h1>Misskey {{ $t('_reversi.reversi') }}</h1>
+
+	<div class="play">
+		<MkButton primary round @click="match" style="margin: var(--margin) auto 0 auto;">{{ $t('invite') }}</MkButton>
+	</div>
+
+	<div class="_section">
+		<MkFolder v-if="invitations.length > 0">
+			<template #header>{{ $t('invitations') }}</template>
+			<div class="nfcacttm">
+				<button class="invitation _panel _button" v-for="invitation in invitations" tabindex="-1" @click="accept(invitation)">
+					<MkAvatar class="avatar" :user="invitation.parent"/>
+					<span class="name"><b><MkUserName :user="invitation.parent"/></b></span>
+					<span class="username">@{{ invitation.parent.username }}</span>
+					<MkTime :time="invitation.createdAt" class="time"/>
+				</button>
+			</div>
+		</MkFolder>
+
+		<MkFolder v-if="myGames.length > 0">
+			<template #header>{{ $t('_reversi.myGames') }}</template>
+			<div class="knextgwz">
+				<MkA class="game _panel" v-for="g in myGames" tabindex="-1" :to="`/games/reversi/${g.id}`" :key="g.id">
+					<div class="players">
+						<MkAvatar class="avatar" :user="g.user1"/><b><MkUserName :user="g.user1"/></b> vs <b><MkUserName :user="g.user2"/></b><MkAvatar class="avatar" :user="g.user2"/>
+					</div>
+					<footer><span class="state" :class="{ playing: !g.isEnded }">{{ g.isEnded ? $t('_reversi.ended') : $t('_reversi.playing') }}</span><MkTime class="time" :time="g.createdAt"/></footer>
+				</MkA>
+			</div>
+		</MkFolder>
+
+		<MkFolder v-if="games.length > 0">
+			<template #header>{{ $t('_reversi.allGames') }}</template>
+			<div class="knextgwz">
+				<MkA class="game _panel" v-for="g in games" tabindex="-1" :to="`/games/reversi/${g.id}`" :key="g.id">
+					<div class="players">
+						<MkAvatar class="avatar" :user="g.user1"/><b><MkUserName :user="g.user1"/></b> vs <b><MkUserName :user="g.user2"/></b><MkAvatar class="avatar" :user="g.user2"/>
+					</div>
+					<footer><span class="state" :class="{ playing: !g.isEnded }">{{ g.isEnded ? $t('_reversi.ended') : $t('_reversi.playing') }}</span><MkTime class="time" :time="g.createdAt"/></footer>
+				</MkA>
+			</div>
+		</MkFolder>
+	</div>
+</div>
+<div class="sazhgisb" v-else>
+	<h1>
+		<i18n-t keypath="waitingFor" tag="span">
+			<template #x>
+				<b><MkUserName :user="matching"/></b>
+			</template>
+		</i18n-t>
+		<MkEllipsis/>
+	</h1>
+	<div class="cancel">
+		<MkButton inline round @click="cancel">{{ $t('cancel') }}</MkButton>
+	</div>
+</div>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import * as os from '@/os';
+import MkButton from '@/components/ui/button.vue';
+import MkFolder from '@/components/ui/folder.vue';
+import { faGamepad } from '@fortawesome/free-solid-svg-icons';
+
+export default defineComponent({
+	components: {
+		MkButton, MkFolder,
+	},
+
+	inject: ['navHook'],
+
+	data() {
+		return {
+			INFO: {
+				header: [{
+					title: this.$t('_reversi.reversi'),
+					icon: faGamepad
+				}]
+			},
+			games: [],
+			gamesFetching: true,
+			gamesMoreFetching: false,
+			myGames: [],
+			matching: null,
+			invitations: [],
+			connection: null,
+			pingClock: null,
+		};
+	},
+
+	mounted() {
+		if (this.$store.getters.isSignedIn) {
+			this.connection = os.stream.useSharedConnection('gamesReversi');
+
+			this.connection.on('invited', this.onInvited);
+
+			this.connection.on('matched', this.onMatched);
+
+			this.pingClock = setInterval(() => {
+				if (this.matching) {
+					this.connection.send('ping', {
+						id: this.matching.id
+					});
+				}
+			}, 3000);
+
+			os.api('games/reversi/games', {
+				my: true
+			}).then(games => {
+				this.myGames = games;
+			});
+
+			os.api('games/reversi/invitations').then(invitations => {
+				this.invitations = this.invitations.concat(invitations);
+			});
+		}
+
+		os.api('games/reversi/games').then(games => {
+			this.games = games;
+			this.gamesFetching = false;
+		});
+	},
+
+	beforeUnmount() {
+		if (this.connection) {
+			this.connection.dispose();
+			clearInterval(this.pingClock);
+		}
+	},
+
+	methods: {
+		go(game) {
+			const url = '/games/reversi/' + game.id;
+			if (this.navHook) {
+				this.navHook(url);
+			} else {
+				this.$router.push(url);
+			}
+		},
+
+		async match() {
+			const user = await os.selectUser({ local: true });
+			if (user == null) return;
+			os.api('games/reversi/match', {
+				userId: user.id
+			}).then(res => {
+				if (res == null) {
+					this.matching = user;
+				} else {
+					this.go(res);
+				}
+			});
+		},
+
+		cancel() {
+			this.matching = null;
+			os.api('games/reversi/match/cancel');
+		},
+
+		accept(invitation) {
+			os.api('games/reversi/match', {
+				userId: invitation.parent.id
+			}).then(game => {
+				if (game) {
+					this.go(game);
+				}
+			});
+		},
+
+		onMatched(game) {
+			this.go(game);
+		},
+
+		onInvited(invite) {
+			this.invitations.unshift(invite);
+		}
+	}
+});
+</script>
+
+<style lang="scss" scoped>
+.bgvwxkhb {
+	> h1 {
+		margin: 0;
+		padding: 24px;
+		text-align: center;
+		font-size: 1.5em;
+		background: linear-gradient(0deg, #43c583, #438881);
+		color: #fff;
+	}
+
+	> .play {
+		text-align: center;
+	}
+}
+
+.sazhgisb {
+	text-align: center;
+}
+
+.nfcacttm {
+	> .invitation {
+		display: flex;
+		box-sizing: border-box;
+		width: 100%;
+		padding: 16px;
+		line-height: 32px;
+		text-align: left;
+
+		> .avatar {
+			width: 32px;
+			height: 32px;
+			margin-right: 8px;
+		}
+
+		> .name {
+			margin-right: 8px;
+		}
+
+		> .username {
+			margin-right: 8px;
+			opacity: 0.7;
+		}
+
+		> .time {
+			margin-left: auto;
+			opacity: 0.7;
+		}
+	}
+}
+
+.knextgwz {
+	display: grid;
+	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
+	grid-gap: var(--margin);
+
+	> .game {
+		> .players {
+			text-align: center;
+			padding: 16px;
+			line-height: 32px;
+
+			> .avatar {
+				width: 32px;
+				height: 32px;
+
+				&:first-child {
+					margin-right: 8px;
+				}
+
+				&:last-child {
+					margin-left: 8px;
+				}
+			}
+		}
+
+		> footer {
+			display: flex;
+			align-items: baseline;
+			border-top: solid 1px var(--divider);
+			padding: 6px 8px;
+			font-size: 0.9em;
+
+			> .state {
+				&.playing {
+					color: var(--accent);
+				}
+			}
+
+			> .time {
+				margin-left: auto;
+				opacity: 0.7;
+			}
+		}
+	}
+}
+</style>
--- a/src/client/pages/settings/api.vue
+++ b/src/client/pages/settings/api.vue
@ -1,9 +1,14 @@
 <template>
-<section class="_section">
+<div>
+	<div class="_section">
 		<div class="_content">
 			<MkButton @click="generateToken">{{ $t('generateAccessToken') }}</MkButton>
 		</div>
-</section>
+	</div>
+	<div class="_section">
+		<MkA to="/api-console" :behavior="isDesktop ? 'window' : null">API console</MkA>
+	</div>
+</div>
 </template>

 <script lang="ts">
@ -28,6 +33,7 @@ export default defineComponent({
 					icon: faKey
 				}]
 			},
+			isDesktop: window.innerWidth >= 1100,
 		};
 	},

--- a/src/client/pages/settings/general.vue
+++ b/src/client/pages/settings/general.vue
@ -2,6 +2,10 @@
 <div class="_section">
 	<section class="_card _vMargin">
 		<div class="_title"><Fa :icon="faCog"/> {{ $t('general') }}</div>
+		<div class="_content">
+			<div>{{ $t('defaultNavigationBehaviour') }}</div>
+			<MkSwitch v-model:value="defaultSideView">{{ $t('openInSideView') }}</MkSwitch>
+		</div>
 		<div class="_content">
 			<div>{{ $t('whenServerDisconnected') }}</div>
 			<MkRadio v-model="serverDisconnectedBehavior" value="reload">{{ $t('_serverDisconnectedBehavior.reload') }}</MkRadio>
@ -47,10 +51,20 @@
 			<MkRadio v-model="fontSize" value="large"><span style="font-size: 18px;">Aa</span></MkRadio>
 			<MkRadio v-model="fontSize" value="veryLarge"><span style="font-size: 20px;">Aa</span></MkRadio>
 		</div>
+		<div class="_content">
+			<div>{{ $t('instanceTicker') }}</div>
+			<MkRadio v-model="instanceTicker" value="none">{{ $t('_instanceTicker.none') }}</MkRadio>
+			<MkRadio v-model="instanceTicker" value="remote">{{ $t('_instanceTicker.remote') }}</MkRadio>
+			<MkRadio v-model="instanceTicker" value="always">{{ $t('_instanceTicker.always') }}</MkRadio>
+		</div>
 	</section>

 	<section class="_card _vMargin">
 		<div class="_title"><Fa :icon="faColumns"/> {{ $t('deck') }}</div>
+		<div class="_content">
+			<div>{{ $t('defaultNavigationBehaviour') }}</div>
+			<MkSwitch v-model:value="deckNavWindow">{{ $t('openInWindow') }}</MkSwitch>
+		</div>
 		<div class="_content">
 			<MkSwitch v-model:value="deckAlwaysShowMainColumn">
 				{{ $t('_deck.alwaysShowMainColumn') }}
@ -146,11 +160,26 @@ export default defineComponent({
 			set(value) { this.$store.commit('device/set', { key: 'showFixedPostForm', value }); }
 		},

+		defaultSideView: {
+			get() { return this.$store.state.device.defaultSideView; },
+			set(value) { this.$store.commit('device/set', { key: 'defaultSideView', value }); }
+		},
+
+		deckNavWindow: {
+			get() { return this.$store.state.device.deckNavWindow; },
+			set(value) { this.$store.commit('device/set', { key: 'deckNavWindow', value }); }
+		},
+
 		chatOpenBehavior: {
 			get() { return this.$store.state.device.chatOpenBehavior; },
 			set(value) { this.$store.commit('device/set', { key: 'chatOpenBehavior', value }); }
 		},

+		instanceTicker: {
+			get() { return this.$store.state.device.instanceTicker; },
+			set(value) { this.$store.commit('device/set', { key: 'instanceTicker', value }); }
+		},
+
 		enableInfiniteScroll: {
 			get() { return this.$store.state.device.enableInfiniteScroll; },
 			set(value) { this.$store.commit('device/set', { key: 'enableInfiniteScroll', value }); }
--- a/src/client/pages/settings/import-export.vue
+++ b/src/client/pages/settings/import-export.vue
@ -9,10 +9,9 @@
 			<option value="mute">{{ $t('_exportOrImport.muteList') }}</option>
 			<option value="blocking">{{ $t('_exportOrImport.blockingList') }}</option>
 		</MkSelect>
-		<MkButton inline @click="doExport()"><Fa :icon="faDownload"/> {{ $t('export') }}</MkButton>
-		<MkButton inline @click="doImport()" :disabled="!['following', 'user-lists'].includes(exportTarget)"><Fa :icon="faUpload"/> {{ $t('import') }}</MkButton>
+		<MkButton inline primary @click="doExport"><Fa :icon="faDownload"/> {{ $t('export') }}</MkButton>
+		<MkButton inline primary @click="doImport" :disabled="!['following', 'user-lists'].includes(exportTarget)"><Fa :icon="faUpload"/> {{ $t('import') }}</MkButton>
 	</div>
-	<input ref="file" type="file" style="display: none;" @change="onChangeFile"/>
 </section>
 </template>

@ -21,8 +20,8 @@ import { defineComponent } from 'vue';
 import { faDownload, faUpload, faBoxes } from '@fortawesome/free-solid-svg-icons';
 import MkButton from '@/components/ui/button.vue';
 import MkSelect from '@/components/ui/select.vue';
-import { apiUrl } from '@/config';
 import * as os from '@/os';
+import { selectFile } from '@/scripts/select-file';

 export default defineComponent({
 	components: {
@ -59,29 +58,9 @@ export default defineComponent({
 			});
 		},

-		doImport() {
-			(this.$refs.file as any).click();
-		},
+		async doImport(e) {
+			const file = await selectFile(e.currentTarget || e.target);
 			
-		onChangeFile() {
-			const [file] = Array.from((this.$refs.file as any).files);
-			
-			const data = new FormData();
-			data.append('file', file);
-			data.append('i', this.$store.state.i.token);
-
-			const promise = fetch(apiUrl + '/drive/files/create', {
-				method: 'POST',
-				body: data
-			})
-			.then(response => response.json())
-			.then(f => {
-				this.reqImport(f);
-			});
-			os.promiseDialog(promise);
-		},
-
-		reqImport(file) {
 			os.api(
 				this.exportTarget == 'following' ? 'i/import-following' :
 				this.exportTarget == 'user-lists' ? 'i/import-user-lists' :
@ -98,7 +77,7 @@ export default defineComponent({
 					text: e.message
 				});
 			});
-		}
+		},
 	}
 });
 </script>
--- a/src/client/pages/settings/index.vue
+++ b/src/client/pages/settings/index.vue
@ -1,52 +1,58 @@
 <template>
 <div class="vvcocwet" :class="{ wide: !narrow }" ref="el">
-	<div class="nav" v-if="!narrow || $route.name === 'settings'">
+	<div class="nav" v-if="!narrow || page == null">
 		<div class="menu">
 			<div class="label">{{ $t('basicSettings') }}</div>
-			<router-link class="item" replace to="/settings/profile"><Fa :icon="faUser" fixed-width class="icon"/>{{ $t('profile') }}</router-link>
-			<router-link class="item" replace to="/settings/privacy"><Fa :icon="faLockOpen" fixed-width class="icon"/>{{ $t('privacy') }}</router-link>
-			<router-link class="item" replace to="/settings/reaction"><Fa :icon="faLaugh" fixed-width class="icon"/>{{ $t('reaction') }}</router-link>
-			<router-link class="item" replace to="/settings/notifications"><Fa :icon="faBell" fixed-width class="icon"/>{{ $t('notifications') }}</router-link>
-			<router-link class="item" replace to="/settings/integration"><Fa :icon="faShareAlt" fixed-width class="icon"/>{{ $t('integration') }}</router-link>
-			<router-link class="item" replace to="/settings/security"><Fa :icon="faLock" fixed-width class="icon"/>{{ $t('security') }}</router-link>
+			<MkA class="item" :class="{ active: page === 'profile' }" replace to="/settings/profile"><Fa :icon="faUser" fixed-width class="icon"/>{{ $t('profile') }}</MkA>
+			<MkA class="item" :class="{ active: page === 'privacy' }" replace to="/settings/privacy"><Fa :icon="faLockOpen" fixed-width class="icon"/>{{ $t('privacy') }}</MkA>
+			<MkA class="item" :class="{ active: page === 'reaction' }" replace to="/settings/reaction"><Fa :icon="faLaugh" fixed-width class="icon"/>{{ $t('reaction') }}</MkA>
+			<MkA class="item" :class="{ active: page === 'notifications' }" replace to="/settings/notifications"><Fa :icon="faBell" fixed-width class="icon"/>{{ $t('notifications') }}</MkA>
+			<MkA class="item" :class="{ active: page === 'integration' }" replace to="/settings/integration"><Fa :icon="faShareAlt" fixed-width class="icon"/>{{ $t('integration') }}</MkA>
+			<MkA class="item" :class="{ active: page === 'security' }" replace to="/settings/security"><Fa :icon="faLock" fixed-width class="icon"/>{{ $t('security') }}</MkA>
 		</div>
 		<div class="menu">
 			<div class="label">{{ $t('clientSettings') }}</div>
-			<router-link class="item" replace to="/settings/general"><Fa :icon="faCogs" fixed-width class="icon"/>{{ $t('general') }}</router-link>
-			<router-link class="item" replace to="/settings/theme"><Fa :icon="faPalette" fixed-width class="icon"/>{{ $t('theme') }}</router-link>
-			<router-link class="item" replace to="/settings/sidebar"><Fa :icon="faListUl" fixed-width class="icon"/>{{ $t('sidebar') }}</router-link>
-			<router-link class="item" replace to="/settings/sounds"><Fa :icon="faMusic" fixed-width class="icon"/>{{ $t('sounds') }}</router-link>
-			<router-link class="item" replace to="/settings/plugins"><Fa :icon="faPlug" fixed-width class="icon"/>{{ $t('plugins') }}</router-link>
+			<MkA class="item" :class="{ active: page === 'general' }" replace to="/settings/general"><Fa :icon="faCogs" fixed-width class="icon"/>{{ $t('general') }}</MkA>
+			<MkA class="item" :class="{ active: page === 'theme' }" replace to="/settings/theme"><Fa :icon="faPalette" fixed-width class="icon"/>{{ $t('theme') }}</MkA>
+			<MkA class="item" :class="{ active: page === 'sidebar' }" replace to="/settings/sidebar"><Fa :icon="faListUl" fixed-width class="icon"/>{{ $t('sidebar') }}</MkA>
+			<MkA class="item" :class="{ active: page === 'sounds' }" replace to="/settings/sounds"><Fa :icon="faMusic" fixed-width class="icon"/>{{ $t('sounds') }}</MkA>
+			<MkA class="item" :class="{ active: page === 'plugins' }" replace to="/settings/plugins"><Fa :icon="faPlug" fixed-width class="icon"/>{{ $t('plugins') }}</MkA>
 		</div>
 		<div class="menu">
 			<div class="label">{{ $t('otherSettings') }}</div>
-			<router-link class="item" replace to="/settings/mute-block"><Fa :icon="faBan" fixed-width class="icon"/>{{ $t('muteAndBlock') }}</router-link>
-			<router-link class="item" replace to="/settings/word-mute"><Fa :icon="faCommentSlash" fixed-width class="icon"/>{{ $t('wordMute') }}</router-link>
-			<router-link class="item" replace to="/settings/api"><Fa :icon="faKey" fixed-width class="icon"/>API</router-link>
-			<router-link class="item" replace to="/settings/other"><Fa :icon="faEllipsisH" fixed-width class="icon"/>{{ $t('other') }}</router-link>
+			<MkA class="item" :class="{ active: page === 'import-export' }" replace to="/settings/import-export"><Fa :icon="faBoxes" fixed-width class="icon"/>{{ $t('importAndExport') }}</MkA>
+			<MkA class="item" :class="{ active: page === 'mute-block' }" replace to="/settings/mute-block"><Fa :icon="faBan" fixed-width class="icon"/>{{ $t('muteAndBlock') }}</MkA>
+			<MkA class="item" :class="{ active: page === 'word-mute' }" replace to="/settings/word-mute"><Fa :icon="faCommentSlash" fixed-width class="icon"/>{{ $t('wordMute') }}</MkA>
+			<MkA class="item" :class="{ active: page === 'api' }" replace to="/settings/api"><Fa :icon="faKey" fixed-width class="icon"/>API</MkA>
+			<MkA class="item" :class="{ active: page === 'other' }" replace to="/settings/other"><Fa :icon="faEllipsisH" fixed-width class="icon"/>{{ $t('other') }}</MkA>
 		</div>
 		<div class="menu">
 			<button class="_button item" @click="logout">{{ $t('logout') }}</button>
 		</div>
 	</div>
 	<div class="main">
-		<router-view v-slot="{ Component }">
 		<transition :name="($store.state.device.animation && !narrow) ? 'view-slide' : ''" appear mode="out-in">
-				<component :is="Component" @info="onInfo"/>
+			<component :is="component" @info="onInfo"/>
 		</transition>
-		</router-view>
 	</div>
 </div>
 </template>

 <script lang="ts">
-import { defineComponent, onMounted, ref } from 'vue';
-import { faCog, faPalette, faPlug, faUser, faListUl, faLock, faCommentSlash, faMusic, faCogs, faEllipsisH, faBan, faShareAlt, faLockOpen, faKey } from '@fortawesome/free-solid-svg-icons';
+import { computed, defineAsyncComponent, defineComponent, onMounted, ref } from 'vue';
+import { faCog, faPalette, faPlug, faUser, faListUl, faLock, faCommentSlash, faMusic, faCogs, faEllipsisH, faBan, faShareAlt, faLockOpen, faKey, faBoxes } from '@fortawesome/free-solid-svg-icons';
 import { faLaugh, faBell } from '@fortawesome/free-regular-svg-icons';
 import { store } from '@/store';
 import { i18n } from '@/i18n';

 export default defineComponent({
+	props: {
+		page: {
+			type: String,
+			required: false
+		}
+	},
+
 	setup(props, context) {
 		const INFO = ref({
 			header: [{
@ -60,6 +66,28 @@ export default defineComponent({
 		const onInfo = (viewInfo) => {
 			INFO.value = viewInfo;
 		};
+		const component = computed(() => {
+			switch (props.page) {
+				case 'profile': return defineAsyncComponent(() => import('./profile.vue'));
+				case 'privacy': return defineAsyncComponent(() => import('./privacy.vue'));
+				case 'reaction': return defineAsyncComponent(() => import('./reaction.vue'));
+				case 'notifications': return defineAsyncComponent(() => import('./notifications.vue'));
+				case 'mute-block': return defineAsyncComponent(() => import('./mute-block.vue'));
+				case 'word-mute': return defineAsyncComponent(() => import('./word-mute.vue'));
+				case 'integration': return defineAsyncComponent(() => import('./integration.vue'));
+				case 'security': return defineAsyncComponent(() => import('./security.vue'));
+				case 'api': return defineAsyncComponent(() => import('./api.vue'));
+				case 'other': return defineAsyncComponent(() => import('./other.vue'));
+				case 'general': return defineAsyncComponent(() => import('./general.vue'));
+				case 'theme': return defineAsyncComponent(() => import('./theme.vue'));
+				case 'sidebar': return defineAsyncComponent(() => import('./sidebar.vue'));
+				case 'sounds': return defineAsyncComponent(() => import('./sounds.vue'));
+				case 'plugins': return defineAsyncComponent(() => import('./plugins.vue'));
+				case 'import-export': return defineAsyncComponent(() => import('./import-export.vue'));
+				case 'regedit': return defineAsyncComponent(() => import('./regedit.vue'));
+				default: return null;
+			}
+		});

 		onMounted(() => {
 			narrow.value = el.value.offsetWidth < 650;
@ -71,11 +99,12 @@ export default defineComponent({
 			view,
 			el,
 			onInfo,
+			component,
 			logout: () => {
 				store.dispatch('logout');
 				location.href = '/';
 			},
-			faPalette, faPlug, faUser, faListUl, faLock, faLaugh, faCommentSlash, faMusic, faBell, faCogs, faEllipsisH, faBan, faShareAlt, faLockOpen, faKey,
+			faPalette, faPlug, faUser, faListUl, faLock, faLaugh, faCommentSlash, faMusic, faBell, faCogs, faEllipsisH, faBan, faShareAlt, faLockOpen, faKey, faBoxes,
 		};
 	},
 });
@ -91,9 +120,6 @@ export default defineComponent({
 }

 .vvcocwet {
-	max-width: 1000px;
-	margin: 0 auto;
-
 	> .nav {
 		> .menu {
 			margin: 16px 0;
@ -121,7 +147,7 @@ export default defineComponent({
 					//border-top: solid 1px var(--divider);
 				}

-				&.router-link-active {
+				&.active {
 					color: var(--accent);
 					padding-left: 42px;
 				}
@ -143,7 +169,7 @@ export default defineComponent({

 		> .nav {
 			width: 30%;
-			max-width: 260px;
+			max-width: 300px;
 		}

 		> .main {
--- a/src/client/pages/settings/integration.vue
+++ b/src/client/pages/settings/integration.vue
@ -1,5 +1,5 @@
 <template>
-<section class="_section" v-if="enableTwitterIntegration || enableDiscordIntegration || enableGithubIntegration">
+<section class="_section">
 	<div class="_content" v-if="enableTwitterIntegration">
 		<header><Fa :icon="faTwitter"/> Twitter</header>
 		<p v-if="integrations.twitter">{{ $t('connectedTo') }}: <a :href="`https://twitter.com/${integrations.twitter.screenName}`" rel="nofollow noopener" target="_blank">@{{ integrations.twitter.screenName }}</a></p>
--- a/src/client/pages/settings/mute-block.vue
+++ b/src/client/pages/settings/mute-block.vue
@ -6,9 +6,9 @@
 			<template #empty><MkInfo>{{ $t('noUsers') }}</MkInfo></template>
 			<template #default="{items}">
 				<div class="user" v-for="mute in items" :key="mute.id">
-					<router-link class="name" :to="userPage(mute.mutee)">
+					<MkA class="name" :to="userPage(mute.mutee)">
 						<MkAcct :user="mute.mutee"/>
-					</router-link>
+					</MkA>
 				</div>
 			</template>
 		</MkPagination>
@ -18,9 +18,9 @@
 			<template #empty><MkInfo>{{ $t('noUsers') }}</MkInfo></template>
 			<template #default="{items}">
 				<div class="user" v-for="block in items" :key="block.id">
-					<router-link class="name" :to="userPage(block.blockee)">
+					<MkA class="name" :to="userPage(block.blockee)">
 						<MkAcct :user="block.blockee"/>
-					</router-link>
+					</MkA>
 				</div>
 			</template>
 		</MkPagination>
--- a/src/client/pages/settings/other.vue
+++ b/src/client/pages/settings/other.vue
@ -1,5 +1,6 @@
 <template>
-<div class="_section">
+<div>
+	<div class="_section">
 		<div class="_card">
 			<div class="_content">
 				<MkSwitch v-model:value="$store.state.i.injectFeaturedNote" @update:value="onChangeInjectFeaturedNote">
@ -7,20 +8,33 @@
 				</MkSwitch>
 			</div>
 		</div>
+	</div>
+	<div class="_section">
+		<MkSwitch v-model:value="debug" @update:value="changeDebug">
+			DEBUG MODE
+		</MkSwitch>
+		<div v-if="debug">
+			<MkA to="/settings/regedit">RegEdit</MkA>
+			<MkButton @click="taskmanager">Task Manager</MkButton>
+		</div>
+	</div>
 </div>
 </template>

 <script lang="ts">
-import { defineComponent } from 'vue';
+import { defineAsyncComponent, defineComponent } from 'vue';
 import { faEllipsisH } from '@fortawesome/free-solid-svg-icons';
 import MkSelect from '@/components/ui/select.vue';
 import MkSwitch from '@/components/ui/switch.vue';
+import MkButton from '@/components/ui/button.vue';
 import * as os from '@/os';
+import { debug } from '@/config';

 export default defineComponent({
 	components: {
 		MkSelect,
 		MkSwitch,
+		MkButton,
 	},

 	emits: ['info'],
@ -33,6 +47,7 @@ export default defineComponent({
 					icon: faEllipsisH
 				}]
 			},
+			debug
 		}
 	},

@ -41,11 +56,22 @@ export default defineComponent({
 	},

 	methods: {
+		changeDebug(v) {
+			console.log(v);
+			localStorage.setItem('debug', v.toString());
+			location.reload();
+		},
+
 		onChangeInjectFeaturedNote(v) {
 			os.api('i/update', {
 				injectFeaturedNote: v
 			});
 		},
+
+		taskmanager() {
+			os.popup(defineAsyncComponent(() => import('@/components/taskmanager.vue')), {
+			}, {}, 'closed');
+		}
 	}
 });
 </script>
--- a/src/client/pages/settings/regedit.vue
+++ b/src/client/pages/settings/regedit.vue
@ -0,0 +1,77 @@
+<template>
+<div>
+	<div class="_section">
+		<MkInfo warn>{{ $t('editTheseSettingsMayBreakAccount') }}</MkInfo>
+	</div>
+	<div class="_section">
+		<div class="_title">Account</div>
+		<div class="_content">
+			<MkTextarea v-model:value="settings" code tall></MkTextarea>
+			<!--<MkButton @click="saveSettings">Save</MkButton>-->
+		</div>
+	</div>
+	<div class="_section">
+		<div class="_title">Device</div>
+		<div class="_content">
+			<MkTextarea v-model:value="deviceSettings" code tall></MkTextarea>
+			<MkButton @click="saveDeviceSettings">Save</MkButton>
+		</div>
+	</div>
+	<div class="_section">
+		<div class="_title">Device (per account)</div>
+		<div class="_content">
+			<MkTextarea v-model:value="deviceUserSettings" code tall></MkTextarea>
+			<MkButton @click="saveDeviceUserSettings">Save</MkButton>
+		</div>
+	</div>
+</div>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import { faCode } from '@fortawesome/free-solid-svg-icons';
+import * as JSON5 from 'json5';
+import MkInfo from '@/components/ui/info.vue';
+import MkButton from '@/components/ui/button.vue';
+import MkTextarea from '@/components/ui/textarea.vue';
+import * as os from '@/os';
+
+export default defineComponent({
+	components: {
+		MkInfo, MkButton, MkTextarea
+	},
+
+	emits: ['info'],
+
+	data() {
+		return {
+			INFO: {
+				header: [{
+					title: 'RegEdit',
+					icon: faCode
+				}]
+			},
+
+			settings: JSON5.stringify(this.$store.state.settings, null, '\t'),
+			deviceSettings: JSON5.stringify(this.$store.state.device, null, '\t'),
+			deviceUserSettings: JSON5.stringify(this.$store.state.deviceUser, null, '\t'),
+		};
+	},
+
+	mounted() {
+		this.$emit('info', this.INFO);
+	},
+
+	methods: {
+		saveDeviceSettings() {
+			const obj = JSON5.parse(this.deviceSettings);
+			this.$store.commit('device/overwrite', obj);
+		},
+
+		saveDeviceUserSettings() {
+			const obj = JSON5.parse(this.deviceUserSettings);
+			this.$store.commit('deviceUser/overwrite', obj);
+		},
+	}
+});
+</script>
--- a/src/client/pages/settings/theme.vue
+++ b/src/client/pages/settings/theme.vue
@ -43,7 +43,7 @@
 					<option v-for="x in lightThemes" :value="x.id" :key="x.id">{{ x.name }}</option>
 				</optgroup>
 			</MkSelect>
-			<a href="https://assets.msky.cafe/theme/list" rel="noopener" target="_blank" class="_link">{{ $t('_theme.explore') }}</a>・<router-link to="/theme-editor" class="_link">{{ $t('_theme.make') }}</router-link>
+			<a href="https://assets.msky.cafe/theme/list" rel="noopener" target="_blank" class="_link">{{ $t('_theme.explore') }}</a>・<MkA to="/theme-editor" class="_link">{{ $t('_theme.make') }}</MkA>
 		</div>
 		<div class="_content">
 			<MkButton primary v-if="wallpaper == null" @click="setWallpaper">{{ $t('setWallpaper') }}</MkButton>
--- a/src/client/pages/tag.vue
+++ b/src/client/pages/tag.vue
@ -15,11 +15,18 @@ export default defineComponent({
 		XNotes
 	},

+	props: {
+		tag: {
+			type: String,
+			required: true
+		}
+	},
+
 	data() {
 		return {
 			INFO: {
 				header: [{
-					title: this.$route.params.tag,
+					title: this.tag,
 					icon: faHashtag
 				}],
 			},
@ -27,7 +34,7 @@ export default defineComponent({
 				endpoint: 'notes/search-by-tag',
 				limit: 10,
 				params: () => ({
-					tag: this.$route.params.tag,
+					tag: this.tag,
 				})
 			},
 			faHashtag
@ -35,7 +42,7 @@ export default defineComponent({
 	},

 	watch: {
-		$route() {
+		tag() {
 			(this.$refs.notes as any).reload();
 		}
 	},
--- a/src/client/pages/test.vue
+++ b/src/client/pages/test.vue
@ -10,6 +10,10 @@
 				<MkInput v-model:value="dialogBody">
 					<span>Body</span>
 				</MkInput>
+				<MkRadio v-model="dialogType" value="info">Info</MkRadio>
+				<MkRadio v-model="dialogType" value="success">Success</MkRadio>
+				<MkRadio v-model="dialogType" value="warning">Warn</MkRadio>
+				<MkRadio v-model="dialogType" value="error">Error</MkRadio>
 				<MkSwitch v-model:value="dialogCancel">
 					<span>With cancel button</span>
 				</MkSwitch>
@ -133,6 +137,7 @@ import MkButton from '@/components/ui/button.vue';
 import MkInput from '@/components/ui/input.vue';
 import MkSwitch from '@/components/ui/switch.vue';
 import MkTextarea from '@/components/ui/textarea.vue';
+import MkRadio from '@/components/ui/radio.vue';
 import * as os from '@/os';

 export default defineComponent({
@ -141,6 +146,7 @@ export default defineComponent({
 		MkInput,
 		MkSwitch,
 		MkTextarea,
+		MkRadio,
 	},

 	data() {
@ -153,6 +159,7 @@ export default defineComponent({
 			},
 			dialogTitle: 'Hello',
 			dialogBody: 'World!',
+			dialogType: 'info',
 			dialogCancel: false,
 			dialogCancelByBgClick: true,
 			dialogInput: false,
@ -192,6 +199,7 @@ export default defineComponent({
 		async showDialog() {
 			this.dialogResult = null;
 			this.dialogResult = await os.dialog({
+				type: this.dialogType,
 				title: this.dialogTitle,
 				text: this.dialogBody,
 				showCancelButton: this.dialogCancel,
@ -229,7 +237,7 @@ export default defineComponent({
 		},

 		messagingWindowOpen() {
-			os.pageWindow('/my/messaging', defineAsyncComponent(() => import('@/pages/messaging/index.vue')));
+			os.pageWindow('/my/messaging');
 		},

 		openWaitingDialog(text?) {
--- a/src/client/pages/timeline.tutorial.vue
+++ b/src/client/pages/timeline.tutorial.vue
@ -9,7 +9,7 @@
 	<div class="_content" v-else-if="tutorial === 1">
 		<div>{{ $t('_tutorial.step2_1') }}</div>
 		<div>{{ $t('_tutorial.step2_2') }}</div>
-		<router-link class="_link" to="/settings/profile">{{ $t('editProfile') }}</router-link>
+		<MkA class="_link" to="/settings/profile">{{ $t('editProfile') }}</MkA>
 	</div>
 	<div class="_content" v-else-if="tutorial === 2">
 		<div>{{ $t('_tutorial.step3_1') }}</div>
@ -25,10 +25,10 @@
 		<div>{{ $t('_tutorial.step5_1') }}</div>
 		<i18n-t keypath="_tutorial.step5_2" tag="div">
 			<template #featured>
-				<router-link class="_link" to="/featured">{{ $t('featured') }}</router-link>
+				<MkA class="_link" to="/featured">{{ $t('featured') }}</MkA>
 			</template>
 			<template #explore>
-				<router-link class="_link" to="/explore">{{ $t('explore') }}</router-link>
+				<MkA class="_link" to="/explore">{{ $t('explore') }}</MkA>
 			</template>
 		</i18n-t>
 		<div>{{ $t('_tutorial.step5_3') }}</div>
@ -43,7 +43,7 @@
 		<div>{{ $t('_tutorial.step7_1') }}</div>
 		<i18n-t keypath="_tutorial.step7_2" tag="div">
 			<template #help>
-				<router-link class="_link" to="/docs">{{ $t('help') }}</router-link>
+				<MkA class="_link" to="/docs">{{ $t('help') }}</MkA>
 			</template>
 		</i18n-t>
 		<div>{{ $t('_tutorial.step7_3') }}</div>
--- a/src/client/pages/user/follow-list.vue
+++ b/src/client/pages/user/follow-list.vue
@ -10,7 +10,6 @@

 <script lang="ts">
 import { defineComponent } from 'vue';
-import parseAcct from '../../../misc/acct/parse';
 import MkUserInfo from '@/components/user-info.vue';
 import MkPagination from '@/components/ui/pagination.vue';
 import { userPage, acct } from '../../filters/user';
@ -22,10 +21,14 @@ export default defineComponent({
 	},

 	props: {
+		user: {
+			type: Object,
+			required: true
+		},
 		type: {
 			type: String,
 			required: true
-		}
+		},
 	},

 	data() {
@ -34,7 +37,7 @@ export default defineComponent({
 				endpoint: () => this.type === 'following' ? 'users/following' : 'users/followers',
 				limit: 20,
 				params: {
-					...parseAcct(this.$route.params.user),
+					userId: this.user.id,
 				}
 			},
 		};
@ -45,7 +48,7 @@ export default defineComponent({
 			this.$refs.list.reload();
 		},

-		'$route'() {
+		user() {
 			this.$refs.list.reload();
 		}
 	},
--- a/src/client/pages/user/index.photos.vue
+++ b/src/client/pages/user/index.photos.vue
@ -2,11 +2,11 @@
 <div class="ujigsodd">
 	<MkLoading v-if="fetching"/>
 	<div class="stream" v-if="!fetching && images.length > 0">
-		<router-link v-for="(image, i) in images" :key="i"
+		<MkA v-for="image in images"
 			class="img"
 			:style="`background-image: url(${thumbnail(image.file)})`"
 			:to="notePage(image.note)"
-		></router-link>
+		></MkA>
 	</div>
 	<p class="empty" v-if="!fetching && images.length == 0">{{ $t('nothing') }}</p>
 </div>
--- a/src/client/pages/user/index.vue
+++ b/src/client/pages/user/index.vue
@ -67,24 +67,23 @@
 				</dl>
 			</div>
 			<div class="status">
-				<router-link :to="userPage(user)" :class="{ active: $route.name === 'user' }">
+				<MkA :to="userPage(user)" :class="{ active: page === 'index' }">
 					<b>{{ number(user.notesCount) }}</b>
 					<span>{{ $t('notes') }}</span>
-				</router-link>
-				<router-link :to="userPage(user, 'following')" :class="{ active: $route.name === 'userFollowing' }">
+				</MkA>
+				<MkA :to="userPage(user, 'following')" :class="{ active: page === 'following' }">
 					<b>{{ number(user.followingCount) }}</b>
 					<span>{{ $t('following') }}</span>
-				</router-link>
-				<router-link :to="userPage(user, 'followers')" :class="{ active: $route.name === 'userFollowers' }">
+				</MkA>
+				<MkA :to="userPage(user, 'followers')" :class="{ active: page === 'followers' }">
 					<b>{{ number(user.followersCount) }}</b>
 					<span>{{ $t('followers') }}</span>
-				</router-link>
+				</MkA>
 			</div>
 		</div>
 	</div>

-	<router-view :user="user"></router-view>
-	<template v-if="$route.name == 'user'">
+	<template v-if="page === 'index'">
 		<div class="_section">
 			<div class="_content _vMargin" v-if="user.pinnedNotes.length > 0">
 				<XNote v-for="note in user.pinnedNotes" class="note _vMargin" :note="note" @update:note="pinnedNoteUpdated(note, $event)" :key="note.id" :detail="true" :pinned="true"/>
@ -106,6 +105,8 @@
 			<XUserTimeline :user="user" class="_content"/>
 		</div>
 	</template>
+	<XFollowList v-else-if="page === 'following'" type="following" :user="user"/>
+	<XFollowList v-else-if="page === 'followers'" type="followers" :user="user"/>
 </div>
 <div v-else-if="error">
 	<MkError @retry="fetch()"/>
@ -128,7 +129,7 @@ import parseAcct from '../../../misc/acct/parse';
 import { getScrollPosition } from '@/scripts/scroll';
 import { getUserMenu } from '@/scripts/get-user-menu';
 import number from '../../filters/number';
-import { userPage, acct } from '../../filters/user';
+import { userPage, acct as getAcct } from '../../filters/user';
 import * as os from '@/os';

 export default defineComponent({
@ -139,10 +140,23 @@ export default defineComponent({
 		MkContainer,
 		MkRemoteCaution,
 		MkFolder,
+		XFollowList: defineAsyncComponent(() => import('./follow-list.vue')),
 		XPhotos: defineAsyncComponent(() => import('./index.photos.vue')),
 		XActivity: defineAsyncComponent(() => import('./index.activity.vue')),
 	},

+	props: {
+		acct: {
+			type: String,
+			required: true
+		},
+		page: {
+			type: String,
+			required: false,
+			default: 'index'
+		}
+	},
+
 	data() {
 		return {
 			INFO: computed(() => this.user ? {
@ -176,7 +190,7 @@ export default defineComponent({
 	},

 	watch: {
-		$route: 'fetch'
+		acct: 'fetch'
 	},

 	created() {
@ -192,10 +206,12 @@ export default defineComponent({
 	},

 	methods: {
+		getAcct,
+
 		fetch() {
-			if (this.$route.params.user == null) return;
+			if (this.acct == null) return;
 			Progress.start();
-			os.api('users/show', parseAcct(this.$route.params.user)).then(user => {
+			os.api('users/show', parseAcct(this.acct)).then(user => {
 				this.user = user;
 			}).catch(e => {
 				this.error = e;
--- a/src/client/router.ts
+++ b/src/client/router.ts
@ -1,4 +1,4 @@
-import { defineAsyncComponent } from 'vue';
+import { defineAsyncComponent, markRaw } from 'vue';
 import { createRouter, createWebHistory } from 'vue-router';
 import MkLoading from '@/pages/_loading_.vue';
 import MkError from '@/pages/_error_.vue';
@ -18,30 +18,11 @@ export const router = createRouter({
 	routes: [
 		// NOTE: MkTimelineをdynamic importするとAsyncComponentWrapperが間に入るせいでkeep-aliveのコンポーネント指定が効かなくなる
 		{ path: '/', name: 'index', component: store.getters.isSignedIn ? MkTimeline : page('welcome') },
-		{ path: '/@:user', name: 'user', component: page('user/index'), children: [
-			{ path: 'following', name: 'userFollowing', component: page('user/follow-list'), props: { type: 'following' } },
-			{ path: 'followers', name: 'userFollowers', component: page('user/follow-list'), props: { type: 'followers' } },
-		]},
+		{ path: '/@:acct/:page?', name: 'user', component: page('user/index'), props: route => ({ acct: route.params.acct, page: route.params.page || 'index' }) },
 		{ path: '/@:user/pages/:page', component: page('page'), props: route => ({ pageName: route.params.page, username: route.params.user }) },
 		{ path: '/@:user/pages/:pageName/view-source', component: page('page-editor/page-editor'), props: route => ({ initUser: route.params.user, initPageName: route.params.pageName }) },
 		{ path: '/@:acct/room', props: true, component: page('room/room') },
-		{ path: '/settings', name: 'settings', component: page('settings/index'), children: [
-			{ path: 'profile', component: page('settings/profile') },
-			{ path: 'privacy', component: page('settings/privacy') },
-			{ path: 'reaction', component: page('settings/reaction') },
-			{ path: 'notifications', component: page('settings/notifications') },
-			{ path: 'mute-block', component: page('settings/mute-block') },
-			{ path: 'word-mute', component: page('settings/word-mute') },
-			{ path: 'integration', component: page('settings/integration') },
-			{ path: 'security', component: page('settings/security') },
-			{ path: 'api', component: page('settings/api') },
-			{ path: 'other', component: page('settings/other') },
-			{ path: 'general', component: page('settings/general') },
-			{ path: 'theme', component: page('settings/theme') },
-			{ path: 'sidebar', component: page('settings/sidebar') },
-			{ path: 'sounds', component: page('settings/sounds') },
-			{ path: 'plugins', component: page('settings/plugins') },
-		]},
+		{ path: '/settings/:page?', name: 'settings', component: page('settings/index'), props: route => ({ page: route.params.page || null }) },
 		{ path: '/announcements', component: page('announcements') },
 		{ path: '/about', component: page('about') },
 		{ path: '/about-misskey', component: page('about-misskey') },
@ -87,8 +68,11 @@ export const router = createRouter({
 		{ path: '/instance/relays', component: page('instance/relays') },
 		{ path: '/instance/announcements', component: page('instance/announcements') },
 		{ path: '/instance/abuses', component: page('instance/abuses') },
-		{ path: '/notes/:note', name: 'note', component: page('note') },
-		{ path: '/tags/:tag', component: page('tag') },
+		{ path: '/notes/:note', name: 'note', component: page('note'), props: route => ({ noteId: route.params.note }) },
+		{ path: '/tags/:tag', component: page('tag'), props: route => ({ tag: route.params.tag }) },
+		{ path: '/games/reversi', component: page('reversi/index') },
+		{ path: '/games/reversi/:gameId', component: page('reversi/game'), props: route => ({ gameId: route.params.gameId }) },
+		{ path: '/api-console', component: page('api-console') },
 		{ path: '/auth/:token', component: page('auth') },
 		{ path: '/miauth/:session', component: page('miauth') },
 		{ path: '/authorize-follow', component: page('follow') },
@ -120,3 +104,13 @@ router.afterEach((to, from) => {
 		indexScrollPos = window.scrollY;
 	}
 });
+
+export function resolve(path: string) {
+	const resolved = router.resolve(path);
+	const route = resolved.matched[0];
+	return {
+		component: markRaw(route.components.default),
+		// TODO: route.propsには関数以外も入る可能性があるのでよしなにハンドリングする
+		props: route.props?.default ? route.props.default(resolved) : resolved.params
+	};
+}
--- a/src/client/scripts/get-user-menu.ts
+++ b/src/client/scripts/get-user-menu.ts
@ -7,7 +7,6 @@ import getAcct from '../../misc/acct/render';
 import * as os from '@/os';
 import { store, userActions } from '@/store';
 import { router } from '@/router';
-import { defineAsyncComponent } from 'vue';
 import { popout } from './popout';

 export function getUserMenu(user) {
@ -137,7 +136,7 @@ export function getUserMenu(user) {
 		action: () => {
 			const acct = getAcct(user);
 			switch (store.state.device.chatOpenBehavior) {
-				case 'window': { os.pageWindow('/my/messaging/' + acct, defineAsyncComponent(() => import('@/pages/messaging/messaging-room.vue')), { userAcct: acct }); break; }
+				case 'window': { os.pageWindow('/my/messaging/' + acct); break; }
 				case 'popout': { popout('/my/messaging'); break; }
 				default: { router.push('/my/messaging'); break; }
 			}
--- a/src/client/scripts/stream.ts
+++ b/src/client/scripts/stream.ts
@ -1,7 +1,8 @@
 import autobind from 'autobind-decorator';
 import { EventEmitter } from 'eventemitter3';
 import ReconnectingWebsocket from 'reconnecting-websocket';
-import { wsUrl } from '@/config';
+import { markRaw } from 'vue';
+import { debug, wsUrl } from '@/config';
 import { query as urlQuery } from '../../prelude/url';

 /**
@ -28,7 +29,7 @@ export default class Stream extends EventEmitter {
 	}

 	@autobind
-	public useSharedConnection(channel: string): SharedConnection {
+	public useSharedConnection(channel: string, name?: string): SharedConnection {
 		let pool = this.sharedConnectionPools.find(p => p.channel === channel);

 		if (pool == null) {
@ -36,7 +37,7 @@ export default class Stream extends EventEmitter {
 			this.sharedConnectionPools.push(pool);
 		}

-		const connection = new SharedConnection(this, channel, pool);
+		const connection = markRaw(new SharedConnection(this, channel, pool, name));
 		this.sharedConnections.push(connection);
 		return connection;
 	}
@ -53,7 +54,7 @@ export default class Stream extends EventEmitter {

 	@autobind
 	public connectToChannel(channel: string, params?: any): NonSharedConnection {
-		const connection = new NonSharedConnection(this, channel, params);
+		const connection = markRaw(new NonSharedConnection(this, channel, params));
 		this.nonSharedConnections.push(connection);
 		return connection;
 	}
@ -113,6 +114,7 @@ export default class Stream extends EventEmitter {

 			for (const c of connections.filter(c => c != null)) {
 				c.emit(body.type, Object.freeze(body.body));
+				if (debug) c.inCount++;
 			}
 		} else {
 			this.emit(type, Object.freeze(body));
@ -142,6 +144,8 @@ export default class Stream extends EventEmitter {
 	}
 }

+let idCounter = 0;
+
 class Pool {
 	public channel: string;
 	public id: string;
@ -154,7 +158,7 @@ class Pool {
 		this.channel = channel;
 		this.stream = stream;

-		this.id = Math.random().toString().substr(2, 8);
+		this.id = (++idCounter).toString();

 		this.stream.on('_disconnected_', this.onStreamDisconnected);
 	}
@ -216,11 +220,16 @@ abstract class Connection extends EventEmitter {
 	protected stream: Stream;
 	public abstract id: string;

-	constructor(stream: Stream, channel: string) {
+	public name?: string; // for debug
+	public inCount: number = 0; // for debug
+	public outCount: number = 0; // for debug
+
+	constructor(stream: Stream, channel: string, name?: string) {
 		super();

 		this.stream = stream;
 		this.channel = channel;
+		this.name = name;
 	}

 	@autobind
@ -233,6 +242,8 @@ abstract class Connection extends EventEmitter {
 			type: type,
 			body: body
 		});
+
+		if (debug) this.outCount++;
 	}

 	public abstract dispose(): void;
@ -245,8 +256,8 @@ class SharedConnection extends Connection {
 		return this.pool.id;
 	}

-	constructor(stream: Stream, channel: string, pool: Pool) {
-		super(stream, channel);
+	constructor(stream: Stream, channel: string, pool: Pool, name?: string) {
+		super(stream, channel, name);

 		this.pool = pool;
 		this.pool.inc();
@ -273,7 +284,7 @@ class NonSharedConnection extends Connection {
 		super(stream, channel);

 		this.params = params;
-		this.id = Math.random().toString().substr(2, 8);
+		this.id = (++idCounter).toString();

 		this.connect();
 	}
--- a/src/client/sidebar.ts
+++ b/src/client/sidebar.ts
@ -1,6 +1,6 @@
 import { faBell, faComments, faEnvelope } from '@fortawesome/free-regular-svg-icons';
 import { faAt, faBroadcastTower, faCloud, faColumns, faDoorClosed, faFileAlt, faFireAlt, faGamepad, faHashtag, faListUl, faSatellite, faSatelliteDish, faSearch, faStar, faTerminal, faUserClock, faUsers } from '@fortawesome/free-solid-svg-icons';
-import { computed, defineAsyncComponent } from 'vue';
+import { computed } from 'vue';
 import { store } from '@/store';
 import { deckmode } from '@/config';
 import { search } from '@/scripts/search';
@ -23,7 +23,7 @@ export const sidebarDef = {
 		indicated: computed(() => store.getters.isSignedIn && store.state.i.hasUnreadMessagingMessage),
 		action: () => {
 			switch (store.state.device.chatOpenBehavior) {
-				case 'window': { os.pageWindow('/my/messaging', defineAsyncComponent(() => import('@/pages/messaging/index.vue'))); break; }
+				case 'window': { os.pageWindow('/my/messaging'); break; }
 				case 'popout': { popout('/my/messaging'); break; }
 				default: { router.push('/my/messaging'); break; }
 			}
@ -115,7 +115,7 @@ export const sidebarDef = {
 	games: {
 		title: 'games',
 		icon: faGamepad,
-		to: '/games',
+		to: '/games/reversi',
 	},
 	scratchpad: {
 		title: 'scratchpad',
--- a/src/client/store.ts
+++ b/src/client/store.ts
@ -70,11 +70,14 @@ export const defaultDeviceSettings = {
 	animatedMfm: true,
 	imageNewTab: false,
 	chatOpenBehavior: 'page',
+	defaultSideView: false,
+	deckNavWindow: true,
 	showFixedPostForm: false,
 	disablePagesScript: false,
 	enableInfiniteScroll: true,
 	useBlurEffectForModal: true,
 	sidebarDisplay: 'full', // full, icon, hide
+	instanceTicker: 'remote', // none, remote, always
 	roomGraphicsQuality: 'medium',
 	roomUseOrthographicCamera: true,
 	deckColumnAlign: 'left',
@ -202,6 +205,15 @@ export const store = createStore({
 			state: defaultDeviceSettings,

 			mutations: {
+				overwrite(state, x) {
+					for (const k of Object.keys(state)) {
+						if (x[k] === undefined) delete state[k];
+					}
+					for (const k of Object.keys(x)) {
+						state[k] = x[k];
+					}
+				},
+
 				set(state, x: { key: string; value: any }) {
 					state[x.key] = x.value;
 				},
@ -218,6 +230,15 @@ export const store = createStore({
 			state: defaultDeviceUserSettings,

 			mutations: {
+				overwrite(state, x) {
+					for (const k of Object.keys(state)) {
+						if (x[k] === undefined) delete state[k];
+					}
+					for (const k of Object.keys(x)) {
+						state[k] = x[k];
+					}
+				},
+
 				init(state, x) {
 					for (const [key, value] of Object.entries(defaultDeviceUserSettings)) {
 						if (x[key]) {
--- a/src/client/style.scss
+++ b/src/client/style.scss
@ -297,6 +297,21 @@ hr {
 	padding: 12px 0;
 }

+._borderButton {
+	@extend ._button;
+	display: block;
+	width: 100%;
+	padding: 10px;
+	box-sizing: border-box;
+	text-align: center;
+	border: solid 1px var(--divider);
+	border-radius: var(--radius);
+
+	&:active {
+		border-color: var(--accent);
+	}
+}
+
 ._popup {
 	background: var(--panel);
 	border-radius: var(--radius);
@ -484,6 +499,60 @@ hr {
 	100% { transform: translateY(0); }
 }

+// const val = () => `translate(${Math.floor(Math.random() * 20) - 10}px, ${Math.floor(Math.random() * 20) - 10}px)`;
+// let css = '';
+// for (let i = 0; i <= 100; i += 5) { css += `${i}% { transform: ${val()} }\n`; }
+@keyframes anime-twitch {
+	0% { transform: translate(7px, -2px) }
+	5% { transform: translate(-3px, 1px) }
+	10% { transform: translate(-7px, -1px) }
+	15% { transform: translate(0px, -1px) }
+	20% { transform: translate(-8px, 6px) }
+	25% { transform: translate(-4px, -3px) }
+	30% { transform: translate(-4px, -6px) }
+	35% { transform: translate(-8px, -8px) }
+	40% { transform: translate(4px, 6px) }
+	45% { transform: translate(-3px, 1px) }
+	50% { transform: translate(2px, -10px) }
+	55% { transform: translate(-7px, 0px) }
+	60% { transform: translate(-2px, 4px) }
+	65% { transform: translate(3px, -8px) }
+	70% { transform: translate(6px, 7px) }
+	75% { transform: translate(-7px, -2px) }
+	80% { transform: translate(-7px, -8px) }
+	85% { transform: translate(9px, 3px) }
+	90% { transform: translate(-3px, -2px) }
+	95% { transform: translate(-10px, 2px) }
+	100% { transform: translate(-2px, -6px) }
+}
+
+// const val = () => `translate(${Math.floor(Math.random() * 6) - 3}px, ${Math.floor(Math.random() * 6) - 3}px) rotate(${Math.floor(Math.random() * 24) - 12}deg)`;
+// let css = '';
+// for (let i = 0; i <= 100; i += 5) { css += `${i}% { transform: ${val()} }\n`; }
+@keyframes anime-shake {
+	0% { transform: translate(-3px, -1px) rotate(-8deg) }
+	5% { transform: translate(0px, -1px) rotate(-10deg) }
+	10% { transform: translate(1px, -3px) rotate(0deg) }
+	15% { transform: translate(1px, 1px) rotate(11deg) }
+	20% { transform: translate(-2px, 1px) rotate(1deg) }
+	25% { transform: translate(-1px, -2px) rotate(-2deg) }
+	30% { transform: translate(-1px, 2px) rotate(-3deg) }
+	35% { transform: translate(2px, 1px) rotate(6deg) }
+	40% { transform: translate(-2px, -3px) rotate(-9deg) }
+	45% { transform: translate(0px, -1px) rotate(-12deg) }
+	50% { transform: translate(1px, 2px) rotate(10deg) }
+	55% { transform: translate(0px, -3px) rotate(8deg) }
+	60% { transform: translate(1px, -1px) rotate(8deg) }
+	65% { transform: translate(0px, -1px) rotate(-7deg) }
+	70% { transform: translate(-1px, -3px) rotate(6deg) }
+	75% { transform: translate(0px, -2px) rotate(4deg) }
+	80% { transform: translate(-2px, -1px) rotate(3deg) }
+	85% { transform: translate(1px, -3px) rotate(-10deg) }
+	90% { transform: translate(1px, 0px) rotate(3deg) }
+	95% { transform: translate(-2px, 0px) rotate(-3deg) }
+	100% { transform: translate(2px, 1px) rotate(2deg) }
+}
+
@keyframes anime-tada {
 	from {
 		transform: scale3d(1, 1, 1);
--- a/src/client/themes/_dark.json5
+++ b/src/client/themes/_dark.json5
@ -56,6 +56,9 @@
 		wallpaperOverlay: 'rgba(0, 0, 0, 0.5)',
 		badge: '#31b1ce',
 		messageBg: ':lighten<5<@bg',
+		success: '#86b300',
+		error: '#ec4137',
+		warn: '#ecb637',
 		htmlThemeColor: '@bg',
 		X1: ':alpha<0<@bg',
 		X2: ':darken<2<@panel',
--- a/src/client/themes/_light.json5
+++ b/src/client/themes/_light.json5
@ -56,6 +56,9 @@
 		wallpaperOverlay: 'rgba(255, 255, 255, 0.5)',
 		badge: '#31b1ce',
 		messageBg: '@panel',
+		success: '#86b300',
+		error: '#ec4137',
+		warn: '#ecb637',
 		htmlThemeColor: '@bg',
 		X1: ':alpha<0<@bg',
 		X2: ':darken<2<@panel',
--- a/src/client/ui/_common_/common.vue
+++ b/src/client/ui/_common_/common.vue
@ -1,9 +1,4 @@
 <template>
-<ZenUI v-if="zen"/>
-<VisitorUI v-else-if="!$store.getters.isSignedIn"/>
-<DeckUI v-else-if="deckmode"/>
-<DefaultUI v-else/>
-
 <component v-for="popup in popups"
 	:key="popup.id"
 	:is="popup.component"
@ -13,27 +8,23 @@

 <XUpload v-if="uploads.length > 0"/>

+<XStreamIndicator/>
+
 <div id="wait" v-if="pendingApiRequestsCount > 0"></div>
 </template>

 <script lang="ts">
 import { defineAsyncComponent, defineComponent } from 'vue';
-import { deckmode } from '@/config';
 import { popups, uploads, pendingApiRequestsCount } from '@/os';

 export default defineComponent({
 	components: {
-		DefaultUI: defineAsyncComponent(() => import('@/ui/default.vue')),
-		DeckUI: defineAsyncComponent(() => import('@/ui/deck.vue')),
-		ZenUI: defineAsyncComponent(() => import('@/ui/zen.vue')),
-		VisitorUI: defineAsyncComponent(() => import('@/ui/visitor.vue')),
-		XUpload: defineAsyncComponent(() => import('@/components/upload.vue')),
+		XStreamIndicator: defineAsyncComponent(() => import('./stream-indicator.vue')),
+		XUpload: defineAsyncComponent(() => import('./upload.vue')),
 	},

 	setup() {
 		return {
-			zen: window.location.search === '?zen',
-			deckmode,
 			uploads,
 			popups,
 			pendingApiRequestsCount,
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
syuilo	72b03e009c	12.52.0	2020-11-02 17:28:13 +09:00
syuilo	1b113c1045	Update webpack 🚀	2020-11-02 17:28:02 +09:00
syuilo	54959557ea	New Crowdin updates (#6766 ) * New translations ja-JP.yml (English) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (English) * New translations ja-JP.yml (German) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (English) * New translations ja-JP.yml (German) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (English) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Simplified) * New translations ja-JP.yml (Chinese Simplified) * New translations ja-JP.yml (Chinese Simplified) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (German) * New translations ja-JP.yml (English) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (German) * New translations ja-JP.yml (English) * New translations ja-JP.yml (Chinese Simplified) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Japanese, Kansai) * New translations ja-JP.yml (Japanese, Kansai) * New translations ja-JP.yml (Japanese, Kansai) * New translations ja-JP.yml (Japanese, Kansai) * New translations ja-JP.yml (Japanese, Kansai) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Japanese, Kansai) * New translations ja-JP.yml (Japanese, Kansai) * New translations ja-JP.yml (Japanese, Kansai) * New translations ja-JP.yml (Japanese, Kansai) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Ukrainian)	2020-11-02 17:27:42 +09:00
syuilo	d44cb7f256	Add new MFM animation syntax	2020-11-02 15:37:42 +09:00
syuilo	3d063c95d1	🎨	2020-11-02 15:16:48 +09:00
syuilo	09cab605fc	Add new MFM animation	2020-11-02 15:16:37 +09:00
syuilo	666c8c0498	Improve usability	2020-11-01 22:49:08 +09:00
syuilo	d3e764d7f9	Improve task manager	2020-11-01 22:43:19 +09:00
syuilo	7060625adf	Improve task manager etc	2020-11-01 22:09:16 +09:00
syuilo	21b6e23e98	メモリリークの一因になってそうだったのでrefを渡すのを削除	2020-11-01 15:04:46 +09:00
syuilo	a0f794e372	Improve task manager	2020-11-01 14:05:06 +09:00
syuilo	9195504329	Improve task manager	2020-11-01 13:38:48 +09:00
syuilo	8c5d9dd549	🎨	2020-11-01 12:32:34 +09:00
syuilo	580f6a5b6c	Merge branch 'develop' of https://github.com/syuilo/misskey into develop	2020-11-01 12:26:58 +09:00
syuilo	74e76b460b	🎨	2020-11-01 12:26:46 +09:00
syuilo	c4570b37b7	🎨	2020-11-01 12:26:38 +09:00
MeiMei	cd0b0012d9	メッセージ (トーク/チャット) 削除の連合 (#6789 )	2020-11-01 12:14:42 +09:00
syuilo	c055b4d32d	fix(client): ストリーミングのメモリリークを修正 SharedConnection や NonSharedConnection のインスタンスを Vue コンポーネントの data に含むと、Vue が Proxy に変換するため、Stream クラス内部でインスタンス同士の比較をしても false になり、使われなくなったインスタンスがメモリ上に残り続ける。なお、チャンネルへの接続/切断は頻繁に行うものではないため、メモリリークといっても影響は軽微とみられる。	2020-11-01 11:57:34 +09:00
syuilo	75a9ff832a	タスクマネージャー(wip)	2020-11-01 11:39:38 +09:00
syuilo	b64d3af1f3	Merge branch 'develop' of https://github.com/syuilo/misskey into develop	2020-10-31 10:19:12 +09:00
syuilo	fb6605bb40	API: blocking/create or deleteで完全なUser情報を返すように	2020-10-31 10:19:10 +09:00
takonomura	3bfae80fa7	補完でタブが効かなくなるケースを修正 (#6779 )	2020-10-31 09:43:28 +09:00
syuilo	cb16cb0610	Fix #6781	2020-10-31 09:39:22 +09:00
takonomura	0baed1a275	チャンネル一覧でバナーが無いとチャンネル名が出ないのを修正 (#6778 )	2020-10-31 05:53:02 +09:00
mintphin	42162c8015	TOOLS: Created demote tool based on mark-admin.ts (#6776 ) * TOOLS: Created demote tool based on mark-admin.ts * TOOLS: Removed trailing whitespace on demote-admin.ts	2020-10-31 00:21:02 +09:00
takonomura	0fab0c416d	リバーシで相手のターンでも置くことができるのを修正 (#6777 )	2020-10-30 22:39:33 +09:00
sobadon	e2e262c8ce	リンクをコピーでパスしかコピーされない問題を修正 (#6785 )	2020-10-30 18:22:14 +09:00
takonomura	cf6596203b	検索ショートカットが使えないのを修正 (#6783 )	2020-10-30 16:42:51 +09:00
syuilo	471911a54f	Merge branch 'develop' of https://github.com/syuilo/misskey into develop	2020-10-28 22:48:25 +09:00
syuilo	9394f4f540	Fix error dialog	2020-10-28 22:47:57 +09:00
MeiMei	4e968216ad	ドライブファイル参照がシステムユーザーで落ちるのを修正 (#6774 )	2020-10-28 22:24:16 +09:00
syuilo	84a7a9555f	ウィンドウ右クリックでサイドビューで開けるように	2020-10-28 22:21:53 +09:00
syuilo	8d12fd152b	ウィンドウ内のリンクを右クリックしたときに「サイドビューで開く」が無いのを修正	2020-10-28 22:21:40 +09:00
syuilo	629b765abc	12.51.0	2020-10-27 18:29:15 +09:00
syuilo	63a89fa84a	カスタム絵文字がつぶれる問題を修正	2020-10-27 18:28:37 +09:00
syuilo	a3f89236a0	New Crowdin updates (#6760 ) * New translations ja-JP.yml (German) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (English) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (English) * New translations ja-JP.yml (German) * New translations ja-JP.yml (Spanish) * New translations ja-JP.yml (Spanish) * New translations ja-JP.yml (Spanish) * New translations ja-JP.yml (Chinese Simplified) * New translations ja-JP.yml (Chinese Simplified) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Arabic) * New translations ja-JP.yml (Arabic) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (German) * New translations ja-JP.yml (English) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (English) * New translations ja-JP.yml (German) * New translations ja-JP.yml (English) * New translations ja-JP.yml (German) * New translations ja-JP.yml (English) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Chinese Simplified) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Korean) * New translations ja-JP.yml (Arabic) * New translations ja-JP.yml (Spanish) * New translations ja-JP.yml (French) * New translations ja-JP.yml (Japanese, Kansai)	2020-10-27 18:24:34 +09:00
syuilo	01560abafb	Fix #6762	2020-10-27 18:21:52 +09:00
MeiMei	b5698026ba	Fix emojilist.json (#6764 )	2020-10-27 18:15:35 +09:00
syuilo	6258ce75b7	Reversi (#6765 ) * wip * wip * wip * wip * Update game.setting.vue * wip * wip * Update game.setting.vue * wip * Update game.board.vue * wip * Update sidebar.ts	2020-10-27 18:11:41 +09:00
syuilo	6f34c74027	Update popup animation	2020-10-27 16:46:13 +09:00
syuilo	8add4f359b	🎨	2020-10-27 16:45:24 +09:00
syuilo	d8933c135f	リモートインスタンス情報を強制更新するAPIを追加	2020-10-27 16:45:14 +09:00
syuilo	eb350e8d6c	Better favicon detection	2020-10-27 16:44:54 +09:00
syuilo	615fedd64d	Instance Ticker	2020-10-27 16:16:59 +09:00
syuilo	25bd82ecaa	Default behavior option for MkA component	2020-10-27 13:53:47 +09:00
syuilo	e0938e5e3a	Add animation of context menu	2020-10-25 23:22:27 +09:00
syuilo	ec5e6c8443	APIコンソール	2020-10-25 16:11:08 +09:00
syuilo	25d8077474	Fix bug	2020-10-25 15:45:47 +09:00
syuilo	06083f40d9	🎨	2020-10-25 12:47:40 +09:00
syuilo	ec203f7f79	Use MFM instead of v-html to avoid XSS	2020-10-25 12:25:13 +09:00
syuilo	1b30d7d47a	Clean up	2020-10-25 11:29:10 +09:00
syuilo	d9be9c958f	投稿失敗したときにエラー表示するように	2020-10-25 11:19:20 +09:00
syuilo	ed09796e0d	🎨	2020-10-25 11:06:55 +09:00
syuilo	4bfa29c0ab	コンテキストメニューの位置計算を改善	2020-10-25 11:01:03 +09:00
syuilo	4804bbb211	インポート/エクスポート設定を復活	2020-10-25 10:48:33 +09:00
syuilo	749102f9c2	ヘッダーにもコンテキストメニュー追加	2020-10-25 09:26:19 +09:00
syuilo	0bcb1434b0	Refactor	2020-10-25 09:15:20 +09:00
syuilo	2e537e618c	12.50.0	2020-10-25 01:30:38 +09:00
syuilo	fe3b7a2ad3	New Crowdin updates (#6756 ) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Russian)	2020-10-25 01:24:55 +09:00
syuilo	90db793fd0	regesit	2020-10-25 01:24:01 +09:00
syuilo	7bd2a6ad61	Merge branch 'develop' of https://github.com/syuilo/misskey into develop	2020-10-25 01:23:41 +09:00
syuilo	745f4d2439	regedit	2020-10-25 01:23:23 +09:00
syuilo	254cfaea28	自前ルーティング (#6759 ) * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip	2020-10-25 01:21:41 +09:00
syuilo	d4da5a1eea	Update dependencies 🚀	2020-10-24 11:12:29 +09:00
syuilo	c0f8297414	Fix migration bug	2020-10-23 17:46:31 +09:00