diff --git a/packages/frontend/src/components/MkContainer.vue b/packages/frontend/src/components/MkContainer.vue index 95188c335e..c47571885a 100644 --- a/packages/frontend/src/components/MkContainer.vue +++ b/packages/frontend/src/components/MkContainer.vue @@ -13,7 +13,7 @@ SPDX-License-Identifier: AGPL-3.0-only <div :class="$style.headerSub"> <slot name="func" :buttonStyleClass="$style.headerButton"></slot> <button v-if="foldable" :class="$style.headerButton" class="_button" @click="() => showBody = !showBody"> - <template v-if="showBody"><i class="ph-caret-up ph-bold ph-lg"></i></template> + <template v-if="showBody"><i class="ti ti-chevron-up"></i></template> <template v-else><i class="ph-caret-down ph-bold ph-lg"></i></template> </button> </div> diff --git a/packages/frontend/src/components/MkDateSeparatedList.vue b/packages/frontend/src/components/MkDateSeparatedList.vue index 475fbcb397..e6f044dd72 100644 --- a/packages/frontend/src/components/MkDateSeparatedList.vue +++ b/packages/frontend/src/components/MkDateSeparatedList.vue @@ -76,7 +76,7 @@ export default defineComponent({ class: $style['date-1'], }, [ h('i', { - class: `ph-caret-up ph-bold ph-lg ${$style['date-1-icon']}`, + class: `ti ti-chevron-up ${$style['date-1-icon']}`, }), getDateText(item.createdAt), ]), diff --git a/packages/frontend/src/components/MkEmojiPicker.section.vue b/packages/frontend/src/components/MkEmojiPicker.section.vue index a5839586b6..66b44b7f4f 100644 --- a/packages/frontend/src/components/MkEmojiPicker.section.vue +++ b/packages/frontend/src/components/MkEmojiPicker.section.vue @@ -8,7 +8,7 @@ SPDX-License-Identifier: AGPL-3.0-only <!-- フォルダの中にはカスタム絵文字だけ(Unicode絵文字もこっち) --> <section v-if="!hasChildSection" v-panel style="border-radius: var(--radius-sm); border-bottom: 0.5px solid var(--divider);"> <header class="_acrylic" @click="shown = !shown"> - <i class="toggle ti-fw" :class="shown ? 'ph-caret-down ph-bold ph-lg' : 'ph-caret-up ph-bold ph-lg'"></i> <slot></slot> (<i class="ph-bold ph-lg"></i>:{{ emojis.length }}) + <i class="toggle ti-fw" :class="shown ? 'ph-caret-down ph-bold ph-lg' : 'ti ti-chevron-up'"></i> <slot></slot> (<i class="ph-bold ph-lg"></i>:{{ emojis.length }}) </header> <div v-if="shown" class="body"> <button @@ -28,7 +28,7 @@ SPDX-License-Identifier: AGPL-3.0-only <!-- フォルダの中にはカスタム絵文字やフォルダがある --> <section v-else v-panel style="border-radius: var(--radius-sm); border-bottom: 0.5px solid var(--divider);"> <header class="_acrylic" @click="shown = !shown"> - <i class="toggle ti-fw" :class="shown ? 'ph-caret-down ph-bold ph-lg' : 'ph-caret-up ph-bold ph-lg'"></i> <slot></slot> (<i class="ph-folder ph-bold ph-lg"></i>:{{ customEmojiTree?.length }} <i class="ph-smiley-sticker ph-bold ph-lg ti-fw"></i>:{{ emojis.length }}) + <i class="toggle ti-fw" :class="shown ? 'ph-caret-down ph-bold ph-lg' : 'ti ti-chevron-up'"></i> <slot></slot> (<i class="ph-folder ph-bold ph-lg"></i>:{{ customEmojiTree?.length }} <i class="ph-smiley-sticker ph-bold ph-lg ti-fw"></i>:{{ emojis.length }}) </header> <div v-if="shown" style="padding-left: 9px;"> <MkEmojiPickerSection diff --git a/packages/frontend/src/components/MkFoldableSection.vue b/packages/frontend/src/components/MkFoldableSection.vue index 51bcafd1c2..7d97fa1fa8 100644 --- a/packages/frontend/src/components/MkFoldableSection.vue +++ b/packages/frontend/src/components/MkFoldableSection.vue @@ -9,7 +9,7 @@ SPDX-License-Identifier: AGPL-3.0-only <div :class="$style.title"><div><slot name="header"></slot></div></div> <div :class="$style.divider"></div> <button class="_button" :class="$style.button"> - <template v-if="showBody"><i class="ph-caret-up ph-bold ph-lg"></i></template> + <template v-if="showBody"><i class="ti ti-chevron-up"></i></template> <template v-else><i class="ph-caret-down ph-bold ph-lg"></i></template> </button> </header> diff --git a/packages/frontend/src/components/MkFolder.vue b/packages/frontend/src/components/MkFolder.vue index 64d390f52b..00d986b788 100644 --- a/packages/frontend/src/components/MkFolder.vue +++ b/packages/frontend/src/components/MkFolder.vue @@ -19,7 +19,7 @@ SPDX-License-Identifier: AGPL-3.0-only </div> <div :class="$style.headerRight"> <span :class="$style.headerRightText"><slot name="suffix"></slot></span> - <i v-if="opened" class="ph-caret-up ph-bold ph-lg icon"></i> + <i v-if="opened" class="ti ti-chevron-up icon"></i> <i v-else class="ph-caret-down ph-bold ph-lg icon"></i> </div> </div> diff --git a/packages/frontend/src/pages/note.vue b/packages/frontend/src/pages/note.vue index 418b33754b..a5a0ab270e 100644 --- a/packages/frontend/src/pages/note.vue +++ b/packages/frontend/src/pages/note.vue @@ -16,8 +16,8 @@ SPDX-License-Identifier: AGPL-3.0-only <div class="_margin"> <div v-if="!showNext" class="_buttons" :class="$style.loadNext"> - <MkButton v-if="note.channelId" rounded :class="$style.loadButton" @click="showNext = 'channel'"><i class="ph-caret-up ph-bold ph-lg"></i> <i class="ph-television-simple ph-bold ph-lg"></i></MkButton> - <MkButton rounded :class="$style.loadButton" @click="showNext = 'user'"><i class="ph-caret-up ph-bold ph-lg"></i> <i class="ph-user ph-bold ph-lg"></i></MkButton> + <MkButton v-if="note.channelId" rounded :class="$style.loadButton" @click="showNext = 'channel'"><i class="ti ti-chevron-up"></i> <i class="ph-television-simple ph-bold ph-lg"></i></MkButton> + <MkButton rounded :class="$style.loadButton" @click="showNext = 'user'"><i class="ti ti-chevron-up"></i> <i class="ph-user ph-bold ph-lg"></i></MkButton> </div> <div v-if="defaultStore.state.noteDesign === 'misskey'" class="_margin _gaps_s"> <MkRemoteCaution v-if="note.user.host != null" :href="note.url ?? note.uri"/> diff --git a/packages/frontend/src/pages/page-editor/page-editor.container.vue b/packages/frontend/src/pages/page-editor/page-editor.container.vue index 7ef66c1c0c..9eae75e015 100644 --- a/packages/frontend/src/pages/page-editor/page-editor.container.vue +++ b/packages/frontend/src/pages/page-editor/page-editor.container.vue @@ -16,7 +16,7 @@ SPDX-License-Identifier: AGPL-3.0-only <i class="ph-list ph-bold ph-lg-2"></i> </button> <button class="_button" @click="toggleContent(!showBody)"> - <template v-if="showBody"><i class="ph-caret-up ph-bold ph-lg"></i></template> + <template v-if="showBody"><i class="ti ti-chevron-up"></i></template> <template v-else><i class="ph-caret-down ph-bold ph-lg"></i></template> </button> </div> diff --git a/packages/frontend/src/ui/deck/column.vue b/packages/frontend/src/ui/deck/column.vue index 18f79945d2..a063acccb8 100644 --- a/packages/frontend/src/ui/deck/column.vue +++ b/packages/frontend/src/ui/deck/column.vue @@ -26,7 +26,7 @@ SPDX-License-Identifier: AGPL-3.0-only </svg> <div :class="$style.color"></div> <button v-if="isStacked && !isMainColumn" :class="$style.toggleActive" class="_button" @click="toggleActive"> - <template v-if="active"><i class="ph-caret-up ph-bold ph-lg"></i></template> + <template v-if="active"><i class="ti ti-chevron-up"></i></template> <template v-else><i class="ph-caret-down ph-bold ph-lg"></i></template> </button> <span :class="$style.title"><slot name="header"></slot></span> diff --git a/packages/frontend/src/widgets/WidgetTimeline.vue b/packages/frontend/src/widgets/WidgetTimeline.vue index e891db5f59..2b71cd262f 100644 --- a/packages/frontend/src/widgets/WidgetTimeline.vue +++ b/packages/frontend/src/widgets/WidgetTimeline.vue @@ -17,7 +17,7 @@ SPDX-License-Identifier: AGPL-3.0-only <template #header> <button class="_button" @click="choose"> <span>{{ widgetProps.src === 'list' ? widgetProps.list.name : widgetProps.src === 'antenna' ? widgetProps.antenna.name : i18n.ts._timelines[widgetProps.src] }}</span> - <i :class="menuOpened ? 'ph-caret-up ph-bold ph-lg' : 'ph-caret-down ph-bold ph-lg'" style="margin-left: 8px;"></i> + <i :class="menuOpened ? 'ti ti-chevron-up' : 'ph-caret-down ph-bold ph-lg'" style="margin-left: 8px;"></i> </button> </template> diff --git a/packages/frontend/vite.config.ts b/packages/frontend/vite.config.ts index b2d3462304..1123fa8236 100644 --- a/packages/frontend/vite.config.ts +++ b/packages/frontend/vite.config.ts @@ -64,10 +64,10 @@ function iconsReplace(opts: RollupReplaceOptions) { return pluginReplace({ ...opts, preventAssignment: false, - // only replace these strings after a quote, remove a ` ti-fw` - // it if happens to be just after, and make sure they're + // only replace these strings at the start of strings, remove a + // `ti-fw` it if happens to be just after, and make sure they're // followed by a word-boundary that's not a dash - delimiters: ['(?<=["\'])', '(?: ti-fw)?\\b(?!-)'], + delimiters: ['(?<=["\'`])', '(?: ti-fw)?\\b(?!-)'], }); } @@ -171,6 +171,7 @@ export function getConfig(): UserConfig { 'ti ti-device-tv': 'ph-television ph-bold ph-lg', 'ti ti-cookie': 'ph-cookie ph-bold ph-lg', 'ti ti-copy': 'ph-copy ph-bold ph-lg', + 'ti ti-chevron-up': 'ph-caret-up ph-bold ph-lg', }, }), ...process.env.NODE_ENV === 'production'