diff options
| author | Acid Chicken (硫酸鶏) <root@acid-chicken.com> | 2023-06-01 17:19:46 +0900 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2023-06-01 17:19:46 +0900 |
| commit | 337dd97b490fb6bcfc351566a4fd80c35a9cda14 (patch) | |
| tree | 5dc95fc8617a22f713dcf8511398f4100d96c5a9 /packages/frontend/src/components/MkNotification.vue | |
| parent | Update index.d.ts (diff) | |
| download | misskey-337dd97b490fb6bcfc351566a4fd80c35a9cda14.tar.gz misskey-337dd97b490fb6bcfc351566a4fd80c35a9cda14.tar.bz2 misskey-337dd97b490fb6bcfc351566a4fd80c35a9cda14.zip | |
perf(#10923): CSS Modules のクラス名をインライン化する (#10930)
* perf(#10923): unwind css module class name
* perf(#10923): support multiple components
* refactor: clean up
* refactor(#10923): avoid `useCssModule()`
* fix(#10923): allow direct literal class name
* fix(#10923): avoid computed class name
* fix(#10923): allow literal keys
* fix(#10923): typo
* fix(#10923): invalid class names
* chore: test
* revert: test
This reverts commit 5c7ef366eceebe8ba260efa4d5d675f6c1775c45.
* fix(#10923): hidden tale
* perf(#10923): also unwind scoped css contained components
* perf(#10923): `normalizeClass` AOT compilation
---------
Co-authored-by: syuilo <Syuilotan@yahoo.co.jp>
Diffstat (limited to 'packages/frontend/src/components/MkNotification.vue')
| -rw-r--r-- | packages/frontend/src/components/MkNotification.vue | 19 |
1 files changed, 14 insertions, 5 deletions
diff --git a/packages/frontend/src/components/MkNotification.vue b/packages/frontend/src/components/MkNotification.vue index b4c424e79e..d25332b10f 100644 --- a/packages/frontend/src/components/MkNotification.vue +++ b/packages/frontend/src/components/MkNotification.vue @@ -5,7 +5,19 @@ <MkAvatar v-else-if="notification.type === 'achievementEarned'" :class="$style.icon" :user="$i" link preview/> <MkAvatar v-else-if="notification.user" :class="$style.icon" :user="notification.user" link preview/> <img v-else-if="notification.icon" :class="$style.icon" :src="notification.icon" alt=""/> - <div :class="[$style.subIcon, $style['t_' + notification.type]]"> + <div + :class="[$style.subIcon, { + [$style.t_follow]: notification.type === 'follow', + [$style.t_followRequestAccepted]: notification.type === 'followRequestAccepted', + [$style.t_receiveFollowRequest]: notification.type === 'receiveFollowRequest', + [$style.t_renote]: notification.type === 'renote', + [$style.t_reply]: notification.type === 'reply', + [$style.t_mention]: notification.type === 'mention', + [$style.t_quote]: notification.type === 'quote', + [$style.t_pollEnded]: notification.type === 'pollEnded', + [$style.t_achievementEarned]: notification.type === 'achievementEarned', + }]" + > <i v-if="notification.type === 'follow'" class="ti ti-plus"></i> <i v-else-if="notification.type === 'receiveFollowRequest'" class="ti ti-clock"></i> <i v-else-if="notification.type === 'followRequestAccepted'" class="ti ti-check"></i> @@ -34,7 +46,7 @@ <span v-else>{{ notification.header }}</span> <MkTime v-if="withTime" :time="notification.createdAt" :class="$style.headerTime"/> </header> - <div :class="$style.content"> + <div> <MkA v-if="notification.type === 'reaction'" :class="$style.text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)"> <i class="ti ti-quote" :class="$style.quote"></i> <Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="true" :author="notification.note.user"/> @@ -243,9 +255,6 @@ useTooltip(reactionRef, (showing) => { font-size: 0.9em; } -.content { -} - .text { display: flex; width: 100%; |