Merge branch 'develop'

12.85.1
2021-08-09 21:47:52 +09:00 · 2021-08-09 21:47:43 +09:00 · 2021-08-09 21:47:23 +09:00 · 2021-08-09 21:45:46 +09:00 · 2021-08-09 21:41:20 +09:00 · 2021-08-09 18:55:39 +09:00
1145 changed files with 40924 additions and 4020 deletions
--- a/.github/PULL_REQUEST_TEMPLATE.md
+++ b/.github/PULL_REQUEST_TEMPLATE.md
@ -1,13 +1,32 @@
-## Summary
+<!-- ℹ お読みください
+PRありがとうございます！ PRを作成する前に、以下をご確認ください:
+可能であればタイトルに、以下で示すようなPRの種類が分かるキーワードをプリフィクスしてください。
+fix / refactor / feat / enhance / perf / chore
+また、PRの粒度が適切であることを確認してください。ひとつのPRに複数の種類の変更や関心を含めることは避けてください。
+このPRによって解決されるIssueがある場合は、そのIssue IDを本文内に記入してください。
+CHANGELOG.mdに変更点を追記してください。リファクタリングなど、利用者に影響を与えない変更についてはこの限りではありません。
+機能追加やバグ修正をした場合は、可能であればテストケースを追加してください。
+ご協力ありがとうございます🤗
+-->
+<!-- ℹ README
+Thank you for your PR! Before creating a PR, please check the following:
+If possible, prefix the title with a keyword that identifies the type of this PR, as shown below.
+fix / refactor / feat / enhance / perf / chore
+Also, make sure that the granularity of this PR is appropriate. Please do not include more than one type of change or interest in a single PR.
+If there is an issue to be resolved by this PR, please include the Issue ID in the text.
+Please add the summary of the changes to CHANGELOG.md. However, this is not necessary for changes that do not affect the users, such as refactoring.
+If you have added a feature or fixed a bug, please add a test case if possible.
+Thanks for your cooperation 🤗
+-->

-<!--
-  -
-  - * Please describe your changes here *
-  -
-  - If you are going to resolve some issue, please add this context.
-  - Resolve #ISSUE_NUMBER
-  -
-  - If you are going to fix some bug issue, please add this context.
-  - Fix #ISSUE_NUMBER
-  -
-  -->
+# What
+<!-- このPRで何をしたのか？ どう変わるのか？ -->
+<!-- What did you do with this PR? How will it change things? -->
+
+# Why
+<!-- なぜそうするのか？ どういう意図なのか？ 何が困っているのか？ -->
+<!-- Why do you do it? What are your intentions? What is the problem? -->
+
+# Additional info (optional)
+<!-- テスト観点など -->
+<!-- Test perspective, etc -->
--- a/.mocharc.json
+++ b/.mocharc.json
@ -2,6 +2,6 @@
 	"extension": ["ts","js","cjs","mjs"],
 	"require": ["ts-node/register", "tsconfig-paths/register"],
 	"slow": 1000,
-	"timeout": 30000,
+	"timeout": 35000,
 	"exit": true
 }
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@ -28,12 +28,7 @@ If your language is not listed in Crowdin, please open an issue.

 ![Crowdin](https://d322cqt584bo4o.cloudfront.net/misskey/localized.svg)

-## Internationalization (i18n)
-Misskey uses the Vue.js plugin [Vue I18n](https://github.com/kazupon/vue-i18n).
-Documentation of Vue I18n is available at http://kazupon.github.io/vue-i18n/introduction.html .
-
 ## Documentation
-* Documents for contributors are located in [`/docs`](/docs).
 * Documents for instance admins are located in [`/docs`](/docs).
 * Documents for end users are located in [`/src/docs`](/src/docs).

@ -41,8 +36,8 @@ Documentation of Vue I18n is available at http://kazupon.github.io/vue-i18n/intr
 * Test codes are located in [`/test`](/test).

 ## Continuous integration
-Misskey uses CircleCI for executing automated tests.
-Configuration files are located in [`/.circleci`](/.circleci).
+Misskey uses GitHub Actions for executing automated tests.
+Configuration files are located in [`/.github/workflows`](/.github/workflows).

 ## Adding MisskeyRoom items
 * Use English for material, object and texture names.
@ -247,6 +242,9 @@ npx ts-node ./node_modules/typeorm/cli.js migration:generate -n 変更の名前

 作成されたスクリプトは不必要な変更を含むため除去してください。

+### コネクションには`markRaw`せよ
+**Vueのコンポーネントのdataオプションとして**misskey.jsのコネクションを設定するとき、必ず`markRaw`でラップしてください。インスタンスが不必要にリアクティブ化されることで、misskey.js内の処理で不具合が発生するとともに、パフォーマンス上の問題にも繋がる。なお、Composition APIを使う場合はこの限りではない(リアクティブ化はマニュアルなため)。
+
 ## その他
 ### HTMLのクラス名で follow という単語は使わない
 広告ブロッカーで誤ってブロックされる
--- a/crowdin.yml
+++ b/crowdin.yml
@ -2,6 +2,6 @@ files:
  - source: /locales/ja-JP.yml
    translation: /locales/%locale%.yml
    update_option: update_as_unapproved
-  - source: /src/docs/ja-JP/*.md
-    translation: /src/docs/%locale%/%original_file_name%
+  - source: /src/docs/ja-JP/**/*.md
+    translation: /src/docs/%locale%/**/%original_file_name%
    update_option: update_as_unapproved
--- a/locales/ar-SA.yml
+++ b/locales/ar-SA.yml
@ -385,7 +385,6 @@ updateRemoteUser: "تحديث المعلومات عن المستخدم البع
 deleteAllFiles: "حذف كافة الملفات"
 userSuspended: "تم تعليق هذا المستخدم."
 userSilenced: "تم إسكات هذا المستخدم."
-sidebar: "الشريط الجانبي"
 addItem: "إضافة عنصر"
 rooms: "الغرفة"
 relays: "المُرَحلات"
@ -428,8 +427,13 @@ inUse: "مستخدم"
 info: "عن"
 user: "المستخدمون"
 administration: "إدارة "
+postToGallery: "انشر في المعرض"
+gallery: "المعرض"
 expiration: "ينتهي استطلاع الرأي في"
 middle: "متوسط"
+global: "الشامل"
+_docs:
+  admin: "إدارة "
 _email:
  _follow:
    title: "يتابعك"
@ -442,9 +446,7 @@ _reversi:
  total: "المجموع"
 _channel:
  featured: "المتداوَلة"
-_sidebar:
-  full: "كامل"
-  icon: "الصورة الرمزية"
+_menuDisplay:
  hide: "إخفاء"
 _theme:
  explore: "استكشف قوالب المظهر"
--- a/locales/cs-CZ.yml
+++ b/locales/cs-CZ.yml
@ -111,6 +111,7 @@ editWidgets: "Upravit widget"
 editWidgetsExit: "Hotovo"
 customEmojis: "Vlastní emoji"
 emoji: "Emoji"
+emojis: "Emoji"
 emojiName: "Jméno emoji"
 emojiUrl: "URL obrázku"
 addEmoji: "Přidat emoji"
@ -390,7 +391,6 @@ script: "Skript"
 deleteAllFiles: "Smazat všechny soubory"
 deleteAllFilesConfirm: "Jste si jistí že chcete smazat všechny soubory?"
 userSuspended: "Tomuto uživateli byl pozastaven účet."
-sidebar: "Postranní panel"
 addItem: "Přidat položku"
 rooms: "Místnost"
 inboxUrl: "Inbox URL"
@ -409,8 +409,6 @@ _mfm:
  search: "Vyhledávání"
 _reversi:
  total: "Celkem"
-_sidebar:
-  icon: "Avatar"
 _theme:
  keys:
    mention: "Zmínění"
--- a/locales/de-DE.yml
+++ b/locales/de-DE.yml
--- a/locales/en-US.yml
+++ b/locales/en-US.yml
--- a/locales/eo-UY.yml
+++ b/locales/eo-UY.yml
@ -0,0 +1,507 @@
+---
+_lang_: "Esperanto"
+headlineMisskey: "Reto ligiĝanta per notoj"
+introMisskey: "Bonvenon! Misskey (Ĉi-sekve Miskejo) estas malfermitkoda malcentriza mikrobloga servo.\nKreu \"noto\"n por ke kunhavu tion kio nun okazas aŭ ke eksendu tion kio pri vi📡\nFunkcion \"reago\" vi povas uzi kaj aldoni vian reagon pri ciu noto de ĉiu homo👍\nVolu esplori nova mondo🚀"
+monthAndDay: "{day}-a/{month}"
+search: "Serĉi"
+notifications: "Sciigoj"
+username: "Uzantnomo"
+password: "Pasvorto"
+forgotPassword: "Ĉu vi forgesis pasvorton?"
+fetchingAsApObject: "Informpetado de Fediverso..."
+ok: "Akcepteble"
+gotIt: "Mi konprenas!"
+cancel: "Nuligi"
+enterUsername: "Entajpu uzantnomon"
+renotedBy: "Renoton faras {user}"
+noNotes: "Neniu noto!"
+noNotifications: "Vi ne havas sciigojn."
+instance: "Ekzemplo"
+settings: "Agordoj"
+basicSettings: "Ĝeneralaj agordoj"
+otherSettings: "Aliaj agordoj"
+openInWindow: "Malfermi en nova fenestro"
+profile: "Profilo"
+timeline: "Templinio"
+noAccountDescription: "Tiu uzanto ne enhavas biografion je la profilo."
+login: "Ensaluti"
+loggingIn: "Ensalutado..."
+logout: "Elsaluti"
+signup: "Krei konton"
+uploading: "Alŝutado..."
+save: "Konservi"
+users: "Uzanto"
+addUser: "Aldoni uzanton"
+favorite: "Preferi"
+favorites: "Preferataj"
+unfavorite: "Malpreferi"
+favorited: "Aldonita al preferatoj"
+alreadyFavorited: "Jame aldonita al preferatoj"
+cantFavorite: "Ne aldonita al preferatoj"
+pin: "Alpingli sur la profilo"
+unpin: "Depingli"
+copyContent: "Kopii enhavon"
+copyLink: "Kopii ligilon"
+delete: "Forviŝi"
+deleteAndEdit: "Foriginte redakti"
+deleteAndEditConfirm: "Ĉu vi certas, ke vi volas forigi la noton kaj redakti ĝin? Ĉiuj reagoj, renotoj, kaj respondoj ankaŭ foriĝos."
+addToList: "Aldoni al la listo"
+sendMessage: "Sendi mesaĝon"
+copyUsername: "Kopii uzantnomon"
+searchUser: "Serĉi uzanton"
+reply: "Respondi"
+loadMore: "Vidu pli"
+showMore: "Vidi pli"
+youGotNewFollower: "Vin eksekvis"
+receiveFollowRequest: "Eksekvopeton riceviĝis."
+followRequestAccepted: "La eksekvopeto akceptiĝis."
+mention: "Mencioj"
+mentions: "Al vi"
+importAndExport: "Importaĵo / Eksportaĵo"
+import: "Importi"
+export: "Eksporti"
+files: "Dosieroj"
+download: "Elŝuti"
+driveFileDeleteConfirm: "Ĉu vi certas ke vi volas forviŝi la dosierujon {name}? Noto aldonita ĝin ankaŭ foriĝos."
+unfollowConfirm: "Ĉu vi certas, ke vi volas ne plu sekvi {name}'(o)n?"
+lists: "Listoj"
+noLists: "Neniu listo"
+note: "Elsendi noto"
+notes: "Notoj"
+following: "Sekvatoj"
+followers: "Sekvantoj"
+followsYou: "Vin sekvas "
+createList: "Kreii liston"
+error: "Eraro"
+somethingHappened: "Problemo okazis."
+retry: "Reprovi"
+enterListName: "Entajpu nomon de la listo"
+privacy: "Privateco"
+follow: "Sekvi"
+followRequest: "Peti akcepti de vi eksekvi"
+followRequests: "Eksekvopetoj"
+unfollow: "Ne plu sekvi"
+enterEmoji: "Entajpu emoĵion"
+renote: "Fari renoton"
+unrenote: "Malfari renoton"
+renoted: "Renoton fariĝis."
+cantRenote: "Tiu noto ne estas renototebla."
+cantReRenote: "Oni ne povas fari renoton kiu enhavas renoto."
+quote: "Citi"
+pinnedNote: "Pinglita noto"
+pinned: "Alpingli sur la profilo"
+you: "Vi"
+clickToShow: "Klaku por malkaŝu"
+sensitive: "Enhavo ne estas deca por laborejo (NSFW)"
+add: "Aldoni"
+reaction: "Reagoj"
+enterFileName: "Entajpu dosiernomon"
+mute: "Silentigi"
+unmute: "Malsilentigi"
+block: "Bloki"
+unblock: "Malbloki"
+suspend: "Flostigi"
+unsuspend: "Fandi"
+blockConfirm: "Ĉu vi certas ke vi volas bloki la uzanton?"
+unblockConfirm: "Ĉu vi certas ke vi volas malbloki la uzanton?"
+suspendConfirm: "Ĉu vi certas ke vi volas frostigi la uzanton?"
+unsuspendConfirm: "Ĉu vi certas ke vi volas fandi la uzanton?"
+selectList: "Elekti liston"
+selectAntenna: "Elekti antenon"
+selectWidget: "Elekti enestraĵon"
+editWidgets: "Redakti fenestraĵon"
+editWidgetsExit: "Fini la redaktadon"
+customEmojis: "Personecigitaj emoĵioj"
+emoji: "Emoĵio"
+emojis: "Emoĵio"
+emojiName: "Nomo de emoĵio"
+emojiUrl: "URL de la bildo de emoĵio"
+addEmoji: "Aldoni emoĵion"
+cacheRemoteFiles: "Havi staplon por foraj dosieroj"
+flagAsBot: "Tiu uzanto estas roboto"
+flagAsCat: "Tiu uzanto estas kato"
+addAccount: "Aldoni konton"
+showOnRemote: "Vidi sur la fora ekzemplo"
+general: "Ĝenerala"
+searchWith: "Serĉi: {q}"
+youHaveNoLists: "Vi ne havas listojn."
+followConfirm: "Ĉu vi certas ke vi volas sekvi {name}'(o)n?"
+selectUser: "Elekti uzanton"
+annotation: "Komentarioj"
+federation: "Fediverso"
+instances: "Ekzemplo"
+perHour: "Po horo"
+perDay: "Po tago"
+blockThisInstance: "Bloki tiu ekzemplo"
+withNFiles: "{n} dosiero(j)"
+disk: "Diskilo"
+instanceInfo: "Informo pri la ekzemplo"
+clearCachedFiles: "Forviŝi datumon en staplo"
+clearCachedFilesConfirm: "Ĉu vi certas, ke vi volas forviŝi ĉiujn transajn dosierojn en la staplo?"
+blockedInstances: "Blokataj ekzemploj"
+muteAndBlock: "Silentitaj / Blokitaj"
+mutedUsers: "Silentigitaj uzantoj"
+blockedUsers: "Blokitaj uzantoj"
+noUsers: "Sen uzantoj"
+editProfile: "Redakti profilon"
+noteDeleteConfirm: "Ĉu vi certas ke vi volas forviŝi la noton?"
+pinLimitExceeded: "Vi ne plu povas alpingli noton."
+noCustomEmojis: "Neniu emoĵio"
+federating: "Konfederado"
+blocked: "Blokita"
+subscribing: "Abonita"
+notResponding: "Alvokato ne disponeblas"
+instanceFollowing: "Sekvatoj sur la ekzemplo"
+instanceFollowers: "Sekvantoj el la ekzemplo"
+instanceUsers: "Uzantoj de la ekzemplo"
+changePassword: "Ŝanĝi pasvorton"
+currentPassword: "Aktuala pasvorto"
+newPassword: "Nova pasvorto"
+newPasswordRetype: "Reentajpu la novan pasvorton"
+attachFile: "Aldoni dosieron"
+more: "Plu!"
+usernameOrUserId: "Uzantnomo aŭ identigilo de uzanto"
+noSuchUser: "Neniuj uzantoj trovitaj."
+imageUrl: "URL de bildo"
+remove: "Forigi"
+removed: "Forviŝis"
+removeAreYouSure: "Ĉu vi certas ke vi volas forigi \"{x}\"'(o)n?"
+deleteAreYouSure: "Ĉu vi certas ke vi volas forviŝi \"{x}\"'(o)n?"
+messaging: "Retbabili"
+upload: "Alŝuti"
+fromDrive: "De la diskingo en Miskejo"
+fromUrl: "De URL"
+uploadFromUrl: "Alŝuti de URL"
+uploadFromUrlDescription: "URL de la dosiero kiun vi volu alŝuti"
+games: "Ludoj sur Miskejo"
+messageRead: "Legita"
+startMessaging: "Komenci babiladon"
+tos: "Kondiĉoj de Uzado"
+start: "Komenciĝi"
+home: "Hejmo"
+remoteUserCaution: "Ĉi tiu Infomoj estas ne tute ekzakta pro distanca uzanto."
+images: "Bildoj"
+birthday: "Naskiĝtago"
+registeredDate: "Registriĝdato"
+drive: "Diskingo"
+fileName: "Dosiernomo"
+selectFile: "Elekti dosieron"
+selectFiles: "Elekti dosieron"
+renameFile: "Alinomi la dosieron"
+folderName: "Nomo de la dosierujo"
+renameFolder: "Alinomi la dosierujon"
+deleteFolder: "Forviŝi dosierujon"
+addFile: "Aldoni dosieron"
+emptyDrive: "La diskingo enhavas neniun."
+unableToDelete: "Ne forigebla"
+inputNewFileName: "Entajpu nova dosiernomon"
+inputNewFolderName: "Entajpu nova nomon de la dosierujo"
+hasChildFilesOrFolders: "La dosierujo enhavas dosieron kaj ne estas forigebla."
+copyUrl: "Kopii URL"
+rename: "Alinomi"
+avatar: "Ikono"
+nsfw: "Enhavo ne estas deca por laborejo (NSFW)"
+instanceName: "Nomo de la ekzemplo"
+maintainerName: "Nomo de la administranto"
+maintainerEmail: "Retpoŝto de la administranto"
+tosUrl: "URL de kondiĉoj de uzado"
+thisYear: "Ĉi-jare"
+thisMonth: "Ĉi-monate"
+today: "Hodiaŭ"
+dayX: "{day}-a"
+monthX: "{month}"
+yearX: "La jaro {year}"
+connectService: "Konekti"
+disconnectService: "Farkonektiĝi"
+driveCapacityPerLocalAccount: "Volumo de miskej-diskingo po unu loka uzanto"
+driveCapacityPerRemoteAccount: "Volumo de miskej-diskingo po unu transa uzanto"
+iconUrl: "URL de la ikono (retpaĝsimbolo, ktp.)"
+pinnedUsers: "Alpinglita uzanto"
+pinnedNotes: "Pinglita noto"
+name: "Nomo"
+withFileAntenna: "Nur kun aldonaĵo"
+notesAndReplies: "Kun respondoj"
+withFiles: "Kun aldonaĵo"
+silenceConfirm: "Ĉu vi certas ke vi volas silentigi la uzanton?"
+unsilenceConfirm: "Ĉu vi certas, ke vi ne plu volas ke la uzanto silentas?"
+popularTags: "Popularaj kradvortoj"
+userList: "Listoj"
+aboutMisskey: "Pri Miskejo"
+securityKeyName: "Nomo de la ŝlosilo"
+passwordLessLogin: "Ensaluti sen pasvorto"
+resetPassword: "Restarigi pasvorton"
+newPasswordIs: "La nova pasvorto estas {password}."
+cacheClear: "Forviŝi datumon en stalo"
+help: "Manlibro de uzado"
+inputMessageHere: "Entajpu masaĝo tie ĉi"
+groupName: "Grupa nomo"
+messagingWithUser: "Mesaĝado kun uzanto"
+messagingWithGroup: "Mesaĝi kun grupo"
+noteOf: "Noto de {user}"
+noMessagesYet: "Neniu mesaĝo"
+newMessageExists: "Vi ricevis novan mesaĝon."
+onlyOneFileCanBeAttached: "Vi povas aldoni nur unu dosieron po unu mesaĝo."
+uiLanguage: "Lingvo de la interfaco"
+tags: "Etikedoj"
+createAccount: "Krei konton"
+existingAccount: "Ekzista konto"
+noFollowRequests: "Vi ne havas eksekvopetojn."
+openImageInNewTab: "Fermi la bildo sur nova tablo"
+local: "Loka"
+remote: "Transa"
+accountSettings: "Agordoj de Konto"
+numberOfDays: "Nombro de tagoj"
+hideThisNote: "Kaŝi tiun noton"
+objectStorageBaseUrl: "Baza URL"
+deleteAll: "Forviŝi ĉiujn"
+showInPage: "Vidi en paĝo"
+deleteAllFiles: "Forviŝi ĉiujn dosierojn"
+deleteAllFilesConfirm: "Ĉu vi certas, ke vi volas forviŝi ĉiujn viajn dosierojn?"
+deletedNote: "Forviŝita noto"
+invisibleNote: "Malpublika noto"
+poll: "Balotujo"
+emailServer: "Retpoŝta servilo"
+email: "Retpoŝto"
+emailAddress: "Retpoŝta adreso"
+smtpUser: "Uzantnomo"
+smtpPass: "Pasvorto"
+userSaysSomething: "{name} parolis ion"
+display: "Vidi"
+database: "Datumbazo"
+channel: "Kanalo"
+fileIdOrUrl: "Dosiera identigilo aŭ URL"
+abuseReports: "Signali"
+reportAbuse: "Signali"
+reportAbuseOf: "Signali {name}'(o)n"
+send: "Sendi"
+i18nInfo: "Misskey estas tradukata en diversaj lingvoj far volontuloj. Oni povas kontribui por la tradukado sur {link}."
+followingCount: "Numero de sekvatoj"
+followersCount: "Numero de sekvantoj"
+yes: "Jes"
+no: "Ne"
+driveFilesCount: "Numero de dosieroj en la diskingo"
+noteFavoritesCount: "Numero de la preferataj notoj"
+makeExplorable: "Igi videbla konto sur la paĝo \"Esplorado\""
+showTitlebar: "Montri titolobredon"
+clearCache: "Forviŝi datumon en staplo"
+onlineUsersCount: "{n} uzanto(j) estas surlinea"
+nUsers: "{n} uzanto(j)"
+saveAs: "Konservi kiel…"
+createdAt: "Kreita je"
+updatedAt: "Laste ĝisdatigita"
+deleteConfirm: "Ĉu certas forviŝi?"
+closeAccount: "Forigi konton"
+emailNotification: "Sciigoj per retpoŝto"
+publish: "Publikigi"
+inChannelSearch: "Serĉi en kanalo"
+typingUsers: "{users} estas entajpanta(j)..."
+online: "Surkonektita"
+offline: "Forkonektita"
+instanceBlocking: "Blokado de ekzemplo"
+selectAccount: "Elekti konton"
+user: "Uzanto"
+accounts: "Kontoj"
+global: "Konfederacia"
+sent: "Sendi"
+hashtags: "Kradvorto"
+_gallery:
+  liked: "Ŝatitaj notoj"
+_email:
+  _follow:
+    title: "Vin eksekvis"
+  _receiveFollowRequest:
+    title: "Vi ricevis eksekvopeton."
+_aboutMisskey:
+  about: "Misskey estas malfermitkoda programo evoluigata de syuilo ekde la 2014."
+  contributors: "Precipaj kontribuantoj"
+  allContributors: "Ĉiuj kontribuintoj"
+  source: "Fontkodo"
+  translation: "Traduki Miskejon"
+  patrons: "Mecenatoj"
+_mfm:
+  mention: "Mencioj"
+  hashtag: "Kradvorto"
+  url: "URL"
+  blockCode: "Kodo (Ujo)"
+  blockMath: "Formulo (Ujo)"
+  quote: "Citi"
+  emoji: "Personecigitaj emoĵioj"
+  search: "Serĉi"
+_instanceTicker:
+  none: "Ne montri"
+  remote: "Montri al transaj uzantoj"
+  always: "Ĉiam montri"
+_channel:
+  create: "Krei kanalon"
+  edit: "Redakti kanalon"
+  following: "Sekvata"
+_menuDisplay:
+  hide: "Kaŝi"
+_wordMute:
+  muteWords: "Silentanta vorto"
+  mutedNotes: "Silentigataj notoj"
+_theme:
+  keys:
+    hashtag: "Kradvorto"
+    mention: "Mencioj"
+    renote: "Fari renoton"
+_sfx:
+  note: "Nova noto"
+  noteMy: "Mia noto"
+  notification: "Sciigoj"
+  chat: "Retbabilejo"
+  chatBg: "Retbabilejo (BG)"
+  antenna: "Ricevo de anteno"
+  channel: "Sciigoj de kanalo"
+_ago:
+  secondsAgo: "Antaŭ {n} sekundoj"
+  minutesAgo: "Antaŭ {n} minutoj"
+  hoursAgo: "Antaŭ {n} horoj"
+  daysAgo: "Antaŭ {n} tagoj"
+  weeksAgo: "Antaŭ {n} semajnoj"
+  monthsAgo: "Antaŭ {n} monatoj"
+  yearsAgo: "Antaŭ {n} jaroj"
+_time:
+  second: "sek"
+  minute: "min"
+  hour: "hor"
+  day: "Tago"
+_tutorial:
+  title: "Uzado de Misskey"
+  step1_1: "Bonvenon."
+  step7_2: "Se vi volus scii pli pri Miskejon, volu rigardi la fako {help}."
+_permissions:
+  "read:blocks": "Vidi la listo de la uzantoj kiun vi blokis."
+  "write:blocks": "Redakti la liston de la uzantoj kiun vi blokis."
+  "read:drive": "Ĉia operacio por legi la informon de dosiero en via diskingo de Miskejo"
+  "write:drive": "Ĉia operacio por skribi, forviŝi, aŭ alimaniere ŝanĝi la informon de dosiero en via diskingo de Miskejo"
+  "read:favorites": "Vidi la listo de la preferoj"
+  "read:following": "Vidi tion kion vi sekvas"
+  "write:following": "Sekvi kaj/aŭ malsekvi alian uzanton"
+  "read:messaging": "Vidi via retbabilado"
+  "write:notes": "Krei / Forviŝi noton"
+  "read:notifications": "Vidi sciigojn"
+  "read:reactions": "Vidi reagojn"
+  "read:pages": "Vidi via paĝojn"
+  "read:page-likes": "Vidi ŝatojn de paĝo"
+  "read:channels": "Vidi kanalojn"
+_antennaSources:
+  homeTimeline: "Notoj far uzantoj sekvataj de vi"
+_weekday:
+  sunday: "dimanĉo"
+  monday: "lundo"
+  tuesday: "mardo"
+  wednesday: "merkredo"
+  thursday: "ĵaŭdo"
+  friday: "vendredo"
+  saturday: "sabato"
+_widgets:
+  notifications: "Sciigoj"
+  timeline: "Templinio"
+  clock: "Horloĝo"
+  federation: "Fediverso"
+  onlineUsers: "Surkonektita uzanto"
+_cw:
+  show: "Vidu pli"
+  files: "{count} dosiero(j)"
+_poll:
+  choiceN: "Balotilo {n}"
+  noMore: "Oni ne plu povas aldoni."
+  infinite: "Neniam"
+  deadlineTime: "hor"
+  votesCount: "{n} balotiloj"
+  vote: "Baloti"
+  closed: "Oni jam balotis ĝin"
+_visibility:
+  publicDescription: "Via noto aperiĝos sur la konfederacia templinio"
+  home: "Hejmo"
+  homeDescription: "Elsendi nur sur la hejmtemplinio"
+  followers: "Sekvantoj"
+  followersDescription: "Elsendi nur al sekvantoj al mi"
+  localOnly: "Nur loka"
+  localOnlyDescription: "Ne montri al transaj uzantoj"
+_postForm:
+  replyPlaceholder: "Respondado al tiu noto..."
+  quotePlaceholder: "Citado tiun noton..."
+  channelPlaceholder: "Sendi sur la kanalo"
+_profile:
+  name: "Nomo"
+  username: "Uzantnomo"
+  changeAvatar: "Ŝanĝi profilbildon"
+_exportOrImport:
+  followingList: "Sekvataj"
+  muteList: "Silentigado"
+  blockingList: "Blokado"
+  userLists: "Listoj"
+_timelines:
+  home: "Hejmo"
+  local: "Loka"
+  social: "Sociala"
+  global: "Konfederacia"
+_rooms:
+  translate: "Movi"
+  chooseImage: "Elekti bildon"
+  _furnitures:
+    server: "Servilo"
+    moon: "La luno"
+_pages:
+  deleted: "La paĝo estas forigita."
+  viewPage: "Vidi via paĝojn"
+  my: "Miaj paĝoj"
+  content: "Blokado de paĝo"
+  url: "URL de paĝo"
+  chooseBlock: "Aldoni ujon"
+  blocks:
+    image: "Bildoj"
+    _post:
+      canvasId: "Kanvasa identigilo"
+    _canvas:
+      id: "Kanvasa identigilo"
+    _note:
+      id: "Identigilo de noto"
+    _button:
+      _action:
+        _pushEvent:
+          event: "Nomo de la evento"
+  script:
+    categories:
+      list: "Listoj"
+    blocks:
+      _join:
+        arg1: "Listoj"
+      _randomPick:
+        arg1: "Listoj"
+      _dailyRandomPick:
+        arg1: "Listoj"
+      _seedRandomPick:
+        arg2: "Listoj"
+      pick: "Elekti de la listo"
+      _pick:
+        arg1: "Listoj"
+      _listLen:
+        arg1: "Listoj"
+    types:
+      array: "Listoj"
+      stringArray: "List de teksto"
+_notification:
+  fileUploaded: "La dosiero sukcese alŝutiĝis."
+  youGotPoll: "{name} balotis"
+  youGotMessagingMessageFromUser: "{name} sentis mesaĝon al vi."
+  youWereFollowed: "Vin eksekvis"
+  youReceivedFollowRequest: "Vi ricevis eksekvopeton."
+  yourFollowRequestAccepted: "Via eksekvopeto estas akceptita."
+  _types:
+    follow: "Sekvatoj"
+    mention: "Mencioj"
+    renote: "Fari renoton"
+    quote: "Citi"
+    reaction: "Reagoj"
+    receiveFollowRequest: "Eksekvopeto ricevita"
+    followRequestAccepted: "Eksekvopeto akceptiĝis."
+_deck:
+  profile: "Agordaro"
+  _columns:
+    notifications: "Sciigoj"
+    tl: "Templinio"
+    list: "Listoj"
+    mentions: "Al vi"
--- a/locales/es-ES.yml
+++ b/locales/es-ES.yml
@ -127,6 +127,7 @@ editWidgets: "Editar widgets"
 editWidgetsExit: "Terminar edición"
 customEmojis: "Emojis personalizados"
 emoji: "Emoji"
+emojis: "Emoji"
 emojiName: "Nombre del emoji"
 emojiUrl: "URL de la imágen del emoji"
 addEmoji: "Agregar emoji"
@ -523,7 +524,6 @@ removeAllFollowing: "Retener todos los siguientes"
 removeAllFollowingDescription: "Cancelar todos los siguientes del servidor {host}. Ejecutar en caso de que esta instancia haya dejado de existir"
 userSuspended: "Este usuario ha sido suspendido."
 userSilenced: "Este usuario ha sido silenciado."
-sidebar: "Barra lateral"
 divider: "Divisor"
 addItem: "Agregar elemento"
 rooms: "Cuartos"
@ -665,6 +665,11 @@ user: "Usuarios"
 administration: "Administrar"
 expiration: "Termina el"
 middle: "Mediano"
+global: "Global"
+sent: "Enviar"
+hashtags: "Hashtag"
+_docs:
+  admin: "Administrar"
 _ad:
  back: "Deseleccionar"
 _gallery:
@ -744,9 +749,7 @@ _channel:
  following: "Siguiendo"
  usersCount: "{n} participantes"
  notesCount: "{n} notas"
-_sidebar:
-  full: "Completo"
-  icon: "Avatar"
+_menuDisplay:
  hide: "Ocultar"
 _wordMute:
  muteWords: "Palabras que silenciar"
--- a/locales/fr-FR.yml
+++ b/locales/fr-FR.yml
@ -128,6 +128,7 @@ editWidgets: "Modifier les widgets"
 editWidgetsExit: "Valider les modifications"
 customEmojis: "Émojis personnalisés"
 emoji: "Émoji"
+emojis: "Émoji"
 emojiName: "Nom de l’émoji"
 emojiUrl: "URL de l’émoji"
 addEmoji: "Ajouter un émoji"
@ -326,6 +327,7 @@ driveCapacityPerRemoteAccount: "Volume du Drive par utilisateur distant"
 inMb: "en mégaoctets"
 iconUrl: "URL de l'icône"
 bannerUrl: "URL de l’image de la bannière"
+backgroundImageUrl: "URL de l'image d'arrière-plan"
 basicInfo: "Informations basiques"
 pinnedUsers: "Utilisateur·rice épinglé·e"
 pinnedUsersDescription: "Listez les utilisateur·rice·s que vous souhaitez voir épinglé·e·s sur la page \"Découvrir\", un·e par ligne."
@ -527,7 +529,7 @@ removeAllFollowing: "Retenir tous les abonnements"
 removeAllFollowingDescription: "Se désabonner de tous les comptes de {host}. Veuillez lancer cette action uniquement si l’instance n’existe plus."
 userSuspended: "Cet·te utilisateur·rice a été suspendu·e."
 userSilenced: "Cette utilisateur·trice a été mis·e en sourdine."
-sidebar: "Barre latérale"
+menu: "Menu"
 divider: "Séparateur"
 addItem: "Ajouter un élément"
 rooms: "Chambre"
@ -760,6 +762,19 @@ middle: "Moyen"
 low: "Basse"
 emailNotConfiguredWarning: "Vous n'avez pas configuré d'adresse e-mail."
 ratio: "Ratio"
+customCss: "CSS personnalisé"
+customCssWarn: "Utilisez cette fonctionnalité uniquement si vous savez exactement ce que vous faites. Une configuration inadaptée peut empêcher le client de s'exécuter normalement."
+global: "Global"
+squareAvatars: "Avatars carrés"
+sent: "Envoyer"
+hashtags: "Hashtags"
+troubleshooting: "Résolution de problèmes"
+_docs:
+  continueReading: "Lire plus"
+  features: "Fonctionnalités"
+  generalTopics: "Sujets généraux"
+  advancedTopics: "Sujets avancés"
+  admin: "Gestion"
 _ad:
  back: "Retour"
  reduceFrequencyOfThisAd: "Voir cette publicité moins souvent"
@ -858,6 +873,8 @@ _mfm:
  blurDescription: "Le contenu peut être flouté ; il sera visible en le survolant avec le curseur."
  font: "Police de caractères"
  fontDescription: "Il est possible de choisir la police."
+  rainbow: "Arc-en-ciel"
+  rainbowDescription: "Permet d'afficher le contenu en couleurs arc-en-ciel."
 _reversi:
  reversi: "Reversi"
  gameSettings: "Réglages de la partie"
@ -909,9 +926,10 @@ _channel:
  following: "Abonné·e"
  usersCount: "{n} Participant·e·s"
  notesCount: "{n} Notes"
-_sidebar:
-  full: "Complet"
-  icon: "Icônes"
+_menuDisplay:
+  sideFull: "Latéral"
+  sideIcon: "Latéral (icônes)"
+  top: "Haut de page"
  hide: "Masquer"
 _wordMute:
  muteWords: "Mots à filtrer"
@ -1591,11 +1609,11 @@ _notification:
  youWereInvitedToGroup: "Invité·e au groupe"
  _types:
    all: "Toutes"
-    follow: "Abonnements"
+    follow: "Nouvel·le abonné·e"
    mention: "Mentions"
    reply: "Réponses"
-    renote: "Partager"
-    quote: "Citer"
+    renote: "Renotes"
+    quote: "Citations"
    reaction: "Réactions"
    pollVote: "Votes dans des sondages"
    receiveFollowRequest: "Demande d'abonnement reçue"
--- a/locales/id-ID.yml
+++ b/locales/id-ID.yml
@ -1,10 +1,10 @@
 ---
 _lang_: "Bahasa Indonesia"
-headlineMisskey: "Jaringan terhubung melalui note"
+headlineMisskey: "Jaringan terhubung melalui catatan"
 introMisskey: "Selamat datang! Misskey adalah perangkat mikroblog tercatu bersifat sumber terbuka.\nMulailah menuliskan catatan, bagikan peristiwa terkini, serta ceritakan segala tentangmu.📡\nTunjukkan juga reaksimu pada catatan pengguna lain.👍\nMari jelajahi dunia baru🚀"
 monthAndDay: "{day} {month}"
-search: "Pencarian"
-notifications: "Notifikasi"
+search: "Penelusuran"
+notifications: "Pemberitahuan"
 username: "Nama Pengguna"
 password: "Kata sandi"
 forgotPassword: "Lupa Kata Sandi"
@ -14,8 +14,8 @@ gotIt: "Saya mengerti"
 cancel: "Batalkan"
 enterUsername: "Masukkan nama pengguna"
 renotedBy: "direnote oleh {user}"
-noNotes: "Tidak ada notes"
-noNotifications: "Tidak ada notifikasi"
+noNotes: "Tidak ada catatan"
+noNotifications: "Tidak ada pemberitahuan"
 instance: "Instansi"
 settings: "Pengaturan"
 basicSettings: "Pengaturan umum"
@ -52,25 +52,25 @@ searchUser: "Cari pengguna"
 reply: "Balas"
 loadMore: "Selebihnya"
 showMore: "Selebihnya"
-youGotNewFollower: "Sedang mengikuti"
-receiveFollowRequest: "Permintaan mengikuti terkirim"
-followRequestAccepted: "Permintaan diikuti telah diterima"
-mention: "Sebutan"
+youGotNewFollower: "Mengikuti kamu"
+receiveFollowRequest: "Ingin mengikuti kamu"
+followRequestAccepted: "Permintaan mengikuti telah disetujui"
+mention: "Sebut"
 mentions: "Sebutan"
-directNotes: "Note langsung"
+directNotes: "Catatan langsung"
 importAndExport: "Impor & Ekspor"
 import: "Impor"
 export: "Ekspor"
 files: "Berkas"
 download: "Unduh"
-driveFileDeleteConfirm: "Hapus {name}? Note dengan berkas terkait juga akan terhapus."
+driveFileDeleteConfirm: "Hapus {name}? Catatan dengan berkas terkait juga akan terhapus."
 unfollowConfirm: "Berhenti mengikuti {name}?"
 exportRequested: "Kamu telah meminta ekspor. Ini akan memakan waktu sesaat. Setelah ekspor selesai, berkas yang dihasilkan akan ditambahkan ke Drive"
 importRequested: "Kamu telah meminta impor. Ini akan memakan waktu sesaat."
 lists: "Daftar"
 noLists: "Kamu tidak memiliki daftar apapun"
-note: "Catatan"
-notes: "Note"
+note: "Catat"
+notes: "Catatan"
 following: "Ikuti"
 followers: "Pengikut"
 followsYou: "Mengikuti kamu"
@ -83,13 +83,13 @@ pageLoadError: "Gagal memuat halaman."
 pageLoadErrorDescription: "Umumnya disebabkan jaringan atau tembolok perambah. Cobalah bersihkan tembolok peramban lalu tunggu sesaat sebelum mencoba kembali."
 enterListName: "Masukkan nama daftar"
 privacy: "Privasi"
-makeFollowManuallyApprove: "Permintaan ikuti membutuhkan persetujuan"
-defaultNoteVisibility: "Privasi bawaan Note"
+makeFollowManuallyApprove: "Permintaan mengikuti membutuhkan persetujuan"
+defaultNoteVisibility: "Privasi bawaan catatan"
 follow: "Ikuti"
-followRequest: "Minta ikuti"
-followRequests: "Permintaan ikuti"
+followRequest: "Permintaan mengikuti"
+followRequests: "Permintaan mengikuti"
 unfollow: "Berhenti mengikuti"
-followRequestPending: "Permintaan ikuti yang menunggu"
+followRequestPending: "Permintaan mengikuti yang menunggu"
 enterEmoji: "Masukkan emoji"
 renote: "Renote"
 unrenote: "Hapus renote"
@ -97,16 +97,16 @@ renoted: "Telah direnote"
 cantRenote: "Postingan ini tidak dapat direnote"
 cantReRenote: "Renote tidak dapat direnote"
 quote: "Kutip"
-pinnedNote: "Note yang disematkan"
+pinnedNote: "Catatan yang disematkan"
 pinned: "Sematkan ke profil"
-you: "Anda"
+you: "Kamu"
 clickToShow: "Klik untuk melihat"
 sensitive: "Konten sensitif"
 add: "Tambahkan"
 reaction: "Reaksi"
-reactionSettingDescription: "Masukkan reaksi favorit yang ingin anda sematkan pada bilah reaksi"
+reactionSettingDescription: "Masukkan reaksi favorit yang ingin kamu sematkan pada bilah reaksi"
 reactionSettingDescription2: "Geser untuk memindah urutkan, klik untuk menghapus, tekan \"+\" untuk menambahkan"
-rememberNoteVisibility: "Ingat pengaturan visibilitas note"
+rememberNoteVisibility: "Ingat pengaturan visibilitas catatan"
 attachCancel: "Hapus lampiran"
 markAsSensitive: "Tandai sebagai konten sensitif"
 unmarkAsSensitive: "Hapus tanda konten sensitif"
@ -117,10 +117,10 @@ block: "Blokir"
 unblock: "Buka blokir"
 suspend: "Bekukan"
 unsuspend: "Buka pembekuan"
-blockConfirm: "Apakah anda yakin ingin memblokir akun ini?"
-unblockConfirm: "Apakah anda yakin ingin membuka blokir akun ini?"
-suspendConfirm: "Apakah anda yakin ingin membekukan akun ini?"
-unsuspendConfirm: "Apakah anda yakin ingin membuka pembekuan akun ini?"
+blockConfirm: "Apakah kamu yakin ingin memblokir akun ini?"
+unblockConfirm: "Apakah kamu yakin ingin membuka blokir akun ini?"
+suspendConfirm: "Apakah kamu yakin ingin membekukan akun ini?"
+unsuspendConfirm: "Apakah kamu yakin ingin membuka pembekuan akun ini?"
 selectList: "Pilih daftar"
 selectAntenna: "Pilih Antena"
 selectWidget: "Pilih gawit"
@ -128,6 +128,7 @@ editWidgets: "Sunting gawit"
 editWidgetsExit: "Selesai"
 customEmojis: "Emoji kustom"
 emoji: "Emoji"
+emojis: "Emoji"
 emojiName: "Nama emoji"
 emojiUrl: "URL Emoji"
 addEmoji: "Tambahkan emoji"
@ -138,7 +139,7 @@ flagAsBot: "Atur akun ini sebagai Bot"
 flagAsBotDescription: "Jika akun ini dikendalikan oleh program, tetapkanlah opsi ini. Jika diaktifkan, ini akan berfungsi sebagai tanda bagi pengembang lain untuk mencegah interaksi berantai dengan bot lain dan menyesuaikan sistem internal Misskey untuk memperlakukan akun ini sebagai bot."
 flagAsCat: "Atur akun ini sebagai kucing"
 flagAsCatDescription: "Nyalakan tanda ini untuk menandai akun ini sebagai kucing."
-autoAcceptFollowed: "Setujui otomatis permintaan mengikuti dari pengguna yang anda ikuti"
+autoAcceptFollowed: "Setujui otomatis permintaan mengikuti dari pengguna yang kamu ikuti"
 addAccount: "Tambahkan akun"
 loginFailed: "Gagal untuk masuk"
 showOnRemote: "Lihat profil asli"
@ -154,7 +155,7 @@ proxyAccountDescription: "Akun proksi merupakan sebuah akun yang bertindak sebag
 host: "Host"
 selectUser: "Pilih pengguna"
 recipient: "Penerima"
-annotation: "Komentar"
+annotation: "Keterangan konten"
 federation: "Federasi"
 instances: "Instansi"
 registeredAt: "Terdaftar"
@ -226,8 +227,8 @@ announcements: "Pengumuman"
 imageUrl: "URL Gambar"
 remove: "Hapus"
 removed: "Telah dihapus"
-removeAreYouSure: "Apakah anda yakin ingin menghapus \"{x}\"?"
-deleteAreYouSure: "Apakah anda yakin ingin menghapus \"{x}\"?"
+removeAreYouSure: "Apakah kamu yakin ingin menghapus \"{x}\"?"
+deleteAreYouSure: "Apakah kamu yakin ingin menghapus \"{x}\"?"
 resetAreYouSure: "Yakin mau atur ulang?"
 saved: "Telah disimpan"
 messaging: "Pesan"
@ -235,7 +236,7 @@ upload: "Unggah"
 fromDrive: "Dari Drive"
 fromUrl: "Dari URL"
 uploadFromUrl: "Unggah dari URL"
-uploadFromUrlDescription: "URL berkas yang ingin anda unggah"
+uploadFromUrlDescription: "URL berkas yang ingin kamu unggah"
 uploadFromUrlRequested: "Pengunggahan telah diminta"
 uploadFromUrlMayTakeTime: "Membutuhkan beberapa waktu hingga pengunggahan selesai"
 explore: "Jelajahi"
@ -251,7 +252,7 @@ home: "Beranda"
 remoteUserCaution: "Informasi ini mungkin tidak mutakhir, karena pengguna ini berasal dari instansi luar."
 activity: "Aktivitas"
 images: "Gambar"
-birthday: "Hari Lahir"
+birthday: "Tanggal lahir"
 yearsOld: "{age} tahun"
 registeredDate: "Bergabung pada"
 location: "Lokasi"
@ -279,6 +280,7 @@ emptyDrive: "Drive kosong"
 emptyFolder: "Folder kosong"
 unableToDelete: "Tidak dapat menghapus"
 inputNewFileName: "Masukkan nama berkas yang baru"
+inputNewDescription: "Masukkan keterangan disini"
 inputNewFolderName: "Masukkan nama folder yang baru"
 circularReferenceFolder: "Folder tujuan adalah subfolder dari folder yang ingin kamu pindahkan."
 hasChildFilesOrFolders: "Karena folder ini tidak kosong, maka tidak dapat dihapus."
@ -310,6 +312,8 @@ monthX: "{month}"
 yearX: "{year}"
 pages: "Halaman"
 integration: "Integrasi"
+connectService: "Sambungkan"
+disconnectService: "Putuskan"
 enableLocalTimeline: "Nyalakan linimasa lokal"
 enableGlobalTimeline: "Nyalakan linimasa global"
 disablingTimelinesInfo: "Admin dan Moderator akan selalu memiliki akses ke semua linimasa meskipun linimasa tersebut tidak diaktifkan."
@ -323,13 +327,14 @@ driveCapacityPerRemoteAccount: "Kapasitas drive per pengguna remote"
 inMb: "dalam Megabytes"
 iconUrl: "URL Gambar ikon"
 bannerUrl: "URL Banner"
+backgroundImageUrl: "URL Gambar latar"
 basicInfo: "Informasi Umum"
 pinnedUsers: "Pengguna yang disematkan"
 pinnedUsersDescription: "Tuliskan satu nama pengguna dalam satu baris. Pengguna yang dituliskan disini akan disematkan dalam bilah \"Jelajahi\"."
 pinnedPages: "Halaman yang disematkan"
 pinnedPagesDescription: "Masukkan tautan dari halaman yang kamu ingin sematkan ke halaman utama dari instansi ini, dipisah dengan membuat baris baru."
 pinnedClipId: "ID dari klip yang disematkan"
-pinnedNotes: "Note yang disematkan"
+pinnedNotes: "Catatan yang disematkan"
 hcaptcha: "hCaptcha"
 enableHcaptcha: "Nyalakan hCaptcha"
 hcaptchaSiteKey: "Site Key"
@ -346,14 +351,14 @@ antennaSource: "Sumber Antenna"
 antennaKeywords: "Kata kunci yang diterima"
 antennaExcludeKeywords: "Kata kunci yang dikecualikan"
 antennaKeywordsDescription: "Pisahkan dengan spasi untuk kondisi AND. Pisahkan dengan baris baru untuk kondisi OR."
-notifyAntenna: "Beritahu untuk note baru"
-withFileAntenna: "Hanya tampilkan note dengan berkas yang dilampirkan"
+notifyAntenna: "Beritahu untuk catatan baru"
+withFileAntenna: "Hanya tampilkan catatan dengan berkas yang dilampirkan"
 enableServiceworker: "Aktifkan ServiceWorker"
 antennaUsersDescription: "Tuliskan satu nama pengguna per baris"
 caseSensitive: "Peka huruf besar dan huruf kecil"
 withReplies: "Termasuk balasan"
 connectedTo: "Akun yang mengikuti telah terhubung"
-notesAndReplies: "Note dan balasan"
+notesAndReplies: "Catatan dan balasan"
 withFiles: "Media"
 silence: "Bungkam"
 silenceConfirm: "Apakah kamu yakin ingin membungkam pengguna ini?"
@ -389,7 +394,7 @@ notFoundDescription: "Tidak ada halaman sesuai dengan URL yang ditentukan."
 uploadFolder: "Lokasi unggah folder bawaan"
 cacheClear: "Bersihkan tembolok"
 markAsReadAllNotifications: "Tandai semua pemberitahuan telah dibaca"
-markAsReadAllUnreadNotes: "Tandai semua note telah dibaca"
+markAsReadAllUnreadNotes: "Tandai semua catatan telah dibaca"
 markAsReadAllTalkMessages: "Tandai semua pesan telah dibaca"
 help: "Bantuan"
 inputMessageHere: "Ketik pesan disini"
@ -410,9 +415,9 @@ text: "Teks"
 enable: "Aktifkan"
 next: "Selanjutnya"
 retype: "Masukkan ulang"
-noteOf: "Note milik {user}"
+noteOf: "Catatan milik {user}"
 inviteToGroup: "Undang ke grup"
-maxNoteTextLength: "Batas karakter dari note"
+maxNoteTextLength: "Batas karakter catatan"
 quoteAttached: "Dikutip"
 quoteQuestion: "Apakah kamu ingin menambahkan kutipan?"
 noMessagesYet: "Tidak ada pesan"
@ -524,7 +529,7 @@ removeAllFollowing: "Tahan semua mengikuti"
 removeAllFollowingDescription: "Batal mengikuti semua akun dari {host}. Mohon jalankan ini ketika instansi sudah tidak ada lagi."
 userSuspended: "Pengguna ini telah dibekukan."
 userSilenced: "Pengguna ini telah dibungkam."
-sidebar: "Bilah samping"
+menu: "Menu"
 divider: "Pembagi"
 addItem: "Tambahkan item"
 rooms: "Ruang"
@ -533,8 +538,8 @@ addRelay: "Tambahkan relay"
 inboxUrl: "URL Kotak masuk"
 addedRelays: "Relay yang ditambahkan"
 serviceworkerInfo: "Harus diaktifkan untuk pemberitahuan push."
-deletedNote: "Note yang dihapus"
-invisibleNote: "Postingan yang disembunyikan"
+deletedNote: "Catatan yang dihapus"
+invisibleNote: "Catatan yang disembunyikan"
 enableInfiniteScroll: "Aktifkan gulir tak terbatas"
 visibility: "Visibilitas"
 poll: "Angket"
@ -544,6 +549,8 @@ disablePlayer: "Tutup pemutar video"
 expandTweet: "Perluas utas"
 themeEditor: "Penyunting tema"
 description: "Deskripsi"
+describeFile: "Tambahkan keterangan"
+enterFileDescription: "Masukkan keterangan"
 author: "Pembuat"
 leaveConfirm: "Ada perubahan yang belum disimpan. Apakah kamu ingin membuangnya?"
 manage: "Manajemen"
@ -595,7 +602,7 @@ create: "Buat"
 notificationSetting: "Pengaturan Pemberitahuan"
 notificationSettingDesc: "Pilih tipe pemberitahuan untuk ditampilkan"
 useGlobalSetting: "Gunakan setelan global"
-useGlobalSettingDesc: "Jika dinyalakan, setelan pemberitahuan akun anda akan digunakan. Jika dimatikan, konfigurasi secara individu dapat dibuat."
+useGlobalSettingDesc: "Jika dinyalakan, setelan pemberitahuan akun kamu akan digunakan. Jika dimatikan, konfigurasi secara individu dapat dibuat."
 other: "Lainnya"
 regenerateLoginToken: "Perbarui token login"
 regenerateLoginTokenDescription: "Perbarui token yang digunakan secara internal saat login. Normalnya aksi ini tidak diperlukan. Jika diperbarui, semua perangkat akan dilogout."
@ -629,7 +636,7 @@ public: "Publik"
 i18nInfo: "Misskey diterjemahkan ke dalam banyak bahasa oleh sukarelawan. Kamu dapat ikut membantu di {link}."
 manageAccessTokens: "Kelola access token"
 accountInfo: "Informasi akun"
-notesCount: "Jumlah note"
+notesCount: "Jumlah catatan"
 repliesCount: "Jumlah balasan terkirim"
 renotesCount: "Jumlah renote terkirim"
 repliedCount: "Jumlah balasan diterima"
@ -645,15 +652,15 @@ no: "Tidak"
 driveFilesCount: "Jumlah berkas drive"
 driveUsage: "Penggunaan ruang penyimpanan drive"
 noCrawle: "Tolak pengindeksan crawler"
-noCrawleDescription: "Meminta mesin pencari untuk tidak mengindeks halaman profil kamu, note, Halaman, dll."
-lockedAccountInfo: "Kecuali kamu menyetel visibilitas note milikmu ke \"Hanya pengikut\", note milikmu akan dapat dilihat oleh siapa saja, bahkan jika kamu memerlukan pengikut untuk disetujui secara manual."
-alwaysMarkSensitive: "Tandai NSFW sebagai bawaan"
+noCrawleDescription: "Meminta mesin pencari untuk tidak mengindeks halaman profil kamu, catatan, Halaman, dll."
+lockedAccountInfo: "Kecuali kamu menyetel visibilitas catatan milikmu ke \"Hanya pengikut\", catatan milikmu akan dapat dilihat oleh siapa saja, bahkan jika kamu memerlukan pengikut untuk disetujui secara manual."
+alwaysMarkSensitive: "Tandai media dalam catatan sebagai media sensitif"
 loadRawImages: "Tampilkan lampiran gambar secara penuh daripada thumbnail"
 disableShowingAnimatedImages: "Jangan mainkan gambar bergerak"
 verificationEmailSent: "Surel verifikasi telah dikirimkan. Mohon akses tautan yang telah disertakan untuk menyelesaikan verifikasi."
 notSet: "Tidak disetel"
 emailVerified: "Surel telah diverifikasi"
-noteFavoritesCount: "Jumlah note yang difavoritkan"
+noteFavoritesCount: "Jumlah catatan yang difavoritkan"
 pageLikesCount: "Jumlah suka yang diterima Halaman"
 pageLikedCount: "Jumlah Halaman yang disukai"
 reversiCount: "Jumlah pertandingan Reversi"
@ -664,7 +671,7 @@ experimentalFeatures: "Fitur eksperimental"
 developer: "Pengembang"
 makeExplorable: "Buat akun tampil di \"Jelajahi\""
 makeExplorableDescription: "Jika kamu mematikan ini, akun kamu tidak akan muncul di bagian \"Jelajahi:"
-showGapBetweenNotesInTimeline: "Tampilkan jarak diantara postingan pada linimasa"
+showGapBetweenNotesInTimeline: "Tampilkan jarak diantara catatan pada linimasa"
 duplicate: "Duplikat"
 left: "Kiri"
 center: "Tengah"
@ -716,8 +723,8 @@ unlikeConfirm: "Yakin ingin hapus sukamu?"
 fullView: "Tampilan penuh"
 quitFullView: "Keluar tampilan penuh"
 addDescription: "Tambahkan deskripsi"
-userPagePinTip: "Kamu dapat membuat note untuk ditampilkan disini dengan memilih \"Sematkan ke profil\" dari menu pada note individu."
-notSpecifiedMentionWarning: "Note ini mengandung sebutan dari pengguna yang tidak dimuat sebagai penerima"
+userPagePinTip: "Kamu dapat membuat catatan untuk ditampilkan disini dengan memilih \"Sematkan ke profil\" dari menu pada catatan individu."
+notSpecifiedMentionWarning: "Catatan ini mengandung sebutan dari pengguna yang tidak dimuat sebagai penerima"
 info: "Informasi"
 userInfo: "Informasi pengguna"
 unknown: "Tidak diketahui"
@ -745,7 +752,7 @@ postToGallery: "Posting ke galeri"
 gallery: "Galeri"
 recentPosts: "Postingan terbaru"
 popularPosts: "Postingan populer"
-shareWithNote: "Bagikan dengan note"
+shareWithNote: "Bagikan dengan catatan"
 ads: "Iklan"
 expiration: "Batas akhir"
 memo: "Memo"
@ -755,6 +762,14 @@ middle: "Sedang"
 low: "Rendah"
 emailNotConfiguredWarning: "Alamat surel tidak disetel."
 ratio: "Rasio"
+customCss: "Custom CSS"
+customCssWarn: "Pengaturan ini seharusnya digunakan jika kamu tahu cara kerjanya. Memasukkan nilai yang tidak tepat dapat menyebabkan klien tidak berfungsi semestinya."
+global: "Global"
+squareAvatars: "Tampilkan avatar sebagai persegi"
+sent: "Kirim"
+hashtags: "Tagar"
+_docs:
+  admin: "Manajemen"
 _ad:
  back: "Kembali"
  reduceFrequencyOfThisAd: "Tampilkan iklan ini lebih sedikit"
@ -769,7 +784,7 @@ _gallery:
  unlike: "Hapus suka"
 _email:
  _follow:
-    title: "Sedang mengikuti"
+    title: "Mengikuti kamu"
  _receiveFollowRequest:
    title: "Kamu menerima permintaan mengikuti"
 _plugin:
@ -799,7 +814,7 @@ _mfm:
  cheatSheet: "Contekan MFM"
  intro: "MFM adalah Misskey-exclusive Markup Language yang dapat digunakan di banyak tempat. Berikut kamu bisa melihat daftar dari syntax MFM yang ada."
  dummy: "Misskey membentangkan dunia Fediverse"
-  mention: "Sebutan"
+  mention: "Sebut"
  mentionDescription: "Kamu dapat menentukan pengguna tertentu dengan menggunakan simbol-At dan nama engguna mereka."
  hashtag: "Tagar"
  hashtagDescription: "Kamu dapat menentukan tagar dengan menggunakan angka dan teks."
@ -825,7 +840,7 @@ _mfm:
  quoteDescription: "Menampilkan konten sebagai kutipan."
  emoji: "Emoji kustom"
  emojiDescription: "Emoji kustom dapat ditampilkan dengan mengurung nama emoji kustom menggunakan tanda titik dua."
-  search: "Pencarian"
+  search: "Penelusuran"
  searchDescription: "Menampilkan kotak pencarian dengan teks yang sudah dimasukkan."
  flip: "Balik"
  flipDescription: "Balikkan konten secara horizontal atau vertikal."
@ -903,20 +918,21 @@ _channel:
  owned: "Dimiliki"
  following: "Mengikuti"
  usersCount: "{n} Partisipan"
-  notesCount: "{n} Note"
-_sidebar:
-  full: "Penuh"
-  icon: "Avatar"
+  notesCount: "terdapat {n} catatan"
+_menuDisplay:
+  sideFull: "Horisontal"
+  sideIcon: "Horisontal (Ikon)"
+  top: "Atas"
  hide: "Sembunyikan"
 _wordMute:
  muteWords: "Kata yang dibisukan"
  muteWordsDescription: "Pisahkan dengan spasi untuk kondisi AND. Pisahkan dengan baris baru untuk kondisi OR."
  muteWordsDescription2: "Kurung kata kunci dengan garis miring untuk menggunakan regular expressions."
-  softDescription: "Sembunyikan note yang memenuhi aturan kondisi dari linimasa."
-  hardDescription: "Cegah note memenuhi aturan kondisi dari ditambahkan ke linimasa. Dengan tambahan, note berikut tidak akan ditambahkan ke linimasa meskipun jika kondisi tersebut diubah."
+  softDescription: "Sembunyikan catatan yang memenuhi aturan kondisi dari linimasa."
+  hardDescription: "Cegah catatan memenuhi aturan kondisi dari ditambahkan ke linimasa. Dengan tambahan, catatan berikut tidak akan ditambahkan ke linimasa meskipun jika kondisi tersebut diubah."
  soft: "Lembut"
  hard: "Keras"
-  mutedNotes: "Note yang dibisukan"
+  mutedNotes: "Catatan yang dibisukan"
 _theme:
  explore: "Jelajahi tema"
  install: "Pasang tema"
@ -963,7 +979,7 @@ _theme:
    navIndicator: "Indikator bilah samping"
    link: "Tautan"
    hashtag: "Tagar"
-    mention: "Sebutan"
+    mention: "Sebut"
    mentionMe: "Sebutan (saya)"
    renote: "Renote"
    modalBg: "Latar belakang modal"
@ -992,9 +1008,9 @@ _theme:
    accentLighten: "Aksen (Terang)"
    fgHighlighted: "Teks yang disorot"
 _sfx:
-  note: "Note"
-  noteMy: "Note (Saya)"
-  notification: "Notifikasi"
+  note: "Catatan"
+  noteMy: "Catatan (Saya)"
+  notification: "Pemberitahuan"
  chat: "Pesan"
  chatBg: "Obrolan (Latar Belakang)"
  antenna: "Penerimaan Antenna"
@ -1005,13 +1021,13 @@ _ago:
  unknown: "Tidak diketahui"
  future: "Masa depan"
  justNow: "Baru saja"
-  secondsAgo: "{n} detik yang lalu"
-  minutesAgo: "{n} menit yang lalu"
-  hoursAgo: "{n} jam yang lalu"
-  daysAgo: "{n} hari yang lalu"
-  weeksAgo: "{n} minggu yang lalu"
-  monthsAgo: "{n} bulan yang lalu"
-  yearsAgo: "{n} tahun yang lalu"
+  secondsAgo: "{n} detik lalu"
+  minutesAgo: "{n} menit lalu"
+  hoursAgo: "{n} jam lalu"
+  daysAgo: "{n} hari lalu"
+  weeksAgo: "{n} minggu lalu"
+  monthsAgo: "{n} bulan lalu"
+  yearsAgo: "{n} tahun lalu"
 _time:
  second: "detik"
  minute: "menit"
@ -1020,23 +1036,23 @@ _time:
 _tutorial:
  title: "Cara menggunakan Misskey"
  step1_1: "Selamat datang!"
-  step1_2: "Halaman ini disebut \"linimasa\". Halaman ini menampilkan \"note\" yang diurutkan secara kronologis dari orang-orang yang kamu \"ikuti\"."
-  step1_3: "Linimasa kamu kosong, karena kamu belum memposting note apapun atau mengikuti siapapun."
-  step2_1: "Selesaikan menyetel profilmu sebelum menulis sebuah note atau mengikuti seseorang."
+  step1_2: "Halaman ini disebut \"linimasa\". Halaman ini menampilkan \"catatan\" yang diurutkan secara kronologis dari orang-orang yang kamu \"ikuti\"."
+  step1_3: "Linimasa kamu kosong, karena kamu belum mencatat catatan apapun atau mengikuti siapapun."
+  step2_1: "Selesaikan menyetel profilmu sebelum menulis sebuah catatan atau mengikuti seseorang."
  step2_2: "Menyediakan beberapa informasi tentang siapa kamu akan membuat orang lain mudah untuk mengikutimu kembali."
  step3_1: "Selesai menyetel profil kamu?"
-  step3_2: "Langkah selanjutnya adalah membuat note. Kamu bisa lakukan ini dengan mengklik ikon pensil pada layar kamu."
-  step3_3: "Isilah di dalam modal dan tekan tombol pada atas kanan untuk memposting note kamu."
+  step3_2: "Langkah selanjutnya adalah membuat catatan. Kamu bisa lakukan ini dengan mengklik ikon pensil pada layar kamu."
+  step3_3: "Isilah di dalam modal dan tekan tombol pada atas kanan untuk memcatat catatan kamu."
  step3_4: "Bingung tidak berpikiran untuk mengatakan sesuatu? Coba saja \"baru aja ikutan bikin akun misskey punyaku\"!"
-  step4_1: "Selesai memposting note pertamamu?"
-  step4_2: "Horee! Sekarang note pertamamu sudah ditampilkan di linimasa milikmu."
+  step4_1: "Selesai mencatat catatan pertamamu?"
+  step4_2: "Horee! Sekarang catatan pertamamu sudah ditampilkan di linimasa milikmu."
  step5_1: "Sekarang, mari mencoba untuk membuat linimasamu lebih hidup dengan mengikuti orang lain."
-  step5_2: "{featured} akan memperlihatkan note yang sedang tren saat ini untuk kamu. {explore} akan membantumu untuk mencari pengguna yang sedang tren juga saat ini. Coba ikuti seseorang yang kamu suka!"
+  step5_2: "{featured} akan memperlihatkan catatan yang sedang tren saat ini untuk kamu. {explore} akan membantumu untuk mencari pengguna yang sedang tren juga saat ini. Coba ikuti seseorang yang kamu suka!"
  step5_3: "Untuk mengikuti pengguna lain, klik pada ikon mereka dan tekan tombol follow pada profil mereka."
  step5_4: "Jika pengguna lain memiliki ikon gembok di sebelah nama mereka, maka pengguna rersebut harus menyetujui permintaan mengikuti dari kamu secara manual."
-  step6_1: "Sekarang kamu dapat melihat note pengguna lain pada linimasamu."
-  step6_2: "Kamu juga bisa memberikan \"reaksi\" ke note orang lain untuk merespon dengan cepat."
-  step6_3: "Untuk memberikan \"reaksi\", tekan tanda \"+\" pada note pengguna lain dan pilih emoji yang kamu suka untuk memberikan reaksimu kepada mereka."
+  step6_1: "Sekarang kamu dapat melihat catatan pengguna lain pada linimasamu."
+  step6_2: "Kamu juga bisa memberikan \"reaksi\" ke catatan orang lain untuk merespon dengan cepat."
+  step6_3: "Untuk memberikan \"reaksi\", tekan tanda \"+\" pada catatan pengguna lain dan pilih emoji yang kamu suka untuk memberikan reaksimu kepada mereka."
  step7_1: "Yay, Selamat! Kamu sudah menyelesaikan tutorial dasar Misskey."
  step7_2: "Jika kamu ingin mempelajari lebih lanjut tentang Misskey, cobalah berkunjung ke bagian {help}."
  step7_3: "Semoga berhasil dan bersenang-senanglah! 🚀"
@ -1064,7 +1080,7 @@ _permissions:
  "write:messaging": "Buat atau hapus obrolan"
  "read:mutes": "Lihat daftar orang yang dibisukan"
  "write:mutes": "Sunting daftar orang yang dibisukan"
-  "write:notes": "Buat atau hapus note"
+  "write:notes": "Buat atau hapus catatan"
  "read:notifications": "Lihat pemberitahuan"
  "write:notifications": "Sunting pemberitahuan"
  "read:reactions": "Lihat reaksi"
@ -1086,11 +1102,11 @@ _auth:
  callback: "Mengembalikan kamu ke aplikasi"
  denied: "Akses ditolak"
 _antennaSources:
-  all: "Semua note"
-  homeTimeline: "Note dari pengguna yang diikuti"
-  users: "Note dari pengguna tertentu"
-  userList: "Note dari daftar tertentu"
-  userGroup: "Note dari pengguna dalam grup yang ditentukan"
+  all: "Semua catatan"
+  homeTimeline: "Catatan dari pengguna yang diikuti"
+  users: "Catatan dari pengguna tertentu"
+  userList: "Catatan dari daftar tertentu"
+  userGroup: "Catatan dari pengguna dalam grup yang ditentukan"
 _weekday:
  sunday: "Minggu"
  monday: "Senin"
@ -1101,7 +1117,7 @@ _weekday:
  saturday: "Sabtu"
 _widgets:
  memo: "Catatan memo"
-  notifications: "Notifikasi"
+  notifications: "Pemberitahuan"
  timeline: "Linimasa"
  calendar: "Kalender"
  trends: "Tren"
@ -1111,7 +1127,7 @@ _widgets:
  photos: "Foto"
  digitalClock: "Jam digital"
  federation: "Federasi"
-  postForm: "Buat note"
+  postForm: "Buat catatan"
  slideshow: "Slideshow"
  button: "Tombol"
  onlineUsers: "Pengguna online"
@ -1147,18 +1163,18 @@ _poll:
  remainingSeconds: "Berakhir dalam {s} detik"
 _visibility:
  public: "Publik"
-  publicDescription: "Note kamu akan muncul di linimasa global"
+  publicDescription: "Catat ke linimasa global"
  home: "Beranda"
-  homeDescription: "Posting hanya ke linimasa beranda saja"
+  homeDescription: "Catat ke linimasa beranda saja"
  followers: "Pengikut"
-  followersDescription: "Posting hanya ke pengikut saja"
-  specified: "Direct"
-  specifiedDescription: "Posting hanya ke pengguna yang ditentukan saja"
+  followersDescription: "Catat ke pengikut saja"
+  specified: "Langsung"
+  specifiedDescription: "Catat ke pengguna yang ditentukan saja"
  localOnly: "Hanya lokal"
-  localOnlyDescription: "Tidak dapat dilihat oleh pengguna luar"
+  localOnlyDescription: "Hanya dapat dilihat di instansi lokal"
 _postForm:
-  replyPlaceholder: "Balas ke note ini..."
-  quotePlaceholder: "Kutip note ini..."
+  replyPlaceholder: "Balas ke catatan ini..."
+  quotePlaceholder: "Kutip catatan ini..."
  channelPlaceholder: "Posting ke kanal"
  _placeholders:
    a: "Sedang apa kamu saat ini?"
@ -1180,7 +1196,7 @@ _profile:
  changeAvatar: "Ubah avatar"
  changeBanner: "Ubah header"
 _exportOrImport:
-  allNotes: "Semua note"
+  allNotes: "Semua catatan"
  followingList: "Ikuti"
  muteList: "Bisukan"
  blockingList: "Blokir"
@ -1191,10 +1207,10 @@ _charts:
  usersIncDec: "Perbedaan dalam # pengguna"
  usersTotal: "Jumlah # pengguna"
  activeUsers: "Pengguna aktif"
-  notesIncDec: "Perbedaan # dalam note"
-  localNotesIncDec: "Perbedaan # dalam note lokal"
-  remoteNotesIncDec: "Perbedaan # dalam note luar"
-  notesTotal: "Total # note"
+  notesIncDec: "Perbedaan # dalam catatan"
+  localNotesIncDec: "Perbedaan # dalam catatan lokal"
+  remoteNotesIncDec: "Perbedaan # dalam catatan luar"
+  notesTotal: "Total # catatan"
  filesIncDec: "Perbedaan # dalam berkas"
  filesTotal: "Jumlah # berkas"
  storageUsageIncDec: "Perbedaan dalam penggunaan penyimpanan"
@ -1203,8 +1219,8 @@ _instanceCharts:
  requests: "Permintaan"
  users: "Perbedaan dalam # pengguna"
  usersTotal: "Jumlah # pengguna kumulatif"
-  notes: "Perbedaan # dalam note"
-  notesTotal: "Jumlah # note kumulatif"
+  notes: "Perbedaan # dalam catatan"
+  notesTotal: "Jumlah # catatan kumulatif"
  ff: "Perbedaan jumlah # dalam pengikut"
  ffTotal: "Jumlah # pengikut kumulatif"
  cacheSize: "Perbedaan dalam ukuran tembolok"
@ -1327,7 +1343,7 @@ _pages:
    if: "Jika"
    _if:
      variable: "Variabel"
-    post: "Buat note"
+    post: "Buat catatan"
    _post:
      text: "Isi"
      attachCanvasImage: "Posting dengan kanvas sebagai gambar"
@ -1352,10 +1368,10 @@ _pages:
      id: "ID Kanvas"
      width: "Lebar"
      height: "Tinggi"
-    note: "Note yang ditanam"
+    note: "Catatan yang ditanam"
    _note:
-      id: "ID Note"
-      idDescription: "Kamu dapat menyetel ini dengan menempelkan tautan URL Note."
+      id: "ID Catatan"
+      idDescription: "Kamu dapat menyetel ini dengan menempelkan tautan URL Catatan."
      detailed: "Tampilan rincian"
    switch: "Beralih"
    _switch:
@ -1580,14 +1596,14 @@ _notification:
  youGotPoll: "{name} memilih di angket kamu"
  youGotMessagingMessageFromUser: "{name} mengirimi kamu pesan"
  youGotMessagingMessageFromGroup: "Sebuah pesan telah dikirim ke grup {name}"
-  youWereFollowed: "Sedang mengikuti"
+  youWereFollowed: "Mengikuti kamu"
  youReceivedFollowRequest: "Kamu menerima permintaan mengikuti"
  yourFollowRequestAccepted: "Permintaan mengikuti kamu telah diterima"
  youWereInvitedToGroup: "Telah diundang ke grup"
  _types:
    all: "Semua"
    follow: "Ikuti"
-    mention: "Sebutan"
+    mention: "Sebut"
    reply: "Balasan"
    renote: "Renote"
    quote: "Kutip"
@ -1613,9 +1629,9 @@ _deck:
  _columns:
    main: "Utama"
    widgets: "Widget"
-    notifications: "Notifikasi"
+    notifications: "Pemberitahuan"
    tl: "Linimasa"
    antenna: "Antena"
    list: "Daftar"
    mentions: "Sebutan"
-    direct: "Direct"
+    direct: "Langsung"
--- a/locales/it-IT.yml
+++ b/locales/it-IT.yml
@ -127,6 +127,7 @@ editWidgets: "Modifica i widget"
 editWidgetsExit: "Modifica fine"
 customEmojis: "Emoji personalizzati"
 emoji: "Emoji"
+emojis: "Emoji"
 emojiName: "Nome dell'emoji"
 emojiUrl: "URL dell'emoji"
 addEmoji: "Aggiungi un emoji"
@ -514,7 +515,6 @@ removeAllFollowing: "Cancella tutti i follows"
 removeAllFollowingDescription: "Cancella tutti i follows del server {host}. Per favore, esegui se, ad esempio, l'istanza non esiste più."
 userSuspended: "L'utente è sospes@."
 userSilenced: "L'utente è silenziat@."
-sidebar: "Barra laterale"
 divider: "Linea di separazione"
 addItem: "Aggiungi elemento"
 rooms: "Camera"
@ -741,6 +741,14 @@ middle: "Media"
 low: "Bassa"
 emailNotConfiguredWarning: "Non hai impostato nessun indirizzo e-mail."
 ratio: "Rapporto"
+global: "Federata"
+sent: "Inviare"
+hashtags: "Hashtag"
+troubleshooting: "Risoluzione problemi"
+_docs:
+  continueReading: "Leggi di più"
+  features: "Funzionalità"
+  admin: "Gestione"
 _ad:
  back: "Indietro"
  reduceFrequencyOfThisAd: "Visualizza questa pubblicità meno spesso"
@ -799,6 +807,7 @@ _mfm:
  blur: "Sfocatura"
  font: "Tipo di carattere"
  fontDescription: "Puoi scegliere il tipo di carattere per il contenuto."
+  rainbow: "Arcobaleno"
 _reversi:
  reversi: "Reversi"
  gameSettings: "Impostazioni di gioco"
@ -825,9 +834,7 @@ _channel:
  following: "Seguiti"
  usersCount: "{n} partecipanti"
  notesCount: "{n} note"
-_sidebar:
-  full: "Intera"
-  icon: "Icone"
+_menuDisplay:
  hide: "Nascondere"
 _wordMute:
  muteWords: "Parole da filtrare"
@ -1388,12 +1395,12 @@ _notification:
  youWereInvitedToGroup: "Invitat@ al gruppo"
  _types:
    all: "Tutto"
-    follow: "Follows"
+    follow: "Nuovə follower"
    mention: "Menzioni"
-    reply: "Rispondi"
+    reply: "Risposte"
    renote: "Rinota"
    quote: "Cita"
-    reaction: "Reazione"
+    reaction: "Reazioni"
    pollVote: "Voti ricevuti"
    receiveFollowRequest: "Richiesta di follow ricevuta"
    followRequestAccepted: "Richiesta di follow accettata"
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@ -128,6 +128,7 @@ editWidgets: "ウィジェットを編集"
 editWidgetsExit: "編集を終了"
 customEmojis: "カスタム絵文字"
 emoji: "絵文字"
+emojis: "絵文字"
 emojiName: "絵文字名"
 emojiUrl: "絵文字画像URL"
 addEmoji: "絵文字を追加"
@ -528,7 +529,7 @@ removeAllFollowing: "フォローを全解除"
 removeAllFollowingDescription: "{host}からのフォローをすべて解除します。そのインスタンスがもう存在しなくなった場合などに実行してください。"
 userSuspended: "このユーザーは凍結されています。"
 userSilenced: "このユーザーはサイレンスされています。"
-sidebar: "サイドバー"
+menu: "メニュー"
 divider: "分割線"
 addItem: "項目を追加"
 rooms: "ルーム"
@ -761,6 +762,22 @@ middle: "中"
 low: "低"
 emailNotConfiguredWarning: "メールアドレスの設定がされていません。"
 ratio: "比率"
+customCss: "カスタムCSS"
+customCssWarn: "この設定は必ず知識のある方が行ってください。不適切な設定を行うとクライアントが正常に使用できなくなる恐れがあります。"
+global: "グローバル"
+squareAvatars: "アイコンを四角形で表示"
+sent: "送信"
+received: "受信"
+searchResult: "検索結果"
+hashtags: "ハッシュタグ"
+troubleshooting: "トラブルシューティング"
+
+_docs: 
+  continueReading: "続きを読む"
+  features: "機能"
+  generalTopics: "一般的なトピック"
+  advancedTopics: "高度なトピック"
+  admin: "管理"

 _ad:
  back: "戻る"
@ -868,6 +885,8 @@ _mfm:
  blurDescription: "内容をぼかすことができます。ポインターを上に乗せるとはっきり見えるようになります。"
  font: "フォント"
  fontDescription: "内容のフォントを指定することができます。"
+  rainbow: "レインボー"
+  rainbowDescription: "内容をレインボーにします。"

 _reversi:
  reversi: "リバーシ"
@ -924,9 +943,10 @@ _channel:
  usersCount: "{n}人が参加中"
  notesCount: "{n}投稿があります"

-_sidebar:
-  full: "フル"
-  icon: "アイコン"
+_menuDisplay:
+  sideFull: "横"
+  sideIcon: "横(アイコン)"
+  top: "上部"
  hide: "隠す"

 _wordMute:
--- a/locales/ja-KS.yml
+++ b/locales/ja-KS.yml
@ -127,6 +127,7 @@ editWidgets: "ウィジェットをいじる"
 editWidgetsExit: "編集終ったで"
 customEmojis: "カスタム絵文字"
 emoji: "絵文字"
+emojis: "絵文字"
 emojiName: "絵文字名"
 emojiUrl: "絵文字画像URL"
 addEmoji: "絵文字を追加"
@ -511,7 +512,6 @@ removeAllFollowing: "フォローを全解除"
 removeAllFollowingDescription: "{host}からのフォローをすべて解除するで。そのインスタンスが消えて無くなった時とかには便利な機能やで。"
 userSuspended: "このユーザーは...凍結されとる。"
 userSilenced: "このユーザーは...サイレンスされとる。"
-sidebar: "サイドバー"
 divider: "分割線"
 rooms: "ルーム"
 relays: "リレー"
@ -647,6 +647,11 @@ memo: "メモ"
 high: "高い"
 middle: "中"
 low: "低い"
+global: "グローバル"
+sent: "送信"
+hashtags: "ハッシュタグ"
+_docs:
+  admin: "管理"
 _ad:
  back: "戻る"
 _gallery:
@ -731,9 +736,7 @@ _channel:
  removeBanner: "バナーを削除"
  featured: "トレンド"
  notesCount: "{n}こ投稿があるで"
-_sidebar:
-  full: "フル"
-  icon: "アイコン"
+_menuDisplay:
  hide: "隠す"
 _wordMute:
  soft: "ソフト"
--- a/locales/jbo-EN.yml
+++ b/locales/jbo-EN.yml
@ -0,0 +1 @@
+---
--- a/locales/kab-KAB.yml
+++ b/locales/kab-KAB.yml
@ -7,7 +7,9 @@ username: "Isem n umseqdac"
 password: "Awal uffir"
 ok: "IH"
 settings: "Iɣewwaṛen"
+otherSettings: "Iɣewwaren nniḍen"
 profile: "Amaɣnu"
+signup: "Jerred"
 save: "Sekles"
 delete: "Kkes"
 addToList: "Rnu ɣer tebdart"
@ -27,15 +29,31 @@ followers: "Imeḍfaṛen"
 followsYou: "Yeṭṭafaṛ-ik·em-id"
 createList: "Snulfu-d tabdart"
 enterListName: "Isem n tebdart"
+privacy: "Tabaḍnit"
 follow: "Ḍfeṛ"
 you: "Kečči·mmi"
 selectList: "Fren tabdart"
 youHaveNoLists: "Ulac ɣur-k·m ula d yiwet n tabdart"
+security: "Taɣellist"
 remove: "Kkes"
 userList: "Tibdarin"
+securityKey: "Tasarutt n tɣellist"
+securityKeyName: "Isem n tsarutt"
+signinRequired: "Ttxil jerred"
+signinWith: "Tuqqna s {x}"
+tapSecurityKey: "Sekcem tasarutt-ik·im n tɣellist"
 uiLanguage: "Tutlayt n wegrudem"
+accountSettings: "Iɣewwaṛen n umiḍan"
+plugins: "Izegrar"
+email: "Imayl"
+emailAddress: "Tansa imayl"
 smtpUser: "Isem n umseqdac"
 smtpPass: "Awal uffir"
+other: "Wiyyaḍ"
+accountInfo: "Talɣut n umiḍan"
+emailNotification: "Ilɣa imayl"
+selectAccount: "Fren amiḍan"
+accounts: "Imiḍan"
 _email:
  _follow:
    title: "Yeṭṭafaṛ-ik·em-id"
@ -48,6 +66,8 @@ _theme:
    mention: "Bder"
 _sfx:
  notification: "Ilɣuyen"
+_permissions:
+  "write:account": "Ẓreg talɣut n umiḍan-ik·im"
 _widgets:
  notifications: "Ilɣuyen"
 _cw:
--- a/locales/ko-KR.yml
+++ b/locales/ko-KR.yml
@ -128,6 +128,7 @@ editWidgets: "위젯 편집"
 editWidgetsExit: "편집 종료"
 customEmojis: "커스텀 이모지"
 emoji: "이모지"
+emojis: "이모지"
 emojiName: "이모지 이름"
 emojiUrl: "이모지 URL"
 addEmoji: "이모지 추가"
@ -528,7 +529,7 @@ removeAllFollowing: "모든 팔로잉 해제"
 removeAllFollowingDescription: "{host}(으)로부터 모든 팔로잉을 해제합니다. 해당 인스턴스가 더 이상 존재하지 않게 된 경우 등에 실행해 주세요."
 userSuspended: "이 계정은 정지된 상태입니다."
 userSilenced: "이 계정은 사일런스된 상태입니다."
-sidebar: "사이드바"
+menu: "메뉴"
 divider: "구분선"
 addItem: "항목 추가"
 rooms: "방"
@ -761,6 +762,21 @@ middle: "보통"
 low: "낮음"
 emailNotConfiguredWarning: "메일 주소가 설정되어 있지 않습니다."
 ratio: "비율"
+customCss: "CSS 사용자화"
+customCssWarn: "이 설정은 기능을 알고 있는 경우에만 사용해야 합니다. 잘못된 값을 입력하면 클라이언트가 정상적으로 작동하지 않을 수 있습니다."
+global: "글로벌"
+squareAvatars: "프로필 아이콘을 사각형으로 표시"
+sent: "전송"
+received: "수신"
+searchResult: "검색 결과"
+hashtags: "해시태그"
+troubleshooting: "트러블 슈팅"
+_docs:
+  continueReading: "계속 읽기"
+  features: "기능"
+  generalTopics: "일반 주제"
+  advancedTopics: "심화 주제"
+  admin: "관리"
 _ad:
  back: "뒤로"
  reduceFrequencyOfThisAd: "이 광고의 표시 빈도 낮추기"
@ -859,6 +875,8 @@ _mfm:
  blurDescription: "내용이 흐리게 보입니다. 마우스를 위에 올려두면 내용이 보입니다."
  font: "폰트"
  fontDescription: "내용의 글꼴을 지정할 수 있습니다."
+  rainbow: "무지개"
+  rainbowDescription: "내용을 무지개로 표시합니다."
 _reversi:
  reversi: "리버시"
  gameSettings: "대국 설정"
@ -910,9 +928,10 @@ _channel:
  following: "팔로잉"
  usersCount: "{n}명 참여 중"
  notesCount: "{n}노트"
-_sidebar:
-  full: "전체"
-  icon: "아이콘"
+_menuDisplay:
+  sideFull: "가로"
+  sideIcon: "가로(아이콘)"
+  top: "상단"
  hide: "숨기기"
 _wordMute:
  muteWords: "뮤트할 단어"
--- a/locales/pl-PL.yml
+++ b/locales/pl-PL.yml
@ -128,6 +128,7 @@ editWidgets: "Edytuj widżet"
 editWidgetsExit: "Gotowe"
 customEmojis: "Niestandardowe emoji"
 emoji: "Emoji"
+emojis: "Emoji"
 emojiName: "Nazwa emoji"
 emojiUrl: "Adres URL emoji"
 addEmoji: "Dodaj emoji"
@ -513,7 +514,6 @@ deleteAllFilesConfirm: "Czy na pewno chcesz usunąć wszystkie pliki?"
 removeAllFollowingDescription: "Przestań obserwować wszystkie konta z {host}. Wykonaj to, jeżeli instancja już nie istnieje."
 userSuspended: "To konto zostało zawieszone."
 userSilenced: "Ten użytkownik został wyciszony."
-sidebar: "Pasek boczny"
 divider: "Rozdzielacz"
 addItem: "Dodaj element"
 rooms: "Pokój"
@ -735,6 +735,11 @@ middle: "Średnie"
 low: "Niski"
 emailNotConfiguredWarning: "Nie podano adresu e-mail"
 ratio: "Stosunek"
+global: "Globalna"
+sent: "Wyślij"
+hashtags: "Hashtag"
+_docs:
+  admin: "Zarządzanie"
 _ad:
  back: "Wróć"
  reduceFrequencyOfThisAd: "Pokazuj tę reklamę rzadziej"
@ -858,9 +863,7 @@ _channel:
  following: "Śledzeni"
  usersCount: "{n} uczestnicy"
  notesCount: "{n} wpisy"
-_sidebar:
-  full: "Pełne"
-  icon: "Awatar"
+_menuDisplay:
  hide: "Ukryj"
 _wordMute:
  muteWords: "Słowo do wyciszenia"
--- a/locales/pt-PT.yml
+++ b/locales/pt-PT.yml
@ -6,25 +6,72 @@ notifications: "Notificações"
 username: "Nome de usuário"
 password: "Senha"
 ok: "OK"
+gotIt: "Entendi"
 cancel: "Cancelar"
 enterUsername: "Digite o nome de usuário"
 renotedBy: "Repostado por {user}"
+noNotes: "Sem posts"
 settings: "Configurações"
 basicSettings: "Configurações básicas"
 otherSettings: "Outras configurações"
 profile: "Perfil"
 timeline: "Timeline"
+logout: "Sair"
+users: "Usuários"
+favorite: "Favoritar"
+favorites: "Favoritar"
+showMore: "Ver mais"
+youGotNewFollower: "Você tem um novo seguidor"
+followRequestAccepted: "Pedido de seguir aceito"
+note: "Post"
+notes: "Posts"
+enterEmoji: "Inserir emoji"
+renote: "Repostar"
+renoted: "Repostado"
+cantRenote: "Não pode repostar"
+cantReRenote: "Não pode repostar este repost"
+pinnedNote: "Post fixado"
+sensitive: "Conteúdo sensível"
+mute: "Silenciar"
+unmute: "Dessilenciar"
+settingGuide: "Guia de configuração"
+instances: "Instância"
+registeredAt: "Registrado em"
+perHour: "por hora"
+perDay: "por dia"
+noUsers: "Sem usuários"
+messageRead: "Lida"
+lightThemes: "Tema claro"
+darkThemes: "Tema escuro"
+addFile: "Adicionar arquivo"
+nsfw: "Conteúdo sensível"
+monthX: "mês de {month}"
+pinnedNotes: "Post fixado"
 smtpUser: "Nome de usuário"
 smtpPass: "Senha"
+user: "Usuários"
+_email:
+  _follow:
+    title: "Você tem um novo seguidor"
 _mfm:
  search: "Pesquisar"
+_theme:
+  keys:
+    renote: "Repostar"
 _sfx:
+  note: "Posts"
  notification: "Notificações"
 _widgets:
  notifications: "Notificações"
  timeline: "Timeline"
 _profile:
  username: "Nome de usuário"
+_exportOrImport:
+  muteList: "Silenciar"
+_notification:
+  youWereFollowed: "Você tem um novo seguidor"
+  _types:
+    renote: "Repostar"
 _deck:
  _columns:
    notifications: "Notificações"
--- a/locales/ru-RU.yml
+++ b/locales/ru-RU.yml
@ -7,6 +7,7 @@ search: "Поиск"
 notifications: "Уведомления"
 username: "Имя пользователя"
 password: "Пароль"
+forgotPassword: "Пароль забыт"
 fetchingAsApObject: "Приём с других сайтов"
 ok: "Окей"
 gotIt: "Ясно!"
@ -127,6 +128,7 @@ editWidgets: "Редактировать виджеты"
 editWidgetsExit: "Готово"
 customEmojis: "Эмодзи пользователя"
 emoji: "Эмодзи"
+emojis: "Эмодзи"
 emojiName: "Название эмодзи"
 emojiUrl: "URL эмодзи"
 addEmoji: "Добавить эмодзи"
@ -278,6 +280,7 @@ emptyDrive: "Диск пуст"
 emptyFolder: "Папка пуста"
 unableToDelete: "Удаление невозможно"
 inputNewFileName: "Введите имя нового файла"
+inputNewDescription: "Введите новую подпись"
 inputNewFolderName: "Пожалуйста, введите новое имя папки!"
 circularReferenceFolder: "Вы пытаетесь переместить папку внутрь себя."
 hasChildFilesOrFolders: "Эта папка не пуста и не может быть удалена."
@ -309,6 +312,8 @@ monthX: "{month} месяц"
 yearX: "{year} год"
 pages: "Страницы"
 integration: "Интеграция"
+connectService: "Подключиться"
+disconnectService: "Отключиться"
 enableLocalTimeline: "Включить локальную ленту"
 enableGlobalTimeline: "Включить глобальную ленту"
 disablingTimelinesInfo: "У администраторов и модераторов есть доступ ко всем лентам, даже если они отключены."
@ -322,6 +327,7 @@ driveCapacityPerRemoteAccount: "Объём диска на одного поль
 inMb: "В мегабайтах"
 iconUrl: "Ссылка на аватар"
 bannerUrl: "Ссылка на изображение в шапке"
+backgroundImageUrl: "Ссылка на фоновое изображение"
 basicInfo: "Общая информация"
 pinnedUsers: "Прикреплённый пользователь"
 pinnedUsersDescription: "Перечислите по одному имени пользователя в строке. Пользователи, перечисленные здесь, будут привязаны к закладке \"Изучение\"."
@ -523,7 +529,6 @@ removeAllFollowing: "Удалить всех подписчиков"
 removeAllFollowingDescription: "Отменить все подписки с домена {host}? Пожалуйста, применяйте это действие, если инстанс больше не существует."
 userSuspended: "Эта учётная запись заморожена"
 userSilenced: "Этот пользователь был заглушен"
-sidebar: "Боковая панель"
 divider: "Линия-разделитель"
 addItem: "Добавить элемент"
 rooms: "Комната"
@ -543,6 +548,8 @@ disablePlayer: "Выключить проигрыватель"
 expandTweet: "Развернуть твит"
 themeEditor: "Редактор темы оформления"
 description: "Описание"
+describeFile: "Добавить подпись"
+enterFileDescription: "Введите подпись"
 author: "Автор"
 leaveConfirm: "Вы не сохранили изменения. Хотите выйти и потерять их?"
 manage: "Управление"
@ -745,10 +752,31 @@ gallery: "Галерея"
 recentPosts: "Недавние публикации"
 popularPosts: "Популярные публикации"
 shareWithNote: "Поделиться заметкой"
+ads: "Реклама"
 expiration: "Опрос длится"
+memo: "Памятка"
+priority: "Приоритет"
+high: "Высокий"
 middle: "Средне"
+low: "Низкий"
+emailNotConfiguredWarning: "Не указан адрес электронной почты"
+ratio: "Соотношение"
+global: "Всеобщая"
+sent: "Отправить"
+hashtags: "Хэштег"
+_docs:
+  continueReading: "Читать подробнее"
+  features: "Возможности"
+  generalTopics: "Основные темы"
+  advancedTopics: "Дополнительные темы"
+  admin: "Управление"
 _ad:
  back: "Выход"
+  reduceFrequencyOfThisAd: "Реже показывать эту рекламу"
+_forgotPassword:
+  enterEmail: "Введите адрес электронной почты, который ввели при регистрации. На неё будет выслана ссылка для смены пароля."
+  ifNoEmail: "Если вы не ввели свой адрес электронной почты, свяжитесь с администратором ресурса, чтобы сменить пароль."
+  contactAdmin: "Здесь не используются адреса электронной почты, так что свяжитесь с администратором, чтобы поменять пароль."
 _gallery:
  my: "Личная"
  liked: "Понравившееся"
@ -840,6 +868,8 @@ _mfm:
  blurDescription: "Размывает текст до нечитаемости, будто его поместили за матовое стекло. Наведение указателя мыши на размытый текст возвращает чёткость."
  font: "Шрифт"
  fontDescription: "Так можно писать произвольным шрифтом."
+  rainbow: "Радуга"
+  rainbowDescription: "Заставлять содержимое отображаться в цветах радуги."
 _reversi:
  reversi: "Реверси"
  gameSettings: "Настройки игры"
@ -891,9 +921,10 @@ _channel:
  following: "Подписки"
  usersCount: "Участников: {n}"
  notesCount: "Заметок: {n}"
-_sidebar:
-  full: "Полностью"
-  icon: "Только значки"
+_menuDisplay:
+  sideFull: "Сторона"
+  sideIcon: "Сторона (иконки)"
+  top: "Вверх"
  hide: "Спрятать"
 _wordMute:
  muteWords: "Скрыть слово"
--- a/locales/uk-UA.yml
+++ b/locales/uk-UA.yml
@ -127,6 +127,7 @@ editWidgets: "Редагувати віджети"
 editWidgetsExit: "Готово"
 customEmojis: "Кастомні емоджі"
 emoji: "Емоджі"
+emojis: "Емоджі"
 emojiName: "Назва емоджі"
 emojiUrl: "URL емодзі"
 addEmoji: "Додати емодзі"
@ -517,7 +518,6 @@ removeAllFollowing: "Скасувати всі підписки"
 removeAllFollowingDescription: "Скасувати підписку на всі акаунти з {host}. Будь ласка, робіть це, якщо інстанс більше не існує."
 userSuspended: "Обліковий запис заблокований."
 userSilenced: "Обліковий запис приглушений."
-sidebar: "Бокова панель"
 divider: "Розділювач"
 addItem: "Додати елемент"
 rooms: "Кімнати"
@ -689,6 +689,11 @@ user: "Користувачі"
 administration: "Управління"
 expiration: "Опитування закінчується"
 middle: "Середній"
+global: "Глобальна"
+sent: "Відправити"
+hashtags: "Хештеґ"
+_docs:
+  admin: "Управління"
 _ad:
  back: "Назад"
 _gallery:
@ -816,9 +821,7 @@ _channel:
  following: "Підписки"
  usersCount: "{n} учасників"
  notesCount: "{n} дописів"
-_sidebar:
-  full: "Повна"
-  icon: "Аватар"
+_menuDisplay:
  hide: "Сховати"
 _wordMute:
  muteWords: "Заглушені слова"
--- a/locales/zh-CN.yml
+++ b/locales/zh-CN.yml
@ -1,13 +1,13 @@
 ---
 _lang_: "中文(简体)"
 headlineMisskey: "通过帖子连接在一起的网络"
-introMisskey: "欢迎！Misskey是一个开源的、去中心化的“微博客”服务。\n通过编写「帖文」来和大家分享你的以及你周围的事情吧！📡\n通过「回应」功能，可以让你快速地对大家的帖文表达反馈👍\n来探索新的世界吧！🚀"
+introMisskey: "欢迎！Misskey是一个开源的、去中心化的“微博客”服务。\n通过编写「帖子」来和大家分享你的以及你周围的事情吧！📡\n通过「回应」功能，可以让你快速地对大家的帖子表达反馈👍\n来探索新的世界吧！🚀"
 monthAndDay: "{month}月 {day}日"
 search: "搜索"
 notifications: "通知"
 username: "用户名"
 password: "密码"
-forgotPassword: "忘记密码"
+forgotPassword: "重置密码"
 fetchingAsApObject: "联合查询中"
 ok: "OK"
 gotIt: "我明白了"
@ -63,33 +63,33 @@ import: "导入"
 export: "导出"
 files: "文件"
 download: "下载"
-driveFileDeleteConfirm: "要删除「{name}」文件吗？附加此文件的帖子也会消失。"
+driveFileDeleteConfirm: "要删除「{name}」文件吗？附加此文件的帖子也会被删除。"
 unfollowConfirm: "要取消对{name}的关注吗？"
-exportRequested: "导出请求已提交。可能需要花一些时间。导出的文件将保存到网盘中。"
-importRequested: "导入请求已提交。这可能需要花一点时间。"
+exportRequested: "导出请求已提交，这可能需要花一些时间，导出的文件将保存到网盘中。"
+importRequested: "导入请求已提交，这可能需要花一点时间。"
 lists: "列表"
 noLists: "列表为空"
 note: "帖子"
 notes: "帖子"
 following: "关注中"
 followers: "关注者"
-followsYou: "关注了你"
+followsYou: "正在关注你"
 createList: "创建列表"
 manageLists: "管理列表"
 error: "错误"
-somethingHappened: "出现了问题"
+somethingHappened: "出现了一些问题！"
 retry: "重试"
 pageLoadError: "页面加载失败。"
 pageLoadErrorDescription: "这通常是由于网络或浏览器缓存的原因。请清除缓存或等待片刻后重试。"
 enterListName: "输入列表名称"
 privacy: "隐私"
-makeFollowManuallyApprove: "关注者请求需要批准"
+makeFollowManuallyApprove: "关注者的关注请求需要批准"
 defaultNoteVisibility: "默认可见性"
 follow: "关注"
 followRequest: "关注申请"
 followRequests: "关注申请"
 unfollow: "取消关注"
-followRequestPending: "发送关注申请"
+followRequestPending: "发送关注请求"
 enterEmoji: "输入表情符号"
 renote: "转发"
 unrenote: "取消转发"
@ -106,7 +106,7 @@ add: "添加"
 reaction: "回应"
 reactionSettingDescription: "选择您想要置顶的回应。"
 reactionSettingDescription2: "拖动重新排序，单击删除，点击 + 添加。"
-rememberNoteVisibility: "记录公开范围"
+rememberNoteVisibility: "保存上次设置的可见性"
 attachCancel: "删除附件"
 markAsSensitive: "标记为敏感内容"
 unmarkAsSensitive: "取消标记为敏感内容"
@ -128,17 +128,18 @@ editWidgets: "编辑小工具"
 editWidgetsExit: "完成编辑"
 customEmojis: "自定义表情符号"
 emoji: "表情符号"
+emojis: "表情符号"
 emojiName: "表情符号名称"
 emojiUrl: "表情符号地址"
 addEmoji: "添加表情符号"
 settingGuide: "推荐配置"
 cacheRemoteFiles: "远程文件缓存"
 cacheRemoteFilesDescription: "当禁用此设定时远程文件将直接从远程实例载入。禁用后会减小储存空间需求，但是会增加流量，因为缩略图不会被生成。"
-flagAsBot: "这个账户是Bot"
+flagAsBot: "这是一个机器人账号"
 flagAsBotDescription: "如果此帐户由程序控制，请启用此项。启用后，此标志可以帮助其他开发人员防止机器人之间产生无限互动的行为，并让Misskey的内部系统将此帐户识别为机器人。"
-flagAsCat: "这个账户是Cat"
-flagAsCatDescription: "如果您想表明此帐户是一只猫，请打开此标志。"
-autoAcceptFollowed: "自动允许关注"
+flagAsCat: "这个账户是一只猫"
+flagAsCatDescription: "如果您想表明此帐户是一只猫，请打开此标志。\n开启后，会在您的头像上出现猫耳朵，并将你的帖子中的「na」替换为「nya」，日文同理。"
+autoAcceptFollowed: "自动允许关注者的关注"
 addAccount: "添加账户"
 loginFailed: "登录失败"
 showOnRemote: "转到所在实例显示"
@ -172,7 +173,7 @@ software: "软件"
 version: "版本"
 metadata: "元数据"
 withNFiles: "{n}个文件"
-monitor: "监视器"
+monitor: "服务器状态"
 jobQueue: "作业队列"
 cpuAndMemory: "CPU和内存"
 network: "网络"
@ -211,7 +212,7 @@ instanceFollowing: "关注实例"
 instanceFollowers: "关注实例"
 instanceUsers: "实例用户"
 changePassword: "修改密码"
-security: "安全性"
+security: "安全"
 retypedNotMatch: "两次输入不一致！"
 currentPassword: "现在的密码"
 newPassword: "新密码"
@ -231,18 +232,18 @@ deleteAreYouSure: "要删掉「{x}」吗？"
 resetAreYouSure: "恢复默认设置？"
 saved: "已保存"
 messaging: "聊天"
-upload: "上传"
+upload: "本地上传"
 fromDrive: "从网盘中"
 fromUrl: "从 URL"
 uploadFromUrl: "从网址上传"
-uploadFromUrlDescription: "要上传的文件的URL"
+uploadFromUrlDescription: "输入文件的URL"
 uploadFromUrlRequested: "请求上传"
 uploadFromUrlMayTakeTime: "上传可能需要一些时间完成。"
 explore: "发现"
 games: "Misskey游戏"
 messageRead: "已读"
 noMoreHistory: "没有更多的历史记录"
-startMessaging: "开始聊天"
+startMessaging: "添加聊天"
 nUsersRead: "{n}人已读"
 agreeTo: "{0}人同意"
 tos: "服务条款"
@ -260,8 +261,8 @@ themeForLightMode: "在浅色模式下使用的主题"
 themeForDarkMode: "在深色模式下使用的主题"
 light: "浅色"
 dark: "深色"
-lightThemes: "亮色主题"
-darkThemes: "暗色主题"
+lightThemes: "浅色主题"
+darkThemes: "深色主题"
 syncDeviceDarkMode: "将深色模式与设备设置同步"
 drive: "网盘"
 fileName: "文件名称"
@ -275,24 +276,24 @@ createFolder: "创建文件夹"
 renameFolder: "重命名文件夹"
 deleteFolder: "删除文件夹"
 addFile: "添加文件"
-emptyDrive: "驱动器为空"
-emptyFolder: "空文件夹"
+emptyDrive: "网盘中无文件"
+emptyFolder: "此文件夹中无文件"
 unableToDelete: "无法删除"
 inputNewFileName: "请输入新文件名"
 inputNewDescription: "请输入新标题"
-inputNewFolderName: "请输入新文件名"
+inputNewFolderName: "请输入新文件夹名"
 circularReferenceFolder: "目标文件夹是您要移动的文件夹的子文件夹。"
-hasChildFilesOrFolders: "此文件夹不为空，无法删除。"
+hasChildFilesOrFolders: "此文件夹中有文件，无法删除。"
 copyUrl: "复制链接"
 rename: "重命名"
 avatar: "头像"
-banner: "Banner"
+banner: "横幅"
 nsfw: "敏感内容"
 whenServerDisconnected: "与服务器连接中断时"
-disconnectedFromServer: "已从服务器断开连接"
+disconnectedFromServer: "已和服务器断开连接"
 reload: "重新加载"
-doNothing: "什么都不做"
-reloadConfirm: "确定要重新加载吗"
+doNothing: "关闭弹窗"
+reloadConfirm: "确定要重新加载吗？"
 watch: "关注"
 unwatch: "取消关注"
 accept: "允许"
@ -325,14 +326,14 @@ driveCapacityPerLocalAccount: "每个用户的网盘空间"
 driveCapacityPerRemoteAccount: "每个远程用户的网盘容量"
 inMb: "以兆字节(MegaByte)为单位"
 iconUrl: "图标URL"
-bannerUrl: "Banner URL"
+bannerUrl: "横幅URL"
 backgroundImageUrl: "背景图URL"
 basicInfo: "基本信息"
 pinnedUsers: "置顶用户"
 pinnedUsersDescription: "在「发现」页面中使用换行标记想要置顶的用户。"
 pinnedPages: "固定页面"
 pinnedPagesDescription: "输入您要固定到实例首页的页面路径，以换行符分隔。"
-pinnedClipId: "置顶的片段ID"
+pinnedClipId: "置顶的书签ID"
 pinnedNotes: "已置顶的帖子"
 hcaptcha: "hCaptcha"
 enableHcaptcha: "启用 hCaptcha"
@ -350,13 +351,13 @@ antennaSource: "接收来源"
 antennaKeywords: "包含关键字"
 antennaExcludeKeywords: "排除关键字"
 antennaKeywordsDescription: "使用空格分隔会产生AND规范，并且使用换行符分隔会产生OR规范"
-notifyAntenna: "通知新帖子"
+notifyAntenna: "开启通知"
 withFileAntenna: "仅带有附件的帖子"
 enableServiceworker: "启用ServiceWorker"
 antennaUsersDescription: "指定用户名，用换行符分隔"
 caseSensitive: "区分大小写"
 withReplies: "包括回复"
-connectedTo: "您的账号已连到接以下社交账号"
+connectedTo: "您的账号已连到接以下第三方账号"
 notesAndReplies: "帖子与回复"
 withFiles: "附件"
 silence: "禁言"
@ -364,8 +365,8 @@ silenceConfirm: "确认要禁言吗？"
 unsilence: "解除禁言"
 unsilenceConfirm: "要解除禁言吗？"
 popularUsers: "热门用户"
-recentlyUpdatedUsers: "最近投稿用户"
-recentlyRegisteredUsers: "最近登录用户"
+recentlyUpdatedUsers: "最近投稿的用户"
+recentlyRegisteredUsers: "最近登录的用户"
 recentlyDiscoveredUsers: "最近发现的用户"
 exploreUsersCount: "有{count}个用户"
 exploreFediverse: "探索Fediverse"
@ -374,9 +375,9 @@ userList: "列表"
 about: "关于"
 aboutMisskey: "关于 Misskey"
 administrator: "管理员"
-token: "令牌"
+token: "Token (令牌)"
 twoStepAuthentication: "两步验证"
-moderator: "版主"
+moderator: "监察员"
 nUsersMentioned: "{n} 被提到"
 securityKey: "安全密钥"
 securityKeyName: "密钥名称"
@ -418,7 +419,7 @@ noteOf: "{user}的帖子"
 inviteToGroup: "群组邀请"
 maxNoteTextLength: "帖子的字数限制"
 quoteAttached: "已引用"
-quoteQuestion: "是否将其作为引用附上？"
+quoteQuestion: "是否引用此链接内容？"
 noMessagesYet: "现在没有新的聊天"
 newMessageExists: "新信息"
 onlyOneFileCanBeAttached: "只能添加一个附件"
@ -442,9 +443,9 @@ tapSecurityKey: "轻触硬件安全密钥"
 or: "或者"
 language: "语言"
 uiLanguage: "显示语言"
-groupInvited: "群组招待"
+groupInvited: "您有新的群组邀请"
 aboutX: "关于 {x}"
-useOsNativeEmojis: "使用OS原生表情符号"
+useOsNativeEmojis: "使用系统的原生表情符号"
 youHaveNoGroups: "没有群组"
 joinOrCreateGroup: "请加入一个现有的群组，或者创建新群组。"
 noHistory: "没有历史记录"
@ -460,7 +461,7 @@ regenerate: "重新生成"
 fontSize: "字体大小"
 noFollowRequests: "没有关注申请"
 openImageInNewTab: "在新标签页中打开图片"
-dashboard: "Dashboard"
+dashboard: "管理面板"
 local: "本地"
 remote: "远程"
 total: "总计"
@ -492,12 +493,12 @@ objectStorageUseProxy: "使用代理"
 objectStorageUseProxyDesc: "如果您不使用代理进行API连接，请将其关闭。"
 objectStorageSetPublicRead: "上传时设置为public-read"
 serverLogs: "服务器日志"
-deleteAll: "删除全部"
-showFixedPostForm: "在时间线顶部显示帖子表单"
+deleteAll: "全部删除"
+showFixedPostForm: "在时间线顶部显示发帖框"
 newNoteRecived: "有新的帖子"
-sounds: "声音"
-listen: "听"
-none: "空"
+sounds: "提示音"
+listen: "试听"
+none: "无"
 showInPage: "在页面中显示"
 popout: "弹窗"
 volume: "音量"
@ -509,15 +510,15 @@ recentUsed: "最近使用"
 install: "安装"
 uninstall: "卸载"
 installedApps: "已授权的应用"
-nothing: "没什么"
+nothing: "没有"
 installedDate: "授权日期"
 lastUsedDate: "最近使用"
 state: "状态"
 sort: "排序"
 ascendingOrder: "升序"
 descendingOrder: "降序"
-scratchpad: "便签本"
-scratchpadDescription: "便签本为AiScript提供了实验环境。您可以编写代码以与Misskey交互，运行它并查看结果。"
+scratchpad: "AiScript控制台"
+scratchpadDescription: "AiScript控制台为AiScript提供了实验环境。您可以编写代码以与Misskey交互，运行它并查看结果。"
 output: "输出"
 script: "脚本"
 disablePagesScript: "禁用页面脚本"
@ -528,7 +529,7 @@ removeAllFollowing: "取消所有关注"
 removeAllFollowingDescription: "取消{host}的所有关注者。当实例不存在时执行。"
 userSuspended: "该用户已被冻结。"
 userSilenced: "该用户已被禁言。"
-sidebar: "侧边栏"
+menu: "菜单"
 divider: "分割线"
 addItem: "添加项目"
 rooms: "房间"
@ -545,7 +546,7 @@ poll: "调查问卷"
 useCw: "隐藏内容"
 enablePlayer: "打开播放器"
 disablePlayer: "关闭播放器"
-expandTweet: "展开贴文"
+expandTweet: "展开帖子"
 themeEditor: "主题编辑器"
 description: "描述"
 describeFile: "添加标题"
@ -591,10 +592,10 @@ userSaysSomething: "{name}说了什么"
 makeActive: "启用"
 display: "显示"
 copy: "复制"
-metrics: "指标"
-overview: "概述"
+metrics: "服务器监控"
+overview: "服务器概况"
 logs: "日志"
-delayed: "延迟"
+delayed: "滞后"
 database: "数据库"
 channel: "频道"
 create: "创建"
@ -627,17 +628,17 @@ random: "随机"
 system: "系统"
 switchUi: "切换界面"
 desktop: "桌面"
-clip: "片段"
+clip: "书签"
 createNew: "新建"
 optional: "可选"
-createNewClip: "新建片段"
+createNewClip: "新建书签"
 public: "公开"
 i18nInfo: "Misskey已经被志愿者们翻译到了各种语言。如果你也有兴趣，可以通过{link}帮助翻译。"
 manageAccessTokens: "管理 Access Tokens"
 accountInfo: "帐户信息"
-notesCount: "贴文数量"
+notesCount: "帖子数量"
 repliesCount: "回复数量"
-renotesCount: "转贴数量"
+renotesCount: "转帖数量"
 repliedCount: "回复数"
 renotedCount: "转发数"
 followingCount: "正在关注数量"
@ -648,9 +649,9 @@ pollVotesCount: "问卷调查的投票数"
 pollVotedCount: "问卷调查的被投票数"
 yes: "是"
 no: "否"
-driveFilesCount: "磁盘文件数"
-driveUsage: "磁盘空间用量"
-noCrawle: "拒绝搜索器的索引"
+driveFilesCount: "网盘的文件数"
+driveUsage: "网盘的空间用量"
+noCrawle: "拒绝搜索引擎的索引"
 noCrawleDescription: "要求搜索引擎不要收录（索引）您的用户页面，帖子，页面等。"
 lockedAccountInfo: "即使通过了关注请求，只要您不将帖子可见范围设置成“关注者”，任何人都可以看到您的帖子。"
 alwaysMarkSensitive: "默认将媒体文件标记为敏感内容"
@ -665,7 +666,7 @@ pageLikedCount: "页面被点赞次数"
 reversiCount: "黑白棋对战次数"
 contact: "联系人"
 useSystemFont: "使用系统默认字体"
-clips: "片段"
+clips: "书签"
 experimentalFeatures: "实验性功能"
 developer: "开发者"
 makeExplorable: "使账号可见。"
@ -697,7 +698,7 @@ saveConfirm: "确定保存？"
 deleteConfirm: "确定删除?"
 invalidValue: "无效值。"
 registry: "注册表"
-closeAccount: "关闭账户"
+closeAccount: "永久注销账户"
 currentVersion: "当前版本"
 latestVersion: "最新版本"
 youAreRunningUpToDateClient: "您所使用的客户端已经是最新的。"
@ -761,13 +762,28 @@ middle: "中"
 low: "低"
 emailNotConfiguredWarning: "电子邮件地址未设置。"
 ratio: "比率"
+customCss: "自定义 CSS"
+customCssWarn: "这些设置必须有相关的基础知识，不当的配置可能导致客户端无法正常使用！"
+global: "全局"
+squareAvatars: "显示方形头像图标"
+sent: "发送"
+received: "收取"
+searchResult: "搜索结果"
+hashtags: "话题标签"
+troubleshooting: "故障排除"
+_docs:
+  continueReading: "继续阅读"
+  features: "特性"
+  generalTopics: "通常提示"
+  advancedTopics: "进阶提示"
+  admin: "管理"
 _ad:
  back: "返回"
  reduceFrequencyOfThisAd: "减少此广告的频率"
 _forgotPassword:
-  enterEmail: "请输入您用来注册帐户的电子邮件地址。密码重置链接将发送到该地址。"
-  ifNoEmail: "如果您没有使用电子邮件地址注册，请联系管理员。"
-  contactAdmin: "该实例不支持电子邮件。如果您想重设密码，请联系管理员。"
+  enterEmail: "请输入您验证账号时用的电子邮箱地址，密码重置链接将发送至该邮箱上。"
+  ifNoEmail: "如果您没有使用电子邮件地址进行验证，请联系管理员。"
+  contactAdmin: "该实例不支持发送电子邮件。如果您想重设密码，请联系管理员。"
 _gallery:
  my: "我的图库"
  liked: "喜欢的图片"
@ -777,7 +793,7 @@ _email:
  _follow:
    title: "你有新的关注者"
  _receiveFollowRequest:
-    title: "收到关注请求"
+    title: "收到了关注请求"
 _plugin:
  install: "安装插件"
  installWarn: "请不要安装不可信的插件。"
@ -859,6 +875,8 @@ _mfm:
  blurDescription: "产生模糊效果。将鼠标指针放在上面即可将内容显示出来。"
  font: "字体"
  fontDescription: "可以设置内容所使用的字体。"
+  rainbow: "彩虹"
+  rainbowDescription: "用彩虹色来显示内容。"
 _reversi:
  reversi: "黑白棋"
  gameSettings: "对局设置"
@ -910,19 +928,20 @@ _channel:
  following: "正在关注"
  usersCount: "有{n}人参与"
  notesCount: "有{n}个帖子"
-_sidebar:
-  full: "全部"
-  icon: "图标"
+_menuDisplay:
+  sideFull: "横向"
+  sideIcon: "横向(图标)"
+  top: "顶部"
  hide: "隐藏"
 _wordMute:
  muteWords: "禁用词"
  muteWordsDescription: "使用空格分隔表示AND逻辑，使用换行符分隔表示OR逻辑。"
  muteWordsDescription2: "将关键字用斜线括起来表示正则表达式。"
-  softDescription: "隐藏时间线中指定条件的帖文。"
-  hardDescription: "防止将具有指定条件的帖文添加到时间线。 即使您更改条件，未添加的帖文也会被排除在外。"
+  softDescription: "隐藏时间线中指定条件的帖子。"
+  hardDescription: "防止将具有指定条件的帖子添加到时间线。 即使您更改条件，未添加的帖文也会被排除在外。"
  soft: "软屏蔽"
  hard: "硬屏蔽"
-  mutedNotes: "被屏蔽的帖文"
+  mutedNotes: "被屏蔽的帖子"
 _theme:
  explore: "寻找主题"
  install: "安装主题"
@ -948,8 +967,8 @@ _theme:
  argument: "参数"
  basedProp: "基于的属性名称"
  alpha: "不透明度"
-  darken: "暗色"
-  lighten: "亮色"
+  darken: "深色"
+  lighten: "浅色"
  inputConstantName: "请输入常量名称"
  importInfo: "您可以在此处粘贴主题代码，将其导入到编辑器中"
  deleteConstantConfirm: "确定要删除常量{const}吗?"
@ -984,18 +1003,18 @@ _theme:
    cwBg: "CW 按钮背景"
    cwFg: "CW 按钮文本"
    cwHoverBg: "CW 按钮背景（悬停）"
-    toastBg: "吐司通知背景"
-    toastFg: "吐司通知文本"
+    toastBg: "Toast通知背景"
+    toastFg: "Toast通知文本"
    buttonBg: "按钮背景"
    buttonHoverBg: "按钮背景（悬停）"
    inputBorder: "输入框边框"
    listItemHoverBg: "下拉列表项目背景（悬停）"
-    driveFolderBg: "驱动器文件夹背景"
+    driveFolderBg: "网盘的文件夹背景"
    wallpaperOverlay: "壁纸叠加层"
    badge: "徽章"
    messageBg: "聊天背景"
-    accentDarken: "强调色(暗)"
-    accentLighten: "强调色(亮)"
+    accentDarken: "强调色(深)"
+    accentLighten: "强调色(浅)"
    fgHighlighted: "高亮显示文本"
 _sfx:
  note: "帖子"
@ -1094,9 +1113,9 @@ _auth:
 _antennaSources:
  all: "所有帖子"
  homeTimeline: "已关注用户的帖子"
-  users: "来自特定用户的帖子"
-  userList: "来自特定清单中的帖子"
-  userGroup: "来自特定组中用户的帖子"
+  users: "来自指定用户的帖子"
+  userList: "来自指定列表中的帖子"
+  userGroup: "来自指定群组中用户的帖子"
 _weekday:
  sunday: "星期日"
  monday: "星期一"
@ -1122,7 +1141,7 @@ _widgets:
  button: "按钮"
  onlineUsers: "在线用户"
  jobQueue: "作业队列"
-  serverMetric: "服务器指标"
+  serverMetric: "服务器监控"
  aiscript: "AiScript控制台"
 _cw:
  hide: "隐藏"
@ -1135,7 +1154,7 @@ _poll:
  noMore: "无法再添加更多了"
  canMultipleVote: "允许多个投票"
  expiration: "截止时间"
-  infinite: "无限期"
+  infinite: "不限时间"
  at: "指定日期"
  after: "指定时间"
  deadlineDate: "截止日期"
@ -1174,7 +1193,7 @@ _postForm:
    e: "请写下来吧"
    f: "等待您的发布..."
 _profile:
-  name: "名称"
+  name: "昵称"
  username: "用户名"
  description: "个人简介"
  youCanIncludeHashtags: "您可以包含一个哈希标签。"
@ -1287,7 +1306,7 @@ _rooms:
 _pages:
  newPage: "创建页面"
  editPage: "编辑页面"
-  readPage: "查看源"
+  readPage: "查看页面"
  created: "页面已创建"
  updated: "页面已更新"
  deleted: "该页面已被删除"
@ -1600,7 +1619,7 @@ _notification:
    reaction: "回应"
    pollVote: "问卷调查被投票"
    receiveFollowRequest: "收到关注请求"
-    followRequestAccepted: "关注请求已接受"
+    followRequestAccepted: "关注请求已通过"
    groupInvited: "加入群组邀请"
    app: "关联应用的通知"
 _deck:
--- a/locales/zh-TW.yml
+++ b/locales/zh-TW.yml
@ -14,7 +14,7 @@ gotIt: "知道了"
 cancel: "取消"
 enterUsername: "輸入使用者名稱"
 renotedBy: "{user} 轉傳了"
-noNotes: "貼文不可用。"
+noNotes: "無貼文。"
 noNotifications: "沒有通知"
 instance: "實例"
 settings: "設定"
@ -47,8 +47,8 @@ deleteAndEdit: "刪除並編輯"
 deleteAndEditConfirm: "要刪除並再次編輯嗎？此貼文的所有情感、轉發和回覆也將會消失。"
 addToList: "加入至清單"
 sendMessage: "發送訊息"
-copyUsername: "複製用戶名"
-searchUser: "搜尋用戶"
+copyUsername: "複製使用者名稱"
+searchUser: "搜尋使用者"
 reply: "回覆"
 loadMore: "載入更多"
 showMore: "載入更多"
@ -128,6 +128,7 @@ editWidgets: "編輯小工具"
 editWidgetsExit: "完成"
 customEmojis: "自訂表情符號"
 emoji: "表情符號"
+emojis: "表情符號"
 emojiName: "表情符號名稱"
 emojiUrl: "表情符號URL"
 addEmoji: "加入表情符號"
@ -279,6 +280,7 @@ emptyDrive: "雲端硬碟為空"
 emptyFolder: "資料夾為空"
 unableToDelete: "無法刪除"
 inputNewFileName: "輸入檔案名稱"
+inputNewDescription: "請輸入新標題 "
 inputNewFolderName: "輸入新資料夾的名稱"
 circularReferenceFolder: "目標文件夾是您要移動的文件夾的子文件夾。"
 hasChildFilesOrFolders: "此文件夾不是空的，無法刪除。"
@ -310,6 +312,8 @@ monthX: "{month}月"
 yearX: "{year}年"
 pages: "頁面"
 integration: "整合"
+connectService: "己連結"
+disconnectService: "己斷開 "
 enableLocalTimeline: "開啟本地時間軸"
 enableGlobalTimeline: "啟用公開時間軸"
 disablingTimelinesInfo: "即使您關閉了時間線功能，管理員和協調人仍可以繼續使用，以方便您。"
@ -323,6 +327,7 @@ driveCapacityPerRemoteAccount: "每個非本地用戶的雲端容量"
 inMb: "以Mbps為單位"
 iconUrl: "圖像URL"
 bannerUrl: "橫幅圖像URL"
+backgroundImageUrl: "背景圖片的來源網址 "
 basicInfo: "基本資訊"
 pinnedUsers: "置頂用戶"
 pinnedUsersDescription: "在「發現」頁面中使用換行標記想要置頂的使用者。"
@ -474,7 +479,9 @@ objectStorage: "Object Storage (物件儲存)"
 useObjectStorage: "使用Object Storage"
 objectStorageBaseUrl: "Base URL"
 objectStorageBucket: "儲存空間（Bucket）"
+objectStorageBucketDesc: "請指定您正在使用的服務的存儲桶名稱。 "
 objectStoragePrefix: "前綴"
+objectStoragePrefixDesc: "它存儲在此前綴目錄下。"
 objectStorageEndpoint: "端點（Endpoint）"
 objectStorageEndpointDesc: "如要使用AWS S3，請留空。否則請依照你使用的服務商的說明書進行設定，以'<host>'或 '<host>:<port>'的形式設定端點（Endpoint）。"
 objectStorageRegion: "地域（Region）"
@ -517,7 +524,6 @@ removeAllFollowing: "解除所有追蹤"
 removeAllFollowingDescription: "解除{host}所有的追蹤。在實例不再存在時執行。"
 userSuspended: "該使用者已被停用"
 userSilenced: "該用戶已被禁言。"
-sidebar: "側邊列"
 divider: "分割線"
 addItem: "新增項目"
 rooms: "房間"
@ -537,6 +543,8 @@ disablePlayer: "關閉播放器"
 expandTweet: "展開推文"
 themeEditor: "主題編輯器"
 description: "描述"
+describeFile: "添加標題 "
+enterFileDescription: "輸入標題 "
 author: "作者"
 leaveConfirm: "有未保存的更改。要放棄嗎？"
 manage: "管理"
@ -730,12 +738,35 @@ switch: "切換"
 noMaintainerInformationWarning: "尚未設定管理員信息。"
 noBotProtectionWarning: "尚未設定Bot防護。"
 configure: "設定"
+postToGallery: "發佈到相簿"
+gallery: "相簿"
+recentPosts: "最新貼文"
+popularPosts: "熱門的貼文"
+ads: "廣告"
 expiration: "期限"
+memo: "備忘錄"
+priority: "優先級"
+high: "高"
 middle: "中"
+low: "低"
 emailNotConfiguredWarning: "沒有設定電子郵件地址"
+ratio: "%"
+global: "公開"
+sent: "發送"
+hashtags: "#tag"
+_docs:
+  admin: "管理"
 _ad:
  back: "返回"
+  reduceFrequencyOfThisAd: "降低此廣告的頻率 "
+_forgotPassword:
+  enterEmail: "請輸入您的帳戶註冊的電子郵件地址。 密碼重置連結將被發送到該電子郵件地址。"
+  ifNoEmail: "如果您還沒有註冊您的電子郵件地址，請聯繫管理員。 "
+  contactAdmin: "此實例不支持電子郵件，請聯繫您的管理員重置您的密碼。 "
 _gallery:
+  my: "我的貼文"
+  liked: "喜歡的貼文"
+  like: "讚"
  unlike: "收回喜歡"
 _email:
  _follow:
@ -776,6 +807,7 @@ _mfm:
  url: "URL"
  urlDescription: "可以展示URL位址。"
  link: "鏈接"
+  linkDescription: "您可以將特定範圍的文章與 URL 相關聯。 "
  bold: "粗體"
  small: "縮小"
  center: "置中"
@ -786,7 +818,9 @@ _mfm:
  blockMath: "數學公式(方塊)"
  quote: "引用"
  emoji: "自訂表情符號"
+  emojiDescription: "您可以通過將自定義表情符號名稱括在冒號中來顯示自定義表情符號。 "
  search: "搜尋"
+  searchDescription: "您可以顯示所輸入的搜索框。"
  flip: "翻轉"
  flipDescription: "將內容上下或左右翻轉。"
  jelly: "動畫(果凍)"
@ -855,9 +889,7 @@ _channel:
  following: "關注中"
  usersCount: "有{n}人參與"
  notesCount: "有{n}個貼文"
-_sidebar:
-  full: "全部"
-  icon: "大頭貼"
+_menuDisplay:
  hide: "隱藏"
 _wordMute:
  muteWords: "加入靜音文字"
@ -879,17 +911,27 @@ _theme:
  constant: "常數"
  defaultValue: "預設值"
  color: "顏色"
+  refProp: "查看屬性 "
+  key: "按鍵"
  func: "函数"
  funcKind: "功能類型"
  argument: "參數"
+  basedProp: "要基於的屬性的名稱 "
  alpha: "透明度"
  darken: "暗度"
  lighten: "亮度"
  keys:
+    accent: "重點色彩"
    bg: "背景"
    fg: "文本"
+    focus: "聚焦"
+    indicator: "指標"
    panel: "面板"
    shadow: "陰影"
+    header: "標題"
+    navBg: "側邊欄的背景 "
+    navFg: "側邊欄的文字"
+    navHoverFg: "側邊欄文字（懸停） "
    navActive: "側邊欄文本 (活動)"
    navIndicator: "側邊欄指示符"
    link: "鏈接"
@ -971,6 +1013,7 @@ _tutorial:
 _2fa:
  alreadyRegistered: "此設備已經被註冊過了"
  registerDevice: "註冊裝置"
+  registerKey: "註冊鍵"
  step1: "首先，在您的設備上安裝二步驗證程式，例如{a}或{b}。"
  step2: "然後，掃描螢幕上的QR code。"
 _permissions:
@ -1040,6 +1083,7 @@ _widgets:
  button: "按鈕"
  onlineUsers: "線上的用戶"
  jobQueue: "佇列"
+  serverMetric: "服務器指標 "
 _cw:
  hide: "隱藏"
  show: "瀏覽更多"
@ -1053,6 +1097,7 @@ _poll:
  expiration: "期限"
  infinite: "無期限"
  at: "結束時間"
+  after: "進度指定 "
  deadlineDate: "截止日期"
  deadlineTime: "小時"
  duration: "時長"
@ -1067,6 +1112,7 @@ _poll:
  remainingSeconds: "{s}秒後截止"
 _visibility:
  public: "公開"
+  publicDescription: "發布給所有用戶 "
  home: "首頁"
  followers: "追隨者"
  specified: "指定使用者"
@ -1180,6 +1226,7 @@ _rooms:
    cube: "立方體"
    tv: "電視"
    pinguin: "企鵝蠟像"
+    rubik-cube: "魔術方塊"
    poster-h: "海報(橫向)"
    poster-v: "海報(直向)"
    sofa: " 沙發"
@ -1242,6 +1289,7 @@ _pages:
    post: "發佈窗口"
    _post:
      text: "内容"
+      attachCanvasImage: "附加相簿圖像 "
      canvasId: "畫布ID"
    textInput: "插入字串"
    _textInput:
@ -1266,6 +1314,7 @@ _pages:
    note: "嵌式貼文"
    _note:
      id: "貼文ID"
+      idDescription: "您也可以粘貼筆記 URL 並進行設置。 "
      detailed: "顯示詳細內容"
    switch: "開關"
    _switch:
@ -1282,12 +1331,15 @@ _pages:
      colored: "彩色"
      action: "按下按鈕後發生的行為"
      _action:
+        dialog: "顯示對話框 "
        _dialog:
          content: "内容"
        resetRandom: "重設亂數"
        pushEvent: "發送事件"
        _pushEvent:
          event: "事件名稱"
+          message: "按下時顯示的消息 "
+          variable: "要發送的變數"
          no-variable: "沒有"
        callAiScript: "調用AiScript"
        _callAiScript:
@ -1296,6 +1348,7 @@ _pages:
    _radioButton:
      name: "變數名稱"
      title: "標題"
+      values: "由換行符分隔的選項"
      default: "預設值"
  script:
    categories:
@ -1313,6 +1366,8 @@ _pages:
      text: "字串"
      multiLineText: "字串(多行)"
      textList: "字串串列"
+      _textList:
+        info: "請分開每個換行符 "
      strLen: "字串長度"
      _strLen:
        arg1: "字串"
@ -1323,6 +1378,8 @@ _pages:
      strReplace: "替換字串"
      _strReplace:
        arg1: "字串"
+        arg2: "替換前"
+        arg3: "替換後"
      strReverse: "倒轉字串"
      _strReverse:
        arg1: "字串"
@ -1389,6 +1446,7 @@ _pages:
      _if:
        arg1: "如果"
        arg2: "如果"
+        arg3: "除此以外 "
      not: "否"
      _not:
        arg1: "否"
@ -1399,13 +1457,17 @@ _pages:
      _rannum:
        arg1: "下限"
        arg2: "上限"
+      randomPick: "從列表中隨機選擇 "
      _randomPick:
        arg1: "清單"
+      dailyRandom: "隨機(使用者每日變化 )"
      _dailyRandom:
        arg1: "機率"
+      dailyRannum: "亂數(使用者每日變化)"
      _dailyRannum:
        arg1: "下限"
        arg2: "上限"
+      dailyRandomPick: "從列表中隨機選擇（使用者每日變化 ） "
      _dailyRandomPick:
        arg1: "清單"
      seedRandom: "隨機抽選種子碼"
@ -1444,7 +1506,10 @@ _pages:
      aiScriptVar: "AiScript的變數"
      fn: "函数"
      _fn:
+        slots: "欄位"
+        slots-info: "用換行符分隔每個欄位"
        arg1: "輸出"
+      for: "重複 "
      _for:
        arg1: "重複次數"
        arg2: "處理"
@ -1454,13 +1519,16 @@ _pages:
      boolean: "標記"
      array: "清單"
      stringArray: "字串列表"
+    emptySlot: "空欄位"
    enviromentVariables: "環境變數"
    pageVariables: "頁面元素"
+    argVariables: "輸入欄位"
 _relayStatus:
  requesting: "等待核准"
  accepted: "已通過核准"
  rejected: "已拒絕"
 _notification:
+  fileUploaded: "上傳檔案成功。"
  youGotMention: "{name}提及到您"
  youGotReply: "{name}回覆了您"
  youGotQuote: "{name}引用了您"
--- a/package.json
+++ b/package.json
@ -1,7 +1,7 @@
 {
 	"name": "misskey",
 	"author": "syuilo <syuilotan@yahoo.co.jp>",
-	"version": "12.83.0",
+	"version": "12.85.1",
 	"codename": "indigo",
 	"repository": {
 		"type": "git",
@ -30,14 +30,11 @@
 		"format": "gulp format"
 	},
 	"resolutions": {
-		"mfm-js/twemoji-parser": "13.1.x",
 		"chokidar": "^3.3.1",
-		"constantinople": "^4.0.1",
-		"jsonld/rdf-canonize/node-forge": "0.10.0",
-		"lodash": "^4.17.20"
+		"lodash": "^4.17.21"
 	},
 	"dependencies": {
-		"@babel/plugin-transform-runtime": "7.14.3",
+		"@babel/plugin-transform-runtime": "7.14.5",
 		"@elastic/elasticsearch": "7.11.0",
 		"@koa/cors": "3.1.0",
 		"@koa/multer": "3.0.0",
@ -47,94 +44,94 @@
 		"@sinonjs/fake-timers": "7.1.2",
 		"@syuilo/aiscript": "0.11.1",
 		"@types/bcryptjs": "2.4.2",
-		"@types/bull": "3.15.1",
+		"@types/bull": "3.15.2",
 		"@types/cbor": "6.0.0",
 		"@types/dateformat": "3.0.1",
 		"@types/escape-regexp": "0.0.0",
-		"@types/glob": "7.1.3",
-		"@types/gulp": "4.0.8",
-		"@types/gulp-rename": "2.0.0",
-		"@types/is-url": "1.2.29",
-		"@types/js-yaml": "4.0.1",
-		"@types/jsdom": "16.2.10",
-		"@types/jsonld": "1.5.5",
-		"@types/katex": "0.11.0",
-		"@types/koa": "2.13.3",
-		"@types/koa-bodyparser": "4.3.1",
-		"@types/koa-cors": "0.0.0",
-		"@types/koa-favicon": "2.0.19",
+		"@types/glob": "7.1.4",
+		"@types/gulp": "4.0.9",
+		"@types/gulp-rename": "2.0.1",
+		"@types/is-url": "1.2.30",
+		"@types/js-yaml": "4.0.2",
+		"@types/jsdom": "16.2.13",
+		"@types/jsonld": "1.5.6",
+		"@types/katex": "0.11.1",
+		"@types/koa": "2.13.4",
+		"@types/koa-bodyparser": "4.3.2",
+		"@types/koa-cors": "0.0.1",
+		"@types/koa-favicon": "2.0.21",
 		"@types/koa-logger": "3.1.1",
 		"@types/koa-mount": "4.0.0",
-		"@types/koa-send": "4.1.2",
+		"@types/koa-send": "4.1.3",
 		"@types/koa-views": "7.0.0",
-		"@types/koa__cors": "3.0.2",
-		"@types/koa__multer": "2.0.2",
-		"@types/koa__router": "8.0.4",
-		"@types/markdown-it": "12.0.2",
-		"@types/matter-js": "0.14.12",
-		"@types/mocha": "8.2.2",
-		"@types/node": "15.12.2",
-		"@types/node-fetch": "2.5.10",
-		"@types/nodemailer": "6.4.2",
+		"@types/koa__cors": "3.0.3",
+		"@types/koa__multer": "2.0.3",
+		"@types/koa__router": "8.0.7",
+		"@types/markdown-it": "12.0.3",
+		"@types/matter-js": "0.17.3",
+		"@types/mocha": "8.2.3",
+		"@types/node": "16.3.3",
+		"@types/node-fetch": "2.5.11",
+		"@types/nodemailer": "6.4.4",
 		"@types/nprogress": "0.2.0",
 		"@types/oauth": "0.9.1",
-		"@types/parse5": "6.0.0",
+		"@types/parse5": "6.0.1",
 		"@types/parsimmon": "1.10.6",
-		"@types/portscanner": "2.1.0",
-		"@types/pug": "2.0.4",
+		"@types/portscanner": "2.1.1",
+		"@types/pug": "2.0.5",
 		"@types/punycode": "2.1.0",
-		"@types/qrcode": "1.4.0",
+		"@types/qrcode": "1.4.1",
 		"@types/random-seed": "0.3.3",
-		"@types/ratelimiter": "3.4.1",
-		"@types/redis": "2.8.29",
-		"@types/rename": "1.0.3",
+		"@types/ratelimiter": "3.4.2",
+		"@types/redis": "2.8.31",
+		"@types/rename": "1.0.4",
 		"@types/request-stats": "3.0.0",
-		"@types/rimraf": "3.0.0",
+		"@types/rimraf": "3.0.1",
 		"@types/seedrandom": "2.4.28",
-		"@types/sharp": "0.28.3",
-		"@types/sinonjs__fake-timers": "6.0.2",
-		"@types/speakeasy": "2.0.5",
+		"@types/sharp": "0.28.4",
+		"@types/sinonjs__fake-timers": "6.0.3",
+		"@types/speakeasy": "2.0.6",
 		"@types/throttle-debounce": "2.1.0",
-		"@types/tinycolor2": "1.4.2",
-		"@types/tmp": "0.2.0",
-		"@types/uuid": "8.3.0",
-		"@types/web-push": "3.3.0",
+		"@types/tinycolor2": "1.4.3",
+		"@types/tmp": "0.2.1",
+		"@types/uuid": "8.3.1",
+		"@types/web-push": "3.3.2",
 		"@types/webpack": "5.28.0",
 		"@types/webpack-stream": "3.2.12",
-		"@types/websocket": "1.0.2",
-		"@types/ws": "7.4.4",
-		"@typescript-eslint/parser": "4.26.1",
-		"@vue/compiler-sfc": "3.1.1",
+		"@types/websocket": "1.0.3",
+		"@types/ws": "7.4.6",
+		"@typescript-eslint/parser": "4.28.3",
+		"@vue/compiler-sfc": "3.1.5",
 		"abort-controller": "3.0.0",
-		"apexcharts": "3.27.1",
+		"apexcharts": "3.27.2",
 		"autobind-decorator": "2.4.0",
 		"autosize": "4.0.4",
 		"autwh": "0.1.0",
-		"aws-sdk": "2.923.0",
+		"aws-sdk": "2.948.0",
 		"bcryptjs": "2.4.3",
 		"blurhash": "1.1.3",
-		"broadcast-channel": "3.6.0",
-		"bull": "3.22.7",
+		"broadcast-channel": "3.7.0",
+		"bull": "3.26.0",
 		"cafy": "15.2.1",
-		"cbor": "7.0.5",
+		"cbor": "7.0.6",
 		"chalk": "4.1.1",
 		"chart.js": "2.9.4",
 		"cli-highlight": "2.1.11",
 		"commander": "7.2.0",
 		"concurrently": "6.2.0",
 		"content-disposition": "0.5.3",
-		"core-js": "3.14.0",
+		"core-js": "3.15.2",
 		"crc-32": "1.2.0",
-		"css-loader": "5.2.6",
-		"cssnano": "5.0.5",
+		"css-loader": "6.0.0",
+		"cssnano": "5.0.6",
 		"dateformat": "4.5.1",
 		"diskusage": "1.1.3",
 		"escape-regexp": "0.0.1",
-		"eslint": "7.28.0",
-		"eslint-plugin-vue": "7.10.0",
+		"eslint": "7.30.0",
+		"eslint-plugin-vue": "7.13.0",
 		"eventemitter3": "4.0.7",
 		"feed": "4.2.2",
-		"file-type": "16.5.0",
+		"file-type": "16.5.1",
 		"fluent-ffmpeg": "2.1.2",
 		"glob": "7.1.7",
 		"got": "11.8.2",
@ -157,7 +154,7 @@
 		"jsdom": "16.6.0",
 		"json5": "2.2.0",
 		"json5-loader": "4.0.1",
-		"jsonld": "4.0.1",
+		"jsonld": "5.2.0",
 		"jsrsasign": "8.0.20",
 		"katex": "0.13.11",
 		"koa": "2.13.1",
@ -171,26 +168,26 @@
 		"koa-views": "7.0.1",
 		"langmap": "0.0.16",
 		"lookup-dns-cache": "2.1.0",
-		"markdown-it": "12.0.6",
+		"markdown-it": "12.1.0",
 		"markdown-it-anchor": "7.1.0",
 		"matter-js": "0.17.1",
-		"mfm-js": "0.18.0",
-		"misskey-js": "0.0.4",
+		"mfm-js": "0.19.0",
+		"misskey-js": "0.0.6",
 		"mocha": "8.4.0",
 		"moji": "0.5.1",
 		"ms": "2.1.3",
 		"multer": "1.4.2",
 		"nested-property": "4.0.0",
 		"node-fetch": "2.6.1",
-		"nodemailer": "6.6.1",
+		"nodemailer": "6.6.3",
 		"object-assign-deep": "0.4.0",
 		"os-utils": "0.0.14",
 		"parse5": "6.0.1",
 		"pg": "8.6.0",
 		"portscanner": "2.2.0",
-		"postcss": "8.3.0",
-		"postcss-loader": "5.3.0",
-		"prismjs": "1.23.0",
+		"postcss": "8.3.5",
+		"postcss-loader": "6.1.1",
+		"prismjs": "1.24.1",
 		"probe-image-size": "7.2.1",
 		"promise-limit": "2.7.0",
 		"promise-sequential": "1.1.1",
@ -212,16 +209,16 @@
 		"rimraf": "3.0.2",
 		"rndstr": "1.0.0",
 		"s-age": "1.1.2",
-		"sass": "1.34.1",
-		"sass-loader": "12.0.0",
+		"sass": "1.35.2",
+		"sass-loader": "12.1.0",
 		"seedrandom": "3.0.5",
 		"sharp": "0.28.3",
 		"speakeasy": "2.0.0",
 		"stringz": "2.1.0",
-		"style-loader": "2.0.0",
+		"style-loader": "3.1.0",
 		"summaly": "2.4.0",
 		"syslog-pro": "1.0.0",
-		"systeminformation": "5.7.4",
+		"systeminformation": "5.7.7",
 		"syuilo-password-strength": "0.0.1",
 		"textarea-caret": "3.1.0",
 		"three": "0.117.1",
@ -229,32 +226,32 @@
 		"tinycolor2": "1.4.2",
 		"tmp": "0.2.1",
 		"ts-loader": "9.2.3",
-		"ts-node": "10.0.0",
-		"tsc-alias": "1.3.2",
-		"tsconfig-paths": "3.9.0",
+		"ts-node": "10.1.0",
+		"tsc-alias": "1.3.7",
+		"tsconfig-paths": "3.10.1",
 		"tslint": "6.1.3",
 		"tslint-sonarts": "1.9.0",
 		"twemoji-parser": "13.1.0",
-		"typeorm": "0.2.34",
-		"typescript": "4.3.2",
+		"typeorm": "0.2.32",
+		"typescript": "4.3.5",
 		"ulid": "2.3.0",
 		"uuid": "8.3.2",
 		"v-debounce": "0.1.2",
 		"vanilla-tilt": "1.7.0",
-		"vue": "3.1.1",
+		"vue": "3.1.5",
 		"vue-color": "2.8.1",
-		"vue-json-pretty": "1.7.1",
-		"vue-loader": "16.1.2",
+		"vue-json-pretty": "1.8.1",
+		"vue-loader": "16.3.1",
 		"vue-prism-editor": "2.0.0-alpha.2",
 		"vue-router": "4.0.5",
 		"vue-style-loader": "4.1.3",
 		"vue-svg-loader": "0.17.0-beta.2",
 		"vuedraggable": "4.0.1",
-		"web-push": "3.4.4",
-		"webpack": "5.38.1",
+		"web-push": "3.4.5",
+		"webpack": "5.45.1",
 		"webpack-cli": "4.7.2",
 		"websocket": "1.0.34",
-		"ws": "7.4.6",
+		"ws": "7.5.3",
 		"xev": "2.0.1"
 	},
 	"devDependencies": {
--- a/src/client/account.ts
+++ b/src/client/account.ts
@ -8,6 +8,8 @@ import { unisonReload } from '@client/scripts/unison-reload';
 type Account = {
 	id: string;
 	token: string;
+	isModerator: boolean;
+	isAdmin: boolean;
 };

 const data = localStorage.getItem('account');
@ -45,7 +47,7 @@ function fetchAccount(token): Promise<Account> {
 		})
 		.then(res => {
 			// When failed to authenticate user
-			if (res.status !== 200 && res.status < 500) {
+			if (res.status >= 400 && res.status < 500) {
 				return signout();
 			}

--- a/src/client/components/abuse-report-window.vue
+++ b/src/client/components/abuse-report-window.vue
@ -10,9 +10,9 @@
 	</template>
 	<div class="dpvffvvy _monolithic_">
 		<div class="_section">
-			<MkTextarea v-model:value="comment">
-				<span>{{ $ts.details }}</span>
-				<template #desc>{{ $ts.fillAbuseReportDescription }}</template>
+			<MkTextarea v-model="comment">
+				<template #label>{{ $ts.details }}</template>
+				<template #caption>{{ $ts.fillAbuseReportDescription }}</template>
 			</MkTextarea>
 		</div>
 		<div class="_section">
--- a/src/client/components/analog-clock.vue
+++ b/src/client/components/analog-clock.vue
@ -5,7 +5,8 @@
 					:cy="5 - (Math.cos(angle) * (5 - graduationsPadding))"
 					:r="i % 5 == 0 ? 0.125 : 0.05"
 					:fill="i % 5 == 0 ? majorGraduationColor : minorGraduationColor"
-					:key="i"/>
+					:key="i"
+	/>

 	<line
 		:x1="5 - (Math.sin(sAngle) * (sHandLengthRatio * handsTailLength))"
@ -13,7 +14,9 @@
 		:x2="5 + (Math.sin(sAngle) * ((sHandLengthRatio * 5) - handsPadding))"
 		:y2="5 - (Math.cos(sAngle) * ((sHandLengthRatio * 5) - handsPadding))"
 		:stroke="sHandColor"
-		stroke-width="0.05"/>
+		:stroke-width="thickness / 2"
+		stroke-linecap="round"
+	/>

 	<line
 		:x1="5 - (Math.sin(mAngle) * (mHandLengthRatio * handsTailLength))"
@ -21,7 +24,9 @@
 		:x2="5 + (Math.sin(mAngle) * ((mHandLengthRatio * 5) - handsPadding))"
 		:y2="5 - (Math.cos(mAngle) * ((mHandLengthRatio * 5) - handsPadding))"
 		:stroke="mHandColor"
-		stroke-width="0.1"/>
+		:stroke-width="thickness"
+		stroke-linecap="round"
+	/>

 	<line
 		:x1="5 - (Math.sin(hAngle) * (hHandLengthRatio * handsTailLength))"
@ -29,16 +34,24 @@
 		:x2="5 + (Math.sin(hAngle) * ((hHandLengthRatio * 5) - handsPadding))"
 		:y2="5 - (Math.cos(hAngle) * ((hHandLengthRatio * 5) - handsPadding))"
 		:stroke="hHandColor"
-		stroke-width="0.1"/>
+		:stroke-width="thickness"
+		stroke-linecap="round"
+	/>
 </svg>
 </template>

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

 export default defineComponent({
+	props: {
+		thickness: {
+			type: Number,
+			default: 0.1
+		}
+	},
+
 	data() {
 		return {
 			now: new Date(),
--- a/src/client/components/dialog.vue
+++ b/src/client/components/dialog.vue
@ -14,8 +14,8 @@
 		</div>
 		<header v-if="title"><Mfm :text="title"/></header>
 		<div class="body" v-if="text"><Mfm :text="text"/></div>
-		<MkInput v-if="input" v-model:value="inputValue" autofocus :type="input.type || 'text'" :placeholder="input.placeholder" @keydown="onInputKeydown"></MkInput>
-		<MkSelect v-if="select" v-model:value="selectedValue" autofocus>
+		<MkInput v-if="input" v-model="inputValue" autofocus :type="input.type || 'text'" :placeholder="input.placeholder" @keydown="onInputKeydown"></MkInput>
+		<MkSelect v-if="select" v-model="selectedValue" autofocus>
 			<template v-if="select.items">
 				<option v-for="item in select.items" :value="item.value">{{ item.text }}</option>
 			</template>
--- a/src/client/components/drive.file.vue
+++ b/src/client/components/drive.file.vue
@ -114,7 +114,7 @@ export default defineComponent({
 			if (this.selectMode) {
 				this.$emit('chosen', this.file);
 			} else {
-				os.modalMenu(this.getMenu(), ev.currentTarget || ev.target);
+				os.popupMenu(this.getMenu(), ev.currentTarget || ev.target);
 			}
 		},

--- a/src/client/components/drive.vue
+++ b/src/client/components/drive.vue
@ -10,6 +10,7 @@
 			<span class="separator" v-if="folder != null"><i class="fas fa-angle-right"></i></span>
 			<span class="folder current" v-if="folder != null">{{ folder.name }}</span>
 		</div>
+		<button @click="showMenu" class="menu _button"><i class="fas fa-ellipsis-h"></i></button>
 	</nav>
 	<div class="main" :class="{ uploading: uploadings.length > 0, fetching }"
 		ref="main"
@ -46,7 +47,7 @@
 </template>

 <script lang="ts">
-import { defineComponent } from 'vue';
+import { defineComponent, markRaw } from 'vue';
 import XNavFolder from './drive.nav-folder.vue';
 import XFolder from './drive.folder.vue';
 import XFile from './drive.file.vue';
@ -139,7 +140,7 @@ export default defineComponent({
 			});
 		}

-		this.connection = os.stream.useChannel('drive');
+		this.connection = markRaw(os.stream.useChannel('drive'));

 		this.connection.on('fileCreated', this.onStreamDriveFileCreated);
 		this.connection.on('fileUpdated', this.onStreamDriveFileUpdated);
@ -627,8 +628,12 @@ export default defineComponent({
 			}];
 		},

-		onContextmenu(e) {
-			os.contextMenu(this.getMenu(), e);
+		showMenu(ev) {
+			os.popupMenu(this.getMenu(), ev.currentTarget || ev.target);
+		},
+
+		onContextmenu(ev) {
+			os.contextMenu(this.getMenu(), ev);
 		},
 	}
 });
@ -641,7 +646,7 @@ export default defineComponent({
 	height: 100%;

 	> nav {
-		display: block;
+		display: flex;
 		z-index: 2;
 		width: 100%;
 		padding: 0 8px;
@ -696,6 +701,10 @@ export default defineComponent({
 				}
 			}
 		}
+
+		> .menu {
+			margin-left: auto;
+		}
 	}

 	> .main {
--- a/src/client/components/emoji-picker-dialog.vue
+++ b/src/client/components/emoji-picker-dialog.vue
@ -1,17 +1,17 @@
 <template>
-<MkModal ref="modal" :manual-showing="manualShowing" :src="src" :front="true" @click="$refs.modal.close()" @opening="opening" @close="$emit('close')" @closed="$emit('closed')">
-	<MkEmojiPicker :show-pinned="showPinned" :as-reaction-picker="asReactionPicker" @chosen="chosen" ref="picker"/>
-</MkModal>
+<MkPopup ref="popup" :manual-showing="manualShowing" :src="src" :front="true" @click="$refs.popup.close()" @opening="opening" @close="$emit('close')" @closed="$emit('closed')" #default="{point}">
+	<MkEmojiPicker class="ryghynhb _popup _shadow" :class="{ pointer: point === 'top' }" :show-pinned="showPinned" :as-reaction-picker="asReactionPicker" @chosen="chosen" ref="picker"/>
+</MkPopup>
 </template>

 <script lang="ts">
 import { defineComponent, markRaw } from 'vue';
-import MkModal from '@client/components/ui/modal.vue';
+import MkPopup from '@client/components/ui/popup.vue';
 import MkEmojiPicker from '@client/components/emoji-picker.vue';

 export default defineComponent({
 	components: {
-		MkModal,
+		MkPopup,
 		MkEmojiPicker,
 	},

@ -33,7 +33,7 @@ export default defineComponent({
 		},
 	},

-	emits: ['done', 'closed'],
+	emits: ['done', 'close', 'closed'],

 	data() {
 		return {
@ -44,7 +44,7 @@ export default defineComponent({
 	methods: {
 		chosen(emoji: any) {
 			this.$emit('done', emoji);
-			this.$refs.modal.close();
+			this.$refs.popup.close();
 		},

 		opening() {
@ -56,145 +56,20 @@ export default defineComponent({
 </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 {
-						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;
-			}
+.ryghynhb {
+	&.pointer {
+		&:before {
+			--size: 8px;
+			content: '';
+			display: block;
+			position: absolute;
+			top: calc(0px - (var(--size) * 2));
+			left: 0;
+			right: 0;
+			width: 0;
+			margin: auto;
+			border: solid var(--size) transparent;
+			border-bottom-color: var(--popup);
 		}
 	}
 }
--- a/src/client/components/emoji-picker.vue
+++ b/src/client/components/emoji-picker.vue
@ -1,5 +1,5 @@
 <template>
-<div class="omfetrab _popup" :class="['w' + width, 'h' + height, { big }]">
+<div class="omfetrab" :class="['w' + width, 'h' + height, { big }]">
 	<input ref="search" class="search" data-prevent-emoji-insert :class="{ filled: q != null && q != '' }" v-model.trim="q" :placeholder="$ts.search" @paste.stop="paste" @keyup.enter="done()">
 	<div class="emojis" ref="emojis">
 		<section class="result">
@ -346,7 +346,6 @@ export default defineComponent({

 	display: flex;
 	flex-direction: column;
-	contain: content;

 	&.big {
 		--eachSize: 44px;
--- a/src/client/components/follow-button.vue
+++ b/src/client/components/follow-button.vue
@ -28,7 +28,7 @@
 </template>

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

 export default defineComponent({
@ -71,7 +71,7 @@ export default defineComponent({
 	},

 	mounted() {
-		this.connection = os.stream.useChannel('main');
+		this.connection = markRaw(os.stream.useChannel('main'));

 		this.connection.on('follow', this.onFollowChange);
 		this.connection.on('unfollow', this.onFollowChange);
--- a/src/client/components/forgot-password.vue
+++ b/src/client/components/forgot-password.vue
@ -9,14 +9,14 @@

 	<form class="_monolithic_" @submit.prevent="onSubmit" v-if="$instance.enableEmail">
 		<div class="_section">
-			<MkInput v-model:value="username" type="text" pattern="^[a-zA-Z0-9_]+$" spellcheck="false" autofocus required>
-				<span>{{ $ts.username }}</span>
+			<MkInput v-model="username" type="text" pattern="^[a-zA-Z0-9_]+$" spellcheck="false" autofocus required>
+				<template #label>{{ $ts.username }}</template>
 				<template #prefix>@</template>
 			</MkInput>

-			<MkInput v-model:value="email" type="email" spellcheck="false" required>
-				<span>{{ $ts.emailAddress }}</span>
-				<template #desc>{{ $ts._forgotPassword.enterEmail }}</template>
+			<MkInput v-model="email" type="email" spellcheck="false" required>
+				<template #label>{{ $ts.emailAddress }}</template>
+				<template #caption>{{ $ts._forgotPassword.enterEmail }}</template>
 			</MkInput>

 			<MkButton type="submit" :disabled="processing" primary style="margin: 0 auto;">{{ $ts.send }}</MkButton>
--- a/src/client/components/form-dialog.vue
+++ b/src/client/components/form-dialog.vue
@ -34,6 +34,10 @@
 				<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" :value="item.value" :key="item.value">{{ item.label }}</option>
 			</FormSelect>
+			<FormRadios v-else-if="form[item].type === 'radio'" v-model="values[item]">
+				<template #desc><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" :value="item.value" :key="item.value">{{ item.label }}</option>
+			</FormRadios>
 			<FormRange v-else-if="form[item].type === 'range'" v-model:value="values[item]" :min="form[item].mim" :max="form[item].max" :step="form[item].step">
 				<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" #desc>{{ form[item].description }}</template>
@ -56,6 +60,7 @@ import FormSwitch from './form/switch.vue';
 import FormSelect from './form/select.vue';
 import FormRange from './form/range.vue';
 import FormButton from './form/button.vue';
+import FormRadios from './form/radios.vue';

 export default defineComponent({
 	components: {
@ -67,6 +72,7 @@ export default defineComponent({
 		FormSelect,
 		FormRange,
 		FormButton,
+		FormRadios,
 	},

 	props: {
--- a/src/client/components/form/radios.vue
+++ b/src/client/components/form/radios.vue
@ -27,7 +27,10 @@ export default defineComponent({
 	},
 	render() {
 		const label = this.$slots.desc();
-		const options = this.$slots.default();
+		let options = this.$slots.default();
+
+		// なぜかFragmentになることがあるため
+		if (options.length === 1 && options[0].props == null) options = options[0].children;

 		return h('div', {
 			class: 'cnklmpwm _formItem'
@ -37,7 +40,7 @@ export default defineComponent({
 			}, label),
 			...options.map(option => h('button', {
 				class: '_button _formPanel _formClickable',
-				key: option.props.value,
+				key: option.key,
 				onClick: () => this.value = option.props.value,
 			}, [h('span', {
 				class: ['check', { checked: this.value === option.props.value }],
--- a/src/client/components/global/avatar.vue
+++ b/src/client/components/global/avatar.vue
@ -1,9 +1,9 @@
 <template>
-<span class="eiwwqkts _noSelect" :class="{ cat }" :title="acct(user)" v-if="disableLink" v-user-preview="disablePreview ? undefined : user.id" @click="onClick">
+<span class="eiwwqkts _noSelect" :class="{ cat, square: $store.state.squareAvatars }" :title="acct(user)" v-if="disableLink" v-user-preview="disablePreview ? undefined : user.id" @click="onClick">
 	<img class="inner" :src="url" decoding="async"/>
 	<MkUserOnlineIndicator v-if="showIndicator" class="indicator" :user="user"/>
 </span>
-<MkA class="eiwwqkts _noSelect" :class="{ cat }" :to="userPage(user)" :title="acct(user)" :target="target" v-else v-user-preview="disablePreview ? undefined : user.id">
+<MkA class="eiwwqkts _noSelect" :class="{ cat, square: $store.state.squareAvatars }" :to="userPage(user)" :title="acct(user)" :target="target" v-else v-user-preview="disablePreview ? undefined : user.id">
 	<img class="inner" :src="url" decoding="async"/>
 	<MkUserOnlineIndicator v-if="showIndicator" class="indicator" :user="user"/>
 </MkA>
@ -81,28 +81,6 @@ export default defineComponent({
 	border-radius: 100%;
 	line-height: 16px;

-	&.cat {
-		&:before, &:after {
-			background: #df548f;
-			border: solid 4px currentColor;
-			box-sizing: border-box;
-			content: '';
-			display: inline-block;
-			height: 50%;
-			width: 50%;
-		}
-
-		&:before {
-			border-radius: 0 75% 75%;
-			transform: rotate(37.5deg) skew(30deg);
-		}
-
-		&:after {
-			border-radius: 75% 0 75% 75%;
-			transform: rotate(-37.5deg) skew(-30deg);
-		}
-	}
-
 	> .inner {
 		position: absolute;
 		bottom: 0;
@ -125,5 +103,35 @@ export default defineComponent({
 		width: 20%;
 		height: 20%;
 	}
+
+	&.square {
+		border-radius: 20%;
+
+		> .inner {
+			border-radius: 20%;
+		}
+	}
+
+	&.cat {
+		&:before, &:after {
+			background: #df548f;
+			border: solid 4px currentColor;
+			box-sizing: border-box;
+			content: '';
+			display: inline-block;
+			height: 50%;
+			width: 50%;
+		}
+
+		&:before {
+			border-radius: 0 75% 75%;
+			transform: rotate(37.5deg) skew(30deg);
+		}
+
+		&:after {
+			border-radius: 75% 0 75% 75%;
+			transform: rotate(-37.5deg) skew(-30deg);
+		}
+	}
 }
 </style>
--- a/src/client/components/global/misskey-flavored-markdown.vue
+++ b/src/client/components/global/misskey-flavored-markdown.vue
@ -117,6 +117,11 @@ export default defineComponent({
 	75% { transform: scale3d(1.05, 0.95, 1); }
 	to { transform: scale3d(1, 1, 1); }
 }
+
+@keyframes mfm-rainbow {
+	0% { filter: hue-rotate(0deg) contrast(150%) saturate(150%); }
+	100% { filter: hue-rotate(360deg) contrast(150%) saturate(150%); }
+}
 </style>

 <style lang="scss" scoped>
--- a/src/client/components/instance-stats.vue
+++ b/src/client/components/instance-stats.vue
@ -1,7 +1,7 @@
 <template>
 <div class="zbcjwnqg" style="margin-top: -8px;">
 	<div class="selects" style="display: flex;">
-		<MkSelect v-model:value="chartSrc" style="margin: 0; flex: 1;">
+		<MkSelect v-model="chartSrc" style="margin: 0; flex: 1;">
 			<optgroup :label="$ts.federation">
 				<option value="federation-instances">{{ $ts._charts.federationInstancesIncDec }}</option>
 				<option value="federation-instances-total">{{ $ts._charts.federationInstancesTotal }}</option>
@ -24,7 +24,7 @@
 				<option value="drive-total">{{ $ts._charts.storageUsageTotal }}</option>
 			</optgroup>
 		</MkSelect>
-		<MkSelect v-model:value="chartSpan" style="margin: 0;">
+		<MkSelect v-model="chartSpan" style="margin: 0;">
 			<option value="hour">{{ $ts.perHour }}</option>
 			<option value="day">{{ $ts.perDay }}</option>
 		</MkSelect>
--- a/src/client/components/launch-pad.vue
+++ b/src/client/components/launch-pad.vue
@ -36,7 +36,7 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 import MkModal from '@client/components/ui/modal.vue';
-import { sidebarDef } from '@client/sidebar';
+import { menuDef } from '@client/menu';
 import { instanceName } from '@client/config';

 export default defineComponent({
@ -48,7 +48,7 @@ export default defineComponent({

 	data() {
 		return {
-			menuDef: sidebarDef,
+			menuDef: menuDef,
 			items: [],
 			instanceName,
 		};
--- a/src/client/components/media-video.vue
+++ b/src/client/components/media-video.vue
@ -9,7 +9,6 @@
 	<video
 		:poster="video.thumbnailUrl"
 		:title="video.name"
-		crossorigin="anonymous"
 		preload="none"
 		controls
 	>
--- a/src/client/components/mfm.ts
+++ b/src/client/components/mfm.ts
@ -165,6 +165,10 @@ export default defineComponent({
 								class: '_mfm_blur_',
 							}, genEl(token.children));
 						}
+						case 'rainbow': {
+							style = this.$store.state.animatedMfm ? 'animation: mfm-rainbow 1s linear infinite;' : '';
+							break;
+						}
 					}
 					if (style == null) {
 						return h('span', {}, ['[', token.props.name, ...genEl(token.children), ']']);
--- a/src/client/components/modal-page-window.vue
+++ b/src/client/components/modal-page-window.vue
@ -1,13 +1,10 @@
 <template>
 <MkModal ref="modal" @click="$emit('click')" @closed="$emit('closed')">
-	<div class="hrmcaedk _popup _narrow_" :style="{ width: `${width}px`, height: (height ? `min(${height}px, 100%)` : '100%') }">
+	<div class="hrmcaedk _window _narrow_" :style="{ width: `${width}px`, height: (height ? `min(${height}px, 100%)` : '100%') }">
 		<div class="header" @contextmenu="onContextmenu">
-			<button class="_button" @click="back()" v-if="history.length > 0"><i class="fas fa-chevron-left"></i></button>
-			<button class="_button" style="pointer-events: none;" v-else><!-- マージンのバランスを取るためのダミー --></button>
 			<span class="title">
-				<XHeader :info="pageInfo" :with-back="false"/>
+				<XHeader :info="pageInfo" :back-button="history.length > 0" @back="back()" :close-button="true" @close="$refs.modal.close()"/>
 			</span>
-			<button class="_button" @click="$refs.modal.close()"><i class="fas fa-times"></i></button>
 		</div>
 		<div class="body _flat_">
 			<keep-alive>
@ -177,35 +174,19 @@ export default defineComponent({
 		flex-shrink: 0;
 		box-shadow: 0px 1px var(--divider);

-		> button {
-			height: $height;
-			width: $height;
-
-			@media (max-width: 500px) {
-				height: $height-narrow;
-				width: $height-narrow;
-			}
-		}
-
 		> .title {
 			flex: 1;
-			line-height: $height;
-			padding-left: 32px;
+			height: $height;
 			font-weight: bold;
 			white-space: nowrap;
 			overflow: hidden;
 			text-overflow: ellipsis;
-			pointer-events: none;

 			@media (max-width: 500px) {
-				line-height: $height-narrow;
+				height: $height-narrow;
 				padding-left: 16px;
 			}
 		}
-
-		> button + .title {
-			padding-left: 0;
-		}
 	}

 	> .body {
--- a/src/client/components/note-detailed.vue
+++ b/src/client/components/note-detailed.vue
@ -454,7 +454,7 @@ export default defineComponent({
 		renote(viaKeyboard = false) {
 			pleaseLogin();
 			this.blur();
-			os.modalMenu([{
+			os.popupMenu([{
 				text: this.$ts.renote,
 				icon: 'fas fa-retweet',
 				action: () => {
@ -743,14 +743,14 @@ export default defineComponent({
 		},

 		menu(viaKeyboard = false) {
-			os.modalMenu(this.getMenu(), this.$refs.menuButton, {
+			os.popupMenu(this.getMenu(), this.$refs.menuButton, {
 				viaKeyboard
 			}).then(this.focus);
 		},

 		showRenoteMenu(viaKeyboard = false) {
 			if (!this.isMyRenote) return;
-			os.modalMenu([{
+			os.popupMenu([{
 				text: this.$ts.unrenote,
 				icon: 'fas fa-trash-alt',
 				danger: true,
@ -794,7 +794,7 @@ export default defineComponent({

 		async clip() {
 			const clips = await os.api('clips/list');
-			os.modalMenu([{
+			os.popupMenu([{
 				icon: 'fas fa-plus',
 				text: this.$ts.createNew,
 				action: async () => {
--- a/src/client/components/note-header.vue
+++ b/src/client/components/note-header.vue
@ -24,8 +24,8 @@

 <script lang="ts">
 import { defineComponent } from 'vue';
-import notePage from '../filters/note';
-import { userPage } from '../filters/user';
+import notePage from '@client/filters/note';
+import { userPage } from '@client/filters/user';
 import * as os from '@client/os';

 export default defineComponent({
--- a/src/client/components/note.vue
+++ b/src/client/components/note.vue
@ -429,7 +429,7 @@ export default defineComponent({
 		renote(viaKeyboard = false) {
 			pleaseLogin();
 			this.blur();
-			os.modalMenu([{
+			os.popupMenu([{
 				text: this.$ts.renote,
 				icon: 'fas fa-retweet',
 				action: () => {
@ -718,14 +718,14 @@ export default defineComponent({
 		},

 		menu(viaKeyboard = false) {
-			os.modalMenu(this.getMenu(), this.$refs.menuButton, {
+			os.popupMenu(this.getMenu(), this.$refs.menuButton, {
 				viaKeyboard
 			}).then(this.focus);
 		},

 		showRenoteMenu(viaKeyboard = false) {
 			if (!this.isMyRenote) return;
-			os.modalMenu([{
+			os.popupMenu([{
 				text: this.$ts.unrenote,
 				icon: 'fas fa-trash-alt',
 				danger: true,
@ -769,7 +769,7 @@ export default defineComponent({

 		async clip() {
 			const clips = await os.api('clips/list');
-			os.modalMenu([{
+			os.popupMenu([{
 				icon: 'fas fa-plus',
 				text: this.$ts.createNew,
 				action: async () => {
--- a/src/client/components/notification-setting-window.vue
+++ b/src/client/components/notification-setting-window.vue
@ -11,16 +11,16 @@
 	<template #header>{{ $ts.notificationSetting }}</template>
 	<div class="_monolithic_">
 		<div v-if="showGlobalToggle" class="_section">
-			<MkSwitch v-model:value="useGlobalSetting">
+			<MkSwitch v-model="useGlobalSetting">
 				{{ $ts.useGlobalSetting }}
-				<template #desc>{{ $ts.useGlobalSettingDesc }}</template>
+				<template #caption>{{ $ts.useGlobalSettingDesc }}</template>
 			</MkSwitch>
 		</div>
 		<div v-if="!useGlobalSetting" class="_section">
 			<MkInfo>{{ $ts.notificationSettingDesc }}</MkInfo>
 			<MkButton inline @click="disableAll">{{ $ts.disableAll }}</MkButton>
 			<MkButton inline @click="enableAll">{{ $ts.enableAll }}</MkButton>
-			<MkSwitch v-for="type in notificationTypes" :key="type" v-model:value="typesMap[type]">{{ $t(`_notification._types.${type}`) }}</MkSwitch>
+			<MkSwitch v-for="type in notificationTypes" :key="type" v-model="typesMap[type]">{{ $t(`_notification._types.${type}`) }}</MkSwitch>
 		</div>
 	</div>
 </XModalWindow>
--- a/src/client/components/notification.vue
+++ b/src/client/components/notification.vue
@ -58,12 +58,12 @@
 </template>

 <script lang="ts">
-import { defineComponent } from 'vue';
+import { defineComponent, markRaw } from 'vue';
 import { getNoteSummary } from '@/misc/get-note-summary';
 import XReactionIcon from './reaction-icon.vue';
 import MkFollowButton from './follow-button.vue';
-import notePage from '../filters/note';
-import { userPage } from '../filters/user';
+import notePage from '@client/filters/note';
+import { userPage } from '@client/filters/user';
 import { i18n } from '@client/i18n';
 import * as os from '@client/os';

@ -109,7 +109,7 @@ export default defineComponent({

 			this.readObserver.observe(this.$el);

-			this.connection = os.stream.useChannel('main');
+			this.connection = markRaw(os.stream.useChannel('main'));
 			this.connection.on('readAllNotifications', () => this.readObserver.unobserve(this.$el));
 		}
 	},
--- a/src/client/components/notifications.vue
+++ b/src/client/components/notifications.vue
@ -21,7 +21,7 @@
 </template>

 <script lang="ts">
-import { defineComponent, PropType } from 'vue';
+import { defineComponent, PropType, markRaw } from 'vue';
 import paging from '@client/scripts/paging';
 import XNotification from './notification.vue';
 import XList from './date-separated-list.vue';
@ -89,7 +89,7 @@ export default defineComponent({
 	},

 	mounted() {
-		this.connection = os.stream.useChannel('main');
+		this.connection = markRaw(os.stream.useChannel('main'));
 		this.connection.on('notification', this.onNotification);
 	},

--- a/src/client/components/page-preview.vue
+++ b/src/client/components/page-preview.vue
@ -16,7 +16,7 @@

 <script lang="ts">
 import { defineComponent } from 'vue';
-import { userName } from '../filters/user';
+import { userName } from '@client/filters/user';
 import * as os from '@client/os';

 export default defineComponent({
--- a/src/client/components/page-window.vue
+++ b/src/client/components/page-window.vue
@ -3,16 +3,12 @@
 	:initial-width="500"
 	:initial-height="500"
 	:can-resize="true"
-	:close-right="true"
+	:close-button="false"
 	:contextmenu="contextmenu"
 	@closed="$emit('closed')"
 >
 	<template #header>
-		<XHeader :info="pageInfo" :with-back="false"/>
-	</template>
-	<template #buttons>
-		<button class="_button" @click="back()" v-if="history.length > 0"><i class="fas fa-chevron-left"></i></button>
-		<button class="_button" style="pointer-events: none;" v-else><!-- マージンのバランスを取るためのダミー --></button>
+		<XHeader :info="pageInfo" :back-button="history.length > 0" @back="back()" :close-button="true" @close="close()"/>
 	</template>
 	<div class="yrolvcoq _flat_">
 		<component :is="component" v-bind="props" :ref="changePage"/>
@ -139,6 +135,10 @@ export default defineComponent({
 			this.navigate(this.history.pop(), false);
 		},

+		close() {
+			this.$refs.window.close();
+		},
+
 		expand() {
 			this.$router.push(this.path);
 			this.$refs.window.close();
@ -155,6 +155,5 @@ export default defineComponent({
 <style lang="scss" scoped>
 .yrolvcoq {
 	min-height: 100%;
-	background: var(--bg);
 }
 </style>
--- a/src/client/components/page/page.number-input.vue
+++ b/src/client/components/page/page.number-input.vue
@ -1,6 +1,8 @@
 <template>
 <div>
-	<MkInput class="kudkigyw" :value="value" @update:value="updateValue($event)" type="number">{{ hpml.interpolate(block.text) }}</MkInput>
+	<MkInput class="kudkigyw" :model-value="value" @update:modelValue="updateValue($event)" type="number">
+		<template #label>{{ hpml.interpolate(block.text) }}</template>
+	</MkInput>
 </div>
 </template>

--- a/src/client/components/page/page.post.vue
+++ b/src/client/components/page/page.post.vue
@ -1,6 +1,6 @@
 <template>
 <div class="ngbfujlo">
-	<MkTextarea :value="text" readonly style="margin: 0;"></MkTextarea>
+	<MkTextarea :model-value="text" readonly style="margin: 0;"></MkTextarea>
 	<MkButton class="button" primary @click="post()" :disabled="posting || posted">
 		<i v-if="posted" class="fas fa-check"></i>
 		<i v-else class="fas fa-paper-plane"></i>
--- a/src/client/components/page/page.switch.vue
+++ b/src/client/components/page/page.switch.vue
@ -1,6 +1,6 @@
 <template>
 <div class="hkcxmtwj">
-	<MkSwitch :value="value" @update:value="updateValue($event)">{{ hpml.interpolate(block.text) }}</MkSwitch>
+	<MkSwitch :model-value="value" @update:modelValue="updateValue($event)">{{ hpml.interpolate(block.text) }}</MkSwitch>
 </div>
 </template>

--- a/src/client/components/page/page.text-input.vue
+++ b/src/client/components/page/page.text-input.vue
@ -1,6 +1,8 @@
 <template>
 <div>
-	<MkInput class="kudkigyw" :value="value" @update:value="updateValue($event)" type="text">{{ hpml.interpolate(block.text) }}</MkInput>
+	<MkInput class="kudkigyw" :model-value="value" @update:modelValue="updateValue($event)" type="text">
+		<template #label>{{ hpml.interpolate(block.text) }}</template>
+	</MkInput>
 </div>
 </template>

--- a/src/client/components/page/page.textarea-input.vue
+++ b/src/client/components/page/page.textarea-input.vue
@ -1,6 +1,8 @@
 <template>
 <div>
-	<MkTextarea :value="value" @update:value="updateValue($event)">{{ hpml.interpolate(block.text) }}</MkTextarea>
+	<MkTextarea :model-value="value" @update:modelValue="updateValue($event)">
+		<template #label>{{ hpml.interpolate(block.text) }}</template>
+	</MkTextarea>
 </div>
 </template>

--- a/src/client/components/page/page.textarea.vue
+++ b/src/client/components/page/page.textarea.vue
@ -1,5 +1,5 @@
 <template>
-<MkTextarea :value="text" readonly></MkTextarea>
+<MkTextarea :model-value="text" readonly></MkTextarea>
 </template>

 <script lang="ts">
--- a/src/client/components/poll-editor.vue
+++ b/src/client/components/poll-editor.vue
@ -5,8 +5,7 @@
 	</p>
 	<ul ref="choices">
 		<li v-for="(choice, i) in choices" :key="i">
-			<MkInput class="input" :value="choice" @update:value="onInput(i, $event)">
-				<span>{{ $t('_poll.choiceN', { n: i + 1 }) }}</span>
+			<MkInput class="input" :model-value="choice" @update:modelValue="onInput(i, $event)" :placeholder="$t('_poll.choiceN', { n: i + 1 })">
 			</MkInput>
 			<button @click="remove(i)" class="_button">
 				<i class="fas fa-times"></i>
@ -16,27 +15,27 @@
 	<MkButton class="add" v-if="choices.length < 10" @click="add">{{ $ts.add }}</MkButton>
 	<MkButton class="add" v-else disabled>{{ $ts._poll.noMore }}</MkButton>
 	<section>
-		<MkSwitch v-model:value="multiple">{{ $ts._poll.canMultipleVote }}</MkSwitch>
+		<MkSwitch v-model="multiple">{{ $ts._poll.canMultipleVote }}</MkSwitch>
 		<div>
-			<MkSelect v-model:value="expiration">
+			<MkSelect v-model="expiration">
 				<template #label>{{ $ts._poll.expiration }}</template>
 				<option value="infinite">{{ $ts._poll.infinite }}</option>
 				<option value="at">{{ $ts._poll.at }}</option>
 				<option value="after">{{ $ts._poll.after }}</option>
 			</MkSelect>
 			<section v-if="expiration === 'at'">
-				<MkInput v-model:value="atDate" type="date" class="input">
-					<span>{{ $ts._poll.deadlineDate }}</span>
+				<MkInput v-model="atDate" type="date" class="input">
+					<template #label>{{ $ts._poll.deadlineDate }}</template>
 				</MkInput>
-				<MkInput v-model:value="atTime" type="time" class="input">
-					<span>{{ $ts._poll.deadlineTime }}</span>
+				<MkInput v-model="atTime" type="time" class="input">
+					<template #label>{{ $ts._poll.deadlineTime }}</template>
 				</MkInput>
 			</section>
 			<section v-if="expiration === 'after'">
-				<MkInput v-model:value="after" type="number" class="input">
-					<span>{{ $ts._poll.duration }}</span>
+				<MkInput v-model="after" type="number" class="input">
+					<template #label>{{ $ts._poll.duration }}</template>
 				</MkInput>
-				<MkSelect v-model:value="unit">
+				<MkSelect v-model="unit">
 					<option value="second">{{ $ts._time.second }}</option>
 					<option value="minute">{{ $ts._time.minute }}</option>
 					<option value="hour">{{ $ts._time.hour }}</option>
--- a/src/client/components/poll.vue
+++ b/src/client/components/poll.vue
@ -10,7 +10,7 @@
 			</span>
 		</li>
 	</ul>
-	<p>
+	<p v-if="!readOnly">
 		<span>{{ $t('_poll.totalVotes', { n: total }) }}</span>
 		<span> · </span>
 		<a v-if="!closed && !isVoted" @click="toggleShowResult">{{ showResult ? $ts._poll.vote : $ts._poll.showResult }}</a>
@ -31,6 +31,11 @@ export default defineComponent({
 		note: {
 			type: Object,
 			required: true
+		},
+		readOnly: {
+			type: Boolean,
+			required: false,
+			default: false,
 		}
 	},
 	data() {
@ -65,7 +70,7 @@ export default defineComponent({
 		}
 	},
 	created() {
-		this.showResult = this.isVoted;
+		this.showResult = this.readOnly || this.isVoted;

 		if (this.note.poll.expiresAt) {
 			const update = () => {
@ -83,7 +88,7 @@ export default defineComponent({
 			this.showResult = !this.showResult;
 		},
 		vote(id) {
-			if (this.closed || !this.poll.multiple && this.poll.choices.some(c => c.isVoted)) return;
+			if (this.readOnly || this.closed || !this.poll.multiple && this.poll.choices.some(c => c.isVoted)) return;
 			os.api('notes/polls/vote', {
 				noteId: this.note.id,
 				choice: id
--- a/src/client/components/post-form-attaches.vue
+++ b/src/client/components/post-form-attaches.vue
@ -112,7 +112,7 @@ export default defineComponent({

 		showFileMenu(file, ev: MouseEvent) {
 			if (this.menu) return;
-			this.menu = os.modalMenu([{
+			this.menu = os.popupMenu([{
 				text: this.$ts.renameFile,
 				icon: 'fas fa-i-cursor',
 				action: () => { this.rename(file) }
--- a/src/client/components/post-form.vue
+++ b/src/client/components/post-form.vue
@ -37,6 +37,7 @@
 		<MkInfo warn v-if="hasNotSpecifiedMentions" class="hasNotSpecifiedMentions">{{ $ts.notSpecifiedMentionWarning }} - <button class="_textButton" @click="addMissingMention()">{{ $ts.add }}</button></MkInfo>
 		<input v-show="useCw" ref="cw" class="cw" v-model="cw" :placeholder="$ts.annotation" @keydown="onKeydown">
 		<textarea v-model="text" class="text" :class="{ withCw: useCw }" ref="text" :disabled="posting" :placeholder="placeholder" @keydown="onKeydown" @paste="onPaste" @compositionupdate="onCompositionUpdate" @compositionend="onCompositionEnd" />
+		<input v-show="withHashtags" ref="hashtags" class="hashtags" v-model="hashtags" :placeholder="$ts.hashtags" list="hashtags">
 		<XPostFormAttaches class="attaches" :files="files" @updated="updateFiles" @detach="detachFile" @changeSensitive="updateFileSensitive" @changeName="updateFileName"/>
 		<XPollEditor v-if="poll" :poll="poll" @destroyed="poll = null" @updated="onPollUpdate"/>
 		<footer>
@ -44,9 +45,13 @@
 			<button class="_button" @click="togglePoll" :class="{ active: poll }" v-tooltip="$ts.poll"><i class="fas fa-poll-h"></i></button>
 			<button class="_button" @click="useCw = !useCw" :class="{ active: useCw }" v-tooltip="$ts.useCw"><i class="fas fa-eye-slash"></i></button>
 			<button class="_button" @click="insertMention" v-tooltip="$ts.mention"><i class="fas fa-at"></i></button>
+			<button class="_button" @click="withHashtags = !withHashtags" v-tooltip="$ts.hashtags"><i class="fas fa-hashtag"></i></button>
 			<button class="_button" @click="insertEmoji" v-tooltip="$ts.emoji"><i class="fas fa-laugh-squint"></i></button>
 			<button class="_button" @click="showActions" v-tooltip="$ts.plugin" v-if="postFormActions.length > 0"><i class="fas fa-plug"></i></button>
 		</footer>
+		<datalist id="hashtags">
+			<option v-for="hashtag in recentHashtags" :value="hashtag" :key="hashtag"/>
+		</datalist>
 	</div>
 </div>
 </template>
@ -61,16 +66,17 @@ import * as mfm from 'mfm-js';
 import { host, url } from '@client/config';
 import { erase, unique } from '../../prelude/array';
 import { extractMentions } from '@/misc/extract-mentions';
-import getAcct from '@/misc/acct/render';
+import { getAcct } from '@/misc/acct';
 import { formatTimeString } from '@/misc/format-time-string';
 import { Autocomplete } from '@client/scripts/autocomplete';
 import { noteVisibilities } from '../../types';
 import * as os from '@client/os';
 import { selectFile } from '@client/scripts/select-file';
-import { notePostInterruptors, postFormActions } from '@client/store';
+import { defaultStore, notePostInterruptors, postFormActions } from '@client/store';
 import { isMobile } from '@client/scripts/is-mobile';
 import { throttle } from 'throttle-debounce';
 import MkInfo from '@client/components/ui/info.vue';
+import { defaultStore } from '@client/store';

 export default defineComponent({
 	components: {
@ -212,7 +218,10 @@ export default defineComponent({

 		max(): number {
 			return this.$instance ? this.$instance.maxNoteTextLength : 1000;
-		}
+		},
+
+		withHashtags: defaultStore.makeGetterSetter('postFormWithHashtags'),
+		hashtags: defaultStore.makeGetterSetter('postFormHashtags'),
 	},

 	watch: {
@ -303,6 +312,7 @@ export default defineComponent({
 		// TODO: detach when unmount
 		new Autocomplete(this.$refs.text, this, { model: 'text' });
 		new Autocomplete(this.$refs.cw, this, { model: 'cw' });
+		new Autocomplete(this.$refs.hashtags, this, { model: 'hashtags' });

 		this.$nextTick(() => {
 			// 書きかけの投稿を復元
@ -605,6 +615,11 @@ export default defineComponent({
 				viaMobile: isMobile
 			};

+			if (this.withHashtags) {
+				const hashtags = this.hashtags.trim().split(' ').map(x => x.startsWith('#') ? x : '#' + x).join(' ');
+				data.text = data.text ? `${data.text} ${hashtags}` : hashtags;
+			}
+
 			// plugin
 			if (notePostInterruptors.length > 0) {
 				for (const interruptor of notePostInterruptors) {
@ -618,8 +633,8 @@ export default defineComponent({
 				this.$nextTick(() => {
 					this.deleteDraft();
 					this.$emit('posted');
-					if (this.text && this.text != '') {
-						const hashtags = mfm.parse(this.text).filter(x => x.type === 'hashtag').map(x => x.props.hashtag);
+					if (data.text && data.text != '') {
+						const hashtags = mfm.parse(data.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))));
 					}
@ -649,7 +664,7 @@ export default defineComponent({
 		},

 		showActions(ev) {
-			os.modalMenu(postFormActions.map(action => ({
+			os.popupMenu(postFormActions.map(action => ({
 				text: action.title,
 				action: () => {
 					action.handler({
@ -785,6 +800,7 @@ export default defineComponent({
 		}

 		> .cw,
+		> .hashtags,
 		> .text {
 			display: block;
 			box-sizing: border-box;
@ -813,6 +829,13 @@ export default defineComponent({
 			border-bottom: solid 0.5px var(--divider);
 		}

+		> .hashtags {
+			z-index: 1;
+			padding-top: 8px;
+			padding-bottom: 8px;
+			border-top: solid 0.5px var(--divider);
+		}
+
 		> .text {
 			max-width: 100%;
 			min-width: 100%;
@ -872,6 +895,7 @@ export default defineComponent({
 			}

 			> .cw,
+			> .hashtags,
 			> .text {
 				padding: 0 16px;
 			}
--- a/src/client/components/reactions-viewer.reaction.vue
+++ b/src/client/components/reactions-viewer.reaction.vue
@ -170,7 +170,7 @@ export default defineComponent({
 		}

 		> span {
-			color: #fff;
+			color: var(--fgOnAccent);
 		}
 	}

--- a/src/client/components/sample.vue
+++ b/src/client/components/sample.vue
@ -1,10 +1,10 @@
 <template>
 <div class="_card">
 	<div class="_content">
-		<MkInput v-model:value="text">
-			<span>Text</span>
+		<MkInput v-model="text">
+			<template #label>Text</template>
 		</MkInput>
-		<MkSwitch v-model:value="flag">
+		<MkSwitch v-model="flag">
 			<span>Switch is now {{ flag ? 'on' : 'off' }}</span>
 		</MkSwitch>
 		<div style="margin: 32px 0;">
@ -93,7 +93,7 @@ export default defineComponent({
 		},

 		async openMenu(ev) {
-			os.modalMenu([{
+			os.popupMenu([{
 				type: 'label',
 				text: 'Fruits'
 			}, {
--- a/src/client/components/signin.vue
+++ b/src/client/components/signin.vue
@ -3,15 +3,13 @@
 	<div class="auth _section">
 		<div class="avatar" :style="{ backgroundImage: user ? `url('${ user.avatarUrl }')` : null }" v-show="withAvatar"></div>
 		<div class="normal-signin" v-if="!totpLogin">
-			<MkInput v-model:value="username" type="text" pattern="^[a-zA-Z0-9_]+$" spellcheck="false" autofocus required @update:value="onUsernameChange">
-				<span>{{ $ts.username }}</span>
+			<MkInput v-model="username" :placeholder="$ts.username" type="text" pattern="^[a-zA-Z0-9_]+$" spellcheck="false" autofocus required @update:modelValue="onUsernameChange">
 				<template #prefix>@</template>
 				<template #suffix>@{{ host }}</template>
 			</MkInput>
-			<MkInput v-model:value="password" type="password" :with-password-toggle="true" v-if="!user || user && !user.usePasswordLessLogin" required>
-				<span>{{ $ts.password }}</span>
+			<MkInput v-model="password" :placeholder="$ts.password" type="password" :with-password-toggle="true" v-if="!user || user && !user.usePasswordLessLogin" required>
 				<template #prefix><i class="fas fa-lock"></i></template>
-				<template #desc><button class="_textButton" @click="resetPassword">{{ $ts.forgotPassword }}</button></template>
+				<template #caption><button class="_textButton" @click="resetPassword" type="button">{{ $ts.forgotPassword }}</button></template>
 			</MkInput>
 			<MkButton type="submit" primary :disabled="signing" style="margin: 0 auto;">{{ signing ? $ts.loggingIn : $ts.login }}</MkButton>
 		</div>
@ -27,12 +25,12 @@
 			</div>
 			<div class="twofa-group totp-group">
 				<p style="margin-bottom:0;">{{ $ts.twoStepAuthentication }}</p>
-				<MkInput v-model:value="password" type="password" :with-password-toggle="true" v-if="user && user.usePasswordLessLogin" required>
-					<span>{{ $ts.password }}</span>
+				<MkInput v-model="password" type="password" :with-password-toggle="true" v-if="user && user.usePasswordLessLogin" required>
+					<template #label>{{ $ts.password }}</template>
 					<template #prefix><i class="fas fa-lock"></i></template>
 				</MkInput>
-				<MkInput v-model:value="token" type="text" pattern="^[0-9]{6}$" autocomplete="off" spellcheck="false" required>
-					<span>{{ $ts.token }}</span>
+				<MkInput v-model="token" type="text" pattern="^[0-9]{6}$" autocomplete="off" spellcheck="false" required>
+					<template #label>{{ $ts.token }}</template>
 					<template #prefix><i class="fas fa-gavel"></i></template>
 				</MkInput>
 				<MkButton type="submit" :disabled="signing" primary style="margin: 0 auto;">{{ signing ? $ts.loggingIn : $ts.login }}</MkButton>
--- a/src/client/components/signup.vue
+++ b/src/client/components/signup.vue
@ -1,39 +1,39 @@
 <template>
 <form class="mk-signup" @submit.prevent="onSubmit" :autocomplete="Math.random()">
 	<template v-if="meta">
-		<MkInput v-if="meta.disableRegistration" v-model:value="invitationCode" type="text" :autocomplete="Math.random()" spellcheck="false" required>
-			<span>{{ $ts.invitationCode }}</span>
+		<MkInput v-if="meta.disableRegistration" v-model="invitationCode" type="text" :autocomplete="Math.random()" spellcheck="false" required>
+			<template #label>{{ $ts.invitationCode }}</template>
 			<template #prefix><i class="fas fa-key"></i></template>
 		</MkInput>
-		<MkInput v-model:value="username" type="text" pattern="^[a-zA-Z0-9_]{1,20}$" :autocomplete="Math.random()" spellcheck="false" required @update:value="onChangeUsername">
-			<span>{{ $ts.username }}</span>
+		<MkInput v-model="username" type="text" pattern="^[a-zA-Z0-9_]{1,20}$" :autocomplete="Math.random()" spellcheck="false" required @update:modelValue="onChangeUsername">
+			<template #label>{{ $ts.username }}</template>
 			<template #prefix>@</template>
 			<template #suffix>@{{ host }}</template>
-			<template #desc>
+			<template #caption>
 				<span v-if="usernameState == 'wait'" style="color:#999"><i class="fas fa-spinner fa-pulse fa-fw"></i> {{ $ts.checking }}</span>
-				<span v-if="usernameState == 'ok'" style="color:#3CB7B5"><i class="fas fa-check fa-fw"></i> {{ $ts.available }}</span>
-				<span v-if="usernameState == 'unavailable'" style="color:#FF1161"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.unavailable }}</span>
-				<span v-if="usernameState == 'error'" style="color:#FF1161"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.error }}</span>
-				<span v-if="usernameState == 'invalid-format'" style="color:#FF1161"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.usernameInvalidFormat }}</span>
-				<span v-if="usernameState == 'min-range'" style="color:#FF1161"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.tooShort }}</span>
-				<span v-if="usernameState == 'max-range'" style="color:#FF1161"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.tooLong }}</span>
+				<span v-if="usernameState == 'ok'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ $ts.available }}</span>
+				<span v-if="usernameState == 'unavailable'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.unavailable }}</span>
+				<span v-if="usernameState == 'error'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.error }}</span>
+				<span v-if="usernameState == 'invalid-format'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.usernameInvalidFormat }}</span>
+				<span v-if="usernameState == 'min-range'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.tooShort }}</span>
+				<span v-if="usernameState == 'max-range'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.tooLong }}</span>
 			</template>
 		</MkInput>
-		<MkInput v-model:value="password" type="password" :autocomplete="Math.random()" required @update:value="onChangePassword">
-			<span>{{ $ts.password }}</span>
+		<MkInput v-model="password" type="password" :autocomplete="Math.random()" required @update:modelValue="onChangePassword">
+			<template #label>{{ $ts.password }}</template>
 			<template #prefix><i class="fas fa-lock"></i></template>
-			<template #desc>
-				<p v-if="passwordStrength == 'low'" style="color:#FF1161"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.weakPassword }}</p>
-				<p v-if="passwordStrength == 'medium'" style="color:#3CB7B5"><i class="fas fa-check fa-fw"></i> {{ $ts.normalPassword }}</p>
-				<p v-if="passwordStrength == 'high'" style="color:#3CB7B5"><i class="fas fa-check fa-fw"></i> {{ $ts.strongPassword }}</p>
+			<template #caption>
+				<span v-if="passwordStrength == 'low'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.weakPassword }}</span>
+				<span v-if="passwordStrength == 'medium'" style="color: var(--warn)"><i class="fas fa-check fa-fw"></i> {{ $ts.normalPassword }}</span>
+				<span v-if="passwordStrength == 'high'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ $ts.strongPassword }}</span>
 			</template>
 		</MkInput>
-		<MkInput v-model:value="retypedPassword" type="password" :autocomplete="Math.random()" required @update:value="onChangePasswordRetype">
-			<span>{{ $ts.password }} ({{ $ts.retype }})</span>
+		<MkInput v-model="retypedPassword" type="password" :autocomplete="Math.random()" required @update:modelValue="onChangePasswordRetype">
+			<template #label>{{ $ts.password }} ({{ $ts.retype }})</template>
 			<template #prefix><i class="fas fa-lock"></i></template>
-			<template #desc>
-				<p v-if="passwordRetypeState == 'match'" style="color:#3CB7B5"><i class="fas fa-check fa-fw"></i> {{ $ts.passwordMatched }}</p>
-				<p v-if="passwordRetypeState == 'not-match'" style="color:#FF1161"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.passwordNotMatched }}</p>
+			<template #caption>
+				<span v-if="passwordRetypeState == 'match'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ $ts.passwordMatched }}</span>
+				<span v-if="passwordRetypeState == 'not-match'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.passwordNotMatched }}</span>
 			</template>
 		</MkInput>
 		<label v-if="meta.tosUrl" class="tou">
--- a/src/client/components/tab.vue
+++ b/src/client/components/tab.vue
@ -14,7 +14,7 @@ export default defineComponent({
 			class: 'pxhvhrfw',
 		}, options.map(option => withDirectives(h('button', {
 			class: ['_button', { active: this.value === option.props.value }],
-			key: option.props.value,
+			key: option.key,
 			disabled: this.value === option.props.value,
 			onClick: () => {
 				this.$emit('update:value', option.props.value);
--- a/src/client/components/timeline.vue
+++ b/src/client/components/timeline.vue
@ -3,7 +3,7 @@
 </template>

 <script lang="ts">
-import { defineComponent } from 'vue';
+import { defineComponent, markRaw } from 'vue';
 import XNotes from './notes.vue';
 import * as os from '@client/os';
 import * as sound from '@client/scripts/sound';
@ -92,33 +92,33 @@ export default defineComponent({
 			this.query = {
 				antennaId: this.antenna
 			};
-			this.connection = os.stream.useChannel('antenna', {
+			this.connection = markRaw(os.stream.useChannel('antenna', {
 				antennaId: this.antenna
-			});
+			}));
 			this.connection.on('note', prepend);
 		} else if (this.src == 'home') {
 			endpoint = 'notes/timeline';
-			this.connection = os.stream.useChannel('homeTimeline');
+			this.connection = markRaw(os.stream.useChannel('homeTimeline'));
 			this.connection.on('note', prepend);

-			this.connection2 = os.stream.useChannel('main');
+			this.connection2 = markRaw(os.stream.useChannel('main'));
 			this.connection2.on('follow', onChangeFollowing);
 			this.connection2.on('unfollow', onChangeFollowing);
 		} else if (this.src == 'local') {
 			endpoint = 'notes/local-timeline';
-			this.connection = os.stream.useChannel('localTimeline');
+			this.connection = markRaw(os.stream.useChannel('localTimeline'));
 			this.connection.on('note', prepend);
 		} else if (this.src == 'social') {
 			endpoint = 'notes/hybrid-timeline';
-			this.connection = os.stream.useChannel('hybridTimeline');
+			this.connection = markRaw(os.stream.useChannel('hybridTimeline'));
 			this.connection.on('note', prepend);
 		} else if (this.src == 'global') {
 			endpoint = 'notes/global-timeline';
-			this.connection = os.stream.useChannel('globalTimeline');
+			this.connection = markRaw(os.stream.useChannel('globalTimeline'));
 			this.connection.on('note', prepend);
 		} else if (this.src == 'mentions') {
 			endpoint = 'notes/mentions';
-			this.connection = os.stream.useChannel('main');
+			this.connection = markRaw(os.stream.useChannel('main'));
 			this.connection.on('mention', prepend);
 		} else if (this.src == 'directs') {
 			endpoint = 'notes/mentions';
@ -130,16 +130,16 @@ export default defineComponent({
 					prepend(note);
 				}
 			};
-			this.connection = os.stream.useChannel('main');
+			this.connection = markRaw(os.stream.useChannel('main'));
 			this.connection.on('mention', onNote);
 		} else if (this.src == 'list') {
 			endpoint = 'notes/user-list-timeline';
 			this.query = {
 				listId: this.list
 			};
-			this.connection = os.stream.useChannel('userList', {
+			this.connection = markRaw(os.stream.useChannel('userList', {
 				listId: this.list
-			});
+			}));
 			this.connection.on('note', prepend);
 			this.connection.on('userAdded', onUserAdded);
 			this.connection.on('userRemoved', onUserRemoved);
@ -148,9 +148,9 @@ export default defineComponent({
 			this.query = {
 				channelId: this.channel
 			};
-			this.connection = os.stream.useChannel('channel', {
+			this.connection = markRaw(os.stream.useChannel('channel', {
 				channelId: this.channel
-			});
+			}));
 			this.connection.on('note', prepend);
 		}

--- a/src/client/components/token-generate-window.vue
+++ b/src/client/components/token-generate-window.vue
@ -14,13 +14,15 @@
 		<MkInfo warn>{{ information }}</MkInfo>
 	</div>
 	<div class="_section">
-		<MkInput v-model:value="name">{{ $ts.name }}</MkInput>
+		<MkInput v-model="name">
+			<template #label>{{ $ts.name }}</template>
+		</MkInput>
 	</div>
 	<div class="_section">
 		<div style="margin-bottom: 16px;"><b>{{ $ts.permission }}</b></div>
 		<MkButton inline @click="disableAll">{{ $ts.disableAll }}</MkButton>
 		<MkButton inline @click="enableAll">{{ $ts.enableAll }}</MkButton>
-		<MkSwitch v-for="kind in (initialPermissions || kinds)" :key="kind" v-model:value="permissions[kind]">{{ $t(`_permissions.${kind}`) }}</MkSwitch>
+		<MkSwitch v-for="kind in (initialPermissions || kinds)" :key="kind" v-model="permissions[kind]">{{ $t(`_permissions.${kind}`) }}</MkSwitch>
 	</div>
 </XModalWindow>
 </template>
--- a/src/client/components/ui/button.vue
+++ b/src/client/components/ui/button.vue
@ -1,6 +1,6 @@
 <template>
 <component class="bghgjjyj _button"
-	:is="link ? 'a' : 'button'"
+	:is="link ? 'MkA' : 'button'"
 	:class="{ inline, primary, danger, full }"
 	:type="type"
 	@click="$emit('click', $event)"
@ -115,6 +115,7 @@ export default defineComponent({
 	z-index: 1; // 他コンポーネントのbox-shadowに隠されないようにするため
 	display: block;
 	min-width: 100px;
+	width: max-content;
 	padding: 8px 14px;
 	text-align: center;
 	font-weight: normal;
@ -125,6 +126,8 @@ export default defineComponent({
 	background: var(--buttonBg);
 	border-radius: 999px;
 	overflow: hidden;
+	box-sizing: border-box;
+	transition: background 0.1s ease;

 	&:not(:disabled):hover {
 		background: var(--buttonHoverBg);
@ -140,7 +143,7 @@ export default defineComponent({

 	&.primary {
 		font-weight: bold;
-		color: #fff !important;
+		color: var(--fgOnAccent) !important;
 		background: var(--accent);

 		&:not(:disabled):hover {
--- a/src/client/components/ui/container.vue
+++ b/src/client/components/ui/container.vue
@ -191,6 +191,8 @@ export default defineComponent({
 	}

 	> .content {
+		--stickyTop: 0px;
+
 		&.omitted {
 			position: relative;
 			max-height: var(--maxHeight);
--- a/src/client/components/ui/folder.vue
+++ b/src/client/components/ui/folder.vue
@ -99,9 +99,12 @@ export default defineComponent({
 		z-index: 10;
 		position: sticky;
 		top: var(--stickyTop, 0px);
+		background: var(--panel);
+		/* TODO panelの半透明バージョンをプログラマティックに作りたい
 		background: var(--X17);
 		-webkit-backdrop-filter: blur(8px);
 		backdrop-filter: blur(20px);
+		*/

 		> .title {
 			margin: 0;
--- a/src/client/components/ui/input.vue
+++ b/src/client/components/ui/input.vue
@ -1,32 +1,9 @@
 <template>
-<div class="juejbjww" :class="{ focused, filled, inline, disabled }">
-	<div class="icon" ref="icon"><slot name="icon"></slot></div>
-	<div class="input">
-		<span class="label" ref="labelEl"><slot></slot></span>
-		<span class="title" ref="title">
-			<slot name="title"></slot>
-			<span class="warning" v-if="invalid"><i class="fas fa-exclamation-circle"></i>{{ $refs.input.validationMessage }}</span>
-		</span>
+<div class="matxzzsk">
+	<div class="label" @click="focus"><slot name="label"></slot></div>
+	<div class="input" :class="{ inline, disabled, focused }">
 		<div class="prefix" ref="prefixEl"><slot name="prefix"></slot></div>
-		<input v-if="debounce" ref="inputEl"
-			v-debounce="500"
-			:type="type"
-			v-model.lazy="v"
-			:disabled="disabled"
-			:required="required"
-			:readonly="readonly"
-			:placeholder="placeholder"
-			:pattern="pattern"
-			:autocomplete="autocomplete"
-			:spellcheck="spellcheck"
-			:step="step"
-			@focus="focused = true"
-			@blur="focused = false"
-			@keydown="onKeydown($event)"
-			@input="onInput"
-			:list="id"
-		>
-		<input v-else ref="inputEl"
+		<input ref="inputEl"
 			:type="type"
 			v-model="v"
 			:disabled="disabled"
@ -48,23 +25,25 @@
 		</datalist>
 		<div class="suffix" ref="suffixEl"><slot name="suffix"></slot></div>
 	</div>
-	<button class="save _textButton" v-if="save && changed" @click="() => { changed = false; save(); }">{{ $ts.save }}</button>
-	<div class="desc _caption"><slot name="desc"></slot></div>
+	<div class="caption"><slot name="caption"></slot></div>
+
+	<MkButton v-if="manualSave && changed" @click="updated" primary><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
 </div>
 </template>

 <script lang="ts">
 import { defineComponent, onMounted, onUnmounted, nextTick, ref, watch, computed, toRefs } from 'vue';
-import debounce from 'v-debounce';
-import * as os from '@client/os';
+import MkButton from './button.vue';
+import { debounce } from 'throttle-debounce';

 export default defineComponent({
-	directives: {
-		debounce
+	components: {
+		MkButton,
 	},
+
 	props: {
-		value: {
-			required: false
+		modelValue: {
+			required: true
 		},
 		type: {
 			type: String,
@ -104,9 +83,6 @@ export default defineComponent({
 		step: {
 			required: false
 		},
-		debounce: {
-			required: false
-		},
 		datalist: {
 			type: Array,
 			required: false,
@ -116,15 +92,23 @@ export default defineComponent({
 			required: false,
 			default: false
 		},
-		save: {
-			type: Function,
+		debounce: {
+			type: Boolean,
 			required: false,
+			default: false
+		},
+		manualSave: {
+			type: Boolean,
+			required: false,
+			default: false
 		},
 	},
-	emits: ['change', 'keydown', 'enter'],
+
+	emits: ['change', 'keydown', 'enter', 'update:modelValue'],
+
 	setup(props, context) {
-		const { value, type, autofocus } = toRefs(props);
-		const v = ref(value.value);
+		const { modelValue, type, autofocus } = toRefs(props);
+		const v = ref(modelValue.value);
 		const id = Math.random().toString(); // TODO: uuid?
 		const focused = ref(false);
 		const changed = ref(false);
@ -133,7 +117,6 @@ export default defineComponent({
 		const inputEl = ref(null);
 		const prefixEl = ref(null);
 		const suffixEl = ref(null);
-		const labelEl = ref(null);

 		const focus = () => inputEl.value.focus();
 		const onInput = (ev) => {
@ -148,15 +131,28 @@ export default defineComponent({
 			}
 		};

-		watch(value, newValue => {
+		const updated = () => {
+			changed.value = false;
+			if (type?.value === 'number') {
+				context.emit('update:modelValue', parseFloat(v.value));
+			} else {
+				context.emit('update:modelValue', v.value);
+			}
+		};
+
+		const debouncedUpdated = debounce(1000, updated);
+
+		watch(modelValue, newValue => {
 			v.value = newValue;
 		});

 		watch(v, newValue => {
-			if (type?.value === 'number') {
-				context.emit('update:value', parseFloat(newValue));
-			} else {
-				context.emit('update:value', newValue);
+			if (!props.manualSave) {
+				if (props.debounce) {
+					debouncedUpdated();
+				} else {
+					updated();
+				}
 			}

 			invalid.value = inputEl.value.validity.badInput;
@ -172,7 +168,6 @@ export default defineComponent({
 				// 非表示状態だと要素の幅などは0になってしまうので、定期的に計算する
 				const clock = setInterval(() => {
 					if (prefixEl.value) {
-						labelEl.value.style.left = (prefixEl.value.offsetLeft + prefixEl.value.offsetWidth) + 'px';
 						if (prefixEl.value.offsetWidth) {
 							inputEl.value.style.paddingLeft = prefixEl.value.offsetWidth + 'px';
 						}
@ -200,148 +195,78 @@ export default defineComponent({
 			inputEl,
 			prefixEl,
 			suffixEl,
-			labelEl,
 			focus,
 			onInput,
 			onKeydown,
+			updated,
 		};
 	},
 });
 </script>

 <style lang="scss" scoped>
-.juejbjww {
-	position: relative;
-	margin: 32px 0;
+.matxzzsk {
+	margin: 1.5em 0;

-	&:not(.inline):first-child {
-		margin-top: 8px;
+	> .label {
+		font-size: 0.85em;
+		padding: 0 0 8px 12px;
+		user-select: none;
+
+		&:empty {
+			display: none;
+		}
 	}

-	&:not(.inline):last-child {
-		margin-bottom: 8px;
-	}
+	> .caption {
+		font-size: 0.8em;
+		padding: 8px 0 0 12px;
+		color: var(--fgTransparentWeak);

-	> .icon {
-		position: absolute;
-		top: 0;
-		left: 0;
-		width: 24px;
-		text-align: center;
-		line-height: 32px;
-
-		&:not(:empty) + .input {
-			margin-left: 28px;
+		&:empty {
+			display: none;
 		}
 	}

 	> .input {
+		$height: 42px;
 		position: relative;

-		&:before {
-			content: '';
-			display: block;
-			position: absolute;
-			bottom: 0;
-			left: 0;
-			right: 0;
-			height: 1px;
-			background: var(--inputBorder);
-		}
-
-		&:after {
-			content: '';
-			display: block;
-			position: absolute;
-			bottom: 0;
-			left: 0;
-			right: 0;
-			height: 2px;
-			background: var(--accent);
-			opacity: 0;
-			transform: scaleX(0.12);
-			transition: border 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-			will-change: border opacity transform;
-		}
-
-		> .label {
-			position: absolute;
-			z-index: 1;
-			top: 0;
-			left: 0;
-			pointer-events: none;
-			transition: 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
-			transition-duration: 0.3s;
-			font-size: 1em;
-			line-height: 32px;
-			color: var(--inputLabel);
-			pointer-events: none;
-			//will-change transform
-			transform-origin: top left;
-			transform: scale(1);
-		}
-
-		> .title {
-			position: absolute;
-			z-index: 1;
-			top: -17px;
-			left: 0 !important;
-			pointer-events: none;
-			font-size: 1em;
-			line-height: 32px;
-			color: var(--inputLabel);
-			pointer-events: none;
-			//will-change transform
-			transform-origin: top left;
-			transform: scale(.75);
-			white-space: nowrap;
-			width: 133%;
-			overflow: hidden;
-			text-overflow: ellipsis;
-
-			> .warning {
-				margin-left: 0.5em;
-				color: var(--infoWarnFg);
-
-				> svg {
-					margin-right: 0.1em;
-				}
-			}
-		}
-
 		> input {
-			$height: 32px;
+			appearance: none;
+			-webkit-appearance: none;
 			display: block;
 			height: $height;
 			width: 100%;
 			margin: 0;
-			padding: 0;
+			padding: 0 12px;
 			font: inherit;
 			font-weight: normal;
 			font-size: 1em;
-			line-height: $height;
-			color: var(--inputText);
-			background: transparent;
-			border: none;
-			border-radius: 0;
+			color: var(--fg);
+			background: var(--panel);
+			border: solid 1px var(--inputBorder);
+			border-radius: 6px;
 			outline: none;
 			box-shadow: none;
 			box-sizing: border-box;
+			transition: border-color 0.1s ease-out;

-			&[type='file'] {
-				display: none;
+			&:hover {
+				border-color: var(--inputBorderHover);
 			}
 		}

 		> .prefix,
 		> .suffix {
-			display: block;
+			display: flex;
+			align-items: center;
 			position: absolute;
 			z-index: 1;
 			top: 0;
+			padding: 0 12px;
 			font-size: 1em;
-			line-height: 32px;
-			color: var(--inputLabel);
+			height: $height;
 			pointer-events: none;

 			&:empty {
@ -360,67 +285,33 @@ export default defineComponent({

 		> .prefix {
 			left: 0;
-			padding-right: 4px;
+			padding-right: 6px;
 		}

 		> .suffix {
 			right: 0;
-			padding-left: 4px;
-		}
-	}
-
-	> .save {
-		margin: 6px 0 0 0;
-		font-size: 0.8em;
-	}
-
-	> .desc {
-		margin: 6px 0 0 0;
-
-		&:empty {
-			display: none;
+			padding-left: 6px;
 		}

-		* {
+		&.inline {
+			display: inline-block;
 			margin: 0;
 		}
-	}

-	&.focused {
-		> .input {
-			&:after {
-				opacity: 1;
-				transform: scaleX(1);
-			}
-
-			> .label {
-				color: var(--accent);
+		&.focused {
+			> input {
+				border-color: var(--accent);
+				//box-shadow: 0 0 0 4px var(--focus);
 			}
 		}
-	}

-	&.focused,
-	&.filled {
-		> .input {
-			> .label {
-				top: -17px;
-				left: 0 !important;
-				transform: scale(0.75);
+		&.disabled {
+			opacity: 0.7;
+
+			&, * {
+				cursor: not-allowed !important;
 			}
 		}
 	}
-
-	&.inline {
-		display: inline-block;
-		margin: 0;
-	}
-
-	&.disabled {
-		opacity: 0.7;
-
-		&, * {
-			cursor: not-allowed !important;
-		}
-	}
 }
 </style>
--- a/src/client/components/ui/menu.vue
+++ b/src/client/components/ui/menu.vue
@ -1,5 +1,5 @@
 <template>
-<div class="rrevdjwt" :class="{ left: align === 'left' }"
+<div class="rrevdjwt" :class="{ left: align === 'left', pointer: point === 'top' }"
 	ref="items"
 	@contextmenu.self="e => e.preventDefault()"
 	v-hotkey="keymap"
@ -58,7 +58,11 @@ export default defineComponent({
 		align: {
 			type: String,
 			requried: false
-		}
+		},
+		point: {
+			type: String,
+			requried: false
+		},
 	},
 	emits: ['close'],
 	data() {
@ -137,6 +141,22 @@ export default defineComponent({
 .rrevdjwt {
 	padding: 8px 0;

+	&.pointer {
+		&:before {
+			--size: 8px;
+			content: '';
+			display: block;
+			position: absolute;
+			top: calc(0px - (var(--size) * 2));
+			left: 0;
+			right: 0;
+			width: 0;
+			margin: auto;
+			border: solid var(--size) transparent;
+			border-bottom-color: var(--popup);
+		}
+	}
+
 	&.left {
 		> .item {
 			text-align: left;
@ -171,13 +191,13 @@ export default defineComponent({
 		}

 		&:hover {
-			color: #fff;
+			color: var(--fgOnAccent);
 			background: var(--accent);
 			text-decoration: none;
 		}

 		&:active {
-			color: #fff;
+			color: var(--fgOnAccent);
 			background: var(--accentDarken);
 		}

--- a/src/client/components/ui/modal-window.vue
+++ b/src/client/components/ui/modal-window.vue
@ -1,6 +1,6 @@
 <template>
 <MkModal ref="modal" @click="$emit('click')" @closed="$emit('closed')">
-	<div class="ebkgoccj _popup _narrow_" @keydown="onKeydown" :style="{ width: `${width}px`, height: scroll ? (height ? `${height}px` : null) :  (height ? `min(${height}px, 100%)` : '100%') }">
+	<div class="ebkgoccj _window _narrow_" @keydown="onKeydown" :style="{ width: `${width}px`, height: scroll ? (height ? `${height}px` : null) :  (height ? `min(${height}px, 100%)` : '100%') }">
 		<div class="header">
 			<button class="_button" v-if="withOkButton" @click="$emit('close')"><i class="fas fa-times"></i></button>
 			<span class="title">
--- a/src/client/components/ui/popup-menu.vue
+++ b/src/client/components/ui/popup-menu.vue
@ -1,19 +1,20 @@
 <template>
-<MkModal ref="modal" :src="src" @click="$refs.modal.close()" @closed="$emit('closed')">
-	<MkMenu :items="items" :align="align" @close="$refs.modal.close()" class="_popup"/>
-</MkModal>
+<MkPopup ref="popup" :src="src" @closed="$emit('closed')" #default="{point}">
+	<MkMenu :items="items" :align="align" :point="point" @close="$refs.popup.close()" class="_popup _shadow"/>
+</MkPopup>
 </template>

 <script lang="ts">
 import { defineComponent } from 'vue';
-import MkModal from './modal.vue';
+import MkPopup from './popup.vue';
 import MkMenu from './menu.vue';

 export default defineComponent({
 	components: {
-		MkModal,
+		MkPopup,
 		MkMenu,
 	},
+
 	props: {
 		items: {
 			type: Array,
@ -31,17 +32,7 @@ export default defineComponent({
 			required: false
 		},
 	},
-	emits: ['closed'],
-	computed: {
-		keymap(): any {
-			return {
-				'esc': () => this.$refs.modal.close(),
-			};
-		},
-	},
+
+	emits: ['close', 'closed'],
 });
 </script>
-
-<style lang="scss" scoped>
-
-</style>
--- a/src/client/components/ui/popup.vue
+++ b/src/client/components/ui/popup.vue
@ -0,0 +1,216 @@
+<template>
+<transition :name="$store.state.animation ? 'popup-menu' : ''" :duration="$store.state.animation ? 300 : 0" appear @after-leave="onClosed" @enter="$emit('opening')" @after-enter="childRendered">
+	<div v-show="manualShowing != null ? manualShowing : showing" class="ccczpooj" :class="{ front, fixed, top: position === 'top' }" ref="content" :style="{ pointerEvents: (manualShowing != null ? manualShowing : showing) ? 'auto' : 'none', '--transformOrigin': transformOrigin }">
+		<slot :point="point"></slot>
+	</div>
+</transition>
+</template>
+
+<script lang="ts">
+import { defineComponent, PropType } from 'vue';
+
+function getFixedContainer(el: Element | null): Element | null {
+	if (el == null || el.tagName === 'BODY') return null;
+	const position = window.getComputedStyle(el).getPropertyValue('position');
+	if (position === 'fixed') {
+		return el;
+	} else {
+		return getFixedContainer(el.parentElement);
+	}
+}
+
+export default defineComponent({
+	props: {
+		manualShowing: {
+			type: Boolean,
+			required: false,
+			default: null,
+		},
+		srcCenter: {
+			type: Boolean,
+			required: false
+		},
+		src: {
+			type: Object as PropType<HTMLElement>,
+			required: false,
+		},
+		position: {
+			required: false
+		},
+		front: {
+			type: Boolean,
+			required: false,
+			default: false,
+		}
+	},
+
+	emits: ['opening', 'click', 'esc', 'close', 'closed'],
+
+	data() {
+		return {
+			showing: true,
+			fixed: false,
+			transformOrigin: 'center',
+			contentClicking: false,
+			point: null,
+		};
+	},
+
+	mounted() {
+		this.$watch('src', () => {
+			if (this.src) {
+				this.src.style.pointerEvents = 'none';
+			}
+			this.fixed = getFixedContainer(this.src) != null;
+			this.$nextTick(() => {
+				this.align();
+			});
+		}, { immediate: true });
+
+		this.$nextTick(() => {
+			const popover = this.$refs.content as any;
+			new ResizeObserver((entries, observer) => {
+				this.align();
+			}).observe(popover);
+		});
+
+		document.addEventListener('mousedown', this.onDocumentClick, { passive: true });
+	},
+
+	beforeUnmount() {
+		document.removeEventListener('mousedown', this.onDocumentClick);
+	},
+
+	methods: {
+		align() {
+			if (this.src == null) return;
+
+			const popover = this.$refs.content as any;
+
+			if (popover == null) return;
+
+			const rect = this.src.getBoundingClientRect();
+			
+			const width = popover.offsetWidth;
+			const height = popover.offsetHeight;
+
+			let left;
+			let top;
+
+			if (this.srcCenter) {
+				const x = rect.left + (this.fixed ? 0 : window.pageXOffset) + (this.src.offsetWidth / 2);
+				const y = rect.top + (this.fixed ? 0 : window.pageYOffset) + (this.src.offsetHeight / 2);
+				left = (x - (width / 2));
+				top = (y - (height / 2));
+			} else {
+				const x = rect.left + (this.fixed ? 0 : window.pageXOffset) + (this.src.offsetWidth / 2);
+				const y = rect.top + (this.fixed ? 0 : window.pageYOffset) + this.src.offsetHeight;
+				left = (x - (width / 2));
+				top = y;
+			}
+
+			if (this.fixed) {
+				if (left + width > window.innerWidth) {
+					left = window.innerWidth - width;
+				}
+
+				if (top + height > window.innerHeight) {
+					top = window.innerHeight - height;
+				}
+			} else {
+				if (left + width - window.pageXOffset > window.innerWidth) {
+					left = window.innerWidth - width + window.pageXOffset - 1;
+				}
+
+				if (top + height - window.pageYOffset > window.innerHeight) {
+					top = window.innerHeight - height + window.pageYOffset - 1;
+				}
+			}
+
+			if (top < 0) {
+				top = 0;
+			}
+
+			if (left < 0) {
+				left = 0;
+			}
+
+			if (top > rect.top + (this.fixed ? 0 : window.pageYOffset)) {
+				this.point = 'top';
+				this.transformOrigin = 'center top';
+			} else {
+				this.point = null;
+				this.transformOrigin = 'center';
+			}
+
+			popover.style.left = left + 'px';
+			popover.style.top = top + 'px';
+		},
+
+		childRendered() {
+			// モーダルコンテンツにマウスボタンが押され、コンテンツ外でマウスボタンが離されたときにモーダルバックグラウンドクリックと判定させないためにマウスイベントを監視しフラグ管理する
+			const content = this.$refs.content.children[0];
+			content.addEventListener('mousedown', e => {
+				this.contentClicking = true;
+				window.addEventListener('mouseup', e => {
+					// click イベントより先に mouseup イベントが発生するかもしれないのでちょっと待つ
+					setTimeout(() => {
+						this.contentClicking = false;
+					}, 100);
+				}, { passive: true, once: true });
+			}, { passive: true });
+		},
+
+		close() {
+			if (this.src) this.src.style.pointerEvents = 'auto';
+			this.showing = false;
+			this.$emit('close');
+		},
+
+		onClosed() {
+			this.$emit('closed');
+		},
+
+		onDocumentClick(ev) {
+			const flyoutElement = this.$refs.content;
+			let targetElement = ev.target;
+			do {
+				if (targetElement === flyoutElement) {
+					return;
+				}
+				targetElement = targetElement.parentNode;
+			} while (targetElement);
+			this.close();
+		}
+	}
+});
+</script>
+
+<style lang="scss" scoped>
+.popup-menu-enter-active {
+	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;
+}
+.popup-menu-leave-active {
+	transform-origin: var(--transformOrigin);
+	transition: opacity 0.2s cubic-bezier(0.4, 0, 1, 1), transform 0.2s cubic-bezier(0.4, 0, 1, 1) !important;
+}
+.popup-menu-enter-from, .popup-menu-leave-to {
+	pointer-events: none;
+	opacity: 0;
+	transform: scale(0.9);
+}
+
+.ccczpooj {
+	position: absolute;
+	z-index: 10000;
+
+	&.fixed {
+		position: fixed;
+	}
+
+	&.front {
+		z-index: 20000;
+	}
+}
+</style>
--- a/src/client/components/ui/radios.vue
+++ b/src/client/components/ui/radios.vue
@ -23,14 +23,17 @@ export default defineComponent({
 	},
 	render() {
 		const label = this.$slots.desc();
-		const options = this.$slots.default();
+		let options = this.$slots.default();
+
+		// なぜかFragmentになることがあるため
+		if (options.length === 1 && options[0].props == null) options = options[0].children;

 		return h('div', {
 			class: 'novjtcto'
 		}, [
 			h('div', label),
 			...options.map(option => h(MkRadio, {
-				key: option.props.value,
+				key: option.key,
 				value: option.props.value,
 				modelValue: this.value,
 				'onUpdate:modelValue': value => this.value = value,
--- a/src/client/components/ui/select.vue
+++ b/src/client/components/ui/select.vue
@ -1,185 +1,218 @@
 <template>
-<div class="eiipwacr" :class="{ focused, disabled, filled, inline }">
-	<div class="icon" ref="icon"><slot name="icon"></slot></div>
-	<div class="input" @click="focus">
-		<span class="label" ref="label"><slot name="label"></slot></span>
-		<div class="prefix" ref="prefix"><slot name="prefix"></slot></div>
-		<select ref="input"
+<div class="vblkjoeq">
+	<div class="label" @click="focus"><slot name="label"></slot></div>
+	<div class="input" :class="{ inline, disabled, focused }">
+		<div class="prefix" ref="prefixEl"><slot name="prefix"></slot></div>
+		<select ref="inputEl"
 			v-model="v"
-			:required="required"
 			:disabled="disabled"
+			:required="required"
+			:readonly="readonly"
+			:placeholder="placeholder"
 			@focus="focused = true"
 			@blur="focused = false"
+			@input="onInput"
 		>
 			<slot></slot>
 		</select>
-		<div class="suffix">
-			<slot name="suffix">
-				<i class="fas fa-chevron-down"></i>
-			</slot>
-		</div>
+		<div class="suffix" ref="suffixEl"><i class="fas fa-chevron-down"></i></div>
 	</div>
-	<div class="text"><slot name="text"></slot></div>
+	<div class="caption"><slot name="caption"></slot></div>
+
+	<MkButton v-if="manualSave && changed" @click="updated" primary><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
 </div>
 </template>

 <script lang="ts">
-import { defineComponent } from 'vue';
+import { defineComponent, onMounted, onUnmounted, nextTick, ref, watch, computed, toRefs } from 'vue';
+import MkButton from './button.vue';

 export default defineComponent({
+	components: {
+		MkButton,
+	},
+
 	props: {
-		value: {
-			required: false
+		modelValue: {
+			required: true
 		},
 		required: {
 			type: Boolean,
 			required: false
 		},
+		readonly: {
+			type: Boolean,
+			required: false
+		},
 		disabled: {
 			type: Boolean,
 			required: false
 		},
+		placeholder: {
+			type: String,
+			required: false
+		},
+		autofocus: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
 		inline: {
 			type: Boolean,
 			required: false,
 			default: false
 		},
+		manualSave: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
 	},
-	data() {
+
+	emits: ['change', 'update:modelValue'],
+
+	setup(props, context) {
+		const { modelValue, autofocus } = toRefs(props);
+		const v = ref(modelValue.value);
+		const focused = ref(false);
+		const changed = ref(false);
+		const invalid = ref(false);
+		const filled = computed(() => v.value !== '' && v.value != null);
+		const inputEl = ref(null);
+		const prefixEl = ref(null);
+		const suffixEl = ref(null);
+
+		const focus = () => inputEl.value.focus();
+		const onInput = (ev) => {
+			changed.value = true;
+			context.emit('change', ev);
+		};
+
+		const updated = () => {
+			changed.value = false;
+			context.emit('update:modelValue', v.value);
+		};
+
+		watch(modelValue, newValue => {
+			v.value = newValue;
+		});
+
+		watch(v, newValue => {
+			if (!props.manualSave) {
+				updated();
+			}
+
+			invalid.value = inputEl.value.validity.badInput;
+		});
+
+		onMounted(() => {
+			nextTick(() => {
+				if (autofocus.value) {
+					focus();
+				}
+
+				// このコンポーネントが作成された時、非表示状態である場合がある
+				// 非表示状態だと要素の幅などは0になってしまうので、定期的に計算する
+				const clock = setInterval(() => {
+					if (prefixEl.value) {
+						if (prefixEl.value.offsetWidth) {
+							inputEl.value.style.paddingLeft = prefixEl.value.offsetWidth + 'px';
+						}
+					}
+					if (suffixEl.value) {
+						if (suffixEl.value.offsetWidth) {
+							inputEl.value.style.paddingRight = suffixEl.value.offsetWidth + 'px';
+						}
+					}
+				}, 100);
+
+				onUnmounted(() => {
+					clearInterval(clock);
+				});
+			});
+		});
+
 		return {
-			focused: false,
+			v,
+			focused,
+			invalid,
+			changed,
+			filled,
+			inputEl,
+			prefixEl,
+			suffixEl,
+			focus,
+			onInput,
+			updated,
 		};
 	},
-	computed: {
-		v: {
-			get() {
-				return this.value;
-			},
-			set(v) {
-				this.$emit('update:value', v);
-			}
-		},
-		filled(): boolean {
-			return true;
-		}
-	},
-	mounted() {
-		if (this.$refs.prefix) {
-			this.$refs.label.style.left = (this.$refs.prefix.offsetLeft + this.$refs.prefix.offsetWidth) + 'px';
-		}
-	},
-	methods: {
-		focus() {
-			this.$refs.input.focus();
-		}
-	}
 });
 </script>

 <style lang="scss" scoped>
-.eiipwacr {
-	position: relative;
-	margin: 32px 0;
+.vblkjoeq {
+	margin: 1.5em 0;

-	&:not(.inline):first-child {
-		margin-top: 8px;
+	> .label {
+		font-size: 0.85em;
+		padding: 0 0 8px 12px;
+		user-select: none;
+
+		&:empty {
+			display: none;
+		}
 	}

-	&:not(.inline):last-child {
-		margin-bottom: 8px;
-	}
+	> .caption {
+		font-size: 0.8em;
+		padding: 8px 0 0 12px;
+		color: var(--fgTransparentWeak);

-	> .icon {
-		position: absolute;
-		top: 0;
-		left: 0;
-		width: 24px;
-		text-align: center;
-		line-height: 32px;
-
-		&:not(:empty) + .input {
-			margin-left: 28px;
+		&:empty {
+			display: none;
 		}
 	}

 	> .input {
-		display: flex;
+		$height: 42px;
 		position: relative;

-		&:before {
-			content: '';
-			display: block;
-			position: absolute;
-			bottom: 0;
-			left: 0;
-			right: 0;
-			height: 1px;
-			background: var(--inputBorder);
-		}
-
-		&:after {
-			content: '';
-			display: block;
-			position: absolute;
-			bottom: 0;
-			left: 0;
-			right: 0;
-			height: 2px;
-			background: var(--accent);
-			opacity: 0;
-			transform: scaleX(0.12);
-			transition: border 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-			will-change: border opacity transform;
-		}
-
-		> .label {
-			position: absolute;
-			top: 0;
-			left: 0;
-			pointer-events: none;
-			transition: 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
-			transition-duration: 0.3s;
-			font-size: 1em;
-			line-height: 32px;
-			pointer-events: none;
-			//will-change transform
-			transform-origin: top left;
-			transform: scale(1);
-		}
-
 		> select {
+			appearance: none;
+			-webkit-appearance: none;
 			display: block;
-			flex: 1;
+			height: $height;
 			width: 100%;
-			padding: 0;
+			margin: 0;
+			padding: 0 12px;
 			font: inherit;
 			font-weight: normal;
 			font-size: 1em;
-			height: 32px;
-			background: none;
-			border: none;
-			border-radius: 0;
+			color: var(--fg);
+			background: var(--panel);
+			border: solid 1px var(--inputBorder);
+			border-radius: 6px;
 			outline: none;
 			box-shadow: none;
-			appearance: none;
-			-webkit-appearance: none;
-			color: var(--fg);
+			box-sizing: border-box;
+			cursor: pointer;
+			transition: border-color 0.1s ease-out;

-			option,
-			optgroup {
-				color: var(--fg);
-				background: var(--bg);
+			&:hover {
+				border-color: var(--inputBorderHover);
 			}
 		}

 		> .prefix,
 		> .suffix {
-			display: block;
-			align-self: center;
-			justify-self: center;
+			display: flex;
+			align-items: center;
+			position: absolute;
+			z-index: 1;
+			top: 0;
+			padding: 0 12px;
 			font-size: 1em;
-			line-height: 32px;
-			color: var(--inputLabel);
+			height: $height;
 			pointer-events: none;

 			&:empty {
@ -187,53 +220,41 @@ export default defineComponent({
 			}

 			> * {
-				display: block;
+				display: inline-block;
 				min-width: 16px;
+				max-width: 150px;
+				overflow: hidden;
+				white-space: nowrap;
+				text-overflow: ellipsis;
 			}
 		}

 		> .prefix {
-			padding-right: 4px;
+			left: 0;
+			padding-right: 6px;
 		}

 		> .suffix {
-			padding-left: 4px;
-		}
-	}
-
-	> .text {
-		margin: 6px 0;
-		font-size: 0.8em;
-
-		&:empty {
-			display: none;
+			right: 0;
+			padding-left: 6px;
 		}

-		* {
+		&.inline {
+			display: inline-block;
 			margin: 0;
 		}
-	}

-	&.focused {
-		> .input {
-			&:after {
-				opacity: 1;
-				transform: scaleX(1);
-			}
-
-			> .label {
-				color: var(--accent);
+		&.focused {
+			> select {
+				border-color: var(--accent);
 			}
 		}
-	}

-	&.focused,
-	&.filled {
-		> .input {
-			> .label {
-				top: -17px;
-				left: 0 !important;
-				transform: scale(0.75);
+		&.disabled {
+			opacity: 0.7;
+
+			&, * {
+				cursor: not-allowed !important;
 			}
 		}
 	}
--- a/src/client/components/ui/switch.vue
+++ b/src/client/components/ui/switch.vue
@ -18,7 +18,7 @@
 	</span>
 	<span class="label">
 		<span><slot></slot></span>
-		<p><slot name="desc"></slot></p>
+		<p><slot name="caption"></slot></p>
 	</span>
 </div>
 </template>
@ -28,7 +28,7 @@ import { defineComponent } from 'vue';

 export default defineComponent({
 	props: {
-		value: {
+		modelValue: {
 			type: Boolean,
 			default: false
 		},
@ -39,13 +39,13 @@ export default defineComponent({
 	},
 	computed: {
 		checked(): boolean {
-			return this.value;
+			return this.modelValue;
 		}
 	},
 	methods: {
 		toggle() {
 			if (this.disabled) return;
-			this.$emit('update:value', !this.checked);
+			this.$emit('update:modelValue', !this.checked);
 		}
 	}
 });
@ -136,7 +136,7 @@ export default defineComponent({

 		> p {
 			margin: 0;
-			opacity: 0.7;
+			color: var(--fgTransparentWeak);
 			font-size: 90%;
 		}
 	}
--- a/src/client/components/ui/textarea.vue
+++ b/src/client/components/ui/textarea.vue
@ -1,30 +1,45 @@
 <template>
-<div class="adhpbeos" :class="{ focused, filled, tall, pre }">
-	<div class="input">
-		<span class="label" ref="label"><slot></slot></span>
-		<textarea ref="input" :class="{ code, _monospace: code }"
-			:value="value"
+<div class="adhpbeos">
+	<div class="label" @click="focus"><slot name="label"></slot></div>
+	<div class="input" :class="{ disabled, focused, tall, pre }">
+		<textarea ref="inputEl"
+			:class="{ code, _monospace: code }"
+			v-model="v"
+			:disabled="disabled"
 			:required="required"
 			:readonly="readonly"
+			:placeholder="placeholder"
 			:pattern="pattern"
 			:autocomplete="autocomplete"
-			:spellcheck="!code"
-			@input="onInput"
+			:spellcheck="spellcheck"
 			@focus="focused = true"
 			@blur="focused = false"
+			@keydown="onKeydown($event)"
+			@input="onInput"
 		></textarea>
 	</div>
-	<button class="save _textButton" v-if="save && changed" @click="() => { changed = false; save(); }">{{ $ts.save }}</button>
-	<div class="desc _caption"><slot name="desc"></slot></div>
+	<div class="caption"><slot name="caption"></slot></div>
+
+	<MkButton v-if="manualSave && changed" @click="updated" primary><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
 </div>
 </template>

 <script lang="ts">
-import { defineComponent } from 'vue';
+import { defineComponent, onMounted, onUnmounted, nextTick, ref, watch, computed, toRefs } from 'vue';
+import MkButton from './button.vue';
+import { debounce } from 'throttle-debounce';

 export default defineComponent({
+	components: {
+		MkButton,
+	},
+
 	props: {
-		value: {
+		modelValue: {
+			required: true
+		},
+		type: {
+			type: String,
 			required: false
 		},
 		required: {
@ -35,14 +50,29 @@ export default defineComponent({
 			type: Boolean,
 			required: false
 		},
+		disabled: {
+			type: Boolean,
+			required: false
+		},
 		pattern: {
 			type: String,
 			required: false
 		},
-		autocomplete: {
+		placeholder: {
 			type: String,
 			required: false
 		},
+		autofocus: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		autocomplete: {
+			required: false
+		},
+		spellcheck: {
+			required: false
+		},
 		code: {
 			type: Boolean,
 			required: false
@ -57,169 +87,164 @@ export default defineComponent({
 			required: false,
 			default: false
 		},
-		save: {
-			type: Function,
+		debounce: {
+			type: Boolean,
 			required: false,
+			default: false
+		},
+		manualSave: {
+			type: Boolean,
+			required: false,
+			default: false
 		},
 	},
-	data() {
+
+	emits: ['change', 'keydown', 'enter', 'update:modelValue'],
+
+	setup(props, context) {
+		const { modelValue, autofocus } = toRefs(props);
+		const v = ref(modelValue.value);
+		const focused = ref(false);
+		const changed = ref(false);
+		const invalid = ref(false);
+		const filled = computed(() => v.value !== '' && v.value != null);
+		const inputEl = ref(null);
+
+		const focus = () => inputEl.value.focus();
+		const onInput = (ev) => {
+			changed.value = true;
+			context.emit('change', ev);
+		};
+		const onKeydown = (ev: KeyboardEvent) => {
+			context.emit('keydown', ev);
+
+			if (ev.code === 'Enter') {
+				context.emit('enter');
+			}
+		};
+
+		const updated = () => {
+			changed.value = false;
+			context.emit('update:modelValue', v.value);
+		};
+
+		const debouncedUpdated = debounce(1000, updated);
+
+		watch(modelValue, newValue => {
+			v.value = newValue;
+		});
+
+		watch(v, newValue => {
+			if (!props.manualSave) {
+				if (props.debounce) {
+					debouncedUpdated();
+				} else {
+					updated();
+				}
+			}
+
+			invalid.value = inputEl.value.validity.badInput;
+		});
+
+		onMounted(() => {
+			nextTick(() => {
+				if (autofocus.value) {
+					focus();
+				}
+			});
+		});
+
 		return {
-			focused: false,
-			changed: false,
-		}
+			v,
+			focused,
+			invalid,
+			changed,
+			filled,
+			inputEl,
+			focus,
+			onInput,
+			onKeydown,
+			updated,
+		};
 	},
-	computed: {
-		filled(): boolean {
-			return this.value != '' && this.value != null;
-		}
-	},
-	methods: {
-		focus() {
-			this.$refs.input.focus();
-		},
-		onInput(ev) {
-			this.changed = true;
-			this.$emit('update:value', ev.target.value);
-		}
-	}
 });
 </script>

 <style lang="scss" scoped>
 .adhpbeos {
-	margin: 42px 0 32px 0;
-	position: relative;
+	margin: 1.5em 0;

-	&:first-child {
-		margin-top: 16px;
+	> .label {
+		font-size: 0.85em;
+		padding: 0 0 8px 12px;
+		user-select: none;
+
+		&:empty {
+			display: none;
+		}
 	}

-	&:last-child {
-		margin-bottom: 0;
+	> .caption {
+		font-size: 0.8em;
+		padding: 8px 0 0 12px;
+		color: var(--fgTransparentWeak);
+
+		&:empty {
+			display: none;
+		}
 	}

 	> .input {
 		position: relative;
-	
-		&:before {
-			content: '';
-			display: block;
-			position: absolute;
-			top: 0;
-			bottom: 0;
-			left: 0;
-			right: 0;
-			background: none;
-			border: solid 1px var(--inputBorder);
-			border-radius: 3px;
-			pointer-events: none;
-		}
-
-		&:after {
-			content: '';
-			display: block;
-			position: absolute;
-			top: 0;
-			bottom: 0;
-			left: 0;
-			right: 0;
-			background: none;
-			border: solid 2px var(--accent);
-			border-radius: 3px;
-			opacity: 0;
-			transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-			pointer-events: none;
-		}
-
-		> .label {
-			position: absolute;
-			top: 6px;
-			left: 12px;
-			pointer-events: none;
-			transition: 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
-			transition-duration: 0.3s;
-			font-size: 1em;
-			line-height: 32px;
-			pointer-events: none;
-			//will-change transform
-			transform-origin: top left;
-			transform: scale(1);
-		}

 		> textarea {
+			appearance: none;
+			-webkit-appearance: none;
 			display: block;
 			width: 100%;
 			min-width: 100%;
 			max-width: 100%;
 			min-height: 130px;
+			margin: 0;
 			padding: 12px;
-			box-sizing: border-box;
 			font: inherit;
 			font-weight: normal;
 			font-size: 1em;
-			background: transparent;
-			border: none;
-			border-radius: 0;
+			color: var(--fg);
+			background: var(--panel);
+			border: solid 1px var(--inputBorder);
+			border-radius: 6px;
 			outline: none;
 			box-shadow: none;
-			color: var(--fg);
+			box-sizing: border-box;
+			transition: border-color 0.1s ease-out;

-			&.code {
-				tab-size: 2;
+			&:hover {
+				border-color: var(--inputBorderHover);
 			}
 		}
-	}

-	> .save {
-		margin: 6px 0 0 0;
-		font-size: 0.8em;
-	}
-
-	> .desc {
-		margin: 6px 0 0 0;
-
-		&:empty {
-			display: none;
-		}
-
-		* {
-			margin: 0;
-		}
-	}
-
-	&.focused {
-		> .input {
-			&:after {
-				opacity: 1;
-			}
-
-			> .label {
-				color: var(--accent);
+		&.focused {
+			> textarea {
+				border-color: var(--accent);
 			}
 		}
-	}

-	&.focused,
-	&.filled {
-		> .input {
-			> .label {
-				top: -24px;
-				left: 0 !important;
-				transform: scale(0.75);
+		&.disabled {
+			opacity: 0.7;
+
+			&, * {
+				cursor: not-allowed !important;
 			}
 		}
-	}

-	&.tall {
-		> .input {
+		&.tall {
 			> textarea {
 				min-height: 200px;
 			}
 		}
-	}

-	&.pre {
-		> .input {
+		&.pre {
 			> textarea {
 				white-space: pre;
 			}
--- a/src/client/components/ui/window.vue
+++ b/src/client/components/ui/window.vue
@ -1,17 +1,13 @@
 <template>
 <transition :name="$store.state.animation ? 'window' : ''" appear @after-leave="$emit('closed')">
 	<div class="ebkgocck" :class="{ front }" v-if="showing">
-		<div class="body _popup _shadow _narrow_" @mousedown="onBodyMousedown" @keydown="onKeydown">
+		<div class="body _window _shadow _narrow_" @mousedown="onBodyMousedown" @keydown="onKeydown">
 			<div class="header" :class="{ mini }" @contextmenu.prevent.stop="onContextmenu">
-				<slot v-if="closeRight" name="buttons"><button class="_button" style="pointer-events: none;"></button></slot>
-				<button v-else class="_button" @click="close()"><i class="fas fa-times"></i></button>
+				<button v-if="closeButton" class="_button" @click="close()"><i class="fas fa-times"></i></button>

 				<span class="title" @mousedown.prevent="onHeaderMousedown" @touchstart.prevent="onHeaderMousedown">
 					<slot name="header"></slot>
 				</span>
-
-				<button v-if="closeRight" class="_button" @click="close()"><i class="fas fa-times"></i></button>
-				<slot v-else name="buttons"><button class="_button" style="pointer-events: none;"></button></slot>
 			</div>
 			<div class="body" v-if="padding">
 				<div class="_section">
@ -86,10 +82,10 @@ export default defineComponent({
 			required: false,
 			default: false,
 		},
-		closeRight: {
+		closeButton: {
 			type: Boolean,
 			required: false,
-			default: false,
+			default: true,
 		},
 		mini: {
 			type: Boolean,
@ -420,6 +416,7 @@ export default defineComponent({
 			flex-shrink: 0;
 			user-select: none;
 			height: var(--height);
+			border-bottom: solid 1px var(--divider);

 			> ::v-deep(button) {
 				height: var(--height);
--- a/src/client/components/user-info.vue
+++ b/src/client/components/user-info.vue
@ -29,9 +29,9 @@

 <script lang="ts">
 import { defineComponent } from 'vue';
-import parseAcct from '@/misc/acct/parse';
+import { parseAcct } from '@/misc/acct';
 import MkFollowButton from './follow-button.vue';
-import { userPage } from '../filters/user';
+import { userPage } from '@client/filters/user';

 export default defineComponent({
 	components: {
--- a/src/client/components/user-list.vue
+++ b/src/client/components/user-list.vue
@ -18,7 +18,7 @@
 import { defineComponent } from 'vue';
 import paging from '@client/scripts/paging';
 import MkUserInfo from './user-info.vue';
-import { userPage } from '../filters/user';
+import { userPage } from '@client/filters/user';

 export default defineComponent({
 	components: {
--- a/src/client/components/user-preview.vue
+++ b/src/client/components/user-preview.vue
@ -33,9 +33,9 @@

 <script lang="ts">
 import { defineComponent } from 'vue';
-import parseAcct from '@/misc/acct/parse';
+import { parseAcct } from '@/misc/acct';
 import MkFollowButton from './follow-button.vue';
-import { userPage } from '../filters/user';
+import { userPage } from '@client/filters/user';
 import * as os from '@client/os';

 export default defineComponent({
--- a/src/client/components/user-select-dialog.vue
+++ b/src/client/components/user-select-dialog.vue
@ -10,9 +10,15 @@
 	<template #header>{{ $ts.selectUser }}</template>
 	<div class="tbhwbxda _monolithic_">
 		<div class="_section">
-			<div class="inputs">
-				<MkInput v-model:value="username" class="input" @update:value="search" ref="username"><span>{{ $ts.username }}</span><template #prefix>@</template></MkInput>
-				<MkInput v-model:value="host" class="input" @update:value="search"><span>{{ $ts.host }}</span><template #prefix>@</template></MkInput>
+			<div class="_inputSplit _inputNoTopMargin _inputNoBottomMargin">
+				<MkInput v-model="username" class="input" @update:modelValue="search" ref="username">
+					<template #label>{{ $ts.username }}</template>
+					<template #prefix>@</template>
+				</MkInput>
+				<MkInput v-model="host" class="input" @update:modelValue="search">
+					<template #label>{{ $ts.host }}</template>
+					<template #prefix>@</template>
+				</MkInput>
 			</div>
 		</div>
 		<div class="_section result" v-if="username != '' || host != ''" :class="{ hit: users.length > 0 }">
@ -138,14 +144,6 @@ export default defineComponent({
 			padding: 0;
 		}

-		> .inputs {
-			> .input {
-				display: inline-block;
-				width: 50%;
-				margin: 0;
-			}
-		}
-
 		> .users {
 			flex: 1;
 			overflow: auto;
--- a/src/client/components/users-dialog.vue
+++ b/src/client/components/users-dialog.vue
@ -28,7 +28,7 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 import paging from '@client/scripts/paging';
-import { userPage } from '../filters/user';
+import { userPage } from '@client/filters/user';

 export default defineComponent({
 	mixins: [
--- a/src/client/components/widgets.vue
+++ b/src/client/components/widgets.vue
@ -2,7 +2,7 @@
 <div class="vjoppmmu">
 	<template v-if="edit">
 		<header>
-			<MkSelect v-model:value="widgetAdderSelected" style="margin-bottom: var(--margin)">
+			<MkSelect v-model="widgetAdderSelected" style="margin-bottom: var(--margin)">
 				<template #label>{{ $ts.selectWidget }}</template>
 				<option v-for="widget in widgetDefs" :value="widget" :key="widget">{{ $t(`_widgets.${widget}`) }}</option>
 			</MkSelect>
@ -43,6 +43,7 @@ export default defineComponent({

 	props: {
 		widgets: {
+			type: Array,
 			required: true,
 		},
 		edit: {
--- a/src/client/directives/sticky-container.ts
+++ b/src/client/directives/sticky-container.ts
@ -6,7 +6,7 @@ export default {

 		const header = src.children[0];
 		const currentStickyTop = getComputedStyle(src).getPropertyValue('--stickyTop') || '0px';
-		src.style.setProperty('--stickyTop', `${parseInt(currentStickyTop) + header.offsetHeight}px`);
+		src.style.setProperty('--stickyTop', `calc(${currentStickyTop} + ${header.offsetHeight}px)`);
 		header.style.setProperty('--stickyTop', currentStickyTop);
 		header.style.position = 'sticky';
 		header.style.top = 'var(--stickyTop)';
--- a/src/client/filters/user.ts
+++ b/src/client/filters/user.ts
@ -1,4 +1,4 @@
-import getAcct from '@/misc/acct/render';
+import { getAcct } from '@/misc/acct';
 import getUserName from '@/misc/get-user-name';
 import { url } from '@client/config';

--- a/src/client/init.ts
+++ b/src/client/init.ts
@ -6,7 +6,7 @@ import '@client/style.scss';

 import * as Sentry from '@sentry/browser';
 import { Integrations } from '@sentry/tracing';
-import { computed, createApp, watch } from 'vue';
+import { computed, createApp, watch, markRaw } from 'vue';

 import widgets from '@client/widgets';
 import directives from '@client/directives';
@ -34,18 +34,6 @@ console.info(`Misskey v${version}`);
 window.onerror = null;
 window.onunhandledrejection = null;

-// 後方互換性のため。
-// TODO: そのうち消す
-if ((typeof ColdDeviceStorage.get('lightTheme') === 'string') || (typeof ColdDeviceStorage.get('darkTheme') === 'string')) {
-	ColdDeviceStorage.set('lightTheme', require('@client/themes/l-light.json5'));
-	ColdDeviceStorage.set('darkTheme', require('@client/themes/d-dark.json5'));
-}
-const link = document.createElement('link');
-link.rel = 'stylesheet';
-link.href = 'https://use.fontawesome.com/releases/v5.15.3/css/all.css';
-document.head.appendChild(link);
-// TODOここまで
-
 if (_DEV_) {
 	console.warn('Development mode!!!');

@ -294,7 +282,7 @@ if ($i) {
 		}
 	}

-	const main = stream.useChannel('main', null, 'System');
+	const main = markRaw(stream.useChannel('main', null, 'System'));

 	// 自分の情報が更新されたとき
 	main.on('meUpdated', i => {
--- a/src/client/sidebar.ts
+++ b/src/client/sidebar.ts
@ -5,7 +5,7 @@ import { i18n } from '@client/i18n';
 import { $i } from './account';
 import { unisonReload } from '@client/scripts/unison-reload';

-export const sidebarDef = {
+export const menuDef = {
 	notifications: {
 		title: 'notifications',
 		icon: 'fas fa-bell',
@ -113,6 +113,16 @@ export const sidebarDef = {
 		icon: 'fas fa-satellite-dish',
 		to: '/channels',
 	},
+	federation: {
+		title: 'federation',
+		icon: 'fas fa-globe',
+		to: '/federation',
+	},
+	emojis: {
+		title: 'emojis',
+		icon: 'fas fa-laugh',
+		to: '/emojis',
+	},
 	games: {
 		title: 'games',
 		icon: 'fas fa-gamepad',
@ -133,7 +143,7 @@ export const sidebarDef = {
 		title: 'switchUi',
 		icon: 'fas fa-columns',
 		action: (ev) => {
-			os.modalMenu([{
+			os.popupMenu([{
 				text: i18n.locale.default,
 				action: () => {
 					localStorage.setItem('ui', 'default');
--- a/src/client/os.ts
+++ b/src/client/os.ts
@ -368,10 +368,10 @@ export async function openEmojiPicker(src?: HTMLElement, opts, initialTextarea:
 	});
 }

-export function modalMenu(items: any[], src?: HTMLElement, options?: { align?: string; viaKeyboard?: boolean }) {
+export function popupMenu(items: any[], src?: HTMLElement, options?: { align?: string; viaKeyboard?: boolean }) {
 	return new Promise((resolve, reject) => {
 		let dispose;
-		popup(import('@client/components/ui/modal-menu.vue'), {
+		popup(import('@client/components/ui/popup-menu.vue'), {
 			items,
 			src,
 			align: options?.align,
--- a/src/client/pages/_error_.vue
+++ b/src/client/pages/_error_.vue
@ -1,11 +1,11 @@
 <template>
 <transition :name="$store.state.animation ? 'zoom' : ''" appear>
-	<div class="_section">
-		<div class="mjndxjch _content">
-			<img src="https://xn--931a.moe/assets/error.jpg" class="_ghost"/>
-			<p><i class="fas fa-exclamation-triangle"></i> {{ $ts.pageLoadError }}</p>
-			<p>{{ $ts.pageLoadErrorDescription }}</p>
-		</div>
+	<div class="mjndxjch">
+		<img src="https://xn--931a.moe/assets/error.jpg" class="_ghost"/>
+		<p><b><i class="fas fa-exclamation-triangle"></i> {{ $ts.pageLoadError }}</b></p>
+		<p>{{ $ts.pageLoadErrorDescription }}</p>
+		<p><MkA to="/docs/general/troubleshooting" class="_link">{{ $ts.troubleshooting }}</MkA></p>
+		<p v-if="error" class="error">ERROR: {{ error }}</p>
 	</div>
 </transition>
 </template>
@ -19,6 +19,11 @@ export default defineComponent({
 	components: {
 		MkButton,
 	},
+	props: {
+		error: {
+			required: false,
+		}
+	},
 	data() {
 		return {
 			[symbols.PAGE_INFO]: {
@ -32,10 +37,11 @@ export default defineComponent({

 <style lang="scss" scoped>
 .mjndxjch {
+	padding: 32px;
 	text-align: center;

 	> p {
-		margin: 0 0 8px 0;
+		margin: 0 0 12px 0;
 	}

 	> .button {
@ -45,8 +51,12 @@ export default defineComponent({
 	> img {
 		vertical-align: bottom;
 		height: 128px;
-		margin-bottom: 16px;
+		margin-bottom: 24px;
 		border-radius: 16px;
 	}
+
+	> .error {
+		opacity: 0.7;
+	}
 }
 </style>
--- a/src/client/pages/advanced-theme-editor.vue
+++ b/src/client/pages/advanced-theme-editor.vue
@ -272,7 +272,7 @@ export default defineComponent({
 	
 		showTypeMenu(e: MouseEvent) {
 			return new Promise<ThemeValue>((resolve) => {
-				os.modalMenu([{
+				os.popupMenu([{
 					text: this.$ts._theme.defaultValue,
 					action: () => resolve(null),
 				}, {
--- a/src/client/pages/api-console.vue
+++ b/src/client/pages/api-console.vue
@ -1,13 +1,13 @@
 <template>
 <div class="_root">
 	<div class="_block" style="padding: 24px;">
-		<MkInput v-model:value="endpoint" :datalist="endpoints" @update:value="onEndpointChange()">
-			<span>Endpoint</span>
+		<MkInput v-model="endpoint" :datalist="endpoints" @update:modelValue="onEndpointChange()">
+			<template #label>Endpoint</template>
 		</MkInput>
-		<MkTextarea v-model:value="body" code>
-			<span>Params (JSON or JSON5)</span>
+		<MkTextarea v-model="body" code>
+			<template #label>Params (JSON or JSON5)</template>
 		</MkTextarea>
-		<MkSwitch v-model:value="withCredential">
+		<MkSwitch v-model="withCredential">
 			With credential
 		</MkSwitch>
 		<MkButton primary full @click="send" :disabled="sending">
@ -16,8 +16,8 @@
 		</MkButton>
 	</div>
 	<div v-if="res" class="_block" style="padding: 24px;">
-		<MkTextarea v-model:value="res" code readonly tall>
-			<span>Response</span>
+		<MkTextarea v-model="res" code readonly tall>
+			<template #label>Response</template>
 		</MkTextarea>
 	</div>
 </div>
--- a/src/client/pages/channel-editor.vue
+++ b/src/client/pages/channel-editor.vue
@ -2,9 +2,13 @@
 <div>
 	<div class="_section">
 		<div class="_content">
-			<MkInput v-model:value="name">{{ $ts.name }}</MkInput>
+			<MkInput v-model="name">
+				<template #label>{{ $ts.name }}</template>
+			</MkInput>

-			<MkTextarea v-model:value="description">{{ $ts.description }}</MkTextarea>
+			<MkTextarea v-model="description">
+				<template #label>{{ $ts.description }}</template>
+			</MkTextarea>

 			<div class="banner">
 				<MkButton v-if="bannerId == null" @click="setBannerImage"><i class="fas fa-plus"></i> {{ $ts._channel.setBanner }}</MkButton>
--- a/src/client/pages/clip.vue
+++ b/src/client/pages/clip.vue
@ -79,7 +79,7 @@ export default defineComponent({

 	methods: {
 		menu(ev) {
-			os.modalMenu([this.isOwned ? {
+			os.popupMenu([this.isOwned ? {
 				icon: 'fas fa-pencil-alt',
 				text: this.$ts.edit,
 				action: async () => {
--- a/src/client/pages/doc.vue
+++ b/src/client/pages/doc.vue
@ -1,9 +1,11 @@
 <template>
 <div class="qyqbqfal" v-size="{ max: [500] }">
-	<div class="title">{{ title }}</div>
-	<div class="body" v-html="body"></div>
-	<div class="footer">
-		<MkLink :url="`https://github.com/misskey-dev/misskey/blob/master/src/docs/${lang}/${doc}.md`" class="at">{{ $ts.docSource }}</MkLink>
+	<div class="main">
+		<div class="title">{{ title }}</div>
+		<div class="body" v-html="body"></div>
+		<div class="footer">
+			<MkLink :url="`https://github.com/misskey-dev/misskey/blob/master/src/docs/${lang}/${doc}.md`" class="at">{{ $ts.docSource }}</MkLink>
+		</div>
 	</div>
 </div>
 </template>
@ -62,6 +64,10 @@ export default defineComponent({
 		fetchDoc() {
 			fetch(`${url}/doc-assets/${lang}/${this.doc}.md`).then(res => res.text()).then(md => {
 				this.parse(md);
+			}).catch(() => {
+				fetch(`${url}/doc-assets/ja-JP/${this.doc}.md`).then(res => res.text()).then(md => {
+					this.parse(md);
+				});
 			});
 		},

@ -105,102 +111,129 @@ export default defineComponent({
 <style lang="scss" scoped>
 .qyqbqfal {
 	padding: 32px;
-	max-width: 800px;
-	margin: 0 auto;
+	background: var(--panel);
+	line-height: 1.5;

 	&.max-width_500px {
-		padding: 16px;
+		padding: 24px;
 	}

-	> .title {
-		font-size: 1.5em;
-		font-weight: bold;
-		padding: 0 0 0.75em 0;
-		margin: 0 0 1em 0;
-		border-bottom: solid 2px var(--divider);
-	}
+	> .main {
+		max-width: 800px;
+		margin: 0 auto;

-	> .body {
-		> *:first-child {
-			margin-top: 0;
+		> .title {
+			font-size: 1.5em;
+			font-weight: bold;
+			padding: 0 0 0.75em 0;
+			margin: 0 0 1em 0;
+			border-bottom: solid 2px var(--divider);
 		}

-		> *:last-child {
-			margin-bottom: 0;
-		}
+		> .body {
+			> *:first-child {
+				margin-top: 0;
+			}

-		::v-deep(a) {
-			color: var(--link);
-		}
+			> *:last-child {
+				margin-bottom: 0;
+			}

-		::v-deep(blockquote) {
-			display: block;
-			margin: 8px;
-			padding: 6px 0 6px 12px;
-			color: var(--fg);
-			border-left: solid 3px var(--fg);
-			opacity: 0.7;
+			::v-deep(a) {
+				color: var(--link);
+			}

-			p {
-				margin: 0;
+			::v-deep(blockquote) {
+				display: block;
+				margin: 8px;
+				padding: 6px 0 6px 12px;
+				color: var(--fg);
+				border-left: solid 3px var(--fg);
+				opacity: 0.7;
+
+				p {
+					margin: 0;
+				}
+			}
+
+			::v-deep(h2) {
+				font-size: 1.25em;
+				padding: 0 0 0.5em 0;
+				margin: 1.5em 0 1em 0;
+				border-bottom: solid 0.5px var(--divider);
+			}
+
+			::v-deep(h3) {
+				margin: 1.25em 0 0.5em 0;
+			}
+
+			::v-deep(table) {
+				width: 100%;
+				max-width: 100%;
+				overflow: auto;
+			}
+
+			::v-deep(kbd.group) {
+				display: inline-block;
+				padding: 2px;
+				border: 1px solid var(--divider);
+				border-radius: 4px;
+				box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
+			}
+
+			::v-deep(kbd.key) {
+				display: inline-block;
+				padding: 6px 8px;
+				border: solid 0.5px var(--divider);
+				border-radius: 4px;
+				box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
+			}
+
+			::v-deep(code) {
+				display: inline-block;
+				font-family: Fira code, Fira Mono, Consolas, Menlo, Courier, monospace;
+				tab-size: 2;
+				background: #272822;
+				color: #f8f8f2;
+				border-radius: 6px;
+				padding: 4px 6px;
+			}
+
+			::v-deep(pre) {
+				background: #272822;
+				color: #f8f8f2;
+				border-radius: 6px;
+				padding: 12px 16px;
+
+				> code {
+					padding: 0;
+				}
+			}
+
+			::v-deep(.info) {
+				font-size: 90%;
+				background: var(--infoBg);
+				color: var(--infoFg);
+				padding: 1em;
+				margin: 0.75em 0;
+				border-radius: 6px;
+			}
+
+			::v-deep(.warn) {
+				font-size: 90%;
+				background: var(--infoWarnBg);
+				color: var(--infoWarnFg);
+				padding: 1em;
+				margin: 0.75em 0;
+				border-radius: 6px;
 			}
 		}

-		::v-deep(h2) {
-			font-size: 1.25em;
-			padding: 0 0 0.5em 0;
-			margin: 1.5em 0 1em 0;
-			border-bottom: solid 0.5px var(--divider);
+		> .footer {
+			padding: 1.5em 0 0 0;
+			margin: 1.5em 0 0 0;
+			border-top: solid 2px var(--divider);
 		}
-
-		::v-deep(table) {
-			width: 100%;
-			max-width: 100%;
-			overflow: auto;
-		}
-
-		::v-deep(kbd.group) {
-			display: inline-block;
-			padding: 2px;
-			border: 1px solid var(--divider);
-			border-radius: 4px;
-			box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
-		}
-
-		::v-deep(kbd.key) {
-			display: inline-block;
-			padding: 6px 8px;
-			border: solid 0.5px var(--divider);
-			border-radius: 4px;
-			box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
-		}
-
-		::v-deep(code) {
-			display: inline-block;
-			font-family: Fira code, Fira Mono, Consolas, Menlo, Courier, monospace;
-			tab-size: 2;
-			background: #272822;
-			color: #f8f8f2;
-			border-radius: 6px;
-			padding: 4px 6px;
-		}
-
-		::v-deep(pre) {
-			background: #272822;
-			color: #f8f8f2;
-			border-radius: 6px;
-			padding: 12px 16px;
-
-			> code {
-				padding: 0;
-			}
-		}
-	}
-
-	> .footer {
-		padding: 1.5em 0 0 0;
-		margin: 1.5em 0 0 0;
-		border-top: solid 2px var(--divider);
 	}
 }
 </style>
--- a/src/client/pages/docs.vue
+++ b/src/client/pages/docs.vue
@ -1,14 +1,50 @@
 <template>
-<div>
-	<main class="_section">
-		<div class="_content">
-			<ul>
-				<li v-for="doc in docs" :key="doc.path">
-					<MkA :to="`/docs/${doc.path}`">{{ doc.title }}</MkA>
-				</li>
-			</ul>
+<div class="vtaihdtm">
+	<div class="search">
+		<MkInput v-model="query" :debounce="true" type="search" class="_inputNoTopMargin _inputNoBottomMargin" :placeholder="$ts.search">
+			<template #prefix><i class="fas fa-search"></i></template>
+		</MkInput>
+	</div>
+	<MkFolder>
+		<template #header>{{ $ts._docs.generalTopics }}</template>
+		<div class="docs">
+			<MkA v-for="doc in docs.filter(doc => doc.path.startsWith('general/'))" :key="doc.path" :to="`/docs/${doc.path}`" class="doc">
+				<div class="title">{{ doc.title }}</div>
+				<div class="summary">{{ doc.summary }}</div>
+				<div class="read">{{ $ts._docs.continueReading }}</div>
+			</MkA>
 		</div>
-	</main>
+	</MkFolder>
+	<MkFolder>
+		<template #header>{{ $ts._docs.features }}</template>
+		<div class="docs">
+			<MkA v-for="doc in docs.filter(doc => doc.path.startsWith('features/'))" :key="doc.path" :to="`/docs/${doc.path}`" class="doc">
+				<div class="title">{{ doc.title }}</div>
+				<div class="summary">{{ doc.summary }}</div>
+				<div class="read">{{ $ts._docs.continueReading }}</div>
+			</MkA>
+		</div>
+	</MkFolder>
+	<MkFolder>
+		<template #header>{{ $ts._docs.advancedTopics }}</template>
+		<div class="docs">
+			<MkA v-for="doc in docs.filter(doc => doc.path.startsWith('advanced/'))" :key="doc.path" :to="`/docs/${doc.path}`" class="doc">
+				<div class="title">{{ doc.title }}</div>
+				<div class="summary">{{ doc.summary }}</div>
+				<div class="read">{{ $ts._docs.continueReading }}</div>
+			</MkA>
+		</div>
+	</MkFolder>
+	<MkFolder>
+		<template #header>{{ $ts._docs.admin }}</template>
+		<div class="docs">
+			<MkA v-for="doc in docs.filter(doc => doc.path.startsWith('admin/'))" :key="doc.path" :to="`/docs/${doc.path}`" class="doc">
+				<div class="title">{{ doc.title }}</div>
+				<div class="summary">{{ doc.summary }}</div>
+				<div class="read">{{ $ts._docs.continueReading }}</div>
+			</MkA>
+		</div>
+	</MkFolder>
 </div>
 </template>

@ -16,8 +52,15 @@
 import { defineComponent } from 'vue';
 import { url, lang } from '@client/config';
 import * as symbols from '@client/symbols';
+import MkFolder from '@client/components/ui/folder.vue';
+import MkInput from '@client/components/ui/input.vue';

 export default defineComponent({
+	components: {
+		MkFolder,
+		MkInput,
+	},
+
 	data() {
 		return {
 			[symbols.PAGE_INFO]: {
@ -25,13 +68,72 @@ export default defineComponent({
 				icon: 'fas fa-question-circle'
 			},
 			docs: [],
+			query: null,
+		}
+	},
+
+	watch: {
+		query() {
+			fetch(`${url}/docs.json?lang=${lang}&q=${this.query}`).then(res => res.json()).then(docs => {
+				this.docs = docs;
+			});
 		}
 	},

 	created() {
-		fetch(`${url}/docs.json?lang=${lang}`).then(res => res.json()).then(docs => {
-			this.docs = docs;
+		fetch(`${url}/docs.json?lang=ja-JP`).then(res => res.json()).then(jaDocs => {
+			fetch(`${url}/docs.json?lang=${lang}`).then(res => res.json()).then(docs => {
+				this.docs = jaDocs.map(doc => {
+					const exist = docs.find(d => d.path === doc.path);
+					return exist || doc;
+				});
+			});
 		});
 	},
 });
 </script>
+
+<style lang="scss" scoped>
+.vtaihdtm {
+	background: var(--panel);
+
+	> .search {
+		padding: 16px;
+	}
+
+	.docs {
+		display: grid;
+		grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
+		grid-gap: 12px;
+		margin: 0 16px 16px 16px;
+
+		> .doc {
+			display: inline-block;
+			padding: 16px;
+			border: solid 1px var(--divider);
+			border-radius: 6px;
+
+			&:hover {
+				border: solid 1px var(--accent);
+				text-decoration: none;
+			}
+
+			> .title {
+				font-weight: bold;
+			}
+
+			> .summary {
+				white-space: nowrap;
+				overflow: hidden;
+				text-overflow: ellipsis;
+				font-size: 0.9em;
+			}
+
+			> .read {
+				color: var(--link);
+				font-size: 0.9em;
+			}
+		}
+	}
+}
+</style>
--- a/Show More
+++ b/Show More