diff --git a/CHANGELOG.md b/CHANGELOG.md index e8a73843d0..e09e778c87 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -10,6 +10,7 @@ ## 12.x.x (unreleased) ### Improvements +- クライアント: ノートプレビューの精度を改善 ### Bugfixes - クライアント: 一部のコンポーネントが裏に隠れるのを修正 diff --git a/packages/client/src/components/note-preview.vue b/packages/client/src/components/note-preview.vue index 6e3eba9306..bdcb8d5eed 100644 --- a/packages/client/src/components/note-preview.vue +++ b/packages/client/src/components/note-preview.vue @@ -7,7 +7,7 @@ </div> <div class="body"> <div class="content"> - <Mfm :text="text" :author="$i" :i="$i"/> + <Mfm :text="text.trim()" :author="$i" :i="$i"/> </div> </div> </div> @@ -61,6 +61,7 @@ export default defineComponent({ width: 40px; height: 40px; border-radius: 8px; + pointer-events: none; } > .main { @@ -69,6 +70,7 @@ export default defineComponent({ > .header { margin-bottom: 2px; + font-weight: bold; } > .body { diff --git a/packages/client/src/pages/admin/file-dialog.vue b/packages/client/src/pages/admin/file-dialog.vue index f0774b2946..4c33f62399 100644 --- a/packages/client/src/pages/admin/file-dialog.vue +++ b/packages/client/src/pages/admin/file-dialog.vue @@ -40,7 +40,6 @@ import MkButton from '@/components/ui/button.vue'; import MkSwitch from '@/components/form/switch.vue'; import XModalWindow from '@/components/ui/modal-window.vue'; import MkDriveFileThumbnail from '@/components/drive-file-thumbnail.vue'; -import Progress from '@/scripts/loading'; import bytes from '@/filters/bytes'; import * as os from '@/os'; @@ -74,11 +73,9 @@ export default defineComponent({ methods: { async fetch() { - Progress.start(); this.file = await os.api('drive/files/show', { fileId: this.fileId }); this.info = await os.api('admin/drive/show-file', { fileId: this.fileId }); this.isSensitive = this.file.isSensitive; - Progress.done(); }, showUser() { diff --git a/packages/client/src/pages/antenna-timeline.vue b/packages/client/src/pages/antenna-timeline.vue index 2738208c9d..c38f285725 100644 --- a/packages/client/src/pages/antenna-timeline.vue +++ b/packages/client/src/pages/antenna-timeline.vue @@ -7,8 +7,6 @@ src="antenna" :antenna="antennaId" :sound="true" - @before="before()" - @after="after()" @queue="queueUpdated" /> </div> @@ -17,7 +15,6 @@ <script lang="ts"> import { defineComponent, defineAsyncComponent, computed } from 'vue'; -import Progress from '@/scripts/loading'; import XTimeline from '@/components/timeline.vue'; import { scroll } from '@/scripts/scroll'; import * as os from '@/os'; @@ -76,14 +73,6 @@ export default defineComponent({ }, methods: { - before() { - Progress.start(); - }, - - after() { - Progress.done(); - }, - queueUpdated(q) { this.queue = q; }, diff --git a/packages/client/src/pages/favorites.vue b/packages/client/src/pages/favorites.vue index 980d59835f..faab864744 100644 --- a/packages/client/src/pages/favorites.vue +++ b/packages/client/src/pages/favorites.vue @@ -1,14 +1,13 @@ <template> <div class="jmelgwjh"> <div class="body"> - <XNotes class="notes" :pagination="pagination" :detail="true" :prop="'note'" @before="before()" @after="after()"/> + <XNotes class="notes" :pagination="pagination" :detail="true" :prop="'note'"/> </div> </div> </template> <script lang="ts"> import { defineComponent } from 'vue'; -import Progress from '@/scripts/loading'; import XNotes from '@/components/notes.vue'; import * as os from '@/os'; import * as symbols from '@/symbols'; @@ -33,16 +32,6 @@ export default defineComponent({ }, }; }, - - methods: { - before() { - Progress.start(); - }, - - after() { - Progress.done(); - } - } }); </script> diff --git a/packages/client/src/pages/featured.vue b/packages/client/src/pages/featured.vue index f5edf25594..0844c0952f 100644 --- a/packages/client/src/pages/featured.vue +++ b/packages/client/src/pages/featured.vue @@ -1,12 +1,11 @@ <template> <MkSpacer :content-max="800"> - <XNotes ref="notes" :pagination="pagination" @before="before" @after="after"/> + <XNotes ref="notes" :pagination="pagination"/> </MkSpacer> </template> <script lang="ts"> import { defineComponent } from 'vue'; -import Progress from '@/scripts/loading'; import XNotes from '@/components/notes.vue'; import * as symbols from '@/symbols'; @@ -29,15 +28,5 @@ export default defineComponent({ }, }; }, - - methods: { - before() { - Progress.start(); - }, - - after() { - Progress.done(); - } - } }); </script> diff --git a/packages/client/src/pages/mentions.vue b/packages/client/src/pages/mentions.vue index cd9c6a8fdf..691d3bd9aa 100644 --- a/packages/client/src/pages/mentions.vue +++ b/packages/client/src/pages/mentions.vue @@ -1,12 +1,11 @@ <template> <MkSpacer :content-max="800"> - <XNotes :pagination="pagination" @before="before()" @after="after()"/> + <XNotes :pagination="pagination"/> </MkSpacer> </template> <script lang="ts"> import { defineComponent } from 'vue'; -import Progress from '@/scripts/loading'; import XNotes from '@/components/notes.vue'; import * as symbols from '@/symbols'; @@ -28,15 +27,5 @@ export default defineComponent({ }, }; }, - - methods: { - before() { - Progress.start(); - }, - - after() { - Progress.done(); - } - } }); </script> diff --git a/packages/client/src/pages/messages.vue b/packages/client/src/pages/messages.vue index 9fde0bc7d5..9085af9489 100644 --- a/packages/client/src/pages/messages.vue +++ b/packages/client/src/pages/messages.vue @@ -1,12 +1,11 @@ <template> <MkSpacer :content-max="800"> - <XNotes :pagination="pagination" @before="before()" @after="after()"/> + <XNotes :pagination="pagination"/> </MkSpacer> </template> <script lang="ts"> import { defineComponent } from 'vue'; -import Progress from '@/scripts/loading'; import XNotes from '@/components/notes.vue'; import * as symbols from '@/symbols'; @@ -31,15 +30,5 @@ export default defineComponent({ }, }; }, - - methods: { - before() { - Progress.start(); - }, - - after() { - Progress.done(); - } - } }); </script> diff --git a/packages/client/src/pages/my-groups/group.vue b/packages/client/src/pages/my-groups/group.vue index 89c8659b4f..c307f037a6 100644 --- a/packages/client/src/pages/my-groups/group.vue +++ b/packages/client/src/pages/my-groups/group.vue @@ -35,7 +35,6 @@ <script lang="ts"> import { computed, defineComponent } from 'vue'; -import Progress from '@/scripts/loading'; import MkButton from '@/components/ui/button.vue'; import * as os from '@/os'; import * as symbols from '@/symbols'; @@ -73,7 +72,6 @@ export default defineComponent({ methods: { fetch() { - Progress.start(); os.api('users/groups/show', { groupId: this.groupId }).then(group => { @@ -82,7 +80,6 @@ export default defineComponent({ userIds: this.group.userIds }).then(users => { this.users = users; - Progress.done(); }); }); }, diff --git a/packages/client/src/pages/my-lists/list.vue b/packages/client/src/pages/my-lists/list.vue index 0bfa20514b..a25522f933 100644 --- a/packages/client/src/pages/my-lists/list.vue +++ b/packages/client/src/pages/my-lists/list.vue @@ -36,7 +36,6 @@ <script lang="ts"> import { computed, defineComponent } from 'vue'; -import Progress from '@/scripts/loading'; import MkButton from '@/components/ui/button.vue'; import * as os from '@/os'; import * as symbols from '@/symbols'; @@ -68,7 +67,6 @@ export default defineComponent({ methods: { fetch() { - Progress.start(); os.api('users/lists/show', { listId: this.$route.params.list }).then(list => { @@ -77,7 +75,6 @@ export default defineComponent({ userIds: this.list.userIds }).then(users => { this.users = users; - Progress.done(); }); }); }, diff --git a/packages/client/src/pages/notifications.vue b/packages/client/src/pages/notifications.vue index cf8e934b59..695c54a535 100644 --- a/packages/client/src/pages/notifications.vue +++ b/packages/client/src/pages/notifications.vue @@ -1,14 +1,13 @@ <template> <MkSpacer :content-max="800"> <div class="clupoqwt"> - <XNotifications class="notifications" :include-types="includeTypes" :unread-only="tab === 'unread'" @before="before" @after="after"/> + <XNotifications class="notifications" :include-types="includeTypes" :unread-only="tab === 'unread'"/> </div> </MkSpacer> </template> <script lang="ts"> import { computed, defineComponent } from 'vue'; -import Progress from '@/scripts/loading'; import XNotifications from '@/components/notifications.vue'; import * as os from '@/os'; import * as symbols from '@/symbols'; @@ -53,14 +52,6 @@ export default defineComponent({ }, methods: { - before() { - Progress.start(); - }, - - after() { - Progress.done(); - }, - setFilter(ev) { const typeItems = notificationTypes.map(t => ({ text: this.$t(`_notification._types.${t}`), diff --git a/packages/client/src/pages/search.vue b/packages/client/src/pages/search.vue index c7da3fe1c1..85d19bb255 100644 --- a/packages/client/src/pages/search.vue +++ b/packages/client/src/pages/search.vue @@ -1,14 +1,13 @@ <template> <div class="_section"> <div class="_content"> - <XNotes ref="notes" :pagination="pagination" @before="before" @after="after"/> + <XNotes ref="notes" :pagination="pagination"/> </div> </div> </template> <script lang="ts"> import { computed, defineComponent } from 'vue'; -import Progress from '@/scripts/loading'; import XNotes from '@/components/notes.vue'; import * as symbols from '@/symbols'; @@ -39,15 +38,5 @@ export default defineComponent({ (this.$refs.notes as any).reload(); } }, - - methods: { - before() { - Progress.start(); - }, - - after() { - Progress.done(); - } - } }); </script> diff --git a/packages/client/src/pages/tag.vue b/packages/client/src/pages/tag.vue index f4709659e3..a0c8367849 100644 --- a/packages/client/src/pages/tag.vue +++ b/packages/client/src/pages/tag.vue @@ -1,12 +1,11 @@ <template> <div class="_section"> - <XNotes ref="notes" class="_content" :pagination="pagination" @before="before" @after="after"/> + <XNotes ref="notes" class="_content" :pagination="pagination"/> </div> </template> <script lang="ts"> import { defineComponent } from 'vue'; -import Progress from '@/scripts/loading'; import XNotes from '@/components/notes.vue'; import * as symbols from '@/symbols'; @@ -43,15 +42,5 @@ export default defineComponent({ (this.$refs.notes as any).reload(); } }, - - methods: { - before() { - Progress.start(); - }, - - after() { - Progress.done(); - } - } }); </script> diff --git a/packages/client/src/pages/timeline.vue b/packages/client/src/pages/timeline.vue index 494932c602..216b3c34ea 100644 --- a/packages/client/src/pages/timeline.vue +++ b/packages/client/src/pages/timeline.vue @@ -10,8 +10,6 @@ class="tl" :src="src" :sound="true" - @before="before()" - @after="after()" @queue="queueUpdated" /> </div> @@ -21,7 +19,6 @@ <script lang="ts"> import { defineComponent, defineAsyncComponent, computed } from 'vue'; -import Progress from '@/scripts/loading'; import XTimeline from '@/components/timeline.vue'; import XPostForm from '@/components/post-form.vue'; import { scroll } from '@/scripts/scroll'; @@ -118,14 +115,6 @@ export default defineComponent({ }, methods: { - before() { - Progress.start(); - }, - - after() { - Progress.done(); - }, - queueUpdated(q) { this.queue = q; }, diff --git a/packages/client/src/pages/user-list-timeline.vue b/packages/client/src/pages/user-list-timeline.vue index c2970c8d06..4476567cfb 100644 --- a/packages/client/src/pages/user-list-timeline.vue +++ b/packages/client/src/pages/user-list-timeline.vue @@ -7,8 +7,6 @@ src="list" :list="listId" :sound="true" - @before="before()" - @after="after()" @queue="queueUpdated" /> </div> @@ -17,7 +15,6 @@ <script lang="ts"> import { defineComponent, defineAsyncComponent, computed } from 'vue'; -import Progress from '@/scripts/loading'; import XTimeline from '@/components/timeline.vue'; import { scroll } from '@/scripts/scroll'; import * as os from '@/os'; @@ -76,14 +73,6 @@ export default defineComponent({ }, methods: { - before() { - Progress.start(); - }, - - after() { - Progress.done(); - }, - queueUpdated(q) { this.queue = q; }, diff --git a/packages/client/src/pages/user/index.vue b/packages/client/src/pages/user/index.vue index 5a529ba8cf..0b96368587 100644 --- a/packages/client/src/pages/user/index.vue +++ b/packages/client/src/pages/user/index.vue @@ -205,7 +205,6 @@ import MkFolder from '@/components/ui/folder.vue'; import MkRemoteCaution from '@/components/remote-caution.vue'; import MkTab from '@/components/tab.vue'; import MkInfo from '@/components/ui/info.vue'; -import Progress from '@/scripts/loading'; import * as Acct from 'misskey-js/built/acct'; import { getScrollPosition } from '@/scripts/scroll'; import { getUserMenu } from '@/scripts/get-user-menu'; @@ -328,13 +327,10 @@ export default defineComponent({ fetch() { if (this.acct == null) return; this.user = null; - Progress.start(); os.api('users/show', Acct.parse(this.acct)).then(user => { this.user = user; }).catch(e => { this.error = e; - }).finally(() => { - Progress.done(); }); }, diff --git a/packages/client/src/scripts/loading.ts b/packages/client/src/scripts/loading.ts deleted file mode 100644 index 4b0a560e34..0000000000 --- a/packages/client/src/scripts/loading.ts +++ /dev/null @@ -1,11 +0,0 @@ -export default { - start: () => { - // TODO - }, - done: () => { - // TODO - }, - set: val => { - // TODO - } -}; diff --git a/packages/client/src/ui/_common_/sidebar.vue b/packages/client/src/ui/_common_/sidebar.vue index e363c3abd9..bf560e8dd6 100644 --- a/packages/client/src/ui/_common_/sidebar.vue +++ b/packages/client/src/ui/_common_/sidebar.vue @@ -170,6 +170,8 @@ export default defineComponent({ } &:hover, &.active { + color: var(--accent); + &:before { content: ""; display: block; @@ -283,8 +285,10 @@ export default defineComponent({ } &:before { - width: 100%; - border-radius: 0; + width: auto; + height: 100%; + aspect-ratio: 1/1; + border-radius: 8px; } &.post { @@ -296,8 +300,9 @@ export default defineComponent({ } &.post:before { - width: calc(100% - 32px); - height: calc(100% - 32px); + width: calc(100% - 28px); + height: auto; + aspect-ratio: 1/1; border-radius: 100%; } } diff --git a/packages/client/src/ui/deck/direct-column.vue b/packages/client/src/ui/deck/direct-column.vue index a11b2e82ed..6ef733dfd0 100644 --- a/packages/client/src/ui/deck/direct-column.vue +++ b/packages/client/src/ui/deck/direct-column.vue @@ -8,7 +8,6 @@ <script lang="ts"> import { defineComponent } from 'vue'; -import Progress from '@/scripts/loading'; import XColumn from './column.vue'; import XNotes from '@/components/notes.vue'; import * as os from '@/os'; @@ -41,15 +40,5 @@ export default defineComponent({ }, } }, - - methods: { - before() { - Progress.start(); - }, - - after() { - Progress.done(); - } - } }); </script> diff --git a/packages/client/src/ui/deck/mentions-column.vue b/packages/client/src/ui/deck/mentions-column.vue index 7dd06989cb..4b8dc0c4ee 100644 --- a/packages/client/src/ui/deck/mentions-column.vue +++ b/packages/client/src/ui/deck/mentions-column.vue @@ -8,7 +8,6 @@ <script lang="ts"> import { defineComponent } from 'vue'; -import Progress from '@/scripts/loading'; import XColumn from './column.vue'; import XNotes from '@/components/notes.vue'; import * as os from '@/os'; @@ -38,15 +37,5 @@ export default defineComponent({ }, } }, - - methods: { - before() { - Progress.start(); - }, - - after() { - Progress.done(); - } - } }); </script>