13.0.0-beta.30

🎨
2023-01-08 14:30:00 +09:00 · 2023-01-08 14:29:22 +09:00 · 2023-01-08 14:28:14 +09:00 · 2023-01-08 14:22:04 +09:00 · 2023-01-08 14:19:32 +09:00 · 2023-01-08 14:17:56 +09:00
218 changed files with 2486 additions and 1668 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -11,9 +11,18 @@ You should also include the user name that made the change.

 ## 13.0.0 (unreleased)

+### TL;DR
+- New features (Play, new widgets, new charts, etc)
+- Rewriten backend
+- Better performance (backend and frontend)
+- Various usability improvements
+- Various UI tweaks
+
 ### Changes
-#### For sabakans
+#### For server admins
 - Node.js 18.x or later is required
+- PostgreSQL 15.x is required
+	- Misskey not using 15 specific features at 13.0.0, but may do so in the future.
 - Elasticsearchのサポートが削除されました
 	- 代わりに今後任意の検索プロバイダを設定できる仕組みを構想しています。その仕組みを使えば今まで通りElasticsearchも利用できます
 - Migrate to Yarn Berry (v3.2.1) @ThatOneCalculator
@@ -21,14 +30,16 @@ You should also include the user name that made the change.

 #### For users
 - ノートのウォッチ機能が削除されました
+- アンケートに投票された際に通知が作成されなくなりました
 - 新たに動的なPagesを作ることはできなくなりました
 	- 代わりにAiScriptを用いてより柔軟に動的なコンテンツを作成できるMisskey Play機能が実装されています。
- AiScriptが0.12.1にアップデートされました
+- AiScriptが0.12.2にアップデートされました
 	- 0.12.xの変更点についてはこちら https://github.com/syuilo/aiscript/blob/master/CHANGELOG.md#0120
-	- 0.12.1未満のプラグインは読み込むことはできません
+	- 0.12.x未満のプラグインは読み込むことはできません
 - iOS15以下のデバイスはサポートされなくなりました
+- Firefox109以下はサポートされなくなりました

-#### For developers
+#### For app developers
 - API: カスタム絵文字エンティティに`url`プロパティが含まれなくなりました
 	- 絵文字画像を表示するには、`<instance host>/emoji/<emoji name>.webp`にリクエストすると画像が返ります。
 	- e.g. `https://p1.a9z.dev/emoji/misskey.webp`
@@ -67,9 +78,13 @@ You should also include the user name that made the change.
 - Client: Improve RSS widget @tamaina
 - Client: show Unicode emoji tooltip with its name in MkReactionsViewer.reaction @saschanaz
 - Client: OpenSearch support @SoniEx2 @chaoticryptidz
+- Client: Support remote objects in search @SoniEx2
+- Client: user activity page @syuilo
 - Client: add user list widget @syuilo
 - Client: add heatmap of daily active users to about page @syuilo
 - Client: introduce fluent emoji @syuilo
+- Client: add new theme @syuilo
+- Client: show fireworks when visit user who today is birthday @syuilo
 - Client: show bot warning on screen when logged in as bot account @syuilo
 - Client: improve overall performance of client @syuilo
 - Client: ui tweaks @syuilo
@@ -87,6 +102,7 @@ You should also include the user name that made the change.
 - Client: InAppウィンドウが操作できなくなることがあるのを修正 @tamaina
 - Client: use proxied image for instance icon @syuilo
 - Client: Webhookの編集画面で、内容を保存することができない問題を修正 @m-hayabusa
+- Client: Page編集でブロックの移動が行えない問題を修正 @syuilo
 - Client: update emoji picker immediately on all input @saschanaz
 - Client: チャートのツールチップが画面に残ることがあるのを修正 @syuilo
 - Client: fix wrong link in tutorial @syuilo
--- a/locales/ar-SA.yml
+++ b/locales/ar-SA.yml
@@ -380,6 +380,7 @@ administrator: "المدير"
 token: "الرمز المميز"
 twoStepAuthentication: "الإستيثاق بعاملَيْن"
 moderator: "مشرِف"
+moderation: "الإشراف"
 nUsersMentioned: "{n} مستخدمين أُشير إليهم"
 securityKey: "مفتاح الأمان"
 securityKeyName: "اسم المفتاح"
@@ -813,6 +814,9 @@ colored: "ملوّن"
 label: "التسمية"
 localOnly: "المحلي فقط"
 account: "الحسابات"
+cannotLoad: "تعذر التحميل"
+like: "أعجبني"
+show: "المظهر"
 _emailUnavailable:
  used: "هذا البريد الإلكتروني مستخدم"
  format: "صيغة البريد الإلكتروني غير صالحة"
@@ -1228,6 +1232,11 @@ _timelines:
  local: "المحلي"
  social: "الاجتماعي"
  global: "الشامل"
+_play:
+  viewSource: "اظهر المصدر"
+  featured: "الأكثر شعبية"
+  title: "العنوان"
+  summary: "الوصف"
 _pages:
  newPage: "أنشئ صفحة جديدة"
  editPage: "عدّل الصفحة"
@@ -1293,6 +1302,7 @@ _notification:
  yourFollowRequestAccepted: "قُبل طلب المتابعة"
  youWereInvitedToGroup: "دُعيت إلى فريقٍ"
  pollEnded: "ظهرت نتائج الاستطلاع"
+  unreadAntennaNote: "هوائي {name}"
  _types:
    all: "الكل"
    follow: "متابِعون جدد"
--- a/locales/bn-BD.yml
+++ b/locales/bn-BD.yml
@@ -851,6 +851,8 @@ colored: "রঙ্গিন"
 label: "লেবেল"
 localOnly: "শুধুমাত্র লোকাল"
 account: "অ্যাকাউন্টগুলি"
+like: "পছন্দ করা"
+show: "প্রদর্শন"
 _emailUnavailable:
  used: "এই ইমেইল ঠিকানাটি ইতোমধ্যে ব্যবহৃত হয়েছে"
  format: "এই ইমেল ঠিকানাটি সঠিকভাবে লিখা হয়নি"
@@ -1319,6 +1321,12 @@ _timelines:
  local: "স্থানীয়"
  social: "সামাজিক"
  global: "গ্লোবাল"
+_play:
+  viewSource: "উৎস দেখুন"
+  featured: "জনপ্রিয়"
+  title: "শিরোনাম"
+  script: "স্ক্রিপ্ট"
+  summary: "বর্ণনা"
 _pages:
  newPage: "নতুন পৃষ্ঠা বানান"
  editPage: "পৃষ্ঠাটি সম্পাদনা করুন"
--- a/locales/cs-CZ.yml
+++ b/locales/cs-CZ.yml
@@ -610,6 +610,7 @@ speed: "Rychlost"
 slow: "Pomalá"
 fast: "Rychlá"
 account: "Účty"
+show: "Zobrazit"
 _ad:
  back: "Zpět"
 _gallery:
@@ -748,6 +749,9 @@ _charts:
 _timelines:
  home: "Domů"
  global: "Globální"
+_play:
+  script: "Skript"
+  summary: "Popis"
 _pages:
  newPage: "Vytvořit novou stránku"
  editPage: "Upravit stránku"
--- a/locales/de-DE.yml
+++ b/locales/de-DE.yml
@@ -609,7 +609,7 @@ regexpErrorDescription: "Im regulären Ausdruck deiner {tab}en Wortstummschaltun
 instanceMute: "Instanzstummschaltungen"
 userSaysSomething: "{name} hat etwas gesagt"
 makeActive: "Aktivieren"
-display: "Anzeigeart"
+display: "Anzeigen"
 copy: "Kopieren"
 metrics: "Metriken"
 overview: "Übersicht"
@@ -916,6 +916,14 @@ loggedInAsBot: "Momentan als Bot angemeldet"
 tools: "Werkzeuge"
 cannotLoad: "Kann nicht geladen werden"
 numberOfProfileView: "Profilaufrufe"
+like: "Gefällt mir"
+unlike: "\"Gefällt mir\" entfernen"
+numberOfLikes: "\"Gefällt mir\"-Anzahl"
+show: "Anzeigen"
+neverShow: "Nicht wieder anzeigen"
+remindMeLater: "Vielleicht später"
+didYouLikeMisskey: "Gefällt dir Misskey?"
+pleaseDonate: "Misskey ist die kostenlose Software, die von {host} verwendet wird. Wir würden uns über Spenden freuen, damit dessen Entwicklung weitergeführt werden kann!"
 _sensitiveMediaDetection:
  description: "Ermöglicht eine Erleichterung der Servermoderation durch die automatische Erkennungen von NSFW-Medien unter Verwendung von Machine Learning. Hierdurch wird die Serverlast etwas erhöht."
  sensitivity: "Erkennungssensitivität"
@@ -1315,6 +1323,7 @@ _widgets:
  jobQueue: "Job-Warteschlange"
  serverMetric: "Servermetriken"
  aiscript: "AiScript-Konsole"
+  aiscriptApp: "AiScript-Anwendung"
  aichan: "Ai"
  userList: "Benutzerliste"
  _userList:
@@ -1420,6 +1429,21 @@ _timelines:
  local: "Lokal"
  social: "Sozial"
  global: "Global"
+_play:
+  new: "Play erstellen"
+  edit: "Play bearbeiten"
+  created: "Play erfolgreich erstellt"
+  updated: "Play erfolgreich aktualisiert"
+  deleted: "Play erfolgreich gelöscht"
+  pageSetting: "Play-Einstellungen"
+  editThisPage: "Dieses Play bearbeiten"
+  viewSource: "Quelltext anzeigen"
+  my: "Meine Plays"
+  liked: "Mit \"Gefällt mir\" markierte Plays"
+  featured: "Beliebt"
+  title: "Titel"
+  script: "Skript"
+  summary: "Beschreibung"
 _pages:
  newPage: "Seite erstellen"
  editPage: "Seite bearbeiten"
--- a/locales/en-US.yml
+++ b/locales/en-US.yml
@@ -916,6 +916,14 @@ loggedInAsBot: "Currently logged in as bot"
 tools: "Tools"
 cannotLoad: "Unable to load"
 numberOfProfileView: "Profile views"
+like: "Like"
+unlike: "Unlike"
+numberOfLikes: "Likes"
+show: "Show"
+neverShow: "Don't show again"
+remindMeLater: "Maybe later"
+didYouLikeMisskey: "Have you taken a liking to Misskey?"
+pleaseDonate: "{host} uses the free software, Misskey. We would highly appreciate your donations so development of Misskey can continue!"
 _sensitiveMediaDetection:
  description: "Reduces the effort of server moderation through automatically recognizing NSFW media via Machine Learning. This will slightly increase the load on the server."
  sensitivity: "Detection sensitivity"
@@ -1315,6 +1323,7 @@ _widgets:
  jobQueue: "Job Queue"
  serverMetric: "Server metrics"
  aiscript: "AiScript console"
+  aiscriptApp: "AiScript App"
  aichan: "Ai"
  userList: "User list"
  _userList:
@@ -1420,6 +1429,21 @@ _timelines:
  local: "Local"
  social: "Social"
  global: "Global"
+_play:
+  new: "Create Play"
+  edit: "Edit Play"
+  created: "Play created"
+  updated: "Play edited"
+  deleted: "Play deleted"
+  pageSetting: "Play settings"
+  editThisPage: "Edit this Play"
+  viewSource: "View source"
+  my: "My Plays"
+  liked: "Liked Plays"
+  featured: "Popular"
+  title: "Title"
+  script: "Script"
+  summary: "Description"
 _pages:
  newPage: "Create a new Page"
  editPage: "Edit this Page"
--- a/locales/es-ES.yml
+++ b/locales/es-ES.yml
@@ -916,6 +916,8 @@ loggedInAsBot: "Inicio sesión como cuenta bot."
 tools: "Utilidades"
 cannotLoad: "No se puede cargar."
 numberOfProfileView: "Número de vistas de perfil"
+like: "¡Muy bien!"
+show: "Apariencia"
 _sensitiveMediaDetection:
  description: "Reduce el esfuerzo de la moderación el el servidor a través del reconocimiento automático de contenido NSFW usando 'Machine Learning'. Esto puede incrementar ligeramente la carga en el servidor."
  sensitivity: "Sensibilidad de detección"
@@ -1420,6 +1422,12 @@ _timelines:
  local: "Local"
  social: "Social"
  global: "Global"
+_play:
+  viewSource: "Ver la fuente"
+  featured: "Popular"
+  title: "Título"
+  script: "Script"
+  summary: "Descripción"
 _pages:
  newPage: "Crear página"
  editPage: "Editar página"
--- a/locales/fr-FR.yml
+++ b/locales/fr-FR.yml
@@ -910,6 +910,8 @@ caption: "Libellé"
 loggedInAsBot: "Connecté actuellement en tant que bot"
 tools: "Outils"
 cannotLoad: "Chargement impossible"
+like: "J'aime"
+show: "Affichage"
 _sensitiveMediaDetection:
  description: "L'apprentissage automatique peut être utilisé pour détecter automatiquement les médias sensibles à modérer. La sollicitation des serveurs augmente légèrement."
  sensitivity: "Sensibilité de la détection"
@@ -1411,6 +1413,12 @@ _timelines:
  local: "Local"
  social: "Social"
  global: "Global"
+_play:
+  viewSource: "Afficher la source"
+  featured: "Populaire"
+  title: "Titre"
+  script: "Script"
+  summary: "Description"
 _pages:
  newPage: "Créer une page"
  editPage: "Modifier une page"
--- a/locales/id-ID.yml
+++ b/locales/id-ID.yml
@@ -855,6 +855,10 @@ colored: "Diwarnai"
 label: "Label"
 localOnly: "Hanya lokal"
 account: "Akun"
+like: "Suka"
+unlike: "Tidak Suka"
+numberOfLikes: "Jumlah yang disukai"
+show: "Tampilkan"
 _emailUnavailable:
  used: "Alamat surel ini telah digunakan"
  format: "Format tidak valid."
@@ -1220,6 +1224,7 @@ _widgets:
  jobQueue: "Antrian kerja"
  serverMetric: "Statistik peladen"
  aiscript: "Konsol AiScript"
+  aiscriptApp: "Aplikasi AiScript"
  aichan: "Ai"
  _userList:
    chooseList: "Pilih daftar"
@@ -1323,6 +1328,21 @@ _timelines:
  local: "Lokal"
  social: "Sosial"
  global: "Global"
+_play:
+  new: "Membuat Permainan"
+  edit: "Menyunting Permainan"
+  created: "Permainan sudah dibuat"
+  updated: "Permainan sudah diperbaharui"
+  deleted: "Hapus permainan"
+  pageSetting: "Pengaturan permainan"
+  editThisPage: "Sunting Permainan ini"
+  viewSource: "Lihat sumber"
+  my: "Permainan saya"
+  liked: "Permainan Disukai"
+  featured: "Populer"
+  title: "Judul"
+  script: "Script"
+  summary: "Deskripsi"
 _pages:
  newPage: "Buat halaman baru"
  editPage: "Sunting halaman"
--- a/locales/it-IT.yml
+++ b/locales/it-IT.yml
@@ -1,7 +1,7 @@
 ---
 _lang_: "Italiano"
 headlineMisskey: "Rete collegata tramite note"
-introMisskey: "Benvenut@! Misskey è un servizio di microblogging decentralizzato, libero e aperto. \nScrivi \"note\" per condividere ciò che sta succedendo adesso o per dire a tutti qualcosa di te. 📡\nGrazie alla funzione \"reazioni\" puoi anche mandare reazioni rapide alle note delle altre persone del Fediverso. 👍\nEsplora un nuovo mondo! 🚀"
+introMisskey: "Eccoci! Misskey è un servizio di microblogging decentralizzato, libero e aperto. \n📡 Puoi pubblicare «Note» per condividere ciò che sta succedendo o per dire a tutti qualcosa su di te. \n👍 Puoi reagire inviando emoji rapidi alle «Note» provenienti da altri profili nel Fediverso.\n🚀 Esplora un nuovo mondo insieme a noi!"
 poweredByMisskeyDescription: "{name} è uno dei servizi (chiamati istanze) che utilizzano la piattaforma open source <b>Misskey</b>."
 monthAndDay: "{day}/{month}"
 search: "Cerca"
@@ -28,7 +28,7 @@ timeline: "Timeline"
 noAccountDescription: "L'utente non ha ancora scritto niente nella biografia di profilo."
 login: "Accedi"
 loggingIn: "Accesso in corso..."
-logout: "Esci"
+logout: "Uscita"
 signup: "Iscriviti"
 uploading: "Caricamento..."
 save: "Salva"
@@ -876,7 +876,7 @@ deleteAccount: "Eliminazione profilo"
 document: "Documento"
 numberOfPageCache: "Numero di pagine cache"
 numberOfPageCacheDescription: "Aumenta l'usabilità, ma aumenta anche il carico e l'utilizzo della memoria."
-logoutConfirm: "Sei sicuro di voler effettuare il logout?"
+logoutConfirm: "Vuoi davvero uscire da Misskey? "
 lastActiveDate: "Data dell'ultimo utilizzo"
 statusbar: "Barra di stato"
 pleaseSelect: "Scegli un'opzione"
@@ -916,6 +916,8 @@ loggedInAsBot: "Connessione come Bot"
 tools: "Strumenti"
 cannotLoad: "Caricamento impossibile"
 numberOfProfileView: "Visualizzazioni profilo"
+like: "Mi piace!"
+show: "Visualizza"
 _sensitiveMediaDetection:
  description: "L'apprendimento automatico può essere utilizzato per individuare automaticamente i media sensibili da moderare. Il carico del server aumenta leggermente."
  sensitivity: "Sensibilità di rilevamento"
@@ -1067,7 +1069,7 @@ _mfm:
  sparkleDescription: "Aggiungere effetti particellari scintillanti."
  rotate: "Ruota"
  rotateDescription: "Ruota con un angolo specificato."
-  plain: "aereo"
+  plain: "Testo semplice"
  plainDescription: "Disattiva tutta la sintassi interna."
 _instanceTicker:
  none: "Nascondi"
@@ -1205,13 +1207,13 @@ _time:
  day: "giorni"
 _tutorial:
  title: "Come usare Misskey"
-  step1_1: "Benvenuto/a!"
+  step1_1: "Eccoci!"
  step1_2: "Questa pagina si chiama una \" Timeline \". Mostra in ordine cronologico le \" note \" delle persone che segui."
  step1_3: "Attualmente la tua Timeline è vuota perché non segui alcun profilo e non hai pubblicato alcuna nota ancora."
-  step2_1: "Prima di scrivere una nota o di seguire altri profili, imposta il tuo di profilo!"
+  step2_1: "Prima di scrivere una «Nota» o di seguire altri profili, prepara il tuo profilo!"
  step2_2: "Aggiungere qualche informazione su di te aumenterà le tue possibilità di essere seguit@ da altre persone. "
  step3_1: "Hai finito di impostare il tuo profilo?"
-  step3_2: "Ora, puoi pubblicare una nota. Facciamo una prova! Premi il pulsante a forma di penna in cima allo schermo per aprire una finestra di dialogo.  "
+  step3_2: "Ora puoi pubblicare una «Nota». Proviamo subito! Premi il bottone con l'icona «penna» per iniziare a scrivere in una finestra di dialogo.  "
  step3_3: "Scritto il testo della nota, puoi pubblicarla premendo il pulsante nella parte superiore destra della finestra di dialogo."
  step3_4: "Non ti viene niente in mente? Perché non scrivi semplicemente \"Ho appena cominciato a usare Misskey\"?"
  step4_1: "Hai pubblicato qualcosa?"
@@ -1223,7 +1225,7 @@ _tutorial:
  step6_1: "Adesso, dovresti essere in grado di vedere le note dagli altri profili sulla tua timeline."
  step6_2: "Puoi anche rispondere alle note con un click, scegliendo le reazioni immediate."
  step6_3: "Per inviare una reazione, premi l'icona + della nota e scegli l'emoji che vuoi mandare."
-  step7_1: "Complimenti! Sei arrivat@ alla fine dell'esercitazione di base su come usare Misskey. "
+  step7_1: "Congratulazioni! Hai completato l'esercitazione iniziale su come usare Misskey."
  step7_2: "Se vuoi saperne di più su Misskey, puoi dare un'occhiata alla sezione {help}."
  step7_3: "Da ultimo, buon divertimento su Misskey! 🚀"
  step8_1: "Per concludere, vuoi attivare le notifiche push?"
@@ -1315,7 +1317,7 @@ _widgets:
  jobQueue: "Coda di lavoro"
  serverMetric: "Statistiche server"
  aiscript: "Console AiScript"
-  aichan: "indaco (tintura)"
+  aichan: "Mascotte Ai"
  userList: "Elenco utenti"
  _userList:
    chooseList: "Seleziona una lista"
@@ -1420,6 +1422,12 @@ _timelines:
  local: "Locale"
  social: "Sociale"
  global: "Federata"
+_play:
+  viewSource: "Visualizza sorgente"
+  featured: "Popolari"
+  title: "Titolo"
+  script: "Script"
+  summary: "Descrizione"
 _pages:
  newPage: "Crea pagina"
  editPage: "Modifica pagina"
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -920,6 +920,10 @@ like: "いいね！"
 unlike: "いいねを解除"
 numberOfLikes: "いいね数"
 show: "表示"
+neverShow: "今後表示しない"
+remindMeLater: "また後で"
+didYouLikeMisskey: "Misskeyを気に入っていただけましたか？"
+pleaseDonate: "Misskeyは{host}が使用している無料のソフトウェアです。これからも開発を続けられるように、ぜひ寄付をお願いします！"

 _sensitiveMediaDetection:
  description: "機械学習を使って自動でセンシティブなメディアを検出し、モデレーションに役立てることができます。サーバーの負荷が少し増えます。"
@@ -1546,7 +1550,6 @@ _notification:
  youGotReply: "{name}からのリプライ"
  youGotQuote: "{name}による引用"
  youRenoted: "{name}がRenoteしました"
-  youGotPoll: "{name}が投票しました"
  youGotMessagingMessageFromUser: "{name}からのチャットがあります"
  youGotMessagingMessageFromGroup: "{name}のチャットがあります"
  youWereFollowed: "フォローされました"
@@ -1565,7 +1568,6 @@ _notification:
    renote: "Renote"
    quote: "引用"
    reaction: "リアクション"
-    pollVote: "アンケートに投票された"
    pollEnded: "アンケートが終了"
    receiveFollowRequest: "フォロー申請を受け取った"
    followRequestAccepted: "フォローが受理された"
--- a/locales/ja-KS.yml
+++ b/locales/ja-KS.yml
@@ -915,6 +915,8 @@ caption: "キャプション"
 loggedInAsBot: "Botアカウントでログイン中やで"
 tools: "ツール"
 cannotLoad: "読み込めへんで"
+like: "ええやん！"
+show: "表示"
 _sensitiveMediaDetection:
  description: "機械学習を使って自動でセンシティブなメディアを検出して、モデレーションに役立てることができるで。サーバーの負荷が少し増えてまうなあ。"
  sensitivity: "検出感度やで"
@@ -1418,6 +1420,12 @@ _timelines:
  local: "ローカル"
  social: "ソーシャル"
  global: "グローバル"
+_play:
+  viewSource: "ソースを表示"
+  featured: "人気"
+  title: "タイトル"
+  script: "スクリプト"
+  summary: "説明"
 _pages:
  newPage: "ページを作る"
  editPage: "ページの編集"
--- a/locales/ko-KR.yml
+++ b/locales/ko-KR.yml
@@ -916,6 +916,14 @@ loggedInAsBot: "봇 계정으로 로그인중"
 tools: "도구"
 cannotLoad: "불러오지 못했습니다"
 numberOfProfileView: "프로필 뷰 수"
+like: "좋아요!"
+unlike: "좋아요 취소"
+numberOfLikes: "좋아요 수"
+show: "표시"
+neverShow: "다시 보지 않기"
+remindMeLater: "나중에 알림"
+didYouLikeMisskey: "Misskey가 마음에 드시나요?"
+pleaseDonate: "{host}은(는) 무료 소프트웨어 Misskey를 사용합니다. 후원을 통해 저희의 개발이 이어질 수 있게 도와주세요!"
 _sensitiveMediaDetection:
  description: "기계학습을 통해 자동으로 민감한 미디어를 탐지하여, 모더레이션에 참고할 수 있도록 합니다. 서버의 부하를 약간 증가시킵니다."
  sensitivity: "탐지 민감도"
@@ -1315,6 +1323,7 @@ _widgets:
  jobQueue: "작업 대기열"
  serverMetric: "서버 통계"
  aiscript: "AiScript 콘솔"
+  aiscriptApp: "AiScript 앱"
  aichan: "아이"
  userList: "사용자 목록"
  _userList:
@@ -1420,6 +1429,21 @@ _timelines:
  local: "로컬"
  social: "소셜"
  global: "글로벌"
+_play:
+  new: "Play 만들기"
+  edit: "Play 수정하기"
+  created: "Play를 생성했습니다"
+  updated: "Play를 갱신했습니다"
+  deleted: "Play를 삭제했습니다"
+  pageSetting: "Play 설정"
+  editThisPage: "이 Play를 수정"
+  viewSource: "소스 보기"
+  my: "나의 Play"
+  liked: "좋아요 한 Play"
+  featured: "인기"
+  title: "제목"
+  script: "스크립트"
+  summary: "설명"
 _pages:
  newPage: "페이지 만들기"
  editPage: "페이지 수정"
--- a/locales/pl-PL.yml
+++ b/locales/pl-PL.yml
@@ -866,6 +866,8 @@ pushNotificationNotSupported: "Przeglądarka lub instancja nie obsługuje powiad
 sendPushNotificationReadMessage: "Usuń powiadomienia push po przeczytaniu powiadomień i wiadomości."
 sendPushNotificationReadMessageCaption: "Chwilowo pojawi się powiadomienie \"{emptyPushNotificationMessage}\". Może wzrosnąć zużycie baterii urządzenia."
 loggedInAsBot: "Jesteś obecnie zalogowany/a jako bot"
+like: "Polub"
+show: "Wyświetlanie"
 _sensitiveMediaDetection:
  description: "Zmniejsza wysiłek związany z moderacją serwera dzięki automatycznemu rozpoznawaniu zawartości NSFW za pomocą uczenia maszynowego. To nieznacznie zwiększy obciążenie serwera."
  setSensitiveFlagAutomatically: "Oznacz jako NSFW"
@@ -1313,6 +1315,12 @@ _timelines:
  local: "Lokalne"
  social: "Społeczność"
  global: "Globalna"
+_play:
+  viewSource: "Zobacz źródło"
+  featured: "Wyróżnione"
+  title: "Tytuł"
+  script: "Skrypt"
+  summary: "Opis"
 _pages:
  newPage: "Utwórz stronę"
  editPage: "Edytuj tę stronę"
--- a/locales/ro-RO.yml
+++ b/locales/ro-RO.yml
@@ -647,6 +647,7 @@ middle: "Mediu"
 sent: "Trimite"
 searchByGoogle: "Caută"
 file: "Fișiere"
+show: "Arată"
 _email:
  _follow:
    title: "te-a urmărit"
@@ -690,6 +691,9 @@ _charts:
  federation: "Federație"
 _timelines:
  home: "Acasă"
+_play:
+  script: "Script"
+  summary: "Descriere"
 _pages:
  blocks:
    image: "Imagini"
--- a/locales/ru-RU.yml
+++ b/locales/ru-RU.yml
@@ -864,6 +864,8 @@ enableAutoSensitiveDescription: "Если доступно, используйт
 account: "Учётные записи"
 windowMaximize: "Развернуть"
 windowRestore: "Восстановить"
+like: "Нравится!"
+show: "Отображение"
 _sensitiveMediaDetection:
  description: "Машинное обучение может быть использовано для автоматического обнаружения чувствительных медиа для модерации. Нагрузка на сервер увеличивается незначительно."
  setSensitiveFlagAutomatically: "Установить флаг NSFW"
@@ -1332,6 +1334,12 @@ _timelines:
  local: "Местная"
  social: "Социальная"
  global: "Всеобщая"
+_play:
+  viewSource: "Просмотр исходника"
+  featured: "Популярные"
+  title: "Заголовок"
+  script: "Скрипт"
+  summary: "Описание"
 _pages:
  newPage: "Создать страницу"
  editPage: "Править страницу"
--- a/locales/sk-SK.yml
+++ b/locales/sk-SK.yml
@@ -911,6 +911,12 @@ windowRestore: "Obnoviť"
 caption: "Nadpis"
 tools: "Nástroje"
 cannotLoad: "Nedá sa načítať."
+like: "Páči sa mi"
+show: "Zobraziť"
+neverShow: "Nabudúce nezobrazovať"
+remindMeLater: "Pripomenúť neskôr"
+didYouLikeMisskey: "Páči sa vám Misskey?"
+pleaseDonate: "Misskey je bezplatný softvér, ktorý používa {host}. Prosím, prispejte, aby sme ho mohli ďalej rozvíjať!"
 _sensitiveMediaDetection:
  description: "Strojové učenie sa použije na automatickú detekciu citlivých médií na účely ich moderovania. Mierne sa zvýši zaťaženie servera."
  sensitivity: "Citlivosť detekcie"
@@ -1413,6 +1419,12 @@ _timelines:
  local: "Lokálne"
  social: "Sociálne"
  global: "Globálne"
+_play:
+  viewSource: "Ukázať zdroj"
+  featured: "Význačné"
+  title: "Nadpis"
+  script: "Skript"
+  summary: "Popis"
 _pages:
  newPage: "Vytvoriť novú stránku"
  editPage: "Upraviť túto stránku"
--- a/locales/sv-SE.yml
+++ b/locales/sv-SE.yml
@@ -2,6 +2,7 @@
 _lang_: "Svenska"
 headlineMisskey: "Ett nätverk kopplat av noter"
 introMisskey: "Välkommen! Misskey är en öppen och decentraliserad mikrobloggningstjänst.\nSkapa en \"not\" och dela dina tankar med alla runtomkring dig. 📡\nMed \"reaktioner\" kan du snabbt uttrycka dina känslor kring andras noter.👍\nLåt oss utforska en nya värld!🚀"
+poweredByMisskeyDescription: "{name} är en tjänst driven av den öppna källkodsplatformen <b>Misskey</b> (benämns \"Misskey instans\")."
 monthAndDay: "{day}/{month}"
 search: "Sök"
 notifications: "Notifikationer"
@@ -12,6 +13,7 @@ fetchingAsApObject: "Hämtar från Fediversum..."
 ok: "OK"
 gotIt: "Uppfattat!"
 cancel: "Avbryt"
+noThankYou: "Nej tack"
 enterUsername: "Ange användarnamn"
 renotedBy: "Omnoterad av {user}"
 noNotes: "Inga noteringar"
@@ -47,11 +49,13 @@ deleteAndEdit: "Radera och ändra"
 deleteAndEditConfirm: "Är du säker att du vill radera denna not och ändra den? Du kommer förlora alla reaktioner, omnoteringar och svar till den."
 addToList: "Lägg till i lista"
 sendMessage: "Skicka ett meddelande"
+copyRSS: "Kopiera RSS"
 copyUsername: "Kopiera användarnamn"
 searchUser: "Sök användare"
 reply: "Svara"
 loadMore: "Ladda mer"
 showMore: "Visa mer"
+showLess: "Stäng"
 youGotNewFollower: "följde dig"
 receiveFollowRequest: "Följarförfrågan mottagen"
 followRequestAccepted: "Följarförfrågan accepterad"
@@ -238,6 +242,17 @@ saved: "Sparad"
 messaging: "Chatt"
 upload: "Ladda upp"
 keepOriginalUploading: "Behåll originalbild"
+keepOriginalUploadingDescription: "Sparar den originellt uppladdade bilden i sitt i befintliga skick. Om avstängd, kommer en webbversion bli genererad vid uppladdning."
+fromDrive: "Från Drive"
+fromUrl: "Från en länk"
+uploadFromUrl: "Ladda upp från länk"
+uploadFromUrlDescription: "Länken av filen du vill ladda upp"
+uploadFromUrlRequested: "Uppladdning begärd"
+uploadFromUrlMayTakeTime: "Det kan ta tid tills att uppladdningen blir klar."
+explore: "Utforska"
+messageRead: "Läs"
+noMoreHistory: "Det finns ingen mer historik"
+startMessaging: "Starta en chatt"
 nsfw: "Känsligt innehåll"
 pinnedNotes: "Fästad not"
 userList: "Listor"
--- a/locales/th-TH.yml
+++ b/locales/th-TH.yml
@@ -916,6 +916,10 @@ loggedInAsBot: "ล็อกอินเป็นบอตอยู่ในข
 tools: "เครื่องมือ"
 cannotLoad: "ไม่สามารถโหลดได้"
 numberOfProfileView: "มุมมองโปรไฟล์"
+like: "ชื่นชอบ"
+unlike: "ไม่ชอบ"
+numberOfLikes: "จำนวนไลค์"
+show: "แสดงผล"
 _sensitiveMediaDetection:
  description: "ลดความพยายามในการดูแลเซิร์ฟเวอร์ผ่านการจดจำสื่อ NSFW โดยอัตโนมัติผ่านการเรียนรู้ของเครื่อง การทำสิ่งนี้อาจจะเพิ่มภาระบนเซิร์ฟเวอร์เล็กน้อย"
  sensitivity: "การตรวจจับความไว"
@@ -1315,6 +1319,7 @@ _widgets:
  jobQueue: "คิวงาน"
  serverMetric: "ตัวชี้วัดเซิร์ฟเวอร์"
  aiscript: "AiScript คอนโซล"
+  aiscriptApp: "AiScript แอพ"
  aichan: "เอไอ"
  userList: "รายชื่อผู้ใช้"
  _userList:
@@ -1420,6 +1425,21 @@ _timelines:
  local: "ในพื้นที่"
  social: "โซเชี่ยล"
  global: "ทั่วโลก"
+_play:
+  new: "สร้างการเล่น"
+  edit: "แก้ไขเล่น"
+  created: "สร้างการเล่นแล้ว"
+  updated: "แก้ไขการเล่นแล้ว"
+  deleted: "ลบการเล่นแล้ว"
+  pageSetting: "ตั้งค่าการเล่น"
+  editThisPage: "แก้ไข Play นี้"
+  viewSource: "ดูต้นฉบับ"
+  my: "มาย เพลย์"
+  liked: "ไลค์ เพลย์"
+  featured: "เป็นที่นิยม"
+  title: "หัวข้อ"
+  script: "สคริปต์"
+  summary: "รายละเอียด"
 _pages:
  newPage: "สร้างหน้าเพจใหม่"
  editPage: "แก้ไขหน้าเพจ"
--- a/locales/uk-UA.yml
+++ b/locales/uk-UA.yml
@@ -892,6 +892,8 @@ unsubscribePushNotification: "Вимкнути push-сповіщення"
 windowMaximize: "Розгорнути"
 windowRestore: "Відновити"
 caption: "Підпис"
+like: "Вподобати"
+show: "Відображення"
 _sensitiveMediaDetection:
  sensitivity: "Чутливість детектування"
  setSensitiveFlagAutomatically: "Позначити як NSFW"
@@ -1348,6 +1350,12 @@ _timelines:
  local: "Локальна"
  social: "Соціальна"
  global: "Глобальна"
+_play:
+  viewSource: "Переглянути вихідний код"
+  featured: "Популярні"
+  title: "Заголовок"
+  script: "Скрипт"
+  summary: "Опис"
 _pages:
  newPage: "Створити сторінку"
  editPage: "Редагувати сторінку"
--- a/locales/vi-VN.yml
+++ b/locales/vi-VN.yml
@@ -894,6 +894,8 @@ navbar: "Thanh điều hướng"
 shuffle: "Xáo trộn"
 account: "Tài khoản của bạn"
 move: "Di chuyển"
+like: "Thích"
+show: "Hiển thị"
 _sensitiveMediaDetection:
  description: "Giảm nỗ lực kiểm duyệt máy chủ thông qua việc tự động nhận dạng media NSFW thông qua học máy. Điều này sẽ làm tăng một chút áp lực trên máy chủ."
  sensitivity: "Phát hiện nhạy cảm"
@@ -1393,6 +1395,12 @@ _timelines:
  local: "Máy chủ này"
  social: "Xã hội"
  global: "Liên hợp"
+_play:
+  viewSource: "Xem mã nguồn"
+  featured: "Nổi tiếng"
+  title: "Tựa đề"
+  script: "Kịch bản"
+  summary: "Mô tả"
 _pages:
  newPage: "Tạo Trang mới"
  editPage: "Sửa Trang này"
--- a/locales/zh-CN.yml
+++ b/locales/zh-CN.yml
@@ -916,6 +916,10 @@ loggedInAsBot: "以Bot账户登录"
 tools: "工具"
 cannotLoad: "无法加载"
 numberOfProfileView: "个人资料展示次数"
+like: "点赞！"
+unlike: "取消赞"
+numberOfLikes: "点赞数"
+show: "显示"
 _sensitiveMediaDetection:
  description: "可以使用机器学习技术自动检测敏感媒体，以便进行审核。服务器负载将略微增加。"
  sensitivity: "检测敏感度"
@@ -1049,8 +1053,8 @@ _mfm:
  shakeDescription: "显示摇晃的动画效果。"
  twitch: "动画(颤抖)"
  twitchDescription: "显示强烈颤抖的动画效果。"
-  spin: "动画(回转)"
-  spinDescription: "显示回转的动画效果。"
+  spin: "动画(旋转)"
+  spinDescription: "显示旋转的动画效果。"
  x2: "大"
  x2Description: "以大尺寸显示内容。"
  x3: "非常大"
@@ -1315,6 +1319,7 @@ _widgets:
  jobQueue: "作业队列"
  serverMetric: "服务器指标"
  aiscript: "AiScript控制台"
+  aiscriptApp: "AiScript App"
  aichan: "小蓝"
  userList: "用户列表"
  _userList:
@@ -1420,6 +1425,21 @@ _timelines:
  local: "本地"
  social: "社交"
  global: "全局"
+_play:
+  new: "创建Play"
+  edit: "编辑Play"
+  created: "创建了一个Play"
+  updated: "更新了Play"
+  deleted: "删除了Play"
+  pageSetting: "Play设置"
+  editThisPage: "编辑此Play"
+  viewSource: "查看源代码"
+  my: "我的Play"
+  liked: "点赞的Play"
+  featured: "热门"
+  title: "标题"
+  script: "脚本"
+  summary: "描述"
 _pages:
  newPage: "创建页面"
  editPage: "编辑页面"
--- a/locales/zh-TW.yml
+++ b/locales/zh-TW.yml
@@ -916,6 +916,13 @@ loggedInAsBot: "以機器人帳號登入中"
 tools: "工具"
 cannotLoad: "無法載入"
 numberOfProfileView: "個人檔案檢視次數"
+like: "讚"
+unlike: "收回讚"
+numberOfLikes: "讚數"
+show: "檢視"
+neverShow: "不再顯示"
+remindMeLater: "以後再說"
+didYouLikeMisskey: "您是否喜愛Misskey呢？"
 _sensitiveMediaDetection:
  description: "您可以使用機器學習自動檢測敏感媒體並將其用於審核。 伺服器的負荷會稍微增加。"
  sensitivity: "檢測敏感度"
@@ -1315,6 +1322,7 @@ _widgets:
  jobQueue: "佇列"
  serverMetric: "服務器指標 "
  aiscript: "AiScript控制台"
+  aiscriptApp: "AiScript App"
  aichan: "小藍"
  userList: "使用者列表"
  _userList:
@@ -1420,6 +1428,21 @@ _timelines:
  local: "本地"
  social: "社群"
  global: "公開"
+_play:
+  new: "新增Play"
+  edit: "編輯Play"
+  created: "已新增Play"
+  updated: "已更新Play"
+  deleted: "已刪除Play"
+  pageSetting: "Play設定"
+  editThisPage: "編輯這個Play"
+  viewSource: "檢視原始碼"
+  my: "自己的Play"
+  liked: "按了讚的Play"
+  featured: "人氣"
+  title: "標題"
+  script: "腳本"
+  summary: "描述"
 _pages:
  newPage: "建立頁面"
  editPage: "編輯頁面"
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "misskey",
-	"version": "13.0.0-beta.24",
+	"version": "13.0.0-beta.30",
 	"codename": "indigo",
 	"repository": {
 		"type": "git",
@@ -53,10 +53,10 @@
 	"devDependencies": {
 		"@types/gulp": "4.0.10",
 		"@types/gulp-rename": "2.0.1",
-		"@typescript-eslint/eslint-plugin": "5.47.1",
-		"@typescript-eslint/parser": "5.47.1",
+		"@typescript-eslint/eslint-plugin": "5.48.0",
+		"@typescript-eslint/parser": "5.48.0",
 		"cross-env": "7.0.3",
-		"cypress": "12.2.0",
+		"cypress": "12.3.0",
 		"eslint": "^8.31.0",
 		"start-server-and-test": "1.15.2",
 		"typescript": "4.9.4"
--- a/packages/backend/assets/emoji-unknown.png
+++ b/packages/backend/assets/emoji-unknown.png
--- a/packages/backend/package.json
+++ b/packages/backend/package.json
@@ -21,9 +21,9 @@
 		"@tensorflow/tfjs-node": "4.1.0"
 	},
 	"dependencies": {
-		"@bull-board/api": "^4.10.0",
-		"@bull-board/fastify": "^4.10.0",
-		"@bull-board/ui": "^4.10.0",
+		"@bull-board/api": "^4.10.1",
+		"@bull-board/fastify": "^4.10.1",
+		"@bull-board/ui": "^4.10.1",
 		"@discordapp/twemoji": "14.0.2",
 		"@fastify/accepts": "4.1.0",
 		"@fastify/cookie": "^8.3.0",
@@ -38,10 +38,10 @@
 		"@peertube/http-signature": "1.7.0",
 		"@sinonjs/fake-timers": "10.0.2",
 		"accepts": "^1.3.8",
-		"ajv": "8.11.2",
+		"ajv": "8.12.0",
 		"archiver": "5.3.1",
 		"autwh": "0.1.0",
-		"aws-sdk": "2.1286.0",
+		"aws-sdk": "2.1289.0",
 		"bcryptjs": "2.4.3",
 		"blurhash": "2.0.4",
 		"bull": "4.10.2",
@@ -110,8 +110,8 @@
 		"stringz": "2.1.0",
 		"summaly": "2.7.0",
 		"syslog-pro": "git+https://github.com/misskey-dev/SyslogPro#0.2.9-misskey.2",
-		"systeminformation": "5.16.9",
-		"tinycolor2": "1.5.1",
+		"systeminformation": "5.17.1",
+		"tinycolor2": "1.5.2",
 		"tmp": "0.2.1",
 		"tsc-alias": "1.8.2",
 		"tsconfig-paths": "4.1.2",
@@ -128,7 +128,7 @@
 	},
 	"devDependencies": {
 		"@redocly/openapi-core": "1.0.0-beta.117",
-		"@swc/core": "1.3.24",
+		"@swc/core": "1.3.25",
 		"@swc/jest": "0.2.24",
 		"@types/accepts": "1.3.5",
 		"@types/archiver": "5.3.1",
@@ -172,8 +172,8 @@
 		"@types/web-push": "3.3.2",
 		"@types/websocket": "1.0.5",
 		"@types/ws": "8.5.4",
-		"@typescript-eslint/eslint-plugin": "5.47.1",
-		"@typescript-eslint/parser": "5.47.1",
+		"@typescript-eslint/eslint-plugin": "5.48.0",
+		"@typescript-eslint/parser": "5.48.0",
 		"cross-env": "7.0.3",
 		"eslint": "8.31.0",
 		"eslint-plugin-import": "2.26.0",
--- a/packages/backend/src/core/PollService.ts
+++ b/packages/backend/src/core/PollService.ts
@@ -92,13 +92,6 @@ export class PollService {
 			choice: choice,
 			userId: user.id,
 		});
-	
-		// Notify
-		this.createNotificationService.createNotification(note.userId, 'pollVote', {
-			notifierId: user.id,
-			noteId: note.id,
-			choice: choice,
-		});
 	}

 	@bindThis
--- a/packages/backend/src/core/entities/NotificationEntityService.ts
+++ b/packages/backend/src/core/entities/NotificationEntityService.ts
@@ -98,7 +98,7 @@ export class NotificationEntityService implements OnModuleInit {
 				}),
 				reaction: notification.reaction,
 			} : {}),
-			...(notification.type === 'pollVote' ? {
+			...(notification.type === 'pollVote' ? { // TODO: そのうち消す
 				note: this.noteEntityService.pack(notification.note ?? notification.noteId!, { id: notification.notifieeId }, {
 					detail: true,
 					_hint_: options._hintForEachNotes_,
--- a/packages/backend/src/misc/is-mime-image.ts
+++ b/packages/backend/src/misc/is-mime-image.ts
@@ -3,6 +3,7 @@ import { FILE_TYPE_BROWSERSAFE } from '@/const.js';
 const dictionary = {
 	'safe-file': FILE_TYPE_BROWSERSAFE,
 	'sharp-convertible-image': ['image/jpeg', 'image/png', 'image/gif', 'image/apng', 'image/vnd.mozilla.apng', 'image/webp', 'image/avif', 'image/svg+xml'],
+	'sharp-animation-convertible-image': ['image/jpeg', 'image/png', 'image/gif', 'image/webp', 'image/avif', 'image/svg+xml'],
 };

 export const isMimeImage = (mime: string, type: keyof typeof dictionary): boolean => dictionary[type].includes(mime);
--- a/packages/backend/src/models/entities/Notification.ts
+++ b/packages/backend/src/models/entities/Notification.ts
@@ -55,11 +55,11 @@ export class Notification {
 	 * 通知の種類。
 	 * follow - フォローされた
 	 * mention - 投稿で自分が言及された
-	 * reply - (自分または自分がWatchしている)投稿が返信された
-	 * renote - (自分または自分がWatchしている)投稿がRenoteされた
-	 * quote - (自分または自分がWatchしている)投稿が引用Renoteされた
-	 * reaction - (自分または自分がWatchしている)投稿にリアクションされた
-	 * pollVote - (自分または自分がWatchしている)投稿のアンケートに投票された
+	 * reply - 投稿に返信された
+	 * renote - 投稿がRenoteされた
+	 * quote - 投稿が引用Renoteされた
+	 * reaction - 投稿にリアクションされた
+	 * pollVote - 投稿のアンケートに投票された (廃止)
 	 * pollEnded - 自分のアンケートもしくは自分が投票したアンケートが終了した
 	 * receiveFollowRequest - フォローリクエストされた
 	 * followRequestAccepted - 自分の送ったフォローリクエストが承認された
--- a/packages/backend/src/server/MediaProxyServerService.ts
+++ b/packages/backend/src/server/MediaProxyServerService.ts
@@ -79,10 +79,18 @@ export class MediaProxyServerService {
 	
 			const { mime, ext } = await this.fileInfoService.detectType(path);
 			const isConvertibleImage = isMimeImage(mime, 'sharp-convertible-image');
+			const isAnimationConvertibleImage = isMimeImage(mime, 'sharp-animation-convertible-image');
 	
 			let image: IImage;
 			if ('emoji' in request.query && isConvertibleImage) {
-				const data = await sharp(path, { animated: !('static' in request.query) })
+				if (!isAnimationConvertibleImage && !('static' in request.query)) {
+					image = {
+						data: fs.readFileSync(path),
+						ext,
+						type: mime,
+					};
+				} else {
+					const data = await sharp(path, { animated: !('static' in request.query) })
 					.resize({
 						height: 128,
 						withoutEnlargement: true,
@@ -90,11 +98,12 @@ export class MediaProxyServerService {
 					.webp(webpDefault)
 					.toBuffer();

-				image = {
-					data,
-					ext: 'webp',
-					type: 'image/webp',
-				};
+					image = {
+						data,
+						ext: 'webp',
+						type: 'image/webp',
+					};
+				}
 			} else if ('static' in request.query && isConvertibleImage) {
 				image = await this.imageProcessingService.convertToWebp(path, 498, 280);
 			} else if ('preview' in request.query && isConvertibleImage) {
--- a/packages/backend/src/server/ServerService.ts
+++ b/packages/backend/src/server/ServerService.ts
@@ -1,12 +1,11 @@
 import cluster from 'node:cluster';
 import * as fs from 'node:fs';
-import * as http from 'node:http';
 import { Inject, Injectable } from '@nestjs/common';
 import Fastify from 'fastify';
 import { IsNull } from 'typeorm';
 import { GlobalEventService } from '@/core/GlobalEventService.js';
 import type { Config } from '@/config.js';
-import type { UserProfilesRepository, UsersRepository } from '@/models/index.js';
+import type { EmojisRepository, UserProfilesRepository, UsersRepository } from '@/models/index.js';
 import { DI } from '@/di-symbols.js';
 import type Logger from '@/logger.js';
 import { envOption } from '@/env.js';
@@ -39,6 +38,9 @@ export class ServerService {
 		@Inject(DI.userProfilesRepository)
 		private userProfilesRepository: UserProfilesRepository,

+		@Inject(DI.emojisRepository)
+		private emojisRepository: EmojisRepository,
+
 		private userEntityService: UserEntityService,
 		private apiServerService: ApiServerService,
 		private streamingApiServerService: StreamingApiServerService,
@@ -77,6 +79,43 @@ export class ServerService {
 		fastify.register(this.nodeinfoServerService.createServer);
 		fastify.register(this.wellKnownServerService.createServer);

+		fastify.get<{ Params: { path: string }; Querystring: { static?: any; }; }>('/emoji/:path(.*)', async (request, reply) => {
+			const path = request.params.path;
+
+			if (!path.match(/^[a-zA-Z0-9\-_@\.]+?\.webp$/)) {
+				reply.code(404);
+				return;
+			}
+
+			reply.header('Cache-Control', 'public, max-age=86400');
+
+			const name = path.split('@')[0].replace('.webp', '');
+			const host = path.split('@')[1]?.replace('.webp', '');
+
+			const emoji = await this.emojisRepository.findOneBy({
+				// `@.` is the spec of ReactionService.decodeReaction
+				host: (host == null || host === '.') ? IsNull() : host,
+				name: name,
+			});
+
+			reply.header('Content-Security-Policy', 'default-src \'none\'; style-src \'unsafe-inline\'');
+
+			if (emoji == null) {
+				return await reply.redirect('/static-assets/emoji-unknown.png');
+			}
+
+			const url = new URL('/proxy/emoji.webp', this.config.url);
+			// || emoji.originalUrl してるのは後方互換性のため（publicUrlはstringなので??はだめ）
+			url.searchParams.set('url', emoji.publicUrl || emoji.originalUrl);
+			url.searchParams.set('emoji', '1');
+			if ('static' in request.query) url.searchParams.set('static', '1');
+
+			return await reply.redirect(
+				301,
+				url.toString(),
+			);
+		});
+
 		fastify.get<{ Params: { acct: string } }>('/avatar/@:acct', async (request, reply) => {
 			const { username, host } = Acct.parse(request.params.acct);
 			const user = await this.usersRepository.findOne({
--- a/packages/backend/src/server/api/endpoints/notes/polls/vote.ts
+++ b/packages/backend/src/server/api/endpoints/notes/polls/vote.ts
@@ -162,13 +162,6 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 				userId: me.id,
 			});

-			// Notify
-			this.createNotificationService.createNotification(note.userId, 'pollVote', {
-				notifierId: me.id,
-				noteId: note.id,
-				choice: ps.choice,
-			});
-
 			// リモート投票の場合リプライ送信
 			if (note.userHost != null) {
 				const pollOwner = await this.usersRepository.findOneByOrFail({ id: note.userId }) as IRemoteUser;
--- a/packages/backend/src/server/web/ClientServerService.ts
+++ b/packages/backend/src/server/web/ClientServerService.ts
@@ -1,6 +1,5 @@
 import { dirname } from 'node:path';
 import { fileURLToPath } from 'node:url';
-import { PathOrFileDescriptor, readFileSync } from 'node:fs';
 import { Inject, Injectable } from '@nestjs/common';
 import { createBullBoard } from '@bull-board/api';
 import { BullAdapter } from '@bull-board/api/bullAdapter.js';
@@ -71,9 +70,6 @@ export class ClientServerService {
 		@Inject(DI.pagesRepository)
 		private pagesRepository: PagesRepository,

-		@Inject(DI.emojisRepository)
-		private emojisRepository: EmojisRepository,
-
 		@Inject(DI.flashsRepository)
 		private flashsRepository: FlashsRepository,

@@ -225,44 +221,6 @@ export class ClientServerService {
 			return reply.sendFile('/apple-touch-icon.png', staticAssets);
 		});

-		fastify.get<{ Params: { path: string }; Querystring: { static?: any; }; }>('/emoji/:path(.*)', async (request, reply) => {
-			const path = request.params.path;
-
-			if (!path.match(/^[a-zA-Z0-9\-_@\.]+?\.webp$/)) {
-				reply.code(404);
-				return;
-			}
-
-			reply.header('Cache-Control', 'public, max-age=86400');
-
-			const name = path.split('@')[0].replace('.webp', '');
-			const host = path.split('@')[1]?.replace('.webp', '');
-
-			const emoji = await this.emojisRepository.findOneBy({
-				// `@.` is the spec of ReactionService.decodeReaction
-				host: (host == null || host === '.') ? IsNull() : host,
-				name: name,
-			});
-
-			if (emoji == null) {
-				reply.code(404);
-				return;
-			}
-
-			reply.header('Content-Security-Policy', 'default-src \'none\'; style-src \'unsafe-inline\'');
-
-			const url = new URL('/proxy/emoji.webp', this.config.url);
-			// || emoji.originalUrl してるのは後方互換性のため（publicUrlはstringなので??はだめ）
-			url.searchParams.set('url', emoji.publicUrl || emoji.originalUrl);
-			url.searchParams.set('emoji', '1');
-			if ('static' in request.query) url.searchParams.set('static', '1');
-
-			return await reply.redirect(
-				301,
-				url.toString(),
-			);
-		});
-
 		fastify.get<{ Params: { path: string } }>('/fluent-emoji/:path(.*)', async (request, reply) => {
 			const path = request.params.path;

@@ -357,7 +315,7 @@ export class ClientServerService {
 			const name = meta.name || 'Misskey';
 			let content = '';
 			content += '<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/" xmlns:moz="http://www.mozilla.org/2006/browser/search/">';
-			content += `<ShortName>${name} Search</ShortName>`;
+			content += `<ShortName>${name}</ShortName>`;
 			content += `<Description>${name} Search</Description>`;
 			content += '<InputEncoding>UTF-8</InputEncoding>';
 			content += `<Image width="16" height="16" type="image/x-icon">${this.config.url}/favicon.ico</Image>`;
--- a/packages/backend/src/server/web/views/base.pug
+++ b/packages/backend/src/server/web/views/base.pug
@@ -31,7 +31,7 @@ html
 		link(rel='icon' href= icon || '/favicon.ico')
 		link(rel='apple-touch-icon' href= icon || '/apple-touch-icon.png')
 		link(rel='manifest' href='/manifest.json')
-		link(rel='search' type='application/opensearchdescription+xml' title=((title || "Misskey") + " Search") href=`${url}/opensearch.xml`)
+		link(rel='search' type='application/opensearchdescription+xml' title=(title || "Misskey") href=`${url}/opensearch.xml`)
 		link(rel='prefetch' href='https://xn--931a.moe/assets/info.jpg')
 		link(rel='prefetch' href='https://xn--931a.moe/assets/not-found.jpg')
 		link(rel='prefetch' href='https://xn--931a.moe/assets/error.jpg')
--- a/packages/frontend/package.json
+++ b/packages/frontend/package.json
@@ -11,7 +11,7 @@
 		"@rollup/plugin-alias": "4.0.2",
 		"@rollup/plugin-json": "6.0.0",
 		"@rollup/pluginutils": "5.0.2",
-		"@syuilo/aiscript": "0.12.1",
+		"@syuilo/aiscript": "0.12.2",
 		"@tabler/icons": "^1.118.0",
 		"@vitejs/plugin-vue": "4.0.0",
 		"@vue/compiler-sfc": "3.2.45",
@@ -20,7 +20,8 @@
 		"blurhash": "2.0.4",
 		"broadcast-channel": "4.19.1",
 		"browser-image-resizer": "git+https://github.com/misskey-dev/browser-image-resizer#v2.2.1-misskey.3",
-		"chart.js": "4.1.1",
+		"canvas-confetti": "^1.6.0",
+		"chart.js": "4.1.2",
 		"chartjs-adapter-date-fns": "3.0.0",
 		"chartjs-chart-matrix": "^1.3.0",
 		"chartjs-plugin-gradient": "0.6.1",
@@ -35,7 +36,7 @@
 		"insert-text-at-cursor": "0.3.0",
 		"is-file-animated": "1.0.2",
 		"json5": "2.2.3",
-		"katex": "0.15.6",
+		"katex": "0.16.4",
 		"matter-js": "0.18.0",
 		"mfm-js": "0.23.0",
 		"misskey-js": "0.0.14",
@@ -44,7 +45,7 @@
 		"punycode": "2.1.1",
 		"querystring": "0.2.1",
 		"rndstr": "1.0.0",
-		"rollup": "3.9.0",
+		"rollup": "3.9.1",
 		"s-age": "1.1.2",
 		"sanitize-html": "^2.8.1",
 		"sass": "1.57.1",
@@ -55,14 +56,14 @@
 		"textarea-caret": "3.1.0",
 		"three": "0.148.0",
 		"throttle-debounce": "5.0.0",
-		"tinycolor2": "1.5.1",
+		"tinycolor2": "1.5.2",
 		"tsc-alias": "1.8.2",
 		"tsconfig-paths": "4.1.2",
 		"twemoji-parser": "14.0.0",
 		"typescript": "4.9.4",
 		"uuid": "9.0.0",
 		"vanilla-tilt": "1.8.0",
-		"vite": "4.0.3",
+		"vite": "4.0.4",
 		"vue": "3.2.45",
 		"vue-prism-editor": "2.0.0-alpha.2",
 		"vuedraggable": "next"
@@ -72,7 +73,7 @@
 		"@types/glob": "8.0.0",
 		"@types/gulp": "4.0.10",
 		"@types/gulp-rename": "2.0.1",
-		"@types/katex": "0.14.0",
+		"@types/katex": "0.16.0",
 		"@types/matter-js": "0.18.2",
 		"@types/punycode": "2.1.0",
 		"@types/sanitize-html": "^2.8.0",
@@ -82,16 +83,16 @@
 		"@types/uuid": "9.0.0",
 		"@types/websocket": "1.0.5",
 		"@types/ws": "8.5.4",
-		"@typescript-eslint/eslint-plugin": "5.47.1",
-		"@typescript-eslint/parser": "5.47.1",
+		"@typescript-eslint/eslint-plugin": "5.48.0",
+		"@typescript-eslint/parser": "5.48.0",
 		"@vue/runtime-core": "3.2.45",
 		"cross-env": "7.0.3",
-		"cypress": "12.2.0",
+		"cypress": "12.3.0",
 		"eslint": "8.31.0",
 		"eslint-plugin-import": "2.26.0",
 		"eslint-plugin-vue": "9.8.0",
 		"start-server-and-test": "1.15.2",
 		"vue-eslint-parser": "^9.1.0",
-		"vue-tsc": "^1.0.19"
+		"vue-tsc": "^1.0.22"
 	}
 }
--- a/packages/frontend/src/account.ts
+++ b/packages/frontend/src/account.ts
@@ -6,12 +6,13 @@ import { del, get, set } from '@/scripts/idb-proxy';
 import { apiUrl } from '@/config';
 import { waiting, api, popup, popupMenu, success, alert } from '@/os';
 import { unisonReload, reloadChannel } from '@/scripts/unison-reload';
+import { miLocalStorage } from './local-storage';

 // TODO: 他のタブと永続化されたstateを同期

 type Account = misskey.entities.MeDetailed;

-const accountData = localStorage.getItem('account');
+const accountData = miLocalStorage.getItem('account');

 // TODO: 外部からはreadonlyに
 export const $i = accountData ? reactive(JSON.parse(accountData) as Account) : null;
@@ -21,7 +22,7 @@ export const iAmAdmin = $i != null && $i.isAdmin;

 export async function signout() {
 	waiting();
-	localStorage.removeItem('account');
+	miLocalStorage.removeItem('account');

 	await removeAccount($i.id);

@@ -119,7 +120,7 @@ export function updateAccount(accountData) {
 	for (const [key, value] of Object.entries(accountData)) {
 		$i[key] = value;
 	}
-	localStorage.setItem('account', JSON.stringify($i));
+	miLocalStorage.setItem('account', JSON.stringify($i));
 }

 export function refreshAccount() {
@@ -130,7 +131,7 @@ export async function login(token: Account['token'], redirect?: string) {
 	waiting();
 	if (_DEV_) console.log('logging as token ', token);
 	const me = await fetchAccount(token);
-	localStorage.setItem('account', JSON.stringify(me));
+	miLocalStorage.setItem('account', JSON.stringify(me));
 	document.cookie = `token=${token}; path=/; max-age=31536000`; // bull dashboardの認証とかで使う
 	await addAccount(me.id, token);

--- a/packages/frontend/src/components/MkAbuseReport.vue
+++ b/packages/frontend/src/components/MkAbuseReport.vue
@@ -37,7 +37,7 @@

 <script lang="ts" setup>
 import MkButton from '@/components/MkButton.vue';
-import MkSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import MkKeyValue from '@/components/MkKeyValue.vue';
 import { acct, userPage } from '@/filters/user';
 import * as os from '@/os';
--- a/packages/frontend/src/components/MkAbuseReportWindow.vue
+++ b/packages/frontend/src/components/MkAbuseReportWindow.vue
@@ -9,7 +9,7 @@
 		</I18n>
 	</template>
 	<MkSpacer :margin-min="20" :margin-max="28">
-		<div class="dpvffvvy _autoGap">
+		<div class="dpvffvvy _gaps_m">
 			<div class="">
 				<MkTextarea v-model="comment">
 					<template #label>{{ i18n.ts.details }}</template>
@@ -28,7 +28,7 @@
 import { ref, shallowRef } from 'vue';
 import * as Misskey from 'misskey-js';
 import MkWindow from '@/components/MkWindow.vue';
-import MkTextarea from '@/components/form/textarea.vue';
+import MkTextarea from '@/components/MkTextarea.vue';
 import MkButton from '@/components/MkButton.vue';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
--- a/packages/frontend/src/components/MkAsUi.vue
+++ b/packages/frontend/src/components/MkAsUi.vue
@@ -51,10 +51,10 @@
 import { computed, defineAsyncComponent, onMounted, onUnmounted, Ref } from 'vue';
 import * as os from '@/os';
 import MkButton from '@/components/MkButton.vue';
-import MkInput from '@/components/form/input.vue';
-import MkSwitch from '@/components/form/switch.vue';
-import MkTextarea from '@/components/form/textarea.vue';
-import MkSelect from '@/components/form/select.vue';
+import MkInput from '@/components/MkInput.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
+import MkTextarea from '@/components/MkTextarea.vue';
+import MkSelect from '@/components/MkSelect.vue';
 import { AsUiComponent } from '@/scripts/aiscript/ui';
 import FormFolder from '@/components/form/folder.vue';

--- a/packages/frontend/src/components/MkAutocomplete.vue
+++ b/packages/frontend/src/components/MkAutocomplete.vue
@@ -46,6 +46,7 @@ import { defaultStore } from '@/store';
 import { emojilist } from '@/scripts/emojilist';
 import { instance } from '@/instance';
 import { i18n } from '@/i18n';
+import { miLocalStorage } from '@/local-storage';

 type EmojiDef = {
 	emoji: string;
@@ -208,7 +209,7 @@ function exec() {
 		}
 	} else if (props.type === 'hashtag') {
 		if (!props.q || props.q === '') {
-			hashtags.value = JSON.parse(localStorage.getItem('hashtags') || '[]');
+			hashtags.value = JSON.parse(miLocalStorage.getItem('hashtags') || '[]');
 			fetching.value = false;
 		} else {
 			const cacheKey = `autocomplete:hashtag:${props.q}`;
--- a/packages/frontend/src/components/MkChart.vue
+++ b/packages/frontend/src/components/MkChart.vue
@@ -16,7 +16,6 @@
 */
 import { onMounted, ref, shallowRef, watch, PropType, onUnmounted } from 'vue';
 import { Chart } from 'chart.js';
-import { enUS } from 'date-fns/locale';
 import gradient from 'chartjs-plugin-gradient';
 import * as os from '@/os';
 import { defaultStore } from '@/store';
@@ -186,6 +185,10 @@ const render = () => {
 					time: {
 						stepSize: 1,
 						unit: props.span === 'day' ? 'month' : 'day',
+						displayFormats: {
+							day: 'M/d',
+							month: 'Y/M',
+						},
 					},
 					grid: {
 					},
@@ -194,11 +197,6 @@ const render = () => {
 						maxRotation: 0,
 						autoSkipPadding: 16,
 					},
-					adapters: {
-						date: {
-							locale: enUS,
-						},
-					},
 					min: getDate(props.limit).getTime(),
 				},
 				y: {
--- a/packages/frontend/src/components/MkChartLegend.vue
+++ b/packages/frontend/src/components/MkChartLegend.vue
@@ -72,4 +72,11 @@ defineExpose({
 		}
 	}
 }
+
+@container (max-width: 500px) {
+	.root {
+		font-size: 90%;
+		gap: 6px;
+	}
+}
 </style>
--- a/packages/frontend/src/components/form/checkbox.vue
+++ b/packages/frontend/src/components/form/checkbox.vue
--- a/packages/frontend/src/components/MkContextMenu.vue
+++ b/packages/frontend/src/components/MkContextMenu.vue
@@ -74,7 +74,7 @@ function onMousedown(evt: Event) {
 }

 .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);
+	transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1), transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
 	transform-origin: left top;
 }

--- a/packages/frontend/src/components/MkDialog.vue
+++ b/packages/frontend/src/components/MkDialog.vue
@@ -42,8 +42,8 @@
 import { onBeforeUnmount, onMounted, ref, shallowRef } from 'vue';
 import MkModal from '@/components/MkModal.vue';
 import MkButton from '@/components/MkButton.vue';
-import MkInput from '@/components/form/input.vue';
-import MkSelect from '@/components/form/select.vue';
+import MkInput from '@/components/MkInput.vue';
+import MkSelect from '@/components/MkSelect.vue';
 import { i18n } from '@/i18n';

 type Input = {
--- a/packages/frontend/src/components/MkDonation.vue
+++ b/packages/frontend/src/components/MkDonation.vue
@@ -0,0 +1,109 @@
+<template>
+<div class="_panel _shadow" :class="$style.root">
+	<!-- TODO: インスタンス運営者が任意のテキストとリンクを設定できるようにする -->
+	<div :class="$style.icon">
+		<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-pig-money" width="40" height="40" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+			<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+			<path d="M15 11v.01"></path>
+			<path d="M5.173 8.378a3 3 0 1 1 4.656 -1.377"></path>
+			<path d="M16 4v3.803a6.019 6.019 0 0 1 2.658 3.197h1.341a1 1 0 0 1 1 1v2a1 1 0 0 1 -1 1h-1.342c-.336 .95 -.907 1.8 -1.658 2.473v2.027a1.5 1.5 0 0 1 -3 0v-.583a6.04 6.04 0 0 1 -1 .083h-4a6.04 6.04 0 0 1 -1 -.083v.583a1.5 1.5 0 0 1 -3 0v-2l.001 -.027a6 6 0 0 1 3.999 -10.473h2.5l4.5 -3h.001z"></path>
+		</svg>
+	</div>
+	<div :class="$style.main">
+		<div :class="$style.title">{{ i18n.ts.didYouLikeMisskey }}</div>
+		<div :class="$style.text">
+			<I18n :src="i18n.ts.pleaseDonate" tag="span">
+				<template #host>
+					{{ $instance.name ?? host }}
+				</template>
+			</I18n>
+			<div style="margin-top: 0.2em;">
+				<MkLink target="_blank" url="https://misskey-hub.net/docs/donate.html">{{ i18n.ts.learnMore }}</MkLink>
+			</div>
+		</div>
+		<div class="_buttons">
+			<MkButton @click="close">{{ i18n.ts.remindMeLater }}</MkButton>
+			<MkButton @click="neverShow">{{ i18n.ts.neverShow }}</MkButton>
+		</div>
+	</div>
+	<button class="_button" :class="$style.close" @click="close"><i class="ti ti-x"></i></button>
+</div>
+</template>
+
+<script lang="ts" setup>
+import { onMounted, shallowRef } from 'vue';
+import MkButton from '@/components/MkButton.vue';
+import MkLink from '@/components/MkLink.vue';
+import { host } from '@/config';
+import { i18n } from '@/i18n';
+import * as os from '@/os';
+import { miLocalStorage } from '@/local-storage';
+
+const emit = defineEmits<{
+	(ev: 'closed'): void;
+}>();
+
+const zIndex = os.claimZIndex('low');
+
+function close() {
+	miLocalStorage.setItem('latestDonationInfoShownAt', Date.now().toString());
+	emit('closed');
+}
+
+function neverShow() {
+	miLocalStorage.setItem('neverShowDonationInfo', 'true')
+	close();
+}
+</script>
+
+<style lang="scss" module>
+.root {
+	position: fixed;
+	z-index: v-bind(zIndex);
+	bottom: var(--margin);
+	left: 0;
+	right: 0;
+	margin: auto;
+	box-sizing: border-box;
+	width: calc(100% - (var(--margin) * 2));
+	max-width: 500px;
+	display: flex;
+}
+
+.icon {
+	text-align: center;
+	padding-top: 25px;
+	width: 100px;
+	color: var(--accent);
+}
+@media (max-width: 500px) {
+	.icon {
+		width: 80px;
+	}
+}
+@media (max-width: 450px) {
+	.icon {
+		width: 70px;
+	}
+}
+
+.main {
+	padding: 25px 25px 25px 0;
+	flex: 1;
+}
+
+.close {
+	position: absolute;
+	top: 8px;
+	right: 8px;
+	padding: 8px;
+}
+
+.title {
+	font-weight: bold;
+}
+
+.text {
+	margin: 0.7em 0 1em 0;
+}
+</style>
--- a/packages/frontend/src/components/MkEmojiPicker.vue
+++ b/packages/frontend/src/components/MkEmojiPicker.vue
@@ -1,5 +1,5 @@
 <template>
-<div class="omfetrab" :class="['s' + size, 'w' + width, 'h' + height, { asDrawer }]" :style="{ maxHeight: maxHeight ? maxHeight + 'px' : undefined }">
+<div class="omfetrab" :class="['s' + size, 'w' + width, 'h' + height, { asDrawer, asWindow }]" :style="{ maxHeight: maxHeight ? maxHeight + 'px' : undefined }">
 	<input ref="search" :value="q" class="search" data-prevent-emoji-insert :class="{ filled: q != null && q != '' }" :placeholder="i18n.ts.search" type="search" @input="input()" @paste.stop="paste" @keyup.enter="done()">
 	<div ref="emojis" class="emojis">
 		<section class="result">
@@ -94,6 +94,7 @@ const props = withDefaults(defineProps<{
 	asReactionPicker?: boolean;
 	maxHeight?: number;
 	asDrawer?: boolean;
+	asWindow?: boolean;
 }>(), {
 	showPinned: true,
 });
@@ -440,6 +441,28 @@ defineExpose({
 		}
 	}

+	&.asWindow {
+		width: 100% !important;
+		height: 100% !important;
+
+		> .emojis {
+			::v-deep(section) {
+				> .body {
+					display: grid;
+					grid-template-columns: var(--columns);
+					font-size: 30px;
+
+					> .item {
+						aspect-ratio: 1 / 1;
+						width: auto;
+						height: auto;
+						min-width: 0;
+					}
+				}
+			}
+		}
+	}
+
 	> .search {
 		width: 100%;
 		padding: 12px;
--- a/packages/frontend/src/components/MkEmojiPickerWindow.vue
+++ b/packages/frontend/src/components/MkEmojiPickerWindow.vue
@@ -1,13 +1,13 @@
 <template>
 <MkWindow ref="window"
-	:initial-width="null"
-	:initial-height="null"
-	:can-resize="false"
+	:initial-width="300"
+	:initial-height="290"
+	:can-resize="true"
 	:mini="true"
 	:front="true"
 	@closed="emit('closed')"
 >
-	<MkEmojiPicker :show-pinned="showPinned" :as-reaction-picker="asReactionPicker" @chosen="chosen"/>
+	<MkEmojiPicker :show-pinned="showPinned" :as-reaction-picker="asReactionPicker" as-window @chosen="chosen" :class="$style.picker"/>
 </MkWindow>
 </template>

@@ -34,147 +34,8 @@ function chosen(emoji: any) {
 }
 </script>

-<style lang="scss" scoped>
-.omfetrab {
-	$pad: 8px;
-	--eachSize: 40px;
-
-	display: flex;
-	flex-direction: column;
-	contain: content;
-
-	&.big {
-		--eachSize: 44px;
-	}
-
-	&.w1 {
-		width: calc((var(--eachSize) * 5) + (#{$pad} * 2));
-	}
-
-	&.w2 {
-		width: calc((var(--eachSize) * 6) + (#{$pad} * 2));
-	}
-
-	&.w3 {
-		width: calc((var(--eachSize) * 7) + (#{$pad} * 2));
-	}
-
-	&.h1 {
-		--height: calc((var(--eachSize) * 4) + (#{$pad} * 2));
-	}
-
-	&.h2 {
-		--height: calc((var(--eachSize) * 6) + (#{$pad} * 2));
-	}
-
-	&.h3 {
-		--height: calc((var(--eachSize) * 8) + (#{$pad} * 2));
-	}
-
-	> .search {
-		width: 100%;
-		padding: 12px;
-		box-sizing: border-box;
-		font-size: 1em;
-		outline: none;
-		border: none;
-		background: transparent;
-		color: var(--fg);
-
-		&:not(.filled) {
-			order: 1;
-			z-index: 2;
-			box-shadow: 0px -1px 0 0px var(--divider);
-		}
-	}
-
-	> .emojis {
-		height: var(--height);
-		overflow-y: auto;
-		overflow-x: hidden;
-
-		scrollbar-width: none;
-
-		&::-webkit-scrollbar {
-			display: none;
-		}
-
-		> .index {
-			min-height: var(--height);
-			position: relative;
-			border-bottom: solid 0.5px var(--divider);
-				
-			> .arrow {
-				position: absolute;
-				bottom: 0;
-				left: 0;
-				width: 100%;
-				padding: 16px 0;
-				text-align: center;
-				opacity: 0.5;
-				pointer-events: none;
-			}
-		}
-
-		section {
-			> header {
-				position: sticky;
-				top: 0;
-				left: 0;
-				z-index: 1;
-				padding: 8px;
-				font-size: 12px;
-			}
-
-			> div {
-				padding: $pad;
-
-				> button {
-					position: relative;
-					padding: 0;
-					width: var(--eachSize);
-					height: var(--eachSize);
-					border-radius: 4px;
-
-					&:focus-visible {
-						outline: solid 2px var(--focus);
-						z-index: 1;
-					}
-
-					&:hover {
-						background: rgba(0, 0, 0, 0.05);
-					}
-
-					&:active {
-						background: var(--accent);
-						box-shadow: inset 0 0.15em 0.3em rgba(27, 31, 35, 0.15);
-					}
-
-					> * {
-						font-size: 24px;
-						height: 1.25em;
-						vertical-align: -.25em;
-						pointer-events: none;
-					}
-				}
-			}
-
-			&.result {
-				border-bottom: solid 0.5px var(--divider);
-
-				&:empty {
-					display: none;
-				}
-			}
-
-			&.unicode {
-				min-height: 384px;
-			}
-
-			&.custom {
-				min-height: 64px;
-			}
-		}
-	}
+<style lang="scss" module>
+.picker {
+	height: 100%;
 }
 </style>
--- a/packages/frontend/src/components/MkFileCaptionEditWindow.vue
+++ b/packages/frontend/src/components/MkFileCaptionEditWindow.vue
@@ -23,7 +23,7 @@
 import { } from 'vue';
 import * as Misskey from 'misskey-js';
 import MkModalWindow from '@/components/MkModalWindow.vue';
-import MkTextarea from '@/components/form/textarea.vue';
+import MkTextarea from '@/components/MkTextarea.vue';
 import MkDriveFileThumbnail from '@/components/MkDriveFileThumbnail.vue';
 import { i18n } from '@/i18n';

--- a/packages/frontend/src/components/MkFolder.vue
+++ b/packages/frontend/src/components/MkFolder.vue
@@ -1,7 +1,7 @@
 <template>
 <div class="ssazuxis">
 	<header class="_button" :style="{ background: bg }" @click="showBody = !showBody">
-		<div class="title"><slot name="header"></slot></div>
+		<div class="title"><div><slot name="header"></slot></div></div>
 		<div class="divider"></div>
 		<button class="_button">
 			<template v-if="showBody"><i class="ti ti-chevron-up"></i></template>
@@ -25,8 +25,9 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 import tinycolor from 'tinycolor2';
+import { miLocalStorage } from '@/local-storage';

-const localStoragePrefix = 'ui:folder:';
+const miLocalStoragePrefix = 'ui:folder:' as const;

 export default defineComponent({
 	props: {
@@ -44,13 +45,13 @@ export default defineComponent({
 	data() {
 		return {
 			bg: null,
-			showBody: (this.persistKey && localStorage.getItem(localStoragePrefix + this.persistKey)) ? localStorage.getItem(localStoragePrefix + this.persistKey) === 't' : this.expanded,
+			showBody: (this.persistKey && miLocalStorage.getItem(`${miLocalStoragePrefix}${this.persistKey}`)) ? (miLocalStorage.getItem(`${miLocalStoragePrefix}${this.persistKey}`) === 't') : this.expanded,
 		};
 	},
 	watch: {
 		showBody() {
 			if (this.persistKey) {
-				localStorage.setItem(localStoragePrefix + this.persistKey, this.showBody ? 't' : 'f');
+				miLocalStorage.setItem(`${miLocalStoragePrefix}${this.persistKey}`, this.showBody ? 't' : 'f');
 			}
 		},
 	},
@@ -126,14 +127,6 @@ export default defineComponent({
 			place-content: center;
 			margin: 0;
 			padding: 12px 16px 12px 0;
-
-			> i {
-				margin-right: 6px;
-			}
-
-			&:empty {
-				display: none;
-			}
 		}

 		> .divider {
--- a/packages/frontend/src/components/MkForgotPassword.vue
+++ b/packages/frontend/src/components/MkForgotPassword.vue
@@ -9,7 +9,7 @@
 	<template #header>{{ i18n.ts.forgotPassword }}</template>

 	<form v-if="instance.enableEmail" class="bafeceda" @submit.prevent="onSubmit">
-		<div class="main _autoGap">
+		<div class="main _gaps_m">
 			<MkInput v-model="username" type="text" pattern="^[a-zA-Z0-9_]+$" :spellcheck="false" autofocus required>
 				<template #label>{{ i18n.ts.username }}</template>
 				<template #prefix>@</template>
@@ -36,7 +36,7 @@
 import { } from 'vue';
 import MkModalWindow from '@/components/MkModalWindow.vue';
 import MkButton from '@/components/MkButton.vue';
-import MkInput from '@/components/form/input.vue';
+import MkInput from '@/components/MkInput.vue';
 import * as os from '@/os';
 import { instance } from '@/instance';
 import { i18n } from '@/i18n';
--- a/packages/frontend/src/components/MkFormDialog.vue
+++ b/packages/frontend/src/components/MkFormDialog.vue
@@ -15,36 +15,36 @@
 	</template>

 	<MkSpacer :margin-min="20" :margin-max="32">
-		<div class="xkpnjxcv _autoGap">
+		<div class="xkpnjxcv _gaps_m">
 			<template v-for="item in Object.keys(form).filter(item => !form[item].hidden)">
-				<FormInput v-if="form[item].type === 'number'" v-model="values[item]" type="number" :step="form[item].step || 1">
+				<MkInput v-if="form[item].type === 'number'" v-model="values[item]" type="number" :step="form[item].step || 1">
 					<template #label><span v-text="form[item].label || item"></span><span v-if="form[item].required === false"> ({{ $ts.optional }})</span></template>
 					<template v-if="form[item].description" #caption>{{ form[item].description }}</template>
-				</FormInput>
-				<FormInput v-else-if="form[item].type === 'string' && !form[item].multiline" v-model="values[item]" type="text">
+				</MkInput>
+				<MkInput v-else-if="form[item].type === 'string' && !form[item].multiline" v-model="values[item]" type="text">
 					<template #label><span v-text="form[item].label || item"></span><span v-if="form[item].required === false"> ({{ $ts.optional }})</span></template>
 					<template v-if="form[item].description" #caption>{{ form[item].description }}</template>
-				</FormInput>
-				<FormTextarea v-else-if="form[item].type === 'string' && form[item].multiline" v-model="values[item]">
+				</MkInput>
+				<MkTextarea v-else-if="form[item].type === 'string' && form[item].multiline" v-model="values[item]">
 					<template #label><span v-text="form[item].label || item"></span><span v-if="form[item].required === false"> ({{ $ts.optional }})</span></template>
 					<template v-if="form[item].description" #caption>{{ form[item].description }}</template>
-				</FormTextarea>
-				<FormSwitch v-else-if="form[item].type === 'boolean'" v-model="values[item]">
+				</MkTextarea>
+				<MkSwitch v-else-if="form[item].type === 'boolean'" v-model="values[item]">
 					<span v-text="form[item].label || item"></span>
 					<template v-if="form[item].description" #caption>{{ form[item].description }}</template>
-				</FormSwitch>
-				<FormSelect v-else-if="form[item].type === 'enum'" v-model="values[item]">
+				</MkSwitch>
+				<MkSelect v-else-if="form[item].type === 'enum'" v-model="values[item]">
 					<template #label><span v-text="form[item].label || item"></span><span v-if="form[item].required === false"> ({{ $ts.optional }})</span></template>
 					<option v-for="item in form[item].enum" :key="item.value" :value="item.value">{{ item.label }}</option>
-				</FormSelect>
-				<FormRadios v-else-if="form[item].type === 'radio'" v-model="values[item]">
+				</MkSelect>
+				<MkRadios v-else-if="form[item].type === 'radio'" v-model="values[item]">
 					<template #label><span v-text="form[item].label || item"></span><span v-if="form[item].required === false"> ({{ $ts.optional }})</span></template>
 					<option v-for="item in form[item].options" :key="item.value" :value="item.value">{{ item.label }}</option>
-				</FormRadios>
-				<FormRange v-else-if="form[item].type === 'range'" v-model="values[item]" :min="form[item].min" :max="form[item].max" :step="form[item].step" :text-converter="form[item].textConverter">
+				</MkRadios>
+				<MkRange v-else-if="form[item].type === 'range'" v-model="values[item]" :min="form[item].min" :max="form[item].max" :step="form[item].step" :text-converter="form[item].textConverter">
 					<template #label><span v-text="form[item].label || item"></span><span v-if="form[item].required === false"> ({{ $ts.optional }})</span></template>
 					<template v-if="form[item].description" #caption>{{ form[item].description }}</template>
-				</FormRange>
+				</MkRange>
 				<MkButton v-else-if="form[item].type === 'button'" @click="form[item].action($event, values)">
 					<span v-text="form[item].content || item"></span>
 				</MkButton>
@@ -56,25 +56,25 @@

 <script lang="ts">
 import { defineComponent } from 'vue';
-import FormInput from './form/input.vue';
-import FormTextarea from './form/textarea.vue';
-import FormSwitch from './form/switch.vue';
-import FormSelect from './form/select.vue';
-import FormRange from './form/range.vue';
+import MkInput from './MkInput.vue';
+import MkTextarea from './MkTextarea.vue';
+import MkSwitch from './MkSwitch.vue';
+import MkSelect from './MkSelect.vue';
+import MkRange from './MkRange.vue';
 import MkButton from './MkButton.vue';
-import FormRadios from './form/radios.vue';
+import MkRadios from './MkRadios.vue';
 import MkModalWindow from '@/components/MkModalWindow.vue';

 export default defineComponent({
 	components: {
 		MkModalWindow,
-		FormInput,
-		FormTextarea,
-		FormSwitch,
-		FormSelect,
-		FormRange,
+		MkInput,
+		MkTextarea,
+		MkSwitch,
+		MkSelect,
+		MkRange,
 		MkButton,
-		FormRadios,
+		MkRadios,
 	},

 	props: {
--- a/packages/frontend/src/components/MkHeatmap.vue
+++ b/packages/frontend/src/components/MkHeatmap.vue
@@ -10,7 +10,6 @@
 <script lang="ts" setup>
 import { markRaw, version as vueVersion, onMounted, onBeforeUnmount, nextTick, watch } from 'vue';
 import { Chart } from 'chart.js';
-import { enUS } from 'date-fns/locale';
 import tinycolor from 'tinycolor2';
 import { MatrixController, MatrixElement } from 'chartjs-chart-matrix';
 import * as os from '@/os';
@@ -149,7 +148,9 @@ async function renderChart() {
 						round: 'week',
 						isoWeekday: 0,
 						displayFormats: {
-							week: 'MMM dd',
+							day: 'M/d',
+							month: 'Y/M',
+							week: 'M/d',
 						},
 					},
 					grid: {
--- a/packages/frontend/src/components/form/input.vue
+++ b/packages/frontend/src/components/form/input.vue
--- a/packages/frontend/src/components/MkInstanceStats.vue
+++ b/packages/frontend/src/components/MkInstanceStats.vue
@@ -78,7 +78,7 @@
 <script lang="ts" setup>
 import { onMounted } from 'vue';
 import { Chart } from 'chart.js';
-import MkSelect from '@/components/form/select.vue';
+import MkSelect from '@/components/MkSelect.vue';
 import MkChart from '@/components/MkChart.vue';
 import { useChartTooltip } from '@/scripts/use-chart-tooltip';
 import * as os from '@/os';
--- a/packages/frontend/src/components/MkMenu.vue
+++ b/packages/frontend/src/components/MkMenu.vue
@@ -31,7 +31,7 @@
 				<span v-if="item.indicate" class="indicator"><i class="_indicatorCircle"></i></span>
 			</button>
 			<span v-else-if="item.type === 'switch'" :tabindex="i" class="item" @mouseenter.passive="onItemMouseEnter(item)" @mouseleave.passive="onItemMouseLeave(item)">
-				<FormSwitch v-model="item.ref" :disabled="item.disabled" class="form-switch">{{ item.text }}</FormSwitch>
+				<MkSwitch v-model="item.ref" :disabled="item.disabled" class="form-switch">{{ item.text }}</MkSwitch>
 			</span>
 			<button v-else-if="item.type === 'parent'" :tabindex="i" class="_button item parent" :class="{ childShowing: childShowingItem === item }" @mouseenter="showChildren(item, $event)">
 				<i v-if="item.icon" class="ti-fw" :class="item.icon"></i>
@@ -58,7 +58,7 @@
 <script lang="ts" setup>
 import { defineAsyncComponent, nextTick, onBeforeUnmount, onMounted, onUnmounted, Ref, ref, watch } from 'vue';
 import { focusPrev, focusNext } from '@/scripts/focus';
-import FormSwitch from '@/components/form/switch.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import { MenuItem, InnerMenuItem, MenuPending, MenuAction } from '@/types/menu';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
@@ -251,17 +251,18 @@ onBeforeUnmount(() => {
 				color: #fff;

 				&:before {
-					background: #d42e2e;
+					background: #d42e2e !important;
 				}
 			}
 		}

+		&:active,
 		&.active {
-			color: var(--fgOnAccent);
+			color: var(--fgOnAccent) !important;
 			opacity: 1;

 			&:before {
-				background: var(--accent);
+				background: var(--accent) !important;
 			}
 		}

--- a/packages/frontend/src/components/MkModal.vue
+++ b/packages/frontend/src/components/MkModal.vue
@@ -1,7 +1,7 @@
 <template>
 <Transition :name="transitionName" :duration="transitionDuration" appear @after-leave="emit('closed')" @enter="emit('opening')" @after-enter="onOpened">
 	<div v-show="manualShowing != null ? manualShowing : showing" v-hotkey.global="keymap" class="qzhlnise" :class="{ drawer: type === 'drawer', dialog: type === 'dialog' || type === 'dialog:top', popup: type === 'popup' }" :style="{ zIndex, pointerEvents: (manualShowing != null ? manualShowing : showing) ? 'auto' : 'none', '--transformOrigin': transformOrigin }">
-		<div class="bg _modalBg" :class="{ transparent: transparentBg && (type === 'popup') }" :style="{ zIndex }" @click="onBgClick" @contextmenu.prevent.stop="() => {}"></div>
+		<div class="bg _modalBg" :class="{ transparent: transparentBg && (type === 'popup') }" :style="{ zIndex }" @click="onBgClick" @mousedown="onBgClick" @contextmenu.prevent.stop="() => {}"></div>
 		<div ref="content" class="content" :class="{ fixed, top: type === 'dialog:top' }" :style="{ zIndex }" @click.self="onBgClick">
 			<slot :max-height="maxHeight" :type="type"></slot>
 		</div>
@@ -63,6 +63,7 @@ let transformOrigin = $ref('center');
 let showing = $ref(true);
 let content = $shallowRef<HTMLElement>();
 const zIndex = os.claimZIndex(props.zPriority);
+let useSendAnime = $ref(false);
 const type = $computed<ModalTypes>(() => {
 	if (props.preferType === 'auto') {
 		if (!defaultStore.state.disableDrawer && isTouchUsing && deviceKind === 'smartphone') {
@@ -74,15 +75,34 @@ const type = $computed<ModalTypes>(() => {
 		return props.preferType!;
 	}
 });
-let transitionName = $ref(defaultStore.state.animation ? (type === 'drawer') ? 'modal-drawer' : (type === 'popup') ? 'modal-popup' : 'modal' : '');
-let transitionDuration = $ref(defaultStore.state.animation ? 200 : 0);
+let transitionName = $computed((() =>
+	defaultStore.state.animation
+		? useSendAnime
+			? 'send'
+			: type === 'drawer'
+				? 'modal-drawer'
+				: type === 'popup'
+					? 'modal-popup'
+					: 'modal'
+		: ''
+));
+let transitionDuration = $computed((() =>
+	transitionName === 'send'
+		? 400
+		: transitionName === 'modal-popup'
+			? 100
+			: transitionName === 'modal'
+				? 200
+				: transitionName === 'modal-drawer'
+					? 200
+					: 0
+));

 let contentClicking = false;

 function close(opts: { useSendAnimation?: boolean } = {}) {
 	if (opts.useSendAnimation) {
-		transitionName = 'send';
-		transitionDuration = 400;
+		useSendAnime = true;
 	}

 	// eslint-disable-next-line vue/no-mutating-props
@@ -267,9 +287,8 @@ defineExpose({
 	}

 	> .content {
-		transform-style: preserve-3d;
-    transform: perspective(50cm) translateZ(0px) translateY(0px) rotateX(0deg);
-		transition: opacity 0.4s cubic-bezier(.5,-0.5,.75,1), transform 0.4s cubic-bezier(.5,-0.5,.75,1) !important;
+    transform: translateY(0px);
+		transition: opacity 0.3s ease-in, transform 0.3s cubic-bezier(.5,-0.5,1,.5) !important;
 	}
 }
 .send-enter-from, .send-leave-to {
@@ -280,8 +299,7 @@ defineExpose({
 	> .content {
 		pointer-events: none;
 		opacity: 0;
-		transform-style: preserve-3d;
-		transform: perspective(50cm) translateZ(-300px) translateY(-200px) rotateX(40deg);
+		transform: translateY(-300px);
 	}
 }

@@ -310,12 +328,12 @@ defineExpose({

 .modal-popup-enter-active, .modal-popup-leave-active {
 	> .bg {
-		transition: opacity 0.2s !important;
+		transition: opacity 0.1s !important;
 	}

 	> .content {
 		transform-origin: var(--transformOrigin);
-		transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1), transform 0.2s cubic-bezier(0, 0, 0.2, 1) !important;
+		transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1), transform 0.1s cubic-bezier(0, 0, 0.2, 1) !important;
 	}
 }
 .modal-popup-enter-from, .modal-popup-leave-to {
--- a/packages/frontend/src/components/MkNote.vue
+++ b/packages/frontend/src/components/MkNote.vue
@@ -13,7 +13,7 @@
 	<div v-if="appearNote._prId_" class="info"><i class="fas fa-bullhorn"></i> {{ i18n.ts.promotion }}<button class="_textButton hide" @click="readPromo()">{{ i18n.ts.hideThisNote }} <i class="ti ti-x"></i></button></div>
 	<div v-if="appearNote._featuredId_" class="info"><i class="ti ti-bolt"></i> {{ i18n.ts.featured }}</div>
 	<div v-if="isRenote" class="renote">
-		<MkAvatar class="avatar" :user="note.user"/>
+		<MkAvatar v-once class="avatar" :user="note.user"/>
 		<i class="ti ti-repeat"></i>
 		<I18n :src="i18n.ts.renotedBy" tag="span">
 			<template #user>
@@ -27,11 +27,16 @@
 				<i v-if="isMyRenote" class="ti ti-dots dropdownIcon"></i>
 				<MkTime :time="note.createdAt"/>
 			</button>
-			<MkVisibility :note="note"/>
+			<span v-if="note.visibility !== 'public'" style="{ margin-left: 0.5em; }" :title="i18n.ts._visibility[note.visibility]">
+				<i v-if="note.visibility === 'home'" class="ti ti-home"></i>
+				<i v-else-if="note.visibility === 'followers'" class="ti ti-lock-open"></i>
+				<i v-else-if="note.visibility === 'specified'" ref="specified" class="ti ti-mail"></i>
+			</span>
+			<span v-if="note.localOnly" style="{ margin-left: 0.5em; }" :title="i18n.ts._visibility['localOnly']"><i class="ti ti-world-off"></i></span>
 		</div>
 	</div>
 	<article class="article" @contextmenu.stop="onContextmenu">
-		<MkAvatar class="avatar" :user="appearNote.user"/>
+		<MkAvatar v-once class="avatar" :user="appearNote.user"/>
 		<div class="main">
 			<MkNoteHeader class="header" :note="appearNote" :mini="true"/>
 			<MkInstanceTicker v-if="showTicker" class="ticker" :instance="appearNote.user.instance"/>
@@ -44,7 +49,7 @@
 					<div class="text">
 						<span v-if="appearNote.isHidden" style="opacity: 0.5">({{ i18n.ts.private }})</span>
 						<MkA v-if="appearNote.replyId" class="reply" :to="`/notes/${appearNote.replyId}`"><i class="ti ti-arrow-back-up"></i></MkA>
-						<Mfm v-if="appearNote.text" :text="appearNote.text" :author="appearNote.user" :i="$i"/>
+						<Mfm v-if="appearNote.text" v-once :text="appearNote.text" :author="appearNote.user" :i="$i"/>
 						<a v-if="appearNote.renote != null" class="rp">RN:</a>
 						<div v-if="translating || translation" class="translation">
 							<MkLoading v-if="translating" mini/>
@@ -75,14 +80,25 @@
 					<i class="ti ti-arrow-back-up"></i>
 					<p v-if="appearNote.repliesCount > 0" class="count">{{ appearNote.repliesCount }}</p>
 				</button>
-				<MkRenoteButton ref="renoteButton" class="button" :note="appearNote" :count="appearNote.renoteCount"/>
-				<button v-if="appearNote.myReaction == null" ref="reactButton" class="button _button" @click="react()">
+				<button
+					v-if="canRenote"
+					ref="renoteButton"
+					class="button _button"
+					@mousedown="renote()"
+				>
+					<i class="ti ti-repeat"></i>
+					<p v-if="appearNote.renoteCount > 0" class="count">{{ appearNote.renoteCount }}</p>
+				</button>
+				<button v-else class="button _button" disabled>
+					<i class="ti ti-ban"></i>
+				</button>
+				<button v-if="appearNote.myReaction == null" ref="reactButton" class="button _button" @mousedown="react()">
 					<i class="ti ti-plus"></i>
 				</button>
 				<button v-if="appearNote.myReaction != null" ref="reactButton" class="button _button reacted" @click="undoReact(appearNote)">
 					<i class="ti ti-minus"></i>
 				</button>
-				<button ref="menuButton" class="button _button" @click="menu()">
+				<button ref="menuButton" class="button _button" @mousedown="menu()">
 					<i class="ti ti-dots"></i>
 				</button>
 			</footer>
@@ -111,10 +127,9 @@ import MkReactionsViewer from '@/components/MkReactionsViewer.vue';
 import MkMediaList from '@/components/MkMediaList.vue';
 import MkCwButton from '@/components/MkCwButton.vue';
 import MkPoll from '@/components/MkPoll.vue';
-import MkRenoteButton from '@/components/MkRenoteButton.vue';
+import MkUsersTooltip from '@/components/MkUsersTooltip.vue';
 import MkUrlPreview from '@/components/MkUrlPreview.vue';
 import MkInstanceTicker from '@/components/MkInstanceTicker.vue';
-import MkVisibility from '@/components/MkVisibility.vue';
 import { pleaseLogin } from '@/scripts/please-login';
 import { focusPrev, focusNext } from '@/scripts/focus';
 import { checkWordMute } from '@/scripts/check-word-mute';
@@ -128,6 +143,7 @@ import { i18n } from '@/i18n';
 import { getNoteMenu } from '@/scripts/get-note-menu';
 import { useNoteCapture } from '@/scripts/use-note-capture';
 import { deepClone } from '@/scripts/clone';
+import { useTooltip } from '@/scripts/use-tooltip';

 const props = defineProps<{
 	note: misskey.entities.Note;
@@ -158,7 +174,7 @@ const isRenote = (

 const el = shallowRef<HTMLElement>();
 const menuButton = shallowRef<HTMLElement>();
-const renoteButton = shallowRef<InstanceType<typeof MkRenoteButton>>();
+const renoteButton = shallowRef<HTMLElement>();
 const renoteTime = shallowRef<HTMLElement>();
 const reactButton = shallowRef<HTMLElement>();
 let appearNote = $computed(() => isRenote ? note.renote as misskey.entities.Note : note);
@@ -175,6 +191,7 @@ const translation = ref(null);
 const translating = ref(false);
 const urls = appearNote.text ? extractUrlFromMfm(mfm.parse(appearNote.text)) : null;
 const showTicker = (defaultStore.state.instanceTicker === 'always') || (defaultStore.state.instanceTicker === 'remote' && appearNote.user.instance);
+const canRenote = computed(() => ['public', 'home'].includes(appearNote.visibility) || appearNote.userId === $i.id);

 const keymap = {
 	'r': () => reply(true),
@@ -193,6 +210,47 @@ useNoteCapture({
 	isDeletedRef: isDeleted,
 });

+useTooltip(renoteButton, async (showing) => {
+	const renotes = await os.api('notes/renotes', {
+		noteId: appearNote.id,
+		limit: 11,
+	});
+
+	const users = renotes.map(x => x.user);
+
+	if (users.length < 1) return;
+
+	os.popup(MkUsersTooltip, {
+		showing,
+		users,
+		count: appearNote.renoteCount,
+		targetElement: renoteButton.value,
+	}, {}, 'closed');
+});
+
+function renote(viaKeyboard = false) {
+	pleaseLogin();
+	os.popupMenu([{
+		text: i18n.ts.renote,
+		icon: 'ti ti-repeat',
+		action: () => {
+			os.api('notes/create', {
+				renoteId: appearNote.id,
+			});
+		},
+	}, {
+		text: i18n.ts.quote,
+		icon: 'ti ti-quote',
+		action: () => {
+			os.post({
+				renote: appearNote,
+			});
+		},
+	}], renoteButton.value, {
+		viaKeyboard,
+	});
+}
+
 function reply(viaKeyboard = false): void {
 	pleaseLogin();
 	os.post({
--- a/packages/frontend/src/components/MkNoteDetailed.vue
+++ b/packages/frontend/src/components/MkNoteDetailed.vue
@@ -25,7 +25,12 @@
 				<i v-if="isMyRenote" class="ti ti-dots dropdownIcon"></i>
 				<MkTime :time="note.createdAt"/>
 			</button>
-			<MkVisibility :note="note"/>
+			<span v-if="note.visibility !== 'public'" style="{ margin-left: 0.5em; }" :title="i18n.ts._visibility[note.visibility]">
+				<i v-if="note.visibility === 'home'" class="ti ti-home"></i>
+				<i v-else-if="note.visibility === 'followers'" class="ti ti-lock-open"></i>
+				<i v-else-if="note.visibility === 'specified'" ref="specified" class="ti ti-mail"></i>
+			</span>
+			<span v-if="note.localOnly" style="{ margin-left: 0.5em; }" :title="i18n.ts._visibility['localOnly']"><i class="ti ti-world-off"></i></span>
 		</div>
 	</div>
 	<article class="article" @contextmenu.stop="onContextmenu">
@@ -38,7 +43,12 @@
 					</MkA>
 					<span v-if="appearNote.user.isBot" class="is-bot">bot</span>
 					<div class="info">
-						<MkVisibility :note="appearNote"/>
+						<span v-if="appearNote.visibility !== 'public'" style="{ margin-left: 0.5em; }" :title="i18n.ts._visibility[appearNote.visibility]">
+							<i v-if="appearNote.visibility === 'home'" class="ti ti-home"></i>
+							<i v-else-if="appearNote.visibility === 'followers'" class="ti ti-lock-open"></i>
+							<i v-else-if="appearNote.visibility === 'specified'" ref="specified" class="ti ti-mail"></i>
+						</span>
+						<span v-if="appearNote.localOnly" style="{ margin-left: 0.5em; }" :title="i18n.ts._visibility['localOnly']"><i class="ti ti-world-off"></i></span>
 					</div>
 				</div>
 				<div class="username"><MkAcct :user="appearNote.user"/></div>
@@ -85,14 +95,25 @@
 					<i class="ti ti-arrow-back-up"></i>
 					<p v-if="appearNote.repliesCount > 0" class="count">{{ appearNote.repliesCount }}</p>
 				</button>
-				<MkRenoteButton ref="renoteButton" class="button" :note="appearNote" :count="appearNote.renoteCount"/>
-				<button v-if="appearNote.myReaction == null" ref="reactButton" class="button _button" @click="react()">
+				<button
+					v-if="canRenote"
+					ref="renoteButton"
+					class="button _button"
+					@mousedown="renote()"
+				>
+					<i class="ti ti-repeat"></i>
+					<p v-if="appearNote.renoteCount > 0" class="count">{{ appearNote.renoteCount }}</p>
+				</button>
+				<button v-else class="button _button" disabled>
+					<i class="ti ti-ban"></i>
+				</button>
+				<button v-if="appearNote.myReaction == null" ref="reactButton" class="button _button" @mousedown="react()">
 					<i class="ti ti-plus"></i>
 				</button>
 				<button v-if="appearNote.myReaction != null" ref="reactButton" class="button _button reacted" @click="undoReact(appearNote)">
 					<i class="ti ti-minus"></i>
 				</button>
-				<button ref="menuButton" class="button _button" @click="menu()">
+				<button ref="menuButton" class="button _button" @mousedown="menu()">
 					<i class="ti ti-dots"></i>
 				</button>
 			</footer>
@@ -121,10 +142,9 @@ import MkReactionsViewer from '@/components/MkReactionsViewer.vue';
 import MkMediaList from '@/components/MkMediaList.vue';
 import MkCwButton from '@/components/MkCwButton.vue';
 import MkPoll from '@/components/MkPoll.vue';
-import MkRenoteButton from '@/components/MkRenoteButton.vue';
+import MkUsersTooltip from '@/components/MkUsersTooltip.vue';
 import MkUrlPreview from '@/components/MkUrlPreview.vue';
 import MkInstanceTicker from '@/components/MkInstanceTicker.vue';
-import MkVisibility from '@/components/MkVisibility.vue';
 import { pleaseLogin } from '@/scripts/please-login';
 import { checkWordMute } from '@/scripts/check-word-mute';
 import { userPage } from '@/filters/user';
@@ -138,6 +158,7 @@ import { i18n } from '@/i18n';
 import { getNoteMenu } from '@/scripts/get-note-menu';
 import { useNoteCapture } from '@/scripts/use-note-capture';
 import { deepClone } from '@/scripts/clone';
+import { useTooltip } from '@/scripts/use-tooltip';

 const props = defineProps<{
 	note: misskey.entities.Note;
@@ -168,7 +189,7 @@ const isRenote = (

 const el = shallowRef<HTMLElement>();
 const menuButton = shallowRef<HTMLElement>();
-const renoteButton = shallowRef<InstanceType<typeof MkRenoteButton>>();
+const renoteButton = shallowRef<HTMLElement>();
 const renoteTime = shallowRef<HTMLElement>();
 const reactButton = shallowRef<HTMLElement>();
 let appearNote = $computed(() => isRenote ? note.renote as misskey.entities.Note : note);
@@ -182,6 +203,7 @@ const urls = appearNote.text ? extractUrlFromMfm(mfm.parse(appearNote.text)) : n
 const showTicker = (defaultStore.state.instanceTicker === 'always') || (defaultStore.state.instanceTicker === 'remote' && appearNote.user.instance);
 const conversation = ref<misskey.entities.Note[]>([]);
 const replies = ref<misskey.entities.Note[]>([]);
+const canRenote = computed(() => ['public', 'home'].includes(appearNote.visibility) || appearNote.userId === $i.id);

 const keymap = {
 	'r': () => reply(true),
@@ -198,6 +220,47 @@ useNoteCapture({
 	isDeletedRef: isDeleted,
 });

+useTooltip(renoteButton, async (showing) => {
+	const renotes = await os.api('notes/renotes', {
+		noteId: appearNote.id,
+		limit: 11,
+	});
+
+	const users = renotes.map(x => x.user);
+
+	if (users.length < 1) return;
+
+	os.popup(MkUsersTooltip, {
+		showing,
+		users,
+		count: appearNote.renoteCount,
+		targetElement: renoteButton.value,
+	}, {}, 'closed');
+});
+
+function renote(viaKeyboard = false) {
+	pleaseLogin();
+	os.popupMenu([{
+		text: i18n.ts.renote,
+		icon: 'ti ti-repeat',
+		action: () => {
+			os.api('notes/create', {
+				renoteId: appearNote.id,
+			});
+		},
+	}, {
+		text: i18n.ts.quote,
+		icon: 'ti ti-quote',
+		action: () => {
+			os.post({
+				renote: appearNote,
+			});
+		},
+	}], renoteButton.value, {
+		viaKeyboard,
+	});
+}
+
 function reply(viaKeyboard = false): void {
 	pleaseLogin();
 	os.post({
--- a/packages/frontend/src/components/MkNoteHeader.vue
+++ b/packages/frontend/src/components/MkNoteHeader.vue
@@ -1,6 +1,6 @@
 <template>
 <header class="kkwtjztg">
-	<MkA v-user-preview="note.user.id" class="name" :to="userPage(note.user)">
+	<MkA v-once v-user-preview="note.user.id" class="name" :to="userPage(note.user)">
 		<MkUserName :user="note.user"/>
 	</MkA>
 	<div v-if="note.user.isBot" class="is-bot">bot</div>
@@ -9,7 +9,12 @@
 		<MkA class="created-at" :to="notePage(note)">
 			<MkTime :time="note.createdAt"/>
 		</MkA>
-		<MkVisibility :note="note"/>
+		<span v-if="note.visibility !== 'public'" style="{ margin-left: 0.5em; }" :title="i18n.ts._visibility[note.visibility]">
+			<i v-if="note.visibility === 'home'" class="ti ti-home"></i>
+			<i v-else-if="note.visibility === 'followers'" class="ti ti-lock-open"></i>
+			<i v-else-if="note.visibility === 'specified'" ref="specified" class="ti ti-mail"></i>
+		</span>
+		<span v-if="note.localOnly" style="{ margin-left: 0.5em; }" :title="i18n.ts._visibility['localOnly']"><i class="ti ti-world-off"></i></span>
 	</div>
 </header>
 </template>
@@ -17,7 +22,7 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import * as misskey from 'misskey-js';
-import MkVisibility from '@/components/MkVisibility.vue';
+import { i18n } from '@/i18n';
 import { notePage } from '@/filters/note';
 import { userPage } from '@/filters/user';

--- a/packages/frontend/src/components/MkNotification.vue
+++ b/packages/frontend/src/components/MkNotification.vue
@@ -1,6 +1,6 @@
 <template>
 <div ref="elRef" class="qglefbjs" :class="notification.type">
-	<div class="head">
+	<div v-once class="head">
 		<MkAvatar v-if="notification.type === 'pollEnded'" class="icon" :user="notification.note.user"/>
 		<MkAvatar v-else-if="notification.user" class="icon" :user="notification.user"/>
 		<img v-else-if="notification.icon" class="icon" :src="notification.icon" alt=""/>
@@ -13,10 +13,9 @@
 			<i v-else-if="notification.type === 'reply'" class="ti ti-arrow-back-up"></i>
 			<i v-else-if="notification.type === 'mention'" class="ti ti-at"></i>
 			<i v-else-if="notification.type === 'quote'" class="ti ti-quote"></i>
-			<i v-else-if="notification.type === 'pollVote'" class="ti ti-chart-arrows"></i>
 			<i v-else-if="notification.type === 'pollEnded'" class="ti ti-chart-arrows"></i>
 			<!-- notification.reaction が null になることはまずないが、ここでoptional chaining使うと一部ブラウザで刺さるので念の為 -->
-			<XReactionIcon
+			<MkReactionIcon
 				v-else-if="notification.type === 'reaction'"
 				ref="reactionRef"
 				:reaction="notification.reaction ? notification.reaction.replace(/^:(\w+):$/, ':$1@.:') : notification.reaction"
@@ -32,42 +31,39 @@
 			<span v-else>{{ notification.header }}</span>
 			<MkTime v-if="withTime" :time="notification.createdAt" class="time"/>
 		</header>
-		<MkA v-if="notification.type === 'reaction'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
-			<i class="ti ti-quote"></i>
-			<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full"/>
-			<i class="ti ti-quote"></i>
-		</MkA>
-		<MkA v-if="notification.type === 'renote'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note.renote)">
-			<i class="ti ti-quote"></i>
-			<Mfm :text="getNoteSummary(notification.note.renote)" :plain="true" :nowrap="!full"/>
-			<i class="ti ti-quote"></i>
-		</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"/>
-		</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"/>
-		</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"/>
-		</MkA>
-		<MkA v-if="notification.type === 'pollVote'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
-			<i class="ti ti-quote"></i>
-			<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full"/>
-			<i class="ti ti-quote"></i>
-		</MkA>
-		<MkA v-if="notification.type === 'pollEnded'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
-			<i class="ti ti-quote"></i>
-			<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full"/>
-			<i class="ti ti-quote"></i>
-		</MkA>
-		<span v-if="notification.type === 'follow'" class="text" style="opacity: 0.6;">{{ i18n.ts.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;">{{ i18n.ts.followRequestAccepted }}</span>
-		<span v-if="notification.type === 'receiveFollowRequest'" class="text" style="opacity: 0.6;">{{ i18n.ts.receiveFollowRequest }}<div v-if="full && !followRequestDone"><button class="_textButton" @click="acceptFollowRequest()">{{ i18n.ts.accept }}</button> | <button class="_textButton" @click="rejectFollowRequest()">{{ i18n.ts.reject }}</button></div></span>
-		<span v-if="notification.type === 'groupInvited'" class="text" style="opacity: 0.6;">{{ i18n.ts.groupInvited }}: <b>{{ notification.invitation.group.name }}</b><div v-if="full && !groupInviteDone"><button class="_textButton" @click="acceptGroupInvitation()">{{ i18n.ts.accept }}</button> | <button class="_textButton" @click="rejectGroupInvitation()">{{ i18n.ts.reject }}</button></div></span>
-		<span v-if="notification.type === 'app'" class="text">
-			<Mfm :text="notification.body" :nowrap="!full"/>
-		</span>
+		<div v-once class="content">
+			<MkA v-if="notification.type === 'reaction'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
+				<i class="ti ti-quote"></i>
+				<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full"/>
+				<i class="ti ti-quote"></i>
+			</MkA>
+			<MkA v-else-if="notification.type === 'renote'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note.renote)">
+				<i class="ti ti-quote"></i>
+				<Mfm :text="getNoteSummary(notification.note.renote)" :plain="true" :nowrap="!full"/>
+				<i class="ti ti-quote"></i>
+			</MkA>
+			<MkA v-else-if="notification.type === 'reply'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
+				<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full"/>
+			</MkA>
+			<MkA v-else-if="notification.type === 'mention'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
+				<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full"/>
+			</MkA>
+			<MkA v-else-if="notification.type === 'quote'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
+				<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full"/>
+			</MkA>
+			<MkA v-else-if="notification.type === 'pollEnded'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
+				<i class="ti ti-quote"></i>
+				<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full"/>
+				<i class="ti ti-quote"></i>
+			</MkA>
+			<span v-else-if="notification.type === 'follow'" class="text" style="opacity: 0.6;">{{ i18n.ts.youGotNewFollower }}<div v-if="full"><MkFollowButton :user="notification.user" :full="true"/></div></span>
+			<span v-else-if="notification.type === 'followRequestAccepted'" class="text" style="opacity: 0.6;">{{ i18n.ts.followRequestAccepted }}</span>
+			<span v-else-if="notification.type === 'receiveFollowRequest'" class="text" style="opacity: 0.6;">{{ i18n.ts.receiveFollowRequest }}<div v-if="full && !followRequestDone"><button class="_textButton" @click="acceptFollowRequest()">{{ i18n.ts.accept }}</button> | <button class="_textButton" @click="rejectFollowRequest()">{{ i18n.ts.reject }}</button></div></span>
+			<span v-else-if="notification.type === 'groupInvited'" class="text" style="opacity: 0.6;">{{ i18n.ts.groupInvited }}: <b>{{ notification.invitation.group.name }}</b><div v-if="full && !groupInviteDone"><button class="_textButton" @click="acceptGroupInvitation()">{{ i18n.ts.accept }}</button> | <button class="_textButton" @click="rejectGroupInvitation()">{{ i18n.ts.reject }}</button></div></span>
+			<span v-else-if="notification.type === 'app'" class="text">
+				<Mfm :text="notification.body" :nowrap="!full"/>
+			</span>
+		</div>
 	</div>
 </div>
 </template>
@@ -75,7 +71,7 @@
 <script lang="ts" setup>
 import { ref, shallowRef, onMounted, onUnmounted, watch } from 'vue';
 import * as misskey from 'misskey-js';
-import XReactionIcon from '@/components/MkReactionIcon.vue';
+import MkReactionIcon from '@/components/MkReactionIcon.vue';
 import MkFollowButton from '@/components/MkFollowButton.vue';
 import XReactionTooltip from '@/components/MkReactionTooltip.vue';
 import { getNoteSummary } from '@/scripts/get-note-summary';
@@ -239,12 +235,6 @@ useTooltip(reactionRef, (showing) => {
 				pointer-events: none;
 			}

-			&.pollVote {
-				padding: 3px;
-				background: #88a6b7;
-				pointer-events: none;
-			}
-
 			&.pollEnded {
 				padding: 3px;
 				background: #88a6b7;
@@ -275,23 +265,25 @@ useTooltip(reactionRef, (showing) => {
 			}
 		}

-		> .text {
-			white-space: nowrap;
-			overflow: hidden;
-			text-overflow: ellipsis;
+		> .content {
+			> .text {
+				white-space: nowrap;
+				overflow: hidden;
+				text-overflow: ellipsis;

-			> i {
-				vertical-align: super;
-				font-size: 50%;
-				opacity: 0.5;
-			}
+				> i {
+					vertical-align: super;
+					font-size: 50%;
+					opacity: 0.5;
+				}

-			> i:first-child {
-				margin-right: 4px;
-			}
+				> i:first-child {
+					margin-right: 4px;
+				}

-			> i:last-child {
-				margin-left: 4px;
+				> i:last-child {
+					margin-left: 4px;
+				}
 			}
 		}
 	}
--- a/packages/frontend/src/components/MkNotificationSettingWindow.vue
+++ b/packages/frontend/src/components/MkNotificationSettingWindow.vue
@@ -12,7 +12,7 @@
 	<template #header>{{ i18n.ts.notificationSetting }}</template>

 	<MkSpacer :margin-min="20" :margin-max="28">
-		<div class="_autoGap">
+		<div class="_gaps_m">
 			<template v-if="showGlobalToggle">
 				<MkSwitch v-model="useGlobalSetting">
 					{{ i18n.ts.useGlobalSetting }}
@@ -35,7 +35,7 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import { notificationTypes } from 'misskey-js';
-import MkSwitch from './form/switch.vue';
+import MkSwitch from './MkSwitch.vue';
 import MkInfo from './MkInfo.vue';
 import MkButton from './MkButton.vue';
 import MkModalWindow from '@/components/MkModalWindow.vue';
--- a/packages/frontend/src/components/MkPageWindow.vue
+++ b/packages/frontend/src/components/MkPageWindow.vue
@@ -84,6 +84,7 @@ provideMetadataReceiver((info) => {
 });
 provide('shouldOmitHeaderTitle', true);
 provide('shouldHeaderThin', true);
+provide('forceSpacerMin', true);

 const contextmenu = $computed(() => ([{
 	icon: 'ti ti-player-eject',
@@ -136,5 +137,7 @@ defineExpose({
 .yrolvcoq {
 	min-height: 100%;
 	background: var(--bg);
+
+	--margin: var(--marginHalf);
 }
 </style>
--- a/packages/frontend/src/components/MkPlusOneEffect.vue
+++ b/packages/frontend/src/components/MkPlusOneEffect.vue
@@ -1,14 +1,18 @@
 <template>
 <div :class="$style.root" :style="{ zIndex, top: `${y - 64}px`, left: `${x - 64}px` }">
-	<span class="text" :class="{ up }">+1</span>
+	<span class="text" :class="{ up }">
+		<MkReactionIcon class="icon" :reaction="reaction"/>
+	</span>
 </div>
 </template>

 <script lang="ts" setup>
 import { onMounted } from 'vue';
 import * as os from '@/os';
+import MkReactionIcon from '@/components/MkReactionIcon.vue';

 const props = withDefaults(defineProps<{
+	reaction: string;
 	x: number;
 	y: number;
 }>(), {
@@ -20,6 +24,7 @@ const emit = defineEmits<{

 let up = $ref(false);
 const zIndex = os.claimZIndex('veryLow');
+const angle = (90 - (Math.random() * 180)) + 'deg';

 onMounted(() => {
 	window.setTimeout(() => {
@@ -55,10 +60,11 @@ onMounted(() => {
 			font-weight: bold;
 			transform: translateY(-30px);
 			transition: transform 1s cubic-bezier(0,.5,0,1), opacity 1s cubic-bezier(.5,0,1,.5);
+			will-change: opacity, transform;

 			&.up {
 				opacity: 0;
-				transform: translateY(-50px);
+				transform: translateY(-50px) rotateZ(v-bind(angle));
 			}
 		}
 	}
--- a/packages/frontend/src/components/MkPollEditor.vue
+++ b/packages/frontend/src/components/MkPollEditor.vue
@@ -49,9 +49,9 @@

 <script lang="ts" setup>
 import { ref, watch } from 'vue';
-import MkInput from './form/input.vue';
-import MkSelect from './form/select.vue';
-import MkSwitch from './form/switch.vue';
+import MkInput from './MkInput.vue';
+import MkSelect from './MkSelect.vue';
+import MkSwitch from './MkSwitch.vue';
 import MkButton from './MkButton.vue';
 import { formatDateTimeString } from '@/scripts/format-time-string';
 import { addTime } from '@/scripts/time';
--- a/packages/frontend/src/components/MkPostForm.vue
+++ b/packages/frontend/src/components/MkPostForm.vue
@@ -98,6 +98,7 @@ import { $i, getAccounts, openAccountMenu as openAccountMenu_ } from '@/account'
 import { uploadFile } from '@/scripts/upload';
 import { deepClone } from '@/scripts/clone';
 import MkRippleEffect from '@/components/MkRippleEffect.vue';
+import { miLocalStorage } from '@/local-storage';

 const modal = inject('modal');

@@ -156,7 +157,7 @@ let autocomplete = $ref(null);
 let draghover = $ref(false);
 let quoteId = $ref(null);
 let hasNotSpecifiedMentions = $ref(false);
-let recentHashtags = $ref(JSON.parse(localStorage.getItem('hashtags') || '[]'));
+let recentHashtags = $ref(JSON.parse(miLocalStorage.getItem('hashtags') || '[]'));
 let imeText = $ref('');

 const typing = throttle(3000, () => {
@@ -543,7 +544,7 @@ function onDrop(ev): void {
 }

 function saveDraft() {
-	const draftData = JSON.parse(localStorage.getItem('drafts') || '{}');
+	const draftData = JSON.parse(miLocalStorage.getItem('drafts') || '{}');

 	draftData[draftKey] = {
 		updatedAt: new Date(),
@@ -558,15 +559,15 @@ function saveDraft() {
 		},
 	};

-	localStorage.setItem('drafts', JSON.stringify(draftData));
+	miLocalStorage.setItem('drafts', JSON.stringify(draftData));
 }

 function deleteDraft() {
-	const draftData = JSON.parse(localStorage.getItem('drafts') ?? '{}');
+	const draftData = JSON.parse(miLocalStorage.getItem('drafts') ?? '{}');

 	delete draftData[draftKey];

-	localStorage.setItem('drafts', JSON.stringify(draftData));
+	miLocalStorage.setItem('drafts', JSON.stringify(draftData));
 }

 async function post(ev?: MouseEvent) {
@@ -622,8 +623,8 @@ async function post(ev?: MouseEvent) {
 			emit('posted');
 			if (postData.text && postData.text !== '') {
 				const hashtags_ = mfm.parse(postData.text).filter(x => x.type === 'hashtag').map(x => x.props.hashtag);
-				const history = JSON.parse(localStorage.getItem('hashtags') || '[]') as string[];
-				localStorage.setItem('hashtags', JSON.stringify(unique(hashtags_.concat(history))));
+				const history = JSON.parse(miLocalStorage.getItem('hashtags') || '[]') as string[];
+				miLocalStorage.setItem('hashtags', JSON.stringify(unique(hashtags_.concat(history))));
 			}
 			posting = false;
 			postAccount = null;
@@ -698,7 +699,7 @@ onMounted(() => {
 	nextTick(() => {
 		// 書きかけの投稿を復元
 		if (!props.instant && !props.mention && !props.specified) {
-			const draft = JSON.parse(localStorage.getItem('drafts') || '{}')[draftKey];
+			const draft = JSON.parse(miLocalStorage.getItem('drafts') || '{}')[draftKey];
 			if (draft) {
 				text = draft.data.text;
 				useCw = draft.data.useCw;
--- a/packages/frontend/src/components/form/radio.vue
+++ b/packages/frontend/src/components/form/radio.vue
--- a/packages/frontend/src/components/form/radios.vue
+++ b/packages/frontend/src/components/form/radios.vue
@@ -1,6 +1,6 @@
 <script lang="ts">
 import { defineComponent, h } from 'vue';
-import MkRadio from './radio.vue';
+import MkRadio from './MkRadio.vue';

 export default defineComponent({
 	components: {
--- a/packages/frontend/src/components/form/range.vue
+++ b/packages/frontend/src/components/form/range.vue
--- a/packages/frontend/src/components/MkReactionTooltip.vue
+++ b/packages/frontend/src/components/MkReactionTooltip.vue
@@ -1,7 +1,7 @@
 <template>
 <MkTooltip ref="tooltip" :showing="showing" :target-element="targetElement" :max-width="340" @closed="emit('closed')">
 	<div class="beeadbfb">
-		<XReactionIcon :reaction="reaction" class="icon" :no-style="true"/>
+		<MkReactionIcon :reaction="reaction" class="icon" :no-style="true"/>
 		<div class="name">{{ reaction.replace('@.', '') }}</div>
 	</div>
 </MkTooltip>
@@ -10,7 +10,7 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import MkTooltip from './MkTooltip.vue';
-import XReactionIcon from '@/components/MkReactionIcon.vue';
+import MkReactionIcon from '@/components/MkReactionIcon.vue';

 defineProps<{
 	showing: boolean;
--- a/packages/frontend/src/components/MkReactionsViewer.details.vue
+++ b/packages/frontend/src/components/MkReactionsViewer.details.vue
@@ -2,7 +2,7 @@
 <MkTooltip ref="tooltip" :showing="showing" :target-element="targetElement" :max-width="340" @closed="emit('closed')">
 	<div class="bqxuuuey">
 		<div class="reaction">
-			<XReactionIcon :reaction="reaction" class="icon" :no-style="true"/>
+			<MkReactionIcon :reaction="reaction" class="icon" :no-style="true"/>
 			<div class="name">{{ getReactionName(reaction) }}</div>
 		</div>
 		<div class="users">
@@ -19,7 +19,7 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import MkTooltip from './MkTooltip.vue';
-import XReactionIcon from '@/components/MkReactionIcon.vue';
+import MkReactionIcon from '@/components/MkReactionIcon.vue';
 import { getEmojiName } from '@/scripts/emojilist';

 defineProps<{
--- a/packages/frontend/src/components/MkReactionsViewer.reaction.vue
+++ b/packages/frontend/src/components/MkReactionsViewer.reaction.vue
@@ -1,12 +1,12 @@
 <template>
 <button
-	ref="buttonRef"
+	ref="buttonEl"
 	v-ripple="canToggle"
 	class="hkzvhatu _button"
 	:class="{ reacted: note.myReaction == reaction, canToggle }"
 	@click="toggleReaction()"
 >
-	<XReactionIcon class="icon" :reaction="reaction"/>
+	<MkReactionIcon class="icon" :reaction="reaction"/>
 	<span class="count">{{ count }}</span>
 </button>
 </template>
@@ -15,7 +15,7 @@
 import { computed, onMounted, ref, shallowRef, watch } from 'vue';
 import * as misskey from 'misskey-js';
 import XDetails from '@/components/MkReactionsViewer.details.vue';
-import XReactionIcon from '@/components/MkReactionIcon.vue';
+import MkReactionIcon from '@/components/MkReactionIcon.vue';
 import * as os from '@/os';
 import { useTooltip } from '@/scripts/use-tooltip';
 import { $i } from '@/account';
@@ -28,7 +28,7 @@ const props = defineProps<{
 	note: misskey.entities.Note;
 }>();

-const buttonRef = shallowRef<HTMLElement>();
+const buttonEl = shallowRef<HTMLElement>();

 const canToggle = computed(() => !props.reaction.match(/@\w/) && $i);

@@ -58,10 +58,10 @@ const toggleReaction = () => {
 const anime = () => {
 	if (document.hidden) return;

-	const rect = buttonRef.value.getBoundingClientRect();
-	const x = rect.left + (buttonRef.value.offsetWidth / 2);
-	const y = rect.top + (buttonRef.value.offsetHeight / 2);
-	os.popup(MkPlusOneEffect, { x, y }, {}, 'end');
+	const rect = buttonEl.value.getBoundingClientRect();
+	const x = rect.left + 16;
+	const y = rect.top + (buttonEl.value.offsetHeight / 2);
+	os.popup(MkPlusOneEffect, { reaction: props.reaction, x, y }, {}, 'end');
 };

 watch(() => props.count, (newCount, oldCount) => {
@@ -72,7 +72,7 @@ onMounted(() => {
 	if (!props.isInitial) anime();
 });

-useTooltip(buttonRef, async (showing) => {
+useTooltip(buttonEl, async (showing) => {
 	const reactions = await os.apiGet('notes/reactions', {
 		noteId: props.note.id,
 		type: props.reaction,
@@ -87,7 +87,7 @@ useTooltip(buttonRef, async (showing) => {
 		reaction: props.reaction,
 		users,
 		count: props.count,
-		targetElement: buttonRef.value,
+		targetElement: buttonEl.value,
 	}, {}, 'closed');
 }, 100);
 </script>
--- a/packages/frontend/src/components/MkRemoteCaution.vue
+++ b/packages/frontend/src/components/MkRemoteCaution.vue
@@ -16,6 +16,8 @@ defineProps<{
 	padding: 16px;
 	background: var(--infoWarnBg);
 	color: var(--infoWarnFg);
+	border-radius: var(--radius);
+	overflow: clip;

 	> .link {
 		margin-left: 4px;
--- a/packages/frontend/src/components/MkRenoteButton.vue
+++ b/packages/frontend/src/components/MkRenoteButton.vue
@@ -1,99 +0,0 @@
-<template>
-<button
-	v-if="canRenote"
-	ref="buttonRef"
-	class="eddddedb _button canRenote"
-	@click="renote()"
->
-	<i class="ti ti-repeat"></i>
-	<p v-if="count > 0" class="count">{{ count }}</p>
-</button>
-<button v-else class="eddddedb _button">
-	<i class="ti ti-ban"></i>
-</button>
-</template>
-
-<script lang="ts" setup>
-import { computed, ref, shallowRef } from 'vue';
-import * as misskey from 'misskey-js';
-import XDetails from '@/components/MkUsersTooltip.vue';
-import { pleaseLogin } from '@/scripts/please-login';
-import * as os from '@/os';
-import { $i } from '@/account';
-import { useTooltip } from '@/scripts/use-tooltip';
-import { i18n } from '@/i18n';
-
-const props = defineProps<{
-	note: misskey.entities.Note;
-	count: number;
-}>();
-
-const buttonRef = shallowRef<HTMLElement>();
-
-const canRenote = computed(() => ['public', 'home'].includes(props.note.visibility) || props.note.userId === $i.id);
-
-useTooltip(buttonRef, async (showing) => {
-	const renotes = await os.api('notes/renotes', {
-		noteId: props.note.id,
-		limit: 11,
-	});
-
-	const users = renotes.map(x => x.user);
-
-	if (users.length < 1) return;
-
-	os.popup(XDetails, {
-		showing,
-		users,
-		count: props.count,
-		targetElement: buttonRef.value,
-	}, {}, 'closed');
-});
-
-const renote = (viaKeyboard = false) => {
-	pleaseLogin();
-	os.popupMenu([{
-		text: i18n.ts.renote,
-		icon: 'ti ti-repeat',
-		action: () => {
-			os.api('notes/create', {
-				renoteId: props.note.id,
-			});
-		},
-	}, {
-		text: i18n.ts.quote,
-		icon: 'ti ti-quote',
-		action: () => {
-			os.post({
-				renote: props.note,
-			});
-		},
-	}], buttonRef.value, {
-		viaKeyboard,
-	});
-};
-</script>
-
-<style lang="scss" scoped>
-.eddddedb {
-	display: inline-block;
-	height: 32px;
-	margin: 2px;
-	padding: 0 6px;
-	border-radius: 4px;
-
-	&:not(.canRenote) {
-		cursor: default;
-	}
-
-	&.renoted {
-		background: var(--accent);
-	}
-
-	> .count {
-		display: inline;
-		margin-left: 8px;
-		opacity: 0.7;
-	}
-}
-</style>
--- a/packages/frontend/src/components/MkRetentionHeatmap.vue
+++ b/packages/frontend/src/components/MkRetentionHeatmap.vue
@@ -10,7 +10,6 @@
 <script lang="ts" setup>
 import { markRaw, version as vueVersion, onMounted, onBeforeUnmount, nextTick } from 'vue';
 import { Chart } from 'chart.js';
-import { enUS } from 'date-fns/locale';
 import tinycolor from 'tinycolor2';
 import { MatrixController, MatrixElement } from 'chartjs-chart-matrix';
 import * as os from '@/os';
@@ -40,7 +39,7 @@ async function renderChart() {
 	const wide = rootEl.offsetWidth > 600;
 	const narrow = rootEl.offsetWidth < 400;

-	const maxDays = wide ? 20 : narrow ? 7 : 14;
+	const maxDays = wide ? 15 : narrow ? 5 : 10;

 	const raw = await os.api('retention', { });

--- a/packages/frontend/src/components/MkSample.vue
+++ b/packages/frontend/src/components/MkSample.vue
@@ -30,10 +30,10 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 import MkButton from '@/components/MkButton.vue';
-import MkInput from '@/components/form/input.vue';
-import MkSwitch from '@/components/form/switch.vue';
-import MkTextarea from '@/components/form/textarea.vue';
-import MkRadio from '@/components/form/radio.vue';
+import MkInput from '@/components/MkInput.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
+import MkTextarea from '@/components/MkTextarea.vue';
+import MkRadio from '@/components/MkRadio.vue';
 import * as os from '@/os';
 import * as config from '@/config';

--- a/packages/frontend/src/components/form/select.vue
+++ b/packages/frontend/src/components/form/select.vue
@@ -1,7 +1,7 @@
 <template>
 <div class="vblkjoeq">
 	<div class="label" @click="focus"><slot name="label"></slot></div>
-	<div ref="container" class="input" :class="{ inline, disabled, focused }" @click.prevent="onClick">
+	<div ref="container" class="input" :class="{ inline, disabled, focused }" @mousedown.prevent="show">
 		<div ref="prefixEl" class="prefix"><slot name="prefix"></slot></div>
 		<select
 			ref="inputEl"
@@ -118,7 +118,7 @@ onMounted(() => {
 	});
 });

-const onClick = (ev: MouseEvent) => {
+function show(ev: MouseEvent) {
 	focused.value = true;
 	opening.value = true;

@@ -166,7 +166,7 @@ const onClick = (ev: MouseEvent) => {
 	}).then(() => {
 		focused.value = false;
 	});
-};
+}
 </script>

 <style lang="scss" scoped>
@@ -285,7 +285,7 @@ const onClick = (ev: MouseEvent) => {

 <style lang="scss" module>
 .chevron {
-	transition: transform 0.5s ease;
+	transition: transform 0.1s ease-out;
 }

 .chevronOpening {
--- a/packages/frontend/src/components/MkSignin.vue
+++ b/packages/frontend/src/components/MkSignin.vue
@@ -1,11 +1,11 @@
 <template>
 <form class="eppvobhk" :class="{ signing, totpLogin }" @submit.prevent="onSubmit">
-	<div class="auth _autoGap">
+	<div class="auth _gaps_m">
 		<div v-show="withAvatar" class="avatar" :style="{ backgroundImage: user ? `url('${ user.avatarUrl }')` : null, marginBottom: message ? '1.5em' : null }"></div>
 		<MkInfo v-if="message">
 			{{ message }}
 		</MkInfo>
-		<div v-if="!totpLogin" class="normal-signin _autoGap">
+		<div v-if="!totpLogin" class="normal-signin _gaps_m">
 			<MkInput v-model="username" :placeholder="i18n.ts.username" type="text" pattern="^[a-zA-Z0-9_]+$" :spellcheck="false" autofocus required data-cy-signin-username @update:model-value="onUsernameChange">
 				<template #prefix>@</template>
 				<template #suffix>@{{ host }}</template>
@@ -14,7 +14,7 @@
 				<template #prefix><i class="ti ti-lock"></i></template>
 				<template #caption><button class="_textButton" type="button" @click="resetPassword">{{ i18n.ts.forgotPassword }}</button></template>
 			</MkInput>
-			<MkButton type="submit" primary :disabled="signing" style="margin: 0 auto;">{{ signing ? i18n.ts.loggingIn : i18n.ts.login }}</MkButton>
+			<MkButton type="submit" large primary rounded :disabled="signing" style="margin: 0 auto;">{{ signing ? i18n.ts.loggingIn : i18n.ts.login }}</MkButton>
 		</div>
 		<div v-if="totpLogin" class="2fa-signin" :class="{ securityKeys: user && user.securityKeys }">
 			<div v-if="user && user.securityKeys" class="twofa-group tap-group">
@@ -36,7 +36,7 @@
 					<template #label>{{ i18n.ts.token }}</template>
 					<template #prefix><i class="ti ti-123"></i></template>
 				</MkInput>
-				<MkButton type="submit" :disabled="signing" primary style="margin: 0 auto;">{{ signing ? i18n.ts.loggingIn : i18n.ts.login }}</MkButton>
+				<MkButton type="submit" :disabled="signing" large primary rounded style="margin: 0 auto;">{{ signing ? i18n.ts.loggingIn : i18n.ts.login }}</MkButton>
 			</div>
 		</div>
 	</div>
@@ -53,7 +53,7 @@ import { defineAsyncComponent } from 'vue';
 import { toUnicode } from 'punycode/';
 import { showSuspendedDialog } from '../scripts/show-suspended-dialog';
 import MkButton from '@/components/MkButton.vue';
-import MkInput from '@/components/form/input.vue';
+import MkInput from '@/components/MkInput.vue';
 import MkInfo from '@/components/MkInfo.vue';
 import { apiUrl, host as configHost } from '@/config';
 import { byteify, hexify } from '@/scripts/2fa';
--- a/packages/frontend/src/components/MkSignup.vue
+++ b/packages/frontend/src/components/MkSignup.vue
@@ -1,5 +1,5 @@
 <template>
-<form class="qlvuhzng _autoGap" autocomplete="new-password" @submit.prevent="onSubmit">
+<form class="qlvuhzng _gaps_m" autocomplete="new-password" @submit.prevent="onSubmit">
 	<MkInput v-if="instance.disableRegistration" v-model="invitationCode" type="text" :spellcheck="false" required>
 		<template #label>{{ i18n.ts.invitationCode }}</template>
 		<template #prefix><i class="ti ti-key"></i></template>
@@ -69,8 +69,8 @@ import { } from 'vue';
 import getPasswordStrength from 'syuilo-password-strength';
 import { toUnicode } from 'punycode/';
 import MkButton from './MkButton.vue';
-import MkInput from './form/input.vue';
-import MkSwitch from './form/switch.vue';
+import MkInput from './MkInput.vue';
+import MkSwitch from './MkSwitch.vue';
 import MkCaptcha from '@/components/MkCaptcha.vue';
 import * as config from '@/config';
 import * as os from '@/os';
--- a/packages/frontend/src/components/MkSubNoteContent.vue
+++ b/packages/frontend/src/components/MkSubNoteContent.vue
@@ -4,7 +4,7 @@
 		<span v-if="note.isHidden" style="opacity: 0.5">({{ i18n.ts.private }})</span>
 		<span v-if="note.deletedAt" style="opacity: 0.5">({{ i18n.ts.deleted }})</span>
 		<MkA v-if="note.replyId" class="reply" :to="`/notes/${note.replyId}`"><i class="ti ti-arrow-back-up"></i></MkA>
-		<Mfm v-if="note.text" :text="note.text" :author="note.user" :i="$i"/>
+		<Mfm v-if="note.text" v-once :text="note.text" :author="note.user" :i="$i"/>
 		<MkA v-if="note.renoteId" class="rp" :to="`/notes/${note.renoteId}`">RN: ...</MkA>
 	</div>
 	<details v-if="note.files.length > 0">
--- a/packages/frontend/src/components/form/switch.vue
+++ b/packages/frontend/src/components/form/switch.vue
@@ -73,9 +73,9 @@ const toggle = () => {
 		width: 32px;
 		height: 23px;
 		outline: none;
-		background: var(--swutchOffBg);
+		background: var(--switchOffBg);
 		background-clip: content-box;
-		border: solid 1px var(--swutchOffBg);
+		border: solid 1px var(--switchOffBg);
 		border-radius: 999px;
 		cursor: pointer;
 		transition: inherit;
@@ -87,7 +87,7 @@ const toggle = () => {
 			left: 3px;
 			width: 15px;
 			height: 15px;
-			background: var(--swutchOffFg);
+			background: var(--switchOffFg);
 			border-radius: 999px;
 			transition: all 0.2s ease;
 		}
@@ -131,12 +131,12 @@ const toggle = () => {

 	&.checked {
 		> .button {
-			background-color: var(--swutchOnBg) !important;
-			border-color: var(--swutchOnBg) !important;
+			background-color: var(--switchOnBg) !important;
+			border-color: var(--switchOnBg) !important;

 			> .knob {
 				left: 12px;
-				background: var(--swutchOnFg);
+				background: var(--switchOnFg);
 			}
 		}
 	}
--- a/packages/frontend/src/components/form/textarea.vue
+++ b/packages/frontend/src/components/form/textarea.vue
--- a/packages/frontend/src/components/MkTokenGenerateWindow.vue
+++ b/packages/frontend/src/components/MkTokenGenerateWindow.vue
@@ -13,7 +13,7 @@
 	<template #header>{{ title || $ts.generateAccessToken }}</template>

 	<MkSpacer :margin-min="20" :margin-max="28">
-		<div class="_autoGap">
+		<div class="_gaps_m">
 			<div v-if="information">
 				<MkInfo warn>{{ information }}</MkInfo>
 			</div>
@@ -36,8 +36,8 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import { permissions as kinds } from 'misskey-js';
-import MkInput from './form/input.vue';
-import MkSwitch from './form/switch.vue';
+import MkInput from './MkInput.vue';
+import MkSwitch from './MkSwitch.vue';
 import MkButton from './MkButton.vue';
 import MkInfo from './MkInfo.vue';
 import MkModalWindow from '@/components/MkModalWindow.vue';
--- a/packages/frontend/src/components/MkUpdated.vue
+++ b/packages/frontend/src/components/MkUpdated.vue
@@ -10,12 +10,13 @@
 </template>

 <script lang="ts" setup>
-import { shallowRef } from 'vue';
+import { onMounted, shallowRef } from 'vue';
 import MkModal from '@/components/MkModal.vue';
 import MkButton from '@/components/MkButton.vue';
 import MkSparkle from '@/components/MkSparkle.vue';
 import { version } from '@/config';
 import { i18n } from '@/i18n';
+import { confetti } from '@/scripts/confetti';

 const modal = shallowRef<InstanceType<typeof MkModal>>();

@@ -23,6 +24,12 @@ const whatIsNew = () => {
 	modal.value.close();
 	window.open(`https://misskey-hub.net/docs/releases.html#_${version.replace(/\./g, '-')}`, '_blank');
 };
+
+onMounted(() => {
+	confetti({
+		duration: 1000 * 3,
+	});
+});
 </script>

 <style lang="scss" scoped>
--- a/packages/frontend/src/components/MkUserSelectDialog.vue
+++ b/packages/frontend/src/components/MkUserSelectDialog.vue
@@ -54,7 +54,7 @@
 <script lang="ts" setup>
 import { nextTick, onMounted } from 'vue';
 import * as misskey from 'misskey-js';
-import MkInput from '@/components/form/input.vue';
+import MkInput from '@/components/MkInput.vue';
 import FormSplit from '@/components/form/split.vue';
 import MkModalWindow from '@/components/MkModalWindow.vue';
 import * as os from '@/os';
--- a/packages/frontend/src/components/MkVisibility.vue
+++ b/packages/frontend/src/components/MkVisibility.vue
@@ -1,48 +0,0 @@
-<template>
-<span v-if="note.visibility !== 'public'" :class="$style.visibility" :title="i18n.ts._visibility[note.visibility]">
-	<i v-if="note.visibility === 'home'" class="ti ti-home"></i>
-	<i v-else-if="note.visibility === 'followers'" class="ti ti-lock-open"></i>
-	<i v-else-if="note.visibility === 'specified'" ref="specified" class="ti ti-mail"></i>
-</span>
-<span v-if="note.localOnly" :class="$style.localOnly" :title="i18n.ts._visibility['localOnly']"><i class="ti ti-world-off"></i></span>
-</template>
-
-<script lang="ts" setup>
-import { ref } from 'vue';
-import XDetails from '@/components/MkUsersTooltip.vue';
-import * as os from '@/os';
-import { useTooltip } from '@/scripts/use-tooltip';
-import { i18n } from '@/i18n';
-
-const props = defineProps<{
-	note: {
-		visibility: string;
-		localOnly?: boolean;
-		visibleUserIds?: string[];
-	},
-}>();
-
-const specified = $shallowRef<HTMLElement>();
-
-if (props.note.visibility === 'specified') {
-	useTooltip($$(specified), async (showing) => {
-		const users = await os.api('users/show', {
-			userIds: props.note.visibleUserIds,
-			limit: 10,
-		});
-
-		os.popup(XDetails, {
-			showing,
-			users,
-			count: props.note.visibleUserIds.length,
-			targetElement: specified,
-		}, {}, 'closed');
-	});
-}
-</script>
-
-<style lang="scss" module>
-.visibility, .localOnly {
-	margin-left: 0.5em;
-}
-</style>
--- a/packages/frontend/src/components/MkWidgets.vue
+++ b/packages/frontend/src/components/MkWidgets.vue
@@ -45,7 +45,7 @@ export type DefaultStoredWidget = {
 <script lang="ts" setup>
 import { defineAsyncComponent, reactive, ref, computed } from 'vue';
 import { v4 as uuid } from 'uuid';
-import MkSelect from '@/components/form/select.vue';
+import MkSelect from '@/components/MkSelect.vue';
 import MkButton from '@/components/MkButton.vue';
 import { widgets as widgetDefs } from '@/widgets';
 import * as os from '@/os';
--- a/packages/frontend/src/components/MkWindow.vue
+++ b/packages/frontend/src/components/MkWindow.vue
@@ -61,8 +61,8 @@ function dragClear(fn) {
 }

 const props = withDefaults(defineProps<{
-	initialWidth?: number;
-	initialHeight?: number | null;
+	initialWidth: number;
+	initialHeight: number | null;
 	canResize?: boolean;
 	closeButton?: boolean;
 	mini?: boolean;
@@ -386,7 +386,7 @@ function onBrowserResize() {
 }

 onMounted(() => {
-	if (props.initialWidth) applyTransformWidth(props.initialWidth);
+	applyTransformWidth(props.initialWidth);
 	if (props.initialHeight) applyTransformHeight(props.initialHeight);

 	applyTransformTop((window.innerHeight / 2) - (rootEl.offsetHeight / 2));
--- a/packages/frontend/src/components/global/MkSpacer.vue
+++ b/packages/frontend/src/components/global/MkSpacer.vue
@@ -38,13 +38,13 @@ const forceSpacerMin = inject('forceSpacerMin', false) || deviceKind === 'smartp
 	container-type: inline-size;
 }

-@container (max-width: 360px) {
+@container (max-width: 450px) {
 	.root {
 		padding: v-bind('props.marginMin + "px"');
 	}
 }

-@container (min-width: 361px) {
+@container (min-width: 451px) {
 	.root {
 		padding: v-bind('props.marginMax + "px"');
 	}
--- a/packages/frontend/src/components/global/MkTime.vue
+++ b/packages/frontend/src/components/global/MkTime.vue
@@ -36,23 +36,21 @@ const relative = $computed(() => {
 		i18n.ts._ago.future);
 });

+let tickId: number;
+
 function tick() {
 	now = new Date();
 	const ago = (now.getTime() - _time.getTime()) / 1000/*ms*/;
 	const next = ago < 60 ? 10000 : ago < 3600 ? 60000 : 180000;

-	tickId = window.setTimeout(() => {
-		window.requestAnimationFrame(tick);
-	}, next);
+	tickId = window.setTimeout(tick, next);
 }

-let tickId: number;
-
 if (props.mode === 'relative' || props.mode === 'detail') {
-	tickId = window.requestAnimationFrame(tick);
+	tick();

 	onUnmounted(() => {
-		window.cancelAnimationFrame(tickId);
+		window.clearTimeout(tickId);
 	});
 }
 </script>
--- a/packages/frontend/src/components/page/page.number-input.vue
+++ b/packages/frontend/src/components/page/page.number-input.vue
@@ -8,7 +8,7 @@

 <script lang="ts">
 import { computed, defineComponent, PropType } from 'vue';
-import MkInput from '../form/input.vue';
+import MkInput from '../MkInput.vue';
 import * as os from '@/os';
 import { Hpml } from '@/scripts/hpml/evaluator';
 import { NumberInputVarBlock } from '@/scripts/hpml/block';
--- a/packages/frontend/src/components/page/page.post.vue
+++ b/packages/frontend/src/components/page/page.post.vue
@@ -10,7 +10,7 @@

 <script lang="ts">
 import { defineComponent, PropType } from 'vue';
-import MkTextarea from '../form/textarea.vue';
+import MkTextarea from '../MkTextarea.vue';
 import MkButton from '../MkButton.vue';
 import { apiUrl } from '@/config';
 import * as os from '@/os';
--- a/packages/frontend/src/components/page/page.radio-button.vue
+++ b/packages/frontend/src/components/page/page.radio-button.vue
@@ -7,7 +7,7 @@

 <script lang="ts">
 import { computed, defineComponent, PropType } from 'vue';
-import MkRadio from '../form/radio.vue';
+import MkRadio from '../MkRadio.vue';
 import * as os from '@/os';
 import { Hpml } from '@/scripts/hpml/evaluator';
 import { RadioButtonVarBlock } from '@/scripts/hpml/block';
--- a/packages/frontend/src/components/page/page.switch.vue
+++ b/packages/frontend/src/components/page/page.switch.vue
@@ -6,7 +6,7 @@

 <script lang="ts">
 import { computed, defineComponent, PropType } from 'vue';
-import MkSwitch from '../form/switch.vue';
+import MkSwitch from '../MkSwitch.vue';
 import * as os from '@/os';
 import { Hpml } from '@/scripts/hpml/evaluator';
 import { SwitchVarBlock } from '@/scripts/hpml/block';
--- a/packages/frontend/src/components/page/page.text-input.vue
+++ b/packages/frontend/src/components/page/page.text-input.vue
@@ -8,7 +8,7 @@

 <script lang="ts">
 import { computed, defineComponent, PropType } from 'vue';
-import MkInput from '../form/input.vue';
+import MkInput from '../MkInput.vue';
 import * as os from '@/os';
 import { Hpml } from '@/scripts/hpml/evaluator';
 import { TextInputVarBlock } from '@/scripts/hpml/block';
--- a/packages/frontend/src/components/page/page.textarea-input.vue
+++ b/packages/frontend/src/components/page/page.textarea-input.vue
@@ -8,7 +8,7 @@

 <script lang="ts">
 import { computed, defineComponent, PropType } from 'vue';
-import MkTextarea from '../form/textarea.vue';
+import MkTextarea from '../MkTextarea.vue';
 import * as os from '@/os';
 import { Hpml } from '@/scripts/hpml/evaluator';
 import { HpmlTextInput } from '@/scripts/hpml';
--- a/packages/frontend/src/components/page/page.textarea.vue
+++ b/packages/frontend/src/components/page/page.textarea.vue
@@ -6,7 +6,7 @@
 import { TextBlock } from '@/scripts/hpml/block';
 import { Hpml } from '@/scripts/hpml/evaluator';
 import { defineComponent, PropType } from 'vue';
-import MkTextarea from '../form/textarea.vue';
+import MkTextarea from '../MkTextarea.vue';

 export default defineComponent({
 	components: {
--- a/packages/frontend/src/config.ts
+++ b/packages/frontend/src/config.ts
@@ -1,3 +1,5 @@
+import { miLocalStorage } from "./local-storage";
+
 const address = new URL(location.href);
 const siteName = (document.querySelector('meta[property="og:site_name"]') as HTMLMetaElement)?.content;

@@ -6,10 +8,10 @@ export const hostname = address.hostname;
 export const url = address.origin;
 export const apiUrl = url + '/api';
 export const wsUrl = url.replace('http://', 'ws://').replace('https://', 'wss://') + '/streaming';
-export const lang = localStorage.getItem('lang');
+export const lang = miLocalStorage.getItem('lang');
 export const langs = _LANGS_;
-export const locale = JSON.parse(localStorage.getItem('locale'));
+export const locale = JSON.parse(miLocalStorage.getItem('locale'));
 export const version = _VERSION_;
 export const instanceName = siteName === 'Misskey' ? host : siteName;
-export const ui = localStorage.getItem('ui');
-export const debug = localStorage.getItem('debug') === 'true';
+export const ui = miLocalStorage.getItem('ui');
+export const debug = miLocalStorage.getItem('debug') === 'true';
--- a/packages/frontend/src/init.ts
+++ b/packages/frontend/src/init.ts
@@ -9,9 +9,12 @@ import '@/style.scss';
 //#region account indexedDB migration
 import { set } from '@/scripts/idb-proxy';

-if (localStorage.getItem('accounts') != null) {
-	set('accounts', JSON.parse(localStorage.getItem('accounts')));
-	localStorage.removeItem('accounts');
+{
+	const accounts = miLocalStorage.getItem('accounts');
+	if (accounts) {
+		set('accounts', JSON.parse(accounts));
+		miLocalStorage.removeItem('accounts');
+	}
 }
 //#endregion

@@ -40,6 +43,7 @@ import { reloadChannel } from '@/scripts/unison-reload';
 import { reactionPicker } from '@/scripts/reaction-picker';
 import { getUrlWithoutLoginId } from '@/scripts/login-id';
 import { getAccountFromId } from '@/scripts/get-account-from-id';
+import { miLocalStorage } from './local-storage';

 (async () => {
 	console.info(`Misskey v${version}`);
@@ -154,7 +158,7 @@ import { getAccountFromId } from '@/scripts/get-account-from-id';
 	const fetchInstanceMetaPromise = fetchInstance();

 	fetchInstanceMetaPromise.then(() => {
-		localStorage.setItem('v', instance.version);
+		miLocalStorage.setItem('v', instance.version);

 		// Init service worker
 		initializeSw();
@@ -223,12 +227,12 @@ import { getAccountFromId } from '@/scripts/get-account-from-id';
 	}

 	// クライアントが更新されたか？
-	const lastVersion = localStorage.getItem('lastVersion');
+	const lastVersion = miLocalStorage.getItem('lastVersion');
 	if (lastVersion !== version) {
-		localStorage.setItem('lastVersion', version);
+		miLocalStorage.setItem('lastVersion', version);

 		// テーマリビルドするため
-		localStorage.removeItem('theme');
+		miLocalStorage.removeItem('theme');

 		try { // 変なバージョン文字列来るとcompareVersionsでエラーになるため
 			if (lastVersion != null && compareVersions(version, lastVersion) === 1) {
@@ -244,7 +248,7 @@ import { getAccountFromId } from '@/scripts/get-account-from-id';
 	// NOTE: この処理は必ず↑のクライアント更新時処理より後に来ること(テーマ再構築のため)
 	watch(defaultStore.reactiveState.darkMode, (darkMode) => {
 		applyTheme(darkMode ? ColdDeviceStorage.get('darkTheme') : ColdDeviceStorage.get('lightTheme'));
-	}, { immediate: localStorage.theme == null });
+	}, { immediate: miLocalStorage.getItem('theme') == null });

 	const darkTheme = computed(ColdDeviceStorage.makeGetterSetter('darkTheme'));
 	const lightTheme = computed(ColdDeviceStorage.makeGetterSetter('lightTheme'));
@@ -341,7 +345,7 @@ import { getAccountFromId } from '@/scripts/get-account-from-id';
 			});
 		}

-		const lastUsed = localStorage.getItem('lastUsed');
+		const lastUsed = miLocalStorage.getItem('lastUsed');
 		if (lastUsed) {
 			const lastUsedDate = parseInt(lastUsed, 10);
 			// 二時間以上前なら
@@ -351,7 +355,15 @@ import { getAccountFromId } from '@/scripts/get-account-from-id';
 				}));
 			}
 		}
-		localStorage.setItem('lastUsed', Date.now().toString());
+		miLocalStorage.setItem('lastUsed', Date.now().toString());
+
+		const latestDonationInfoShownAt = miLocalStorage.getItem('latestDonationInfoShownAt');
+		const neverShowDonationInfo = miLocalStorage.getItem('neverShowDonationInfo');
+		if (neverShowDonationInfo !== 'true' && (new Date($i.createdAt).getTime() < (Date.now() - (1000 * 60 * 60 * 24 * 3)))) {
+			if (latestDonationInfoShownAt == null || (new Date(latestDonationInfoShownAt).getTime() < (Date.now() - (1000 * 60 * 60 * 24 * 30)))) {
+				popup(defineAsyncComponent(() => import('@/components/MkDonation.vue')), {}, {}, 'closed');
+			}
+		}

 		if ('Notification' in window) {
 			// 許可を得ていなかったらリクエスト
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
syuilo	1f6a41cea7	13.0.0-beta.30	2023-01-08 14:30:00 +09:00
syuilo	0d7ee20a77	🎨	2023-01-08 14:29:22 +09:00
syuilo	dcca2350dd	🎨	2023-01-08 14:28:14 +09:00
syuilo	1cfdd4c41a	refactor	2023-01-08 14:22:04 +09:00
syuilo	25f4ee7030	Update CHANGELOG.md	2023-01-08 14:19:32 +09:00
syuilo	5320f23017	enhance(client): improve user activity page	2023-01-08 14:17:56 +09:00
syuilo	4ffbbbe6d8	🎨	2023-01-08 13:10:01 +09:00
syuilo	132e45dff4	13.0.0-beta.29	2023-01-08 11:58:00 +09:00
syuilo	01652b72b3	🎨	2023-01-08 11:57:34 +09:00
syuilo	8b1fdb5a3b	enhance(client): add theme	2023-01-08 11:55:37 +09:00
syuilo	192add376c	fix MkModal animation	2023-01-08 11:47:16 +09:00
syuilo	244ea9593a	tweak components	2023-01-08 11:30:40 +09:00
syuilo	f20d7cba74	13.0.0-beta.28	2023-01-08 11:17:02 +09:00
syuilo	a3e282bc75	New Crowdin updates (#9478 ) * New translations ja-JP.yml (Thai) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Italian) * 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 (Korean) * New translations ja-JP.yml (Korean) * New translations ja-JP.yml (Slovak)	2023-01-08 11:16:36 +09:00
syuilo	49a95c34bf	Update CHANGELOG.md	2023-01-08 11:16:26 +09:00
Soni L	ecbefce2aa	Support remote objects in search (#9479 ) * Support remote objects in search Closes #9428 * Use account instead of localStorage * Use useRouter instead of mainRouter Co-authored-by: Chaos <chaoticryptidz@owo.monster>	2023-01-08 11:15:54 +09:00
syuilo	91356b1805	tweak	2023-01-08 11:12:11 +09:00
syuilo	2e2ed1385f	delete pollVote notification	2023-01-08 10:54:45 +09:00
syuilo	49f3090edd	tweak note componsnt	2023-01-08 10:48:44 +09:00
syuilo	4594fb11de	🎨	2023-01-08 10:32:37 +09:00
syuilo	b93e56d2e5	🎨	2023-01-08 10:24:30 +09:00
syuilo	c550dafb81	tweak note component	2023-01-08 10:20:28 +09:00
syuilo	8709574f3d	🎨	2023-01-08 09:58:35 +09:00
syuilo	1b7043fa79	🎨	2023-01-07 19:57:48 +09:00
syuilo	55ef2393fb	13.0.0-beta.27	2023-01-07 17:44:15 +09:00
syuilo	7769095efb	🎨	2023-01-07 17:39:24 +09:00
syuilo	b8248bdd65	🎨	2023-01-07 17:37:30 +09:00
syuilo	6f4ad581dc	🎨	2023-01-07 17:27:09 +09:00
syuilo	aec94920ab	🎨	2023-01-07 17:20:50 +09:00
syuilo	155ca39063	update aiscript	2023-01-07 17:18:30 +09:00
syuilo	58bfb4dca4	refactor	2023-01-07 15:09:46 +09:00
syuilo	49a0b6c48b	fix typo	2023-01-07 15:00:29 +09:00
syuilo	799a653b44	🎨	2023-01-07 15:00:00 +09:00
syuilo	d09e1f4925	refactor	2023-01-07 14:59:54 +09:00
syuilo	cac784af8a	fix #9483	2023-01-07 14:44:50 +09:00
syuilo	d7e0ddcbca	Merge branch 'develop' of https://github.com/misskey-dev/misskey into develop	2023-01-07 14:33:36 +09:00
syuilo	8c0811a442	🎨	2023-01-07 14:33:33 +09:00
syuilo	bab6f75260	Update CHANGELOG.md	2023-01-07 14:24:33 +09:00
syuilo	54e3fccd87	enhance(server): refactor and tweak emoji proxy	2023-01-07 14:19:25 +09:00
syuilo	6a992b6982	fix chart rendering	2023-01-07 14:10:01 +09:00
syuilo	ecd6fc1db8	🎨	2023-01-07 11:49:04 +09:00
syuilo	d99be6697e	enhance(client): donation dialog	2023-01-07 11:49:00 +09:00
syuilo	d2d77b5dc1	Merge branch 'develop' of https://github.com/misskey-dev/misskey into develop	2023-01-07 10:13:07 +09:00
syuilo	91503405b4	refactor(client): typed localStorage	2023-01-07 10:13:02 +09:00
tamaina	c336201084	Merge branch 'develop' of https://github.com/misskey-dev/misskey into develop	2023-01-06 14:01:02 +00:00
tamaina	0f3399753d	chore: remove `Search` from the name of OpenSearch	2023-01-06 14:00:54 +00:00
tamaina	5ec89ea0c3	カスタム絵文字にプロキシを復活 (#9481 ) * wip * Revert "Update ClientServerService.ts" This reverts commit `88c64ece78`. * Revert "disable custom emoji proxy temporary" This reverts commit `495d513efd`. * ✌️	2023-01-06 22:34:50 +09:00
syuilo	a42b03c154	13.0.0-beta.26	2023-01-06 20:29:48 +09:00
syuilo	4b181a30da	tweak confetti	2023-01-06 20:25:08 +09:00
syuilo	70805e00eb	🎨	2023-01-06 20:19:27 +09:00
syuilo	3551ac328e	tweak retention heatmap	2023-01-06 20:01:32 +09:00
syuilo	e36e5df635	chore(client): tweak charts	2023-01-06 20:00:06 +09:00
syuilo	3e7d8b5f17	update deps	2023-01-06 19:59:31 +09:00
syuilo	5846198eee	enhance(client): provide THIS_ID and THIS_URL vars to aiscript of flash	2023-01-06 17:19:25 +09:00
syuilo	c14063a921	🎨	2023-01-06 17:07:32 +09:00
syuilo	457670e730	Update MkTime.vue	2023-01-06 16:58:43 +09:00
syuilo	513cef50a2	tweak federation widget	2023-01-06 16:32:34 +09:00
syuilo	88c64ece78	Update ClientServerService.ts	2023-01-06 14:07:34 +09:00
syuilo	a11672d0a5	13.0.0-beta.25	2023-01-06 13:52:14 +09:00
syuilo	46af9515b0	fix style	2023-01-06 13:52:05 +09:00
syuilo	c5cb786054	🎨	2023-01-06 13:50:41 +09:00
syuilo	4d2d6154a3	New Crowdin updates (#9471 ) * New translations ja-JP.yml (Romanian) * New translations ja-JP.yml (French) * New translations ja-JP.yml (Spanish) * New translations ja-JP.yml (Arabic) * New translations ja-JP.yml (Czech) * New translations ja-JP.yml (German) * New translations ja-JP.yml (Italian) * New translations ja-JP.yml (Korean) * New translations ja-JP.yml (Polish) * New translations ja-JP.yml (Russian) * New translations ja-JP.yml (Slovak) * New translations ja-JP.yml (Ukrainian) * New translations ja-JP.yml (Chinese Simplified) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (English) * New translations ja-JP.yml (Vietnamese) * New translations ja-JP.yml (Indonesian) * New translations ja-JP.yml (Bengali) * New translations ja-JP.yml (Thai) * New translations ja-JP.yml (Japanese, Kansai) * New translations ja-JP.yml (Chinese Simplified) * New translations ja-JP.yml (Korean) * New translations ja-JP.yml (Arabic) * New translations ja-JP.yml (German) * New translations ja-JP.yml (Chinese Simplified) * New translations ja-JP.yml (English) * New translations ja-JP.yml (Indonesian) * New translations ja-JP.yml (Korean) * New translations ja-JP.yml (Swedish) * New translations ja-JP.yml (Chinese Simplified) * New translations ja-JP.yml (Arabic) * New translations ja-JP.yml (Chinese Traditional) * New translations ja-JP.yml (Italian) * New translations ja-JP.yml (Italian)	2023-01-06 13:47:34 +09:00
syuilo	495d513efd	disable custom emoji proxy temporary https://github.com/misskey-dev/misskey/pull/9431#issuecomment-1373006446	2023-01-06 13:47:18 +09:00
syuilo	3b617fafdd	enhance(client): アップデート時にも花火	2023-01-06 13:43:10 +09:00
syuilo	82c4f694a0	🎨	2023-01-06 13:40:17 +09:00
syuilo	dc5b4a0402	enhance(client): show fireworks when visit user who today is birthday Resolve #9476	2023-01-06 13:25:49 +09:00
syuilo	6adc0521d8	Update CHANGELOG.md	2023-01-06 12:26:18 +09:00
syuilo	9ac86dacbb	Update CHANGELOG.md	2023-01-06 12:13:34 +09:00
syuilo	88f0c10d09	Update CHANGELOG.md	2023-01-06 11:20:09 +09:00