feat: ✨ allow users to choose icon set
Co-authored-by: naskya <m@naskya.net>
This commit is contained in:
Kainoa Kanter
parent
b41fd4fef6
commit
78d8767124
283 changed files with 1711 additions and 1523 deletions
|
|
@ -1153,6 +1153,7 @@ detectPostLanguage: "Automatically detect the language and show a translate butt
|
|||
for posts in foreign languages"
|
||||
vibrate: "Play vibrations"
|
||||
openServerInfo: "Show server information by clicking the server ticker on a post"
|
||||
iconSet: "Icon set"
|
||||
|
||||
_sensitiveMediaDetection:
|
||||
description: "Reduces the effort of server moderation through automatically recognizing
|
||||
|
|
@ -2152,3 +2153,9 @@ _feeds:
|
|||
rss: "RSS"
|
||||
atom: "Atom"
|
||||
jsonFeed: "JSON feed"
|
||||
_iconSets:
|
||||
bold: "Bold"
|
||||
light: "Light"
|
||||
regular: "Regular"
|
||||
fill: "Filled"
|
||||
duotone: "Duotone"
|
||||
|
|
|
|||
|
|
@ -991,6 +991,7 @@ remindMeLater: "また後で"
|
|||
addRe: "閲覧注意の投稿への返信で、注釈の先頭に\"re:\"を追加する"
|
||||
languageForTranslation: "投稿翻訳に使用する言語"
|
||||
detectPostLanguage: "投稿の言語を自動検出し、外国語の投稿に翻訳ボタンを表示する"
|
||||
iconSet: "アイコンのスタイル"
|
||||
|
||||
_sensitiveMediaDetection:
|
||||
description: "機械学習を使って自動でセンシティブなメディアを検出し、モデレーションに役立てられます。サーバーの負荷が少し増えます。"
|
||||
|
|
@ -1994,3 +1995,9 @@ indexableDescription: MastodonやFirefishなどの検索機能に、あなたの
|
|||
clickToShowPatterns: クリックしてトラックを表示
|
||||
vibrate: 振動を有効にする
|
||||
indexable: 投稿検索に登録
|
||||
_iconSets:
|
||||
bold: "太め"
|
||||
light: "細め"
|
||||
regular: "標準"
|
||||
fill: "塗りつぶし"
|
||||
duotone: "2色"
|
||||
|
|
|
|||
|
|
@ -31,6 +31,7 @@
|
|||
"@types/uuid": "9.0.3",
|
||||
"@vitejs/plugin-vue": "4.3.4",
|
||||
"@vue/compiler-sfc": "3.3.4",
|
||||
"@vue/runtime-core": "3.3.4",
|
||||
"autobind-decorator": "2.4.0",
|
||||
"autosize": "6.0.1",
|
||||
"blurhash": "2.0.5",
|
||||
|
|
|
|||
|
|
@ -3,8 +3,9 @@ import type * as firefish from "firefish-js";
|
|||
import { i18n } from "./i18n";
|
||||
import { del, get, set } from "@/scripts/idb-proxy";
|
||||
import { apiUrl } from "@/config";
|
||||
import { alert, api, popup, popupMenu, success, waiting } from "@/os";
|
||||
import { alert, api, popup, popupMenu, waiting } from "@/os";
|
||||
import { reloadChannel, unisonReload } from "@/scripts/unison-reload";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
// TODO: 他のタブと永続化されたstateを同期
|
||||
|
||||
|
|
@ -249,7 +250,7 @@ export async function openAccountMenu(
|
|||
...accountItemPromises,
|
||||
{
|
||||
type: "parent",
|
||||
icon: "ph-plus ph-bold ph-lg",
|
||||
icon: `${icon("ph-plus")}`,
|
||||
text: i18n.ts.addAccount,
|
||||
children: [
|
||||
{
|
||||
|
|
@ -268,13 +269,13 @@ export async function openAccountMenu(
|
|||
},
|
||||
{
|
||||
type: "link",
|
||||
icon: "ph-users ph-bold ph-lg",
|
||||
icon: `${icon("ph-users")}`,
|
||||
text: i18n.ts.manageAccounts,
|
||||
to: "/settings/accounts",
|
||||
},
|
||||
{
|
||||
type: "button",
|
||||
icon: "ph-sign-out ph-bold ph-lg",
|
||||
icon: `${icon("ph-sign-out")}`,
|
||||
text: i18n.ts.logout,
|
||||
action: () => {
|
||||
signout();
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
>
|
||||
<template #header>
|
||||
<i
|
||||
class="ph-warning-circle ph-bold ph-lg"
|
||||
:class="icon('ph-warning-circle')"
|
||||
style="margin-right: 0.5em"
|
||||
></i>
|
||||
<I18n :src="i18n.ts.reportAbuseOf" tag="span">
|
||||
|
|
@ -47,6 +47,7 @@ import MkTextarea from "@/components/form/textarea.vue";
|
|||
import MkButton from "@/components/MkButton.vue";
|
||||
import * as os from "@/os";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
user: firefish.entities.User;
|
||||
|
|
|
|||
|
|
@ -8,16 +8,16 @@
|
|||
<template v-if="!wait">
|
||||
<template v-if="isFollowing">
|
||||
<span v-if="full">{{ i18n.ts.unfollow }}</span
|
||||
><i class="ph-minus ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-minus')"></i>
|
||||
</template>
|
||||
<template v-else>
|
||||
<span v-if="full">{{ i18n.ts.follow }}</span
|
||||
><i class="ph-plus ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-plus')"></i>
|
||||
</template>
|
||||
</template>
|
||||
<template v-else>
|
||||
<span v-if="full">{{ i18n.ts.processing }}</span
|
||||
><i class="ph-circle-notch ph-bold ph-lg fa-pulse ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-circle-notch fa-pulse ph-fw')"></i>
|
||||
</template>
|
||||
</button>
|
||||
</template>
|
||||
|
|
@ -26,6 +26,7 @@
|
|||
import { ref } from "vue";
|
||||
import * as os from "@/os";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
|
|
|
|||
|
|
@ -3,11 +3,12 @@
|
|||
<div class="banner" :style="bannerStyle">
|
||||
<div class="fade"></div>
|
||||
<div class="name">
|
||||
<i class="ph-television ph-bold ph-lg"></i> {{ channel.name }}
|
||||
<i :class="icon('ph-television')"></i>
|
||||
{{ channel.name }}
|
||||
</div>
|
||||
<div class="status">
|
||||
<div>
|
||||
<i class="ph-users ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
<i :class="icon('ph-users ph-fw')"></i>
|
||||
<I18n
|
||||
:src="i18n.ts._channel.usersCount"
|
||||
tag="span"
|
||||
|
|
@ -19,7 +20,7 @@
|
|||
</I18n>
|
||||
</div>
|
||||
<div>
|
||||
<i class="ph-pencil ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
<i :class="icon('ph-pencil ph-fw')"></i>
|
||||
<I18n
|
||||
:src="i18n.ts._channel.notesCount"
|
||||
tag="span"
|
||||
|
|
@ -52,6 +53,7 @@
|
|||
<script lang="ts" setup>
|
||||
import { computed } from "vue";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
channel: Record<string, any>;
|
||||
|
|
|
|||
|
|
@ -20,16 +20,16 @@
|
|||
@click="() => (showBody = !showBody)"
|
||||
>
|
||||
<template v-if="showBody"
|
||||
><i class="ph-caret-up ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-caret-up')"></i
|
||||
></template>
|
||||
<template v-else
|
||||
><i class="ph-caret-down ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-caret-down')"></i
|
||||
></template>
|
||||
</button>
|
||||
</div>
|
||||
</header>
|
||||
<transition
|
||||
:name="$store.state.animation ? 'container-toggle' : ''"
|
||||
:name="defaultStore.state.animation ? 'container-toggle' : ''"
|
||||
@enter="enter"
|
||||
@after-enter="afterEnter"
|
||||
@leave="leave"
|
||||
|
|
@ -62,6 +62,8 @@
|
|||
<script lang="ts">
|
||||
import { defineComponent } from "vue";
|
||||
import { i18n } from "@/i18n";
|
||||
import { defaultStore } from "@/store";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
export default defineComponent({
|
||||
props: {
|
||||
|
|
@ -107,6 +109,8 @@ export default defineComponent({
|
|||
omitted: null,
|
||||
ignoreOmit: false,
|
||||
i18n,
|
||||
icon,
|
||||
defaultStore,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<transition :name="$store.state.animation ? 'fade' : ''" appear>
|
||||
<transition :name="defaultStore.state.animation ? 'fade' : ''" appear>
|
||||
<div
|
||||
ref="rootEl"
|
||||
class="nvlagfpb"
|
||||
|
|
@ -17,6 +17,7 @@ import MkMenu from "@/components/MkMenu.vue";
|
|||
import type { MenuItem } from "@/types/menu";
|
||||
import contains from "@/scripts/contains";
|
||||
import * as os from "@/os";
|
||||
import { defaultStore } from "@/store";
|
||||
|
||||
const props = defineProps<{
|
||||
items: MenuItem[];
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@ import { TransitionGroup, defineComponent, h } from "vue";
|
|||
import MkAd from "@/components/global/MkAd.vue";
|
||||
import { i18n } from "@/i18n";
|
||||
import { defaultStore } from "@/store";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
export default defineComponent({
|
||||
props: {
|
||||
|
|
@ -75,14 +76,14 @@ export default defineComponent({
|
|||
[
|
||||
h("span", [
|
||||
h("i", {
|
||||
class: "ph-caret-up ph-bold ph-lg icon",
|
||||
class: `${icon("ph-caret-up")} icon`,
|
||||
}),
|
||||
getDateText(item.createdAt),
|
||||
]),
|
||||
h("span", [
|
||||
getDateText(props.items[i + 1].createdAt),
|
||||
h("i", {
|
||||
class: "ph-caret-down ph-bold ph-lg icon",
|
||||
class: `${icon("ph-caret-down")} icon`,
|
||||
}),
|
||||
]),
|
||||
],
|
||||
|
|
|
|||
|
|
@ -16,27 +16,27 @@
|
|||
<i
|
||||
v-if="type === 'success'"
|
||||
:class="$style.iconInner"
|
||||
class="ph-check ph-bold ph-lg"
|
||||
class="ph-check ph-lg"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="type === 'error'"
|
||||
:class="$style.iconInner"
|
||||
class="ph-circle-wavy-warning ph-bold ph-lg"
|
||||
class="ph-circle-wavy-warning ph-lg"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="type === 'warning'"
|
||||
:class="$style.iconInner"
|
||||
class="ph-warning ph-bold ph-lg"
|
||||
class="ph-warning ph-lg"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="type === 'info'"
|
||||
:class="$style.iconInner"
|
||||
class="ph-info ph-bold ph-lg"
|
||||
class="ph-info ph-lg"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="type === 'question'"
|
||||
:class="$style.iconInner"
|
||||
class="ph-circle-question ph-bold ph-lg"
|
||||
class="ph-circle-question ph-lg"
|
||||
></i>
|
||||
<MkLoading
|
||||
v-else-if="type === 'waiting'"
|
||||
|
|
@ -75,7 +75,7 @@
|
|||
@keydown="onInputKeydown"
|
||||
>
|
||||
<template v-if="input.type === 'password'" #prefix
|
||||
><i class="ph-password ph-bold ph-lg"></i
|
||||
><i :class="iconClass('ph-password')"></i
|
||||
></template>
|
||||
<template #caption>
|
||||
<span
|
||||
|
|
@ -109,7 +109,7 @@
|
|||
class="_buttonIcon"
|
||||
@click.stop="openSearchFilters"
|
||||
>
|
||||
<i class="ph-funnel ph-bold"></i>
|
||||
<i :class="iconClass('ph-funnel', false)"></i>
|
||||
</button>
|
||||
</template>
|
||||
</MkInput>
|
||||
|
|
@ -213,6 +213,7 @@ import MkTextarea from "@/components/form/textarea.vue";
|
|||
import MkSelect from "@/components/form/select.vue";
|
||||
import * as os from "@/os";
|
||||
import { i18n } from "@/i18n";
|
||||
import iconClass from "@/scripts/icon";
|
||||
|
||||
interface Input {
|
||||
type: HTMLInputElement["type"];
|
||||
|
|
@ -364,7 +365,7 @@ async function openSearchFilters(ev) {
|
|||
await os.popupMenu(
|
||||
[
|
||||
{
|
||||
icon: "ph-user ph-bold ph-lg",
|
||||
icon: `${icon("ph-user")}`,
|
||||
text: i18n.ts._filters.fromUser,
|
||||
action: () => {
|
||||
os.selectUser().then((user) => {
|
||||
|
|
@ -375,32 +376,32 @@ async function openSearchFilters(ev) {
|
|||
{
|
||||
type: "parent",
|
||||
text: i18n.ts._filters.withFile,
|
||||
icon: "ph-paperclip ph-bold ph-lg",
|
||||
icon: `${icon("ph-paperclip")}`,
|
||||
children: [
|
||||
{
|
||||
text: i18n.ts.image,
|
||||
icon: "ph-image-square ph-bold ph-lg",
|
||||
icon: `${icon("ph-image-square")}`,
|
||||
action: () => {
|
||||
inputValue.value += " has:image";
|
||||
},
|
||||
},
|
||||
{
|
||||
text: i18n.ts.video,
|
||||
icon: "ph-video-camera ph-bold ph-lg",
|
||||
icon: `${icon("ph-video-camera")}`,
|
||||
action: () => {
|
||||
inputValue.value += " has:video";
|
||||
},
|
||||
},
|
||||
{
|
||||
text: i18n.ts.audio,
|
||||
icon: "ph-music-note ph-bold ph-lg",
|
||||
icon: `${icon("ph-music-note")}`,
|
||||
action: () => {
|
||||
inputValue.value += " has:audio";
|
||||
},
|
||||
},
|
||||
{
|
||||
text: i18n.ts.file,
|
||||
icon: "ph-file ph-bold ph-lg",
|
||||
icon: `${icon("ph-file")}`,
|
||||
action: () => {
|
||||
inputValue.value += " has:file";
|
||||
},
|
||||
|
|
@ -408,14 +409,14 @@ async function openSearchFilters(ev) {
|
|||
],
|
||||
},
|
||||
{
|
||||
icon: "ph-link ph-bold ph-lg",
|
||||
icon: `${icon("ph-link")}`,
|
||||
text: i18n.ts._filters.fromDomain,
|
||||
action: () => {
|
||||
inputValue.value += " domain:";
|
||||
},
|
||||
},
|
||||
{
|
||||
icon: "ph-calendar-blank ph-bold ph-lg",
|
||||
icon: `${icon("ph-calendar-blank")}`,
|
||||
text: i18n.ts._filters.notesBefore,
|
||||
action: () => {
|
||||
os.inputDate({
|
||||
|
|
@ -428,7 +429,7 @@ async function openSearchFilters(ev) {
|
|||
},
|
||||
},
|
||||
{
|
||||
icon: "ph-calendar-blank ph-bold ph-lg",
|
||||
icon: `${icon("ph-calendar-blank")}`,
|
||||
text: i18n.ts._filters.notesAfter,
|
||||
action: () => {
|
||||
os.inputDate({
|
||||
|
|
@ -441,14 +442,14 @@ async function openSearchFilters(ev) {
|
|||
},
|
||||
},
|
||||
{
|
||||
icon: "ph-eye ph-bold ph-lg",
|
||||
icon: `${icon("ph-eye")}`,
|
||||
text: i18n.ts._filters.followingOnly,
|
||||
action: () => {
|
||||
inputValue.value += " filter:following ";
|
||||
},
|
||||
},
|
||||
{
|
||||
icon: "ph-users-three ph-bold ph-lg",
|
||||
icon: `${icon("ph-users-three")}`,
|
||||
text: i18n.ts._filters.followersOnly,
|
||||
action: () => {
|
||||
inputValue.value += " filter:followers ";
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<transition name="slide-fade">
|
||||
<div v-if="show" class="_panel _shadow _acrylic" :class="$style.root">
|
||||
<div :class="$style.icon">
|
||||
<i class="ph-hand-heart ph-bold ph-5x" />
|
||||
<i :class="icon('ph-hand-heart ph-5x', false)" />
|
||||
</div>
|
||||
<div :class="$style.main">
|
||||
<div :class="$style.title">
|
||||
|
|
@ -52,7 +52,7 @@
|
|||
:aria-label="i18n.t('close')"
|
||||
@click="close"
|
||||
>
|
||||
<i class="ph-x ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-x')"></i>
|
||||
</button>
|
||||
</div>
|
||||
</transition>
|
||||
|
|
@ -65,6 +65,7 @@ import { host } from "@/config";
|
|||
import { i18n } from "@/i18n";
|
||||
import * as os from "@/os";
|
||||
import { instance } from "@/instance";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const show = ref(false);
|
||||
|
||||
|
|
|
|||
|
|
@ -46,6 +46,7 @@ import bytes from "@/filters/bytes";
|
|||
import * as os from "@/os";
|
||||
import { i18n } from "@/i18n";
|
||||
import { $i } from "@/account";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
|
|
@ -75,7 +76,7 @@ function getMenu() {
|
|||
return [
|
||||
{
|
||||
text: i18n.ts.rename,
|
||||
icon: "ph-cursor-text ph-bold ph-lg",
|
||||
icon: `${icon("ph-cursor-text")}`,
|
||||
action: rename,
|
||||
},
|
||||
{
|
||||
|
|
@ -83,19 +84,19 @@ function getMenu() {
|
|||
? i18n.ts.unmarkAsSensitive
|
||||
: i18n.ts.markAsSensitive,
|
||||
icon: props.file.isSensitive
|
||||
? "ph-eye ph-bold ph-lg"
|
||||
: "ph-eye-slash ph-bold ph-lg",
|
||||
? "ph-eye ph-lg"
|
||||
: "ph-eye-slash ph-lg",
|
||||
action: toggleSensitive,
|
||||
},
|
||||
{
|
||||
text: i18n.ts.describeFile,
|
||||
icon: "ph-subtitles ph-bold ph-lg",
|
||||
icon: `${icon("ph-subtitles")}`,
|
||||
action: describe,
|
||||
},
|
||||
null,
|
||||
{
|
||||
text: i18n.ts.copyUrl,
|
||||
icon: "ph-link-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-link-simple")}`,
|
||||
action: copyUrl,
|
||||
},
|
||||
{
|
||||
|
|
@ -103,13 +104,13 @@ function getMenu() {
|
|||
href: props.file.url,
|
||||
target: "_blank",
|
||||
text: i18n.ts.download,
|
||||
icon: "ph-download-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-download-simple")}`,
|
||||
download: props.file.name,
|
||||
},
|
||||
null,
|
||||
{
|
||||
text: i18n.ts.delete,
|
||||
icon: "ph-trash ph-bold ph-lg",
|
||||
icon: `${icon("ph-trash")}`,
|
||||
danger: true,
|
||||
action: deleteFile,
|
||||
},
|
||||
|
|
|
|||
|
|
@ -17,10 +17,10 @@
|
|||
>
|
||||
<p class="name">
|
||||
<template v-if="hover"
|
||||
><i class="ph-folder-notch-open ph-bold ph-lg ph-fw ph-lg"></i
|
||||
><i :class="icon('ph-folder-notch-open ph-fw')"></i
|
||||
></template>
|
||||
<template v-if="!hover"
|
||||
><i class="ph-folder-notch ph-bold ph-lg ph-fw ph-lg"></i
|
||||
><i :class="icon('ph-folder-notch ph-fw')"></i
|
||||
></template>
|
||||
{{ folder.name }}
|
||||
</p>
|
||||
|
|
@ -42,6 +42,7 @@ import type * as firefish from "firefish-js";
|
|||
import * as os from "@/os";
|
||||
import { i18n } from "@/i18n";
|
||||
import { defaultStore } from "@/store";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
|
|
@ -248,7 +249,7 @@ function onContextmenu(ev: MouseEvent) {
|
|||
[
|
||||
{
|
||||
text: i18n.ts.openInWindow,
|
||||
icon: "ph-copy ph-bold ph-lg",
|
||||
icon: `${icon("ph-copy")}`,
|
||||
action: () => {
|
||||
os.popup(
|
||||
defineAsyncComponent(
|
||||
|
|
@ -265,13 +266,13 @@ function onContextmenu(ev: MouseEvent) {
|
|||
null,
|
||||
{
|
||||
text: i18n.ts.rename,
|
||||
icon: "ph-cursor-text ph-bold ph-lg",
|
||||
icon: `${icon("ph-cursor-text")}`,
|
||||
action: rename,
|
||||
},
|
||||
null,
|
||||
{
|
||||
text: i18n.ts.delete,
|
||||
icon: "ph-trash ph-bold ph-lg",
|
||||
icon: `${icon("ph-trash")}`,
|
||||
danger: true,
|
||||
action: deleteFolder,
|
||||
},
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
@dragleave="onDragleave"
|
||||
@drop.stop="onDrop"
|
||||
>
|
||||
<i v-if="folder == null" class="ph-cloud ph-bold ph-lg"></i>
|
||||
<i v-if="folder == null" :class="icon('ph-cloud')"></i>
|
||||
<span>{{ folder == null ? i18n.ts.drive : folder.name }}</span>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -18,6 +18,7 @@ import { ref } from "vue";
|
|||
import type * as firefish from "firefish-js";
|
||||
import * as os from "@/os";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
folder?: firefish.entities.DriveFolder;
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
/>
|
||||
<template v-for="f in hierarchyFolders">
|
||||
<span class="separator"
|
||||
><i class="ph-caret-right ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-caret-right')"></i
|
||||
></span>
|
||||
<XNavFolder
|
||||
:folder="f"
|
||||
|
|
@ -24,14 +24,14 @@
|
|||
/>
|
||||
</template>
|
||||
<span v-if="folder != null" class="separator"
|
||||
><i class="ph-caret-right ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-caret-right')"></i
|
||||
></span>
|
||||
<span v-if="folder != null" class="folder current">{{
|
||||
folder.name
|
||||
}}</span>
|
||||
</div>
|
||||
<button class="menu _button" @click="showMenu">
|
||||
<i class="ph-dots-three-outline ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-dots-three-outline')"></i>
|
||||
</button>
|
||||
</nav>
|
||||
<div
|
||||
|
|
@ -149,6 +149,7 @@ import { stream } from "@/stream";
|
|||
import { defaultStore } from "@/store";
|
||||
import { i18n } from "@/i18n";
|
||||
import { uploadFile, uploads } from "@/scripts/upload";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
|
|
@ -677,14 +678,14 @@ function getMenu() {
|
|||
},
|
||||
{
|
||||
text: i18n.ts.upload,
|
||||
icon: "ph-upload-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-upload-simple")}`,
|
||||
action: () => {
|
||||
selectLocalFile();
|
||||
},
|
||||
},
|
||||
{
|
||||
text: i18n.ts.fromUrl,
|
||||
icon: "ph-link-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-link-simple")}`,
|
||||
action: () => {
|
||||
urlUpload();
|
||||
},
|
||||
|
|
@ -697,7 +698,7 @@ function getMenu() {
|
|||
folder.value
|
||||
? {
|
||||
text: i18n.ts.renameFolder,
|
||||
icon: "ph-cursor-text ph-bold ph-lg",
|
||||
icon: `${icon("ph-cursor-text")}`,
|
||||
action: () => {
|
||||
renameFolder(folder.value);
|
||||
},
|
||||
|
|
@ -706,7 +707,7 @@ function getMenu() {
|
|||
folder.value
|
||||
? {
|
||||
text: i18n.ts.deleteFolder,
|
||||
icon: "ph-trash ph-bold ph-lg",
|
||||
icon: `${icon("ph-trash")}`,
|
||||
action: () => {
|
||||
deleteFolder(
|
||||
folder.value as firefish.entities.DriveFolder,
|
||||
|
|
@ -716,7 +717,7 @@ function getMenu() {
|
|||
: undefined,
|
||||
{
|
||||
text: i18n.ts.createFolder,
|
||||
icon: "ph-folder-notch-plus ph-bold ph-lg",
|
||||
icon: `${icon("ph-folder-notch-plus")}`,
|
||||
action: () => {
|
||||
createFolder();
|
||||
},
|
||||
|
|
|
|||
|
|
@ -8,33 +8,21 @@
|
|||
:title="file.name"
|
||||
:cover="fit !== 'contain'"
|
||||
/>
|
||||
<i
|
||||
v-else-if="is === 'image'"
|
||||
class="ph-file-image ph-bold ph-lg icon"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="is === 'video'"
|
||||
class="ph-file-video ph-bold ph-lg icon"
|
||||
></i>
|
||||
<i v-else-if="is === 'image'" :class="icon('ph-file-image icon')"></i>
|
||||
<i v-else-if="is === 'video'" :class="icon('ph-file-video icon')"></i>
|
||||
<i
|
||||
v-else-if="is === 'audio' || is === 'midi'"
|
||||
class="ph-file-audio ph-bold ph-lg icon"
|
||||
:class="icon('ph-file-audio icon')"
|
||||
></i>
|
||||
<i v-else-if="is === 'csv'" class="ph-file-csv ph-bold ph-lg icon"></i>
|
||||
<i v-else-if="is === 'pdf'" class="ph-file-pdf ph-bold ph-lg icon"></i>
|
||||
<i
|
||||
v-else-if="is === 'textfile'"
|
||||
class="ph-file-text ph-bold ph-lg icon"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="is === 'archive'"
|
||||
class="ph-file-zip ph-bold ph-lg icon"
|
||||
></i>
|
||||
<i v-else class="ph-file ph-bold ph-lg icon"></i>
|
||||
<i v-else-if="is === 'csv'" :class="icon('ph-file-csv icon')"></i>
|
||||
<i v-else-if="is === 'pdf'" :class="icon('ph-file-pdf icon')"></i>
|
||||
<i v-else-if="is === 'textfile'" :class="icon('ph-file-text icon')"></i>
|
||||
<i v-else-if="is === 'archive'" :class="icon('ph-file-zip icon')"></i>
|
||||
<i v-else :class="icon('ph-file icon')"></i>
|
||||
|
||||
<i
|
||||
v-if="isThumbnailAvailable && is === 'video'"
|
||||
class="ph-file-video ph-bold ph-lg icon-sub"
|
||||
:class="icon('ph-file-video icon-sub')"
|
||||
></i>
|
||||
</button>
|
||||
</template>
|
||||
|
|
@ -43,6 +31,7 @@
|
|||
import { computed } from "vue";
|
||||
import type * as firefish from "firefish-js";
|
||||
import ImgWithBlurhash from "@/components/MkImgWithBlurhash.vue";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
file: firefish.entities.DriveFile;
|
||||
|
|
|
|||
|
|
@ -4,9 +4,7 @@
|
|||
<i
|
||||
class="toggle ph-fw ph-lg"
|
||||
:class="
|
||||
shown
|
||||
? 'ph-caret-down ph-bold ph-lg'
|
||||
: 'ph-caret-up ph-bold ph-lg'
|
||||
icon(shown ? 'ph-caret-down ph-lg' : 'ph-caret-up ph-lg')
|
||||
"
|
||||
></i>
|
||||
<slot></slot> ({{ emojis.length }})
|
||||
|
|
@ -21,7 +19,7 @@
|
|||
"
|
||||
>
|
||||
<i
|
||||
class="ph-circle ph-fill ph-fw ph-lg"
|
||||
class="ph-circle ph-fill ph-fw"
|
||||
:style="{ color: skinTone + ' !important' }"
|
||||
:aria-label="
|
||||
props.skinToneLabels
|
||||
|
|
@ -50,6 +48,7 @@
|
|||
<script lang="ts" setup>
|
||||
import { onMounted, ref, watch } from "vue";
|
||||
import { addSkinTone } from "@/scripts/emojilist";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
emojis: string[];
|
||||
|
|
|
|||
|
|
@ -75,7 +75,7 @@
|
|||
|
||||
<section>
|
||||
<header class="_acrylic">
|
||||
<i class="ph-alarm ph-bold ph-fw ph-lg"></i>
|
||||
<i :class="icon('ph-alarm ph-fw')"></i>
|
||||
{{ i18n.ts.recentUsed }}
|
||||
</header>
|
||||
<div class="body">
|
||||
|
|
@ -135,28 +135,28 @@
|
|||
:class="{ active: tab === 'index' }"
|
||||
@click="tab = 'index'"
|
||||
>
|
||||
<i class="ph-asterisk ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
<i :class="icon('ph-asterisk ph-fw')"></i>
|
||||
</button>
|
||||
<button
|
||||
class="_button tab"
|
||||
:class="{ active: tab === 'custom' }"
|
||||
@click="tab = 'custom'"
|
||||
>
|
||||
<i class="ph-smiley ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
<i :class="icon('ph-smiley ph-fw')"></i>
|
||||
</button>
|
||||
<button
|
||||
class="_button tab"
|
||||
:class="{ active: tab === 'unicode' }"
|
||||
@click="tab = 'unicode'"
|
||||
>
|
||||
<i class="ph-leaf ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
<i :class="icon('ph-leaf ph-fw')"></i>
|
||||
</button>
|
||||
<button
|
||||
class="_button tab"
|
||||
:class="{ active: tab === 'tags' }"
|
||||
@click="tab = 'tags'"
|
||||
>
|
||||
<i class="ph-hash ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
<i :class="icon('ph-hash ph-fw')"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -182,6 +182,7 @@ import { deviceKind } from "@/scripts/device-kind";
|
|||
import { emojiCategories, instance } from "@/instance";
|
||||
import { i18n } from "@/i18n";
|
||||
import { defaultStore } from "@/store";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
|
|
|
|||
|
|
@ -1,13 +1,14 @@
|
|||
<template>
|
||||
<span class="mk-file-type-icon">
|
||||
<template v-if="kind == 'image'"
|
||||
><i class="ph-file-image ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-file-image')"></i
|
||||
></template>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed } from "vue";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
type: string;
|
||||
|
|
|
|||
|
|
@ -10,15 +10,15 @@
|
|||
:aria-controls="bodyId"
|
||||
>
|
||||
<template v-if="showBody"
|
||||
><i class="ph-caret-up ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-caret-up')"></i
|
||||
></template>
|
||||
<template v-else
|
||||
><i class="ph-caret-down ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-caret-down')"></i
|
||||
></template>
|
||||
</button>
|
||||
</header>
|
||||
<transition
|
||||
:name="$store.state.animation ? 'folder-toggle' : ''"
|
||||
:name="defaultStore.state.animation ? 'folder-toggle' : ''"
|
||||
@enter="enter"
|
||||
@after-enter="afterEnter"
|
||||
@leave="leave"
|
||||
|
|
@ -34,6 +34,8 @@
|
|||
<script lang="ts">
|
||||
import { defineComponent } from "vue";
|
||||
import { getUniqueId } from "@/os";
|
||||
import { defaultStore } from "@/store";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const localStoragePrefix = "ui:folder:";
|
||||
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
class="menu _button"
|
||||
@click.stop="menu"
|
||||
>
|
||||
<i class="ph-dots-three-outline ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-dots-three-outline')"></i>
|
||||
</button>
|
||||
<button
|
||||
v-if="$i != null && $i.id != user.id"
|
||||
|
|
@ -25,37 +25,37 @@
|
|||
<template v-if="!wait">
|
||||
<template v-if="isBlocking">
|
||||
<span>{{ (state = i18n.ts.blocked) }}</span
|
||||
><i class="ph-prohibit ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-prohibit')"></i>
|
||||
</template>
|
||||
<template
|
||||
v-else-if="hasPendingFollowRequestFromYou && user.isLocked"
|
||||
>
|
||||
<span>{{ (state = i18n.ts.followRequestPending) }}</span
|
||||
><i class="ph-hourglass-medium ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-hourglass-medium')"></i>
|
||||
</template>
|
||||
<template
|
||||
v-else-if="hasPendingFollowRequestFromYou && !user.isLocked"
|
||||
>
|
||||
<!-- つまりリモートフォローの場合。 -->
|
||||
<span>{{ (state = i18n.ts.processing) }}</span
|
||||
><i class="ph-circle-notch ph-bold ph-lg fa-pulse"></i>
|
||||
><i :class="icon('ph-circle-notch fa-pulse')"></i>
|
||||
</template>
|
||||
<template v-else-if="isFollowing">
|
||||
<span>{{ (state = i18n.ts.unfollow) }}</span
|
||||
><i class="ph-minus ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-minus')"></i>
|
||||
</template>
|
||||
<template v-else-if="!isFollowing && user.isLocked">
|
||||
<span>{{ (state = i18n.ts.followRequest) }}</span
|
||||
><i class="ph-lock-open ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-lock-open')"></i>
|
||||
</template>
|
||||
<template v-else-if="!isFollowing && !user.isLocked">
|
||||
<span>{{ (state = i18n.ts.follow) }}</span
|
||||
><i class="ph-plus ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-plus')"></i>
|
||||
</template>
|
||||
</template>
|
||||
<template v-else>
|
||||
<span>{{ (state = i18n.ts.processing) }}</span
|
||||
><i class="ph-circle-notch ph-bold ph-lg fa-pulse ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-circle-notch fa-pulse ph-fw')"></i>
|
||||
</template>
|
||||
</button>
|
||||
</template>
|
||||
|
|
@ -70,6 +70,7 @@ import { $i } from "@/account";
|
|||
import { getUserMenu } from "@/scripts/get-user-menu";
|
||||
import { useRouter } from "@/router";
|
||||
import { vibrate } from "@/scripts/vibrate";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<div class="mk-google" @click.stop>
|
||||
<input v-model="query" type="search" :placeholder="q" />
|
||||
<button @click="search">
|
||||
<i class="ph-magnifying-glass ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-magnifying-glass')"></i>
|
||||
{{ i18n.ts.searchByGoogle }}
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -12,6 +12,7 @@
|
|||
import { ref } from "vue";
|
||||
import { i18n } from "@/i18n";
|
||||
import { useRouter } from "@/router";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
|
|
|
|||
|
|
@ -1,11 +1,7 @@
|
|||
<template>
|
||||
<div v-if="visible" class="info" :class="{ warn, card }">
|
||||
<i v-if="warn" class="ph-warning ph-bold ph-lg"></i>
|
||||
<i
|
||||
v-else
|
||||
class="ph-bold ph-lg"
|
||||
:class="icon ? `ph-${icon}` : 'ph-info'"
|
||||
></i>
|
||||
<i v-if="warn" :class="iconClass('ph-warning')"></i>
|
||||
<i v-else :class="iconClass(icon ? `ph-${icon}` : 'ph-info')"></i>
|
||||
<slot></slot>
|
||||
<button
|
||||
v-if="closeable"
|
||||
|
|
@ -14,7 +10,7 @@
|
|||
:aria-label="i18n.t('close')"
|
||||
@click.stop="close"
|
||||
>
|
||||
<i class="ph-x ph-bold ph-lg"></i>
|
||||
<i :class="iconClass('ph-x')"></i>
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -22,6 +18,7 @@
|
|||
<script lang="ts" setup>
|
||||
import { ref } from "vue";
|
||||
import { i18n } from "@/i18n";
|
||||
import iconClass from "@/scripts/icon";
|
||||
|
||||
const visible = ref(true);
|
||||
|
||||
|
|
|
|||
|
|
@ -12,17 +12,17 @@
|
|||
style="margin-left: 0.5em"
|
||||
@click="copy_"
|
||||
>
|
||||
<i class="ph-clipboard-text ph-bold"></i>
|
||||
<i :class="icon('ph-clipboard-text', false)"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {} from "vue";
|
||||
import copyToClipboard from "@/scripts/copy-to-clipboard";
|
||||
import * as os from "@/os";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
|
|
|
|||
|
|
@ -33,7 +33,7 @@
|
|||
v-if="item.indicate"
|
||||
class="indicator"
|
||||
:class="{
|
||||
animateIndicator: $store.state.animation,
|
||||
animateIndicator: defaultStore.state.animation,
|
||||
}"
|
||||
><i class="ph-circle ph-fill"></i
|
||||
></span>
|
||||
|
|
@ -50,7 +50,7 @@
|
|||
v-if="item.indicate"
|
||||
class="indicator"
|
||||
:class="{
|
||||
animateIndicator: $store.state.animation,
|
||||
animateIndicator: defaultStore.state.animation,
|
||||
}"
|
||||
><i class="ph-circle ph-fill"></i
|
||||
></span>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
:is="self ? 'MkA' : 'a'"
|
||||
ref="el"
|
||||
class="xlcxczvw _link"
|
||||
:[attr]="self ? url.substr(local.length) : url"
|
||||
:[attr]="self ? url.substring(local.length) : url"
|
||||
:rel="rel"
|
||||
:target="target"
|
||||
:title="url"
|
||||
|
|
@ -12,7 +12,7 @@
|
|||
<slot></slot>
|
||||
<i
|
||||
v-if="target === '_blank'"
|
||||
class="ph-arrow-square-out ph-bold ph-lg icon"
|
||||
:class="icon('ph-arrow-square-out icon')"
|
||||
></i>
|
||||
</component>
|
||||
</template>
|
||||
|
|
@ -22,6 +22,7 @@ import { defineAsyncComponent, ref } from "vue";
|
|||
import { url as local } from "@/config";
|
||||
import { useTooltip } from "@/scripts/use-tooltip";
|
||||
import * as os from "@/os";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
<div class="text">
|
||||
<div class="wrapper">
|
||||
<b style="display: block"
|
||||
><i class="ph-warning ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-warning')"></i>
|
||||
{{ i18n.ts.sensitive }}</b
|
||||
>
|
||||
<span style="display: block">{{
|
||||
|
|
@ -74,7 +74,7 @@
|
|||
class="_button"
|
||||
@click.stop="captionPopup"
|
||||
>
|
||||
<i class="ph-subtitles ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-subtitles')"></i>
|
||||
</button>
|
||||
<button
|
||||
v-if="!hide"
|
||||
|
|
@ -82,7 +82,7 @@
|
|||
class="_button"
|
||||
@click.stop="hide = true"
|
||||
>
|
||||
<i class="ph-eye-slash ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-eye-slash')"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -98,6 +98,7 @@ import ImgWithBlurhash from "@/components/MkImgWithBlurhash.vue";
|
|||
import { defaultStore } from "@/store";
|
||||
import { i18n } from "@/i18n";
|
||||
import * as os from "@/os";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
media: firefish.entities.DriveFile;
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
class="sensitive"
|
||||
@click="hide = false"
|
||||
>
|
||||
<span class="icon"><i class="ph-warning ph-bold ph-lg"></i></span>
|
||||
<span class="icon"><i :class="icon('ph-warning')"></i></span>
|
||||
<b>{{ i18n.ts.sensitive }}</b>
|
||||
<span>{{ i18n.ts.clickToShow }}</span>
|
||||
</div>
|
||||
|
|
@ -48,7 +48,7 @@
|
|||
:download="media.name"
|
||||
>
|
||||
<span class="icon"
|
||||
><i class="ph-download-simple ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-download-simple')"></i
|
||||
></span>
|
||||
<b>{{ media.name }}</b>
|
||||
</a>
|
||||
|
|
@ -62,6 +62,7 @@ import type * as firefish from "firefish-js";
|
|||
import { ColdDeviceStorage } from "@/store";
|
||||
import "vue-plyr/dist/vue-plyr.css";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@
|
|||
<span class="main">
|
||||
<span class="username">@{{ username }}</span>
|
||||
<span
|
||||
v-if="host != localHost || $store.state.showFullAcct"
|
||||
v-if="host != localHost || defaultStore.state.showFullAcct"
|
||||
class="host"
|
||||
>@{{ toUnicode(host) }}</span
|
||||
>
|
||||
|
|
@ -38,6 +38,7 @@ import { toUnicode } from "punycode";
|
|||
import {} from "vue";
|
||||
import { host as localHost } from "@/config";
|
||||
import { $i } from "@/account";
|
||||
import { defaultStore } from "@/store";
|
||||
|
||||
const props = defineProps<{
|
||||
username: string;
|
||||
|
|
|
|||
|
|
@ -57,7 +57,7 @@
|
|||
v-if="item.indicate"
|
||||
class="indicator"
|
||||
:class="{
|
||||
animateIndicator: $store.state.animation,
|
||||
animateIndicator: defaultStore.state.animation,
|
||||
}"
|
||||
><i class="ph-circle ph-fill"></i
|
||||
></span>
|
||||
|
|
@ -74,8 +74,7 @@
|
|||
>
|
||||
<i
|
||||
v-if="item.icon"
|
||||
class="ph-fw ph-lg"
|
||||
:class="item.icon"
|
||||
:class="icon(`${item.icon} ph-fw`)"
|
||||
></i>
|
||||
<span :style="item.textStyle || ''">{{
|
||||
item.text
|
||||
|
|
@ -84,7 +83,7 @@
|
|||
v-if="item.indicate"
|
||||
class="indicator"
|
||||
:class="{
|
||||
animateIndicator: $store.state.animation,
|
||||
animateIndicator: defaultStore.state.animation,
|
||||
}"
|
||||
><i class="ph-circle ph-fill"></i
|
||||
></span>
|
||||
|
|
@ -107,7 +106,7 @@
|
|||
v-if="item.indicate"
|
||||
class="indicator"
|
||||
:class="{
|
||||
animateIndicator: $store.state.animation,
|
||||
animateIndicator: defaultStore.state.animation,
|
||||
}"
|
||||
><i class="ph-circle ph-fill"></i
|
||||
></span>
|
||||
|
|
@ -135,16 +134,13 @@
|
|||
>
|
||||
<i
|
||||
v-if="item.icon"
|
||||
class="ph-fw ph-lg"
|
||||
:class="item.icon"
|
||||
:class="icon(`${item.icon} ph-fw`)"
|
||||
></i>
|
||||
<span :style="item.textStyle || ''">{{
|
||||
item.text
|
||||
}}</span>
|
||||
<span class="caret"
|
||||
><i
|
||||
class="ph-caret-right ph-bold ph-lg ph-fw ph-lg"
|
||||
></i
|
||||
><i :class="icon('ph-caret-right ph-fw')"></i
|
||||
></span>
|
||||
</button>
|
||||
<button
|
||||
|
|
@ -162,8 +158,7 @@
|
|||
>
|
||||
<i
|
||||
v-if="item.icon"
|
||||
class="ph-fw ph-lg"
|
||||
:class="item.icon"
|
||||
:class="icon(`${item.icon} ph-fw`)"
|
||||
></i>
|
||||
<MkAvatar
|
||||
v-if="item.avatar"
|
||||
|
|
@ -178,7 +173,7 @@
|
|||
v-if="item.indicate"
|
||||
class="indicator"
|
||||
:class="{
|
||||
animateIndicator: $store.state.animation,
|
||||
animateIndicator: defaultStore.state.animation,
|
||||
}"
|
||||
><i class="ph-circle ph-fill"></i
|
||||
></span>
|
||||
|
|
@ -190,6 +185,7 @@
|
|||
</div>
|
||||
<div v-if="childMenu" class="child">
|
||||
<XChild
|
||||
v-if="childTarget && itemsEl"
|
||||
ref="child"
|
||||
:items="childMenu"
|
||||
:target-element="childTarget"
|
||||
|
|
@ -221,6 +217,8 @@ import type {
|
|||
} from "@/types/menu";
|
||||
import * as os from "@/os";
|
||||
import { i18n } from "@/i18n";
|
||||
import { defaultStore } from "@/store";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const XChild = defineAsyncComponent(() => import("./MkMenu.child.vue"));
|
||||
const focusTrap = ref();
|
||||
|
|
|
|||
|
|
@ -5,10 +5,7 @@
|
|||
</div>
|
||||
<div class="mod-player-disabled" v-else-if="hide" @click="toggleVisible()">
|
||||
<div>
|
||||
<b
|
||||
><i class="ph-warning ph-bold ph-lg"></i>
|
||||
{{ i18n.ts.sensitive }}</b
|
||||
>
|
||||
<b><i class="ph-warning"></i> {{ i18n.ts.sensitive }}</b>
|
||||
<span>{{ i18n.ts.clickToShow }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -40,16 +37,16 @@
|
|||
</div>
|
||||
<div class="controls">
|
||||
<button class="play" @click="playPause()" v-if="!loading">
|
||||
<i class="ph-pause ph-fill ph-lg" v-if="playing"></i>
|
||||
<i class="ph-play ph-fill ph-lg" v-else></i>
|
||||
<i class="ph-pause ph-fill" v-if="playing"></i>
|
||||
<i class="ph-play ph-fill" v-else></i>
|
||||
</button>
|
||||
<MkLoading v-else :em="true" />
|
||||
<button class="stop" @click="stop()">
|
||||
<i class="ph-stop ph-fill ph-lg"></i>
|
||||
<i class="ph-stop ph-fill"></i>
|
||||
</button>
|
||||
<button class="loop" @click="toggleLoop()">
|
||||
<i class="ph-repeat ph-fill ph-lg" v-if="loop === -1"></i>
|
||||
<i class="ph-repeat-once ph-fill ph-lg" v-else></i>
|
||||
<i class="ph-repeat ph-fill" v-if="loop === -1"></i>
|
||||
<i class="ph-repeat-once ph-fill" v-else></i>
|
||||
</button>
|
||||
<FormRange
|
||||
class="progress"
|
||||
|
|
@ -64,8 +61,8 @@
|
|||
@update:modelValue="performSeek()"
|
||||
></FormRange>
|
||||
<button class="mute" @click="toggleMute()">
|
||||
<i class="ph-speaker-simple-x ph-fill ph-lg" v-if="muted"></i>
|
||||
<i class="ph-speaker-simple-high ph-fill ph-lg" v-else></i>
|
||||
<i class="ph-speaker-simple-x ph-fill" v-if="muted"></i>
|
||||
<i class="ph-speaker-simple-high ph-fill" v-else></i>
|
||||
</button>
|
||||
<FormRange
|
||||
class="volume"
|
||||
|
|
@ -84,7 +81,7 @@
|
|||
:href="module.url"
|
||||
target="_blank"
|
||||
>
|
||||
<i class="ph-download-simple ph-fill ph-lg"></i>
|
||||
<i class="ph-download-simple ph-fill"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div class="buttons">
|
||||
|
|
@ -94,7 +91,7 @@
|
|||
class="_button"
|
||||
@click.stop="captionPopup"
|
||||
>
|
||||
<i class="ph-subtitles ph-bold ph-lg"></i>
|
||||
<i class="ph-subtitles"></i>
|
||||
</button>
|
||||
<button
|
||||
v-if="!hide"
|
||||
|
|
@ -102,7 +99,7 @@
|
|||
class="_button"
|
||||
@click.stop="toggleVisible()"
|
||||
>
|
||||
<i class="ph-eye-slash ph-bold ph-lg"></i>
|
||||
<i class="ph-eye-slash"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -116,6 +113,7 @@ import { i18n } from "@/i18n";
|
|||
import * as os from "@/os";
|
||||
import { defaultStore } from "@/store";
|
||||
import { ChiptuneJsPlayer, ChiptuneJsConfig } from "@/scripts/chiptune2";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
module: firefish.entities.DriveFile;
|
||||
|
|
|
|||
|
|
@ -15,14 +15,14 @@
|
|||
class="_button"
|
||||
@click="back()"
|
||||
>
|
||||
<i class="ph-caret-left ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-caret-left')"></i>
|
||||
</button>
|
||||
<span v-else style="display: inline-block; width: 20px"></span>
|
||||
<span v-if="pageMetadata?.value" class="title">
|
||||
<i
|
||||
v-if="pageMetadata?.value.icon"
|
||||
class="icon"
|
||||
:class="pageMetadata?.value.icon"
|
||||
:class="icon(pageMetadata?.value.icon)"
|
||||
></i>
|
||||
<span>{{ pageMetadata?.value.title }}</span>
|
||||
</span>
|
||||
|
|
@ -31,7 +31,7 @@
|
|||
:aria-label="i18n.t('close')"
|
||||
@click="$refs.modal.close()"
|
||||
>
|
||||
<i class="ph-x ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-x')"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="body">
|
||||
|
|
@ -64,6 +64,8 @@ import { i18n } from "@/i18n";
|
|||
import type { PageMetadata } from "@/scripts/page-metadata";
|
||||
import { provideMetadataReceiver } from "@/scripts/page-metadata";
|
||||
import { Router } from "@/nirax";
|
||||
import { defaultStore } from "@/store";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
initialPath: string;
|
||||
|
|
@ -101,18 +103,18 @@ const contextmenu = computed(() => {
|
|||
text: path.value,
|
||||
},
|
||||
{
|
||||
icon: "ph-arrows-out-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-arrows-out-simple")}`,
|
||||
text: i18n.ts.showInPage,
|
||||
action: expand,
|
||||
},
|
||||
{
|
||||
icon: "ph-arrow-square-out ph-bold ph-lg",
|
||||
icon: `${icon("ph-arrow-square-out")}`,
|
||||
text: i18n.ts.popout,
|
||||
action: popout,
|
||||
},
|
||||
null,
|
||||
{
|
||||
icon: "ph-arrow-square-out ph-bold ph-lg",
|
||||
icon: `${icon("ph-arrow-square-out")}`,
|
||||
text: i18n.ts.openInNewTab,
|
||||
action: () => {
|
||||
window.open(pageUrl.value, "_blank");
|
||||
|
|
@ -120,7 +122,7 @@ const contextmenu = computed(() => {
|
|||
},
|
||||
},
|
||||
{
|
||||
icon: "ph-link-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-link-simple")}`,
|
||||
text: i18n.ts.copyLink,
|
||||
action: () => {
|
||||
copyToClipboard(pageUrl.value);
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@
|
|||
class="_button"
|
||||
@click="$emit('close')"
|
||||
>
|
||||
<i class="ph-x ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-x')"></i>
|
||||
</button>
|
||||
<span class="title">
|
||||
<slot name="header"></slot>
|
||||
|
|
@ -41,7 +41,7 @@
|
|||
class="_button"
|
||||
@click="$emit('close')"
|
||||
>
|
||||
<i class="ph-x ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-x')"></i>
|
||||
</button>
|
||||
<button
|
||||
v-if="props.withOkButton"
|
||||
|
|
@ -50,7 +50,7 @@
|
|||
:disabled="props.okButtonDisabled"
|
||||
@click="$emit('ok')"
|
||||
>
|
||||
<i class="ph-check ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-check')"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="body">
|
||||
|
|
@ -67,6 +67,7 @@ import { shallowRef } from "vue";
|
|||
import { FocusTrap } from "focus-trap-vue";
|
||||
import MkModal from "./MkModal.vue";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
|
|
|
|||
|
|
@ -1,9 +1,6 @@
|
|||
<template>
|
||||
<div class="msjugskd _block">
|
||||
<i
|
||||
class="ph-airplane-takeoff ph-bold ph-lg"
|
||||
style="margin-right: 8px"
|
||||
/>
|
||||
<i :class="icon('ph-airplane-takeoff')" style="margin-right: 8px" />
|
||||
{{ i18n.ts.accountMoved }}
|
||||
<MkMention class="link" :username="acct" :host="host" />
|
||||
</div>
|
||||
|
|
@ -12,6 +9,7 @@
|
|||
<script lang="ts" setup>
|
||||
import MkMention from "./MkMention.vue";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
defineProps<{
|
||||
acct: string;
|
||||
|
|
|
|||
|
|
@ -27,23 +27,22 @@
|
|||
>
|
||||
<div class="line"></div>
|
||||
<div v-if="appearNote._prId_" class="info">
|
||||
<i class="ph-megaphone-simple-bold ph-lg"></i>
|
||||
<i :class="icon('ph-megaphone-simple-bold')"></i>
|
||||
{{ i18n.ts.promotion
|
||||
}}<button class="_textButton hide" @click.stop="readPromo()">
|
||||
{{ i18n.ts.hideThisNote }}
|
||||
<i class="ph-x ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-x')"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div v-if="appearNote._featuredId_" class="info">
|
||||
<i class="ph-lightning ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-lightning')"></i>
|
||||
{{ i18n.ts.featured }}
|
||||
</div>
|
||||
<div v-if="pinned" class="info">
|
||||
<i class="ph-push-pin ph-bold ph-lg"></i
|
||||
>{{ i18n.ts.pinnedNote }}
|
||||
<i :class="icon('ph-push-pin')"></i>{{ i18n.ts.pinnedNote }}
|
||||
</div>
|
||||
<div v-if="isRenote" class="renote">
|
||||
<i class="ph-rocket-launch ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-rocket-launch')"></i>
|
||||
<I18n :src="i18n.ts.renotedBy" tag="span">
|
||||
<template #user>
|
||||
<MkA
|
||||
|
|
@ -64,7 +63,7 @@
|
|||
>
|
||||
<i
|
||||
v-if="isMyRenote"
|
||||
class="ph-dots-three-outline ph-bold ph-lg dropdownIcon"
|
||||
:class="icon('ph-dots-three-outline dropdownIcon')"
|
||||
></i>
|
||||
<MkTime :time="note.createdAt" />
|
||||
</button>
|
||||
|
|
@ -149,7 +148,7 @@
|
|||
class="channel"
|
||||
:to="`/channels/${appearNote.channel.id}`"
|
||||
@click.stop
|
||||
><i class="ph-television ph-bold"></i>
|
||||
><i :class="icon('ph-television', false)"></i>
|
||||
{{ appearNote.channel.name }}</MkA
|
||||
>
|
||||
</div>
|
||||
|
|
@ -164,7 +163,7 @@
|
|||
class="button _button"
|
||||
@click.stop="reply()"
|
||||
>
|
||||
<i class="ph-arrow-u-up-left ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-arrow-u-up-left')"></i>
|
||||
<template
|
||||
v-if="appearNote.repliesCount > 0 && !detailedView"
|
||||
>
|
||||
|
|
@ -209,7 +208,7 @@
|
|||
class="button _button"
|
||||
@click.stop="react()"
|
||||
>
|
||||
<i class="ph-smiley ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-smiley')"></i>
|
||||
</button>
|
||||
<button
|
||||
v-if="
|
||||
|
|
@ -221,7 +220,7 @@
|
|||
class="button _button reacted"
|
||||
@click.stop="undoReact(appearNote)"
|
||||
>
|
||||
<i class="ph-minus ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-minus')"></i>
|
||||
</button>
|
||||
<XQuoteButton class="button" :note="appearNote" />
|
||||
<button
|
||||
|
|
@ -234,7 +233,7 @@
|
|||
class="button _button"
|
||||
@click.stop="translate"
|
||||
>
|
||||
<i class="ph-translate ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-translate')"></i>
|
||||
</button>
|
||||
<button
|
||||
ref="menuButton"
|
||||
|
|
@ -242,7 +241,7 @@
|
|||
class="button _button"
|
||||
@click.stop="menu()"
|
||||
>
|
||||
<i class="ph-dots-three-outline ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-dots-three-outline')"></i>
|
||||
</button>
|
||||
</footer>
|
||||
</div>
|
||||
|
|
@ -302,6 +301,7 @@ import { useNoteCapture } from "@/scripts/use-note-capture";
|
|||
import { notePage } from "@/filters/note";
|
||||
import { deepClone } from "@/scripts/clone";
|
||||
import { getNoteSummary } from "@/scripts/get-note-summary";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
|
|
@ -494,7 +494,7 @@ function onContextmenu(ev: MouseEvent): void {
|
|||
text: notePage(appearNote.value),
|
||||
},
|
||||
{
|
||||
icon: "ph-browser ph-bold ph-lg",
|
||||
icon: `${icon("ph-browser")}`,
|
||||
text: i18n.ts.openInWindow,
|
||||
action: () => {
|
||||
os.pageWindow(notePage(appearNote.value));
|
||||
|
|
@ -502,7 +502,7 @@ function onContextmenu(ev: MouseEvent): void {
|
|||
},
|
||||
notePage(appearNote.value) != location.pathname
|
||||
? {
|
||||
icon: "ph-arrows-out-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-arrows-out-simple")}`,
|
||||
text: i18n.ts.showInPage,
|
||||
action: () => {
|
||||
router.push(
|
||||
|
|
@ -515,13 +515,13 @@ function onContextmenu(ev: MouseEvent): void {
|
|||
null,
|
||||
{
|
||||
type: "a",
|
||||
icon: "ph-arrow-square-out ph-bold ph-lg",
|
||||
icon: `${icon("ph-arrow-square-out")}`,
|
||||
text: i18n.ts.openInNewTab,
|
||||
href: notePage(appearNote.value),
|
||||
target: "_blank",
|
||||
},
|
||||
{
|
||||
icon: "ph-link-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-link-simple")}`,
|
||||
text: i18n.ts.copyLink,
|
||||
action: () => {
|
||||
copyToClipboard(`${url}${notePage(appearNote.value)}`);
|
||||
|
|
@ -530,7 +530,7 @@ function onContextmenu(ev: MouseEvent): void {
|
|||
appearNote.value.user.host != null
|
||||
? {
|
||||
type: "a",
|
||||
icon: "ph-arrow-square-up-right ph-bold ph-lg",
|
||||
icon: `${icon("ph-arrow-square-up-right")}`,
|
||||
text: i18n.ts.showOnRemote,
|
||||
href:
|
||||
appearNote.value.url ??
|
||||
|
|
@ -568,7 +568,7 @@ function showRenoteMenu(viaKeyboard = false): void {
|
|||
[
|
||||
{
|
||||
text: i18n.ts.unrenote,
|
||||
icon: "ph-trash ph-bold ph-lg",
|
||||
icon: `${icon("ph-trash")}`,
|
||||
danger: true,
|
||||
action: () => {
|
||||
os.api("notes/delete", {
|
||||
|
|
|
|||
|
|
@ -35,7 +35,7 @@
|
|||
|
||||
<MkTab v-model="tab" :style="'underline'" @update:modelValue="loadTab">
|
||||
<option value="replies">
|
||||
<!-- <i class="ph-arrow-u-up-left ph-bold ph-lg"></i> -->
|
||||
<!-- <i :class="icon('ph-arrow-u-up-left')"></i> -->
|
||||
{{
|
||||
wordWithCount(
|
||||
note.repliesCount,
|
||||
|
|
@ -45,7 +45,7 @@
|
|||
}}
|
||||
</option>
|
||||
<option v-if="note.renoteCount > 0" value="renotes">
|
||||
<!-- <i class="ph-rocket-launch ph-bold ph-lg"></i> -->
|
||||
<!-- <i :class="icon('ph-rocket-launch')"></i> -->
|
||||
{{
|
||||
wordWithCount(
|
||||
note.renoteCount,
|
||||
|
|
@ -55,7 +55,7 @@
|
|||
}}
|
||||
</option>
|
||||
<option v-if="reactionsCount > 0" value="reactions">
|
||||
<!-- <i class="ph-smiley ph-bold ph-lg"></i> -->
|
||||
<!-- <i :class="icon('ph-smiley')"></i> -->
|
||||
{{
|
||||
wordWithCount(
|
||||
reactionsCount,
|
||||
|
|
@ -65,7 +65,7 @@
|
|||
}}
|
||||
</option>
|
||||
<option v-if="directQuotes?.length > 0" value="quotes">
|
||||
<!-- <i class="ph-quotes ph-bold ph-lg"></i> -->
|
||||
<!-- <i :class="icon('ph-quotes')"></i> -->
|
||||
{{
|
||||
wordWithCount(
|
||||
directQuotes.length,
|
||||
|
|
@ -75,7 +75,7 @@
|
|||
}}
|
||||
</option>
|
||||
<option v-if="clips?.length > 0" value="clips">
|
||||
<!-- <i class="ph-paperclip ph-bold ph-lg"></i> -->
|
||||
<!-- <i :class="icon('ph-paperclip')"></i> -->
|
||||
{{ wordWithCount(clips.length, i18n.ts.clip, i18n.ts.clips) }}
|
||||
</option>
|
||||
</MkTab>
|
||||
|
|
@ -188,6 +188,7 @@ import { getNoteMenu } from "@/scripts/get-note-menu";
|
|||
import { useNoteCapture } from "@/scripts/use-note-capture";
|
||||
import { deepClone } from "@/scripts/clone";
|
||||
import { stream } from "@/stream";
|
||||
// import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
note: firefish.entities.Note;
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@
|
|||
).toLocaleTimeString(),
|
||||
})
|
||||
"
|
||||
class="ph-pencil ph-bold"
|
||||
:class="icon('ph-pencil', false)"
|
||||
style="margin-left: 0.4rem"
|
||||
></i>
|
||||
</MkA>
|
||||
|
|
@ -58,6 +58,7 @@ import { notePage } from "@/filters/note";
|
|||
import { userPage } from "@/filters/user";
|
||||
import { i18n } from "@/i18n";
|
||||
import { pageWindow } from "@/os";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
note: firefish.entities.Note;
|
||||
|
|
|
|||
|
|
@ -67,7 +67,7 @@
|
|||
class="button _button"
|
||||
@click.stop="reply()"
|
||||
>
|
||||
<i class="ph-arrow-u-up-left ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-arrow-u-up-left')"></i>
|
||||
<template v-if="appearNote.repliesCount > 0">
|
||||
<p class="count">{{ appearNote.repliesCount }}</p>
|
||||
</template>
|
||||
|
|
@ -109,7 +109,7 @@
|
|||
class="button _button"
|
||||
@click.stop="react()"
|
||||
>
|
||||
<i class="ph-smiley ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-smiley')"></i>
|
||||
</button>
|
||||
<button
|
||||
v-if="
|
||||
|
|
@ -121,7 +121,7 @@
|
|||
class="button _button reacted"
|
||||
@click.stop="undoReact(appearNote)"
|
||||
>
|
||||
<i class="ph-minus ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-minus')"></i>
|
||||
</button>
|
||||
<XQuoteButton class="button" :note="appearNote" />
|
||||
<button
|
||||
|
|
@ -134,7 +134,7 @@
|
|||
class="button _button"
|
||||
@click.stop="translate"
|
||||
>
|
||||
<i class="ph-translate ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-translate')"></i>
|
||||
</button>
|
||||
<button
|
||||
ref="menuButton"
|
||||
|
|
@ -142,7 +142,7 @@
|
|||
class="button _button"
|
||||
@click.stop="menu()"
|
||||
>
|
||||
<i class="ph-dots-three-outline ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-dots-three-outline')"></i>
|
||||
</button>
|
||||
</footer>
|
||||
</div>
|
||||
|
|
@ -165,7 +165,7 @@
|
|||
<div class="line"></div>
|
||||
<MkA class="text _link" :to="notePage(note)"
|
||||
>{{ i18n.ts.continueThread }}
|
||||
<i class="ph-caret-double-right ph-bold ph-lg"></i
|
||||
<i :class="icon('ph-caret-double-right')"></i
|
||||
></MkA>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -192,7 +192,6 @@
|
|||
import { computed, inject, ref } from "vue";
|
||||
import type { Ref } from "vue";
|
||||
import type * as firefish from "firefish-js";
|
||||
import * as mfm from "mfm-js";
|
||||
import XNoteHeader from "@/components/MkNoteHeader.vue";
|
||||
import MkSubNoteContent from "@/components/MkSubNoteContent.vue";
|
||||
import XReactionsViewer from "@/components/MkReactionsViewer.vue";
|
||||
|
|
@ -216,6 +215,7 @@ import { i18n } from "@/i18n";
|
|||
import { useNoteCapture } from "@/scripts/use-note-capture";
|
||||
import { defaultStore } from "@/store";
|
||||
import { deepClone } from "@/scripts/clone";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
|
|
@ -412,7 +412,7 @@ function onContextmenu(ev: MouseEvent): void {
|
|||
text: notePage(appearNote.value),
|
||||
},
|
||||
{
|
||||
icon: "ph-browser ph-bold ph-lg",
|
||||
icon: `${icon("ph-browser")}`,
|
||||
text: i18n.ts.openInWindow,
|
||||
action: () => {
|
||||
os.pageWindow(notePage(appearNote.value));
|
||||
|
|
@ -420,7 +420,7 @@ function onContextmenu(ev: MouseEvent): void {
|
|||
},
|
||||
notePage(appearNote.value) != location.pathname
|
||||
? {
|
||||
icon: "ph-arrows-out-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-arrows-out-simple")}`,
|
||||
text: i18n.ts.showInPage,
|
||||
action: () => {
|
||||
router.push(
|
||||
|
|
@ -433,13 +433,13 @@ function onContextmenu(ev: MouseEvent): void {
|
|||
null,
|
||||
{
|
||||
type: "a",
|
||||
icon: "ph-arrow-square-out ph-bold ph-lg",
|
||||
icon: `${icon("ph-arrow-square-out")}`,
|
||||
text: i18n.ts.openInNewTab,
|
||||
href: notePage(appearNote.value),
|
||||
target: "_blank",
|
||||
},
|
||||
{
|
||||
icon: "ph-link-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-link-simple")}`,
|
||||
text: i18n.ts.copyLink,
|
||||
action: () => {
|
||||
copyToClipboard(`${url}${notePage(appearNote.value)}`);
|
||||
|
|
@ -448,7 +448,7 @@ function onContextmenu(ev: MouseEvent): void {
|
|||
note.value.user.host != null
|
||||
? {
|
||||
type: "a",
|
||||
icon: "ph-arrow-square-up-right ph-bold ph-lg",
|
||||
icon: `${icon("ph-arrow-square-up-right")}`,
|
||||
text: i18n.ts.showOnRemote,
|
||||
href: note.value.url ?? note.value.uri ?? "",
|
||||
target: "_blank",
|
||||
|
|
|
|||
|
|
@ -25,43 +25,43 @@
|
|||
<div class="sub-icon" :class="notification.type">
|
||||
<i
|
||||
v-if="notification.type === 'follow'"
|
||||
class="ph-hand-waving ph-bold"
|
||||
:class="icon('ph-hand-waving', false)"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="notification.type === 'receiveFollowRequest'"
|
||||
class="ph-clock ph-bold"
|
||||
:class="icon('ph-clock', false)"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="notification.type === 'followRequestAccepted'"
|
||||
class="ph-check ph-bold"
|
||||
:class="icon('ph-check', false)"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="notification.type === 'groupInvited'"
|
||||
class="ph-identification-card ph-bold"
|
||||
:class="icon('ph-identification-card', false)"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="notification.type === 'renote'"
|
||||
class="ph-rocket-launch ph-bold"
|
||||
:class="icon('ph-rocket-launch', false)"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="notification.type === 'reply'"
|
||||
class="ph-arrow-bend-up-left ph-bold"
|
||||
:class="icon('ph-arrow-bend-up-left', false)"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="notification.type === 'mention'"
|
||||
class="ph-at ph-bold"
|
||||
:class="icon('ph-at', false)"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="notification.type === 'quote'"
|
||||
class="ph-quotes ph-bold"
|
||||
:class="icon('ph-quotes', false)"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="notification.type === 'pollVote'"
|
||||
class="ph-microphone-stage ph-bold"
|
||||
:class="icon('ph-microphone-stage', false)"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="notification.type === 'pollEnded'"
|
||||
class="ph-microphone-stage ph-bold"
|
||||
:class="icon('ph-microphone-stage', false)"
|
||||
></i>
|
||||
<!-- notification.reaction が null になることはまずないが、ここでoptional chaining使うと一部ブラウザで刺さるので念の為 -->
|
||||
<XReactionIcon
|
||||
|
|
@ -122,7 +122,7 @@
|
|||
:nowrap="!full"
|
||||
:custom-emojis="notification.note.emojis"
|
||||
/>
|
||||
<i class="ph-quotes ph-fill ph-lg"></i>
|
||||
<i class="ph-quotes ph-fill"></i>
|
||||
</MkA>
|
||||
<MkA
|
||||
v-if="notification.type === 'renote'"
|
||||
|
|
@ -138,7 +138,7 @@
|
|||
:nowrap="!full"
|
||||
:custom-emojis="notification.note.renote.emojis"
|
||||
/>
|
||||
<i class="ph-quotes ph-fill ph-lg"></i>
|
||||
<i class="ph-quotes ph-fill"></i>
|
||||
</MkA>
|
||||
<MkA
|
||||
v-if="notification.type === 'reply'"
|
||||
|
|
@ -193,7 +193,7 @@
|
|||
:nowrap="!full"
|
||||
:custom-emojis="notification.note.emojis"
|
||||
/>
|
||||
<i class="ph-quotes ph-fill ph-lg"></i>
|
||||
<i class="ph-quotes ph-fill"></i>
|
||||
</MkA>
|
||||
<MkA
|
||||
v-if="notification.type === 'pollEnded'"
|
||||
|
|
@ -201,14 +201,14 @@
|
|||
:to="notePage(notification.note)"
|
||||
:title="getNoteSummary(notification.note)"
|
||||
>
|
||||
<i class="ph-quotes ph-fill ph-lg"></i>
|
||||
<i class="ph-quotes ph-fill"></i>
|
||||
<Mfm
|
||||
:text="getNoteSummary(notification.note)"
|
||||
:plain="true"
|
||||
:nowrap="!full"
|
||||
:custom-emojis="notification.note.emojis"
|
||||
/>
|
||||
<i class="ph-quotes ph-fill ph-lg"></i>
|
||||
<i class="ph-quotes ph-fill"></i>
|
||||
</MkA>
|
||||
<span
|
||||
v-if="notification.type === 'follow'"
|
||||
|
|
@ -287,6 +287,7 @@ import { stream } from "@/stream";
|
|||
import { useTooltip } from "@/scripts/use-tooltip";
|
||||
import { defaultStore } from "@/store";
|
||||
import { instance } from "@/instance";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="mk-notification-toast" :style="{ zIndex }">
|
||||
<transition
|
||||
:name="$store.state.animation ? 'notification-toast' : ''"
|
||||
:name="defaultStore.state.animation ? 'notification-toast' : ''"
|
||||
appear
|
||||
@after-leave="$emit('closed')"
|
||||
>
|
||||
|
|
@ -18,6 +18,7 @@
|
|||
import { onMounted, ref } from "vue";
|
||||
import XNotification from "@/components/MkNotification.vue";
|
||||
import * as os from "@/os";
|
||||
import { defaultStore } from "@/store";
|
||||
|
||||
defineProps<{
|
||||
notification: any; // TODO
|
||||
|
|
|
|||
|
|
@ -42,6 +42,7 @@ import { Router } from "@/nirax";
|
|||
import { i18n } from "@/i18n";
|
||||
import type { PageMetadata } from "@/scripts/page-metadata";
|
||||
import { provideMetadataReceiver } from "@/scripts/page-metadata";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
initialPath: string;
|
||||
|
|
@ -66,7 +67,7 @@ const buttonsLeft = computed(() => {
|
|||
|
||||
if (history.value.length > 1) {
|
||||
buttons.push({
|
||||
icon: "ph-caret-left ph-bold ph-lg",
|
||||
icon: `${icon("ph-caret-left")}`,
|
||||
onClick: back,
|
||||
});
|
||||
}
|
||||
|
|
@ -76,7 +77,7 @@ const buttonsLeft = computed(() => {
|
|||
const buttonsRight = computed(() => {
|
||||
const buttons = [
|
||||
{
|
||||
icon: "ph-arrows-out-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-arrows-out-simple")}`,
|
||||
title: i18n.ts.showInPage,
|
||||
onClick: expand,
|
||||
},
|
||||
|
|
@ -99,17 +100,17 @@ provide("shouldHeaderThin", true);
|
|||
|
||||
const contextmenu = computed(() => [
|
||||
{
|
||||
icon: "ph-arrows-out-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-arrows-out-simple")}`,
|
||||
text: i18n.ts.showInPage,
|
||||
action: expand,
|
||||
},
|
||||
{
|
||||
icon: "ph-arrow-square-out ph-bold ph-lg",
|
||||
icon: `${icon("ph-arrow-square-out")}`,
|
||||
text: i18n.ts.popout,
|
||||
action: popout,
|
||||
},
|
||||
{
|
||||
icon: "ph-arrow-square-out ph-bold ph-lg",
|
||||
icon: `${icon("ph-arrow-square-out")}`,
|
||||
text: i18n.ts.openInNewTab,
|
||||
action: () => {
|
||||
window.open(url + router.getCurrentPath(), "_blank");
|
||||
|
|
@ -117,7 +118,7 @@ const contextmenu = computed(() => [
|
|||
},
|
||||
},
|
||||
{
|
||||
icon: "ph-link-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-link-simple")}`,
|
||||
text: i18n.ts.copyLink,
|
||||
action: () => {
|
||||
copyToClipboard(url + router.getCurrentPath());
|
||||
|
|
|
|||
|
|
@ -1,5 +1,8 @@
|
|||
<template>
|
||||
<transition :name="$store.state.animation ? 'fade' : ''" mode="out-in">
|
||||
<transition
|
||||
:name="defaultStore.state.animation ? 'fade' : ''"
|
||||
mode="out-in"
|
||||
>
|
||||
<MkLoading v-if="fetching" />
|
||||
|
||||
<MkError v-else-if="error" @retry="init()" />
|
||||
|
|
@ -44,7 +47,8 @@
|
|||
<MkButton
|
||||
v-if="!moreFetching"
|
||||
v-appear="
|
||||
$store.state.enableInfiniteScroll && !disableAutoLoad
|
||||
defaultStore.state.enableInfiniteScroll &&
|
||||
!disableAutoLoad
|
||||
? fetchMore
|
||||
: null
|
||||
"
|
||||
|
|
@ -75,6 +79,7 @@ import {
|
|||
} from "@/scripts/scroll";
|
||||
import MkButton from "@/components/MkButton.vue";
|
||||
import { i18n } from "@/i18n";
|
||||
import { defaultStore } from "@/store";
|
||||
|
||||
export interface Paging<
|
||||
E extends keyof firefish.Endpoints = keyof firefish.Endpoints,
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@
|
|||
></div>
|
||||
<span>
|
||||
<template v-if="choice.isVoted"
|
||||
><i class="ph-check ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-check')"></i
|
||||
></template>
|
||||
<Mfm
|
||||
:text="choice.text"
|
||||
|
|
@ -59,6 +59,7 @@ import { pleaseLogin } from "@/scripts/please-login";
|
|||
import * as os from "@/os";
|
||||
import { i18n } from "@/i18n";
|
||||
import { useInterval } from "@/scripts/use-interval";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
note: firefish.entities.Note;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="zmdxowus">
|
||||
<p v-if="choices.length < 2" class="caution">
|
||||
<i class="ph-warning ph-bold ph-lg"></i
|
||||
<i :class="icon('ph-warning')"></i
|
||||
>{{ i18n.ts._poll.noOnlyOneChoice }}
|
||||
</p>
|
||||
<ul>
|
||||
|
|
@ -19,7 +19,7 @@
|
|||
:aria-label="i18n.t('remove')"
|
||||
@click="remove(i)"
|
||||
>
|
||||
<i class="ph-x ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-x')"></i>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
|
|
@ -83,6 +83,7 @@ import MkButton from "./MkButton.vue";
|
|||
import { formatDateTimeString } from "@/scripts/format-time-string";
|
||||
import { addTime } from "@/scripts/time";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
modelValue: {
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@
|
|||
>
|
||||
<header>
|
||||
<button v-if="!fixed" class="cancel _button" @click="cancel">
|
||||
<i class="ph-x ph-bold ph-lg" :aria-label="i18n.t('close')"></i>
|
||||
<i :class="icon('ph-x')" :aria-label="i18n.t('close')"></i>
|
||||
</button>
|
||||
<button
|
||||
v-if="$props.editId == null"
|
||||
|
|
@ -29,7 +29,7 @@
|
|||
>{{ maxTextLength - textLength }}</span
|
||||
>
|
||||
<span v-if="localOnly" class="local-only"
|
||||
><i class="ph-users ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-users')"></i
|
||||
></span>
|
||||
<button
|
||||
ref="visibilityButton"
|
||||
|
|
@ -39,16 +39,16 @@
|
|||
@click="setVisibility"
|
||||
>
|
||||
<span v-if="visibility === 'public'"
|
||||
><i class="ph-planet ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-planet')"></i
|
||||
></span>
|
||||
<span v-if="visibility === 'home'"
|
||||
><i class="ph-house ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-house')"></i
|
||||
></span>
|
||||
<span v-if="visibility === 'followers'"
|
||||
><i class="ph-lock ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-lock')"></i
|
||||
></span>
|
||||
<span v-if="visibility === 'specified'"
|
||||
><i class="ph-envelope-simple-open ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-envelope-simple-open')"></i
|
||||
></span>
|
||||
</button>
|
||||
<button
|
||||
|
|
@ -57,7 +57,7 @@
|
|||
:class="{ active: showPreview }"
|
||||
@click="showPreview = !showPreview"
|
||||
>
|
||||
<i class="ph-binoculars ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-binoculars')"></i>
|
||||
</button>
|
||||
<button
|
||||
class="submit _buttonGradate"
|
||||
|
|
@ -68,11 +68,13 @@
|
|||
{{ submitText
|
||||
}}<i
|
||||
:class="
|
||||
icon(
|
||||
reply
|
||||
? 'ph-arrow-u-up-left ph-bold ph-lg'
|
||||
? 'ph-arrow-u-up-left'
|
||||
: renote
|
||||
? 'ph-quotes ph-bold ph-lg'
|
||||
: 'ph-paper-plane-tilt ph-bold ph-lg'
|
||||
? 'ph-quotes'
|
||||
: 'ph-paper-plane-tilt',
|
||||
)
|
||||
"
|
||||
></i>
|
||||
</button>
|
||||
|
|
@ -82,14 +84,14 @@
|
|||
<XNoteSimple v-if="reply" class="preview" :note="reply" />
|
||||
<XNoteSimple v-if="renote" class="preview" :note="renote" />
|
||||
<div v-if="quoteId" class="with-quote">
|
||||
<i class="ph-quotes ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-quotes')"></i>
|
||||
{{ i18n.ts.quoteAttached
|
||||
}}<button
|
||||
class="_button"
|
||||
:aria-label="i18n.t('removeQuote')"
|
||||
@click="quoteId = null"
|
||||
>
|
||||
<i class="ph-x ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-x')"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div v-if="visibility === 'specified'" class="to-specified">
|
||||
|
|
@ -102,11 +104,11 @@
|
|||
:aria-label="i18n.t('removeRecipient')"
|
||||
@click="removeVisibleUser(u)"
|
||||
>
|
||||
<i class="ph-x ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-x')"></i>
|
||||
</button>
|
||||
</span>
|
||||
<button class="_button" @click="addVisibleUser">
|
||||
<i class="ph-plus ph-bold ph-md ph-fw ph-lg"></i>
|
||||
<i :class="icon('ph-plus ph-md ph-fw')"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -164,7 +166,7 @@
|
|||
class="_button"
|
||||
@click="chooseFileFrom"
|
||||
>
|
||||
<i class="ph-upload ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-upload')"></i>
|
||||
</button>
|
||||
<button
|
||||
v-tooltip="i18n.ts.poll"
|
||||
|
|
@ -172,7 +174,7 @@
|
|||
:class="{ active: poll }"
|
||||
@click="togglePoll"
|
||||
>
|
||||
<i class="ph-microphone-stage ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-microphone-stage')"></i>
|
||||
</button>
|
||||
<button
|
||||
v-tooltip="i18n.ts.useCw"
|
||||
|
|
@ -180,14 +182,14 @@
|
|||
:class="{ active: useCw }"
|
||||
@click="useCw = !useCw"
|
||||
>
|
||||
<i class="ph-eye-slash ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-eye-slash')"></i>
|
||||
</button>
|
||||
<button
|
||||
v-tooltip="i18n.ts.mention"
|
||||
class="_button"
|
||||
@click="insertMention"
|
||||
>
|
||||
<i class="ph-at ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-at')"></i>
|
||||
</button>
|
||||
<button
|
||||
v-tooltip="i18n.ts.hashtags"
|
||||
|
|
@ -195,14 +197,14 @@
|
|||
:class="{ active: withHashtags }"
|
||||
@click="withHashtags = !withHashtags"
|
||||
>
|
||||
<i class="ph-hash ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-hash')"></i>
|
||||
</button>
|
||||
<button
|
||||
v-tooltip="i18n.ts.emoji"
|
||||
class="_button"
|
||||
@click="insertEmoji"
|
||||
>
|
||||
<i class="ph-smiley ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-smiley')"></i>
|
||||
</button>
|
||||
<button
|
||||
v-if="postFormActions.length > 0"
|
||||
|
|
@ -210,7 +212,7 @@
|
|||
class="_button"
|
||||
@click="showActions"
|
||||
>
|
||||
<i class="ph-plug ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-plug')"></i>
|
||||
</button>
|
||||
<!-- v-if="showMfmCheatsheet" -->
|
||||
<button
|
||||
|
|
@ -218,7 +220,7 @@
|
|||
class="_button right"
|
||||
@click="openCheatSheet"
|
||||
>
|
||||
<i class="ph-question ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-question')"></i>
|
||||
</button>
|
||||
</footer>
|
||||
<datalist id="hashtags">
|
||||
|
|
@ -276,6 +278,7 @@ import { deepClone } from "@/scripts/clone";
|
|||
import XCheatSheet from "@/components/MkCheatSheetDialog.vue";
|
||||
import preprocess from "@/scripts/preprocess";
|
||||
import { vibrate } from "@/scripts/vibrate";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const modal = inject("modal");
|
||||
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@
|
|||
fit="cover"
|
||||
/>
|
||||
<div v-if="element.isSensitive" class="sensitive">
|
||||
<i class="ph-warning ph-bold ph-lg icon"></i>
|
||||
<i :class="icon('ph-warning icon')"></i>
|
||||
</div>
|
||||
</div>
|
||||
</VueDraggable>
|
||||
|
|
@ -30,11 +30,13 @@
|
|||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed, defineAsyncComponent, ref } from "vue";
|
||||
import { computed, defineAsyncComponent } from "vue";
|
||||
import { VueDraggable } from "vue-draggable-plus";
|
||||
import MkDriveFileThumbnail from "@/components/MkDriveFileThumbnail.vue";
|
||||
import * as os from "@/os";
|
||||
import { i18n } from "@/i18n";
|
||||
import { defaultStore } from "@/store";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps({
|
||||
files: {
|
||||
|
|
@ -124,7 +126,7 @@ function showFileMenu(file, ev: MouseEvent) {
|
|||
[
|
||||
{
|
||||
text: i18n.ts.renameFile,
|
||||
icon: "ph-cursor-text ph-bold ph-lg",
|
||||
icon: `${icon("ph-cursor-text")}`,
|
||||
action: () => {
|
||||
rename(file);
|
||||
},
|
||||
|
|
@ -133,23 +135,21 @@ function showFileMenu(file, ev: MouseEvent) {
|
|||
text: file.isSensitive
|
||||
? i18n.ts.unmarkAsSensitive
|
||||
: i18n.ts.markAsSensitive,
|
||||
icon: file.isSensitive
|
||||
? "ph-eye ph-bold ph-lg"
|
||||
: "ph-eye-slash ph-bold ph-lg",
|
||||
icon: file.isSensitive ? "ph-eye ph-lg" : "ph-eye-slash ph-lg",
|
||||
action: () => {
|
||||
toggleSensitive(file);
|
||||
},
|
||||
},
|
||||
{
|
||||
text: i18n.ts.describeFile,
|
||||
icon: "ph-subtitles ph-bold ph-lg",
|
||||
icon: `${icon("ph-subtitles")}`,
|
||||
action: () => {
|
||||
describe(file);
|
||||
},
|
||||
},
|
||||
{
|
||||
text: i18n.ts.attachCancel,
|
||||
icon: "ph-x ph-bold ph-lg",
|
||||
icon: `${icon("ph-x")}`,
|
||||
action: () => {
|
||||
detachMedia(file.id);
|
||||
},
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
<template>
|
||||
<button
|
||||
v-if="canRenote && $store.state.seperateRenoteQuote"
|
||||
v-if="canRenote && defaultStore.state.seperateRenoteQuote"
|
||||
v-tooltip.noDelay.bottom="i18n.ts.quote"
|
||||
class="eddddedb _button"
|
||||
@click.stop="quote()"
|
||||
>
|
||||
<i class="ph-quotes ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-quotes')"></i>
|
||||
</button>
|
||||
</template>
|
||||
|
||||
|
|
@ -16,6 +16,8 @@ import { pleaseLogin } from "@/scripts/please-login";
|
|||
import * as os from "@/os";
|
||||
import { $i } from "@/account";
|
||||
import { i18n } from "@/i18n";
|
||||
import { defaultStore } from "@/store";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
note: Note;
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
:class="{ renoted: hasRenotedBefore }"
|
||||
@click.stop="renote(false, $event)"
|
||||
>
|
||||
<i class="ph-rocket-launch ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-rocket-launch')"></i>
|
||||
<p v-if="count > 0 && !detailedView" class="count">{{ count }}</p>
|
||||
</button>
|
||||
<button
|
||||
|
|
@ -16,7 +16,7 @@
|
|||
class="_button"
|
||||
disabled="true"
|
||||
>
|
||||
<i class="ph-rocket-launch ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-rocket-launch')"></i>
|
||||
</button>
|
||||
</template>
|
||||
|
||||
|
|
@ -33,6 +33,7 @@ import { i18n } from "@/i18n";
|
|||
import { defaultStore } from "@/store";
|
||||
import type { MenuItem } from "@/types/menu";
|
||||
import { vibrate } from "@/scripts/vibrate";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
note: firefish.entities.Note;
|
||||
|
|
@ -88,7 +89,7 @@ const renote = (viaKeyboard = false, ev?: MouseEvent) => {
|
|||
if (props.note.visibility === "public") {
|
||||
buttonActions.push({
|
||||
text: i18n.ts.renote,
|
||||
icon: "ph-rocket-launch ph-bold ph-lg",
|
||||
icon: `${icon("ph-rocket-launch")}`,
|
||||
danger: false,
|
||||
action: () => {
|
||||
os.api("notes/create", {
|
||||
|
|
@ -115,7 +116,7 @@ const renote = (viaKeyboard = false, ev?: MouseEvent) => {
|
|||
if (["public", "home"].includes(props.note.visibility)) {
|
||||
buttonActions.push({
|
||||
text: `${i18n.ts.renote} (${i18n.ts._visibility.home})`,
|
||||
icon: "ph-house ph-bold ph-lg",
|
||||
icon: `${icon("ph-house")}`,
|
||||
danger: false,
|
||||
action: () => {
|
||||
os.api("notes/create", {
|
||||
|
|
@ -142,7 +143,7 @@ const renote = (viaKeyboard = false, ev?: MouseEvent) => {
|
|||
if (props.note.visibility === "specified") {
|
||||
buttonActions.push({
|
||||
text: `${i18n.ts.renote} (${i18n.ts.recipient})`,
|
||||
icon: "ph-envelope-simple-open ph-bold ph-lg",
|
||||
icon: `${icon("ph-envelope-simple-open")}`,
|
||||
danger: false,
|
||||
action: () => {
|
||||
os.api("notes/create", {
|
||||
|
|
@ -168,7 +169,7 @@ const renote = (viaKeyboard = false, ev?: MouseEvent) => {
|
|||
} else {
|
||||
buttonActions.push({
|
||||
text: `${i18n.ts.renote} (${i18n.ts._visibility.followers})`,
|
||||
icon: "ph-lock ph-bold ph-lg",
|
||||
icon: `${icon("ph-lock")}`,
|
||||
danger: false,
|
||||
action: () => {
|
||||
os.api("notes/create", {
|
||||
|
|
@ -195,7 +196,7 @@ const renote = (viaKeyboard = false, ev?: MouseEvent) => {
|
|||
if (canRenote.value) {
|
||||
buttonActions.push({
|
||||
text: `${i18n.ts.renote} (${i18n.ts.local})`,
|
||||
icon: "ph-users ph-bold ph-lg",
|
||||
icon: `${icon("ph-users")}`,
|
||||
danger: false,
|
||||
action: () => {
|
||||
vibrate([30, 30, 60]);
|
||||
|
|
@ -234,7 +235,7 @@ const renote = (viaKeyboard = false, ev?: MouseEvent) => {
|
|||
if (!defaultStore.state.seperateRenoteQuote) {
|
||||
buttonActions.push({
|
||||
text: i18n.ts.quote,
|
||||
icon: "ph-quotes ph-bold ph-lg",
|
||||
icon: `${icon("ph-quotes")}`,
|
||||
danger: false,
|
||||
action: () => {
|
||||
os.post({
|
||||
|
|
@ -247,7 +248,7 @@ const renote = (viaKeyboard = false, ev?: MouseEvent) => {
|
|||
if (hasRenotedBefore.value) {
|
||||
buttonActions.push({
|
||||
text: i18n.ts.unrenote,
|
||||
icon: "ph-trash ph-bold ph-lg",
|
||||
icon: `${icon("ph-trash")}`,
|
||||
danger: true,
|
||||
action: () => {
|
||||
os.api("notes/unrenote", {
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@
|
|||
data-cy-signin-password
|
||||
>
|
||||
<template #prefix
|
||||
><i class="ph-lock ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-lock')"></i
|
||||
></template>
|
||||
<template #caption
|
||||
><button
|
||||
|
|
@ -96,7 +96,7 @@
|
|||
>
|
||||
<template #label>{{ i18n.ts.password }}</template>
|
||||
<template #prefix
|
||||
><i class="ph-lock ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-lock')"></i
|
||||
></template>
|
||||
</MkInput>
|
||||
<MkInput
|
||||
|
|
@ -109,7 +109,7 @@
|
|||
>
|
||||
<template #label>{{ i18n.ts._2fa.token }}</template>
|
||||
<template #prefix
|
||||
><i class="ph-poker-chip ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-poker-chip')"></i
|
||||
></template>
|
||||
</MkInput>
|
||||
<MkButton
|
||||
|
|
@ -138,6 +138,7 @@ import { byteify, hexify } from "@/scripts/2fa";
|
|||
import * as os from "@/os";
|
||||
import { login } from "@/account";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const signing = ref(false);
|
||||
const user = ref(null);
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@
|
|||
@update:modelValue="onChangeInvitationCode"
|
||||
>
|
||||
<template #label>{{ i18n.ts.invitationCode }}</template>
|
||||
<template #prefix><i class="ph-key ph-bold ph-lg"></i></template>
|
||||
<template #prefix><i :class="icon('ph-key')"></i></template>
|
||||
</MkInput>
|
||||
<div
|
||||
v-if="
|
||||
|
|
@ -47,51 +47,49 @@
|
|||
v-tooltip:dialog="i18n.ts.usernameInfo"
|
||||
class="_button _help"
|
||||
>
|
||||
<i class="ph-question ph-bold"></i></div
|
||||
<i :class="icon('ph-question', false)"></i></div
|
||||
></template>
|
||||
<template #prefix>@</template>
|
||||
<template #suffix>@{{ host }}</template>
|
||||
<template #caption>
|
||||
<span v-if="usernameState === 'wait'" style="color: #6e6a86"
|
||||
><i
|
||||
class="ph-circle-notch ph-bold ph-lg fa-pulse ph-fw ph-lg"
|
||||
></i>
|
||||
><i :class="icon('ph-circle-notch fa-pulse ph-fw')"></i>
|
||||
{{ i18n.ts.checking }}</span
|
||||
>
|
||||
<span
|
||||
v-else-if="usernameState === 'ok'"
|
||||
style="color: var(--success)"
|
||||
><i class="ph-check ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-check ph-fw')"></i>
|
||||
{{ i18n.ts.available }}</span
|
||||
>
|
||||
<span
|
||||
v-else-if="usernameState === 'unavailable'"
|
||||
style="color: var(--error)"
|
||||
><i class="ph-warning ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-warning ph-fw')"></i>
|
||||
{{ i18n.ts.unavailable }}</span
|
||||
>
|
||||
<span
|
||||
v-else-if="usernameState === 'error'"
|
||||
style="color: var(--error)"
|
||||
><i class="ph-warning ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-warning ph-fw')"></i>
|
||||
{{ i18n.ts.error }}</span
|
||||
>
|
||||
<span
|
||||
v-else-if="usernameState === 'invalid-format'"
|
||||
style="color: var(--error)"
|
||||
><i class="ph-warning ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-warning ph-fw')"></i>
|
||||
{{ i18n.ts.usernameInvalidFormat }}</span
|
||||
>
|
||||
<span
|
||||
v-else-if="usernameState === 'min-range'"
|
||||
style="color: var(--error)"
|
||||
><i class="ph-warning ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-warning ph-fw')"></i>
|
||||
{{ i18n.ts.tooShort }}</span
|
||||
>
|
||||
<span
|
||||
v-else-if="usernameState === 'max-range'"
|
||||
style="color: var(--error)"
|
||||
><i class="ph-warning ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-warning ph-fw')"></i>
|
||||
{{ i18n.ts.tooLong }}</span
|
||||
>
|
||||
</template>
|
||||
|
|
@ -113,64 +111,62 @@
|
|||
v-tooltip:dialog="i18n.ts._signup.emailAddressInfo"
|
||||
class="_button _help"
|
||||
>
|
||||
<i class="ph-question ph-bold"></i></div
|
||||
<i :class="icon('ph-question', false)"></i></div
|
||||
></template>
|
||||
<template #prefix
|
||||
><i class="ph-envelope-simple-open ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-envelope-simple-open')"></i
|
||||
></template>
|
||||
<template #caption>
|
||||
<span v-if="emailState === 'wait'" style="color: #6e6a86"
|
||||
><i
|
||||
class="ph-circle-notch ph-bold ph-lg fa-pulse ph-fw ph-lg"
|
||||
></i>
|
||||
><i :class="icon('ph-circle-notch fa-pulse ph-fw')"></i>
|
||||
{{ i18n.ts.checking }}</span
|
||||
>
|
||||
<span
|
||||
v-else-if="emailState === 'ok'"
|
||||
style="color: var(--success)"
|
||||
><i class="ph-check ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-check ph-fw')"></i>
|
||||
{{ i18n.ts.available }}</span
|
||||
>
|
||||
<span
|
||||
v-else-if="emailState === 'unavailable:used'"
|
||||
style="color: var(--error)"
|
||||
><i class="ph-warning ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-warning ph-fw')"></i>
|
||||
{{ i18n.ts._emailUnavailable.used }}</span
|
||||
>
|
||||
<span
|
||||
v-else-if="emailState === 'unavailable:format'"
|
||||
style="color: var(--error)"
|
||||
><i class="ph-warning ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-warning ph-fw')"></i>
|
||||
{{ i18n.ts._emailUnavailable.format }}</span
|
||||
>
|
||||
<span
|
||||
v-else-if="emailState === 'unavailable:disposable'"
|
||||
style="color: var(--error)"
|
||||
><i class="ph-warning ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-warning ph-fw')"></i>
|
||||
{{ i18n.ts._emailUnavailable.disposable }}</span
|
||||
>
|
||||
<span
|
||||
v-else-if="emailState === 'unavailable:mx'"
|
||||
style="color: var(--error)"
|
||||
><i class="ph-warning ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-warning ph-fw')"></i>
|
||||
{{ i18n.ts._emailUnavailable.mx }}</span
|
||||
>
|
||||
<span
|
||||
v-else-if="emailState === 'unavailable:smtp'"
|
||||
style="color: var(--error)"
|
||||
><i class="ph-warning ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-warning ph-fw')"></i>
|
||||
{{ i18n.ts._emailUnavailable.smtp }}</span
|
||||
>
|
||||
<span
|
||||
v-else-if="emailState === 'unavailable'"
|
||||
style="color: var(--error)"
|
||||
><i class="ph-warning ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-warning ph-fw')"></i>
|
||||
{{ i18n.ts.unavailable }}</span
|
||||
>
|
||||
<span
|
||||
v-else-if="emailState === 'error'"
|
||||
style="color: var(--error)"
|
||||
><i class="ph-warning ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-warning ph-fw')"></i>
|
||||
{{ i18n.ts.error }}</span
|
||||
>
|
||||
</template>
|
||||
|
|
@ -185,26 +181,24 @@
|
|||
@update:modelValue="onChangePassword"
|
||||
>
|
||||
<template #label>{{ i18n.ts.password }}</template>
|
||||
<template #prefix
|
||||
><i class="ph-lock ph-bold ph-lg"></i
|
||||
></template>
|
||||
<template #prefix><i :class="icon('ph-lock')"></i></template>
|
||||
<template #caption>
|
||||
<span
|
||||
v-if="passwordStrength == 'low'"
|
||||
style="color: var(--error)"
|
||||
><i class="ph-warning ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-warning ph-fw')"></i>
|
||||
{{ i18n.ts.weakPassword }}</span
|
||||
>
|
||||
<span
|
||||
v-if="passwordStrength == 'medium'"
|
||||
style="color: var(--warn)"
|
||||
><i class="ph-check ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-check ph-fw')"></i>
|
||||
{{ i18n.ts.normalPassword }}</span
|
||||
>
|
||||
<span
|
||||
v-if="passwordStrength == 'high'"
|
||||
style="color: var(--success)"
|
||||
><i class="ph-check ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-check ph-fw')"></i>
|
||||
{{ i18n.ts.strongPassword }}</span
|
||||
>
|
||||
</template>
|
||||
|
|
@ -221,20 +215,18 @@
|
|||
<template #label
|
||||
>{{ i18n.ts.password }} ({{ i18n.ts.retype }})</template
|
||||
>
|
||||
<template #prefix
|
||||
><i class="ph-lock ph-bold ph-lg"></i
|
||||
></template>
|
||||
<template #prefix><i :class="icon('ph-lock')"></i></template>
|
||||
<template #caption>
|
||||
<span
|
||||
v-if="passwordRetypeState == 'match'"
|
||||
style="color: var(--success)"
|
||||
><i class="ph-check ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-check ph-fw')"></i>
|
||||
{{ i18n.ts.passwordMatched }}</span
|
||||
>
|
||||
<span
|
||||
v-if="passwordRetypeState == 'not-match'"
|
||||
style="color: var(--error)"
|
||||
><i class="ph-warning ph-bold ph-lg ph-fw ph-lg"></i>
|
||||
><i :class="icon('ph-warning ph-fw')"></i>
|
||||
{{ i18n.ts.passwordNotMatched }}</span
|
||||
>
|
||||
</template>
|
||||
|
|
@ -297,6 +289,7 @@ import * as os from "@/os";
|
|||
import { login } from "@/account";
|
||||
import { instance } from "@/instance";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
|
|
|
|||
|
|
@ -31,13 +31,13 @@
|
|||
</svg>
|
||||
<i
|
||||
v-else-if="instance.defaultReaction === '👍'"
|
||||
class="ph-thumbs-up ph-bold ph-lg"
|
||||
:class="icon('ph-thumbs-up')"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="instance.defaultReaction === '❤️'"
|
||||
class="ph-heart ph-bold ph-lg"
|
||||
:class="icon('ph-heart')"
|
||||
></i>
|
||||
<i v-else class="ph-star ph-bold ph-lg"></i>
|
||||
<i v-else :class="icon('ph-star')"></i>
|
||||
</button>
|
||||
</template>
|
||||
|
||||
|
|
@ -49,6 +49,7 @@ import * as os from "@/os";
|
|||
import { defaultStore } from "@/store";
|
||||
import { i18n } from "@/i18n";
|
||||
import { instance } from "@/instance";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
note: Note;
|
||||
|
|
|
|||
|
|
@ -10,30 +10,26 @@
|
|||
<span v-if="!reacted">
|
||||
<i
|
||||
v-if="instance.defaultReaction === '👍'"
|
||||
class="ph-thumbs-up ph-bold ph-lg"
|
||||
:class="icon('ph-thumbs-up')"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="instance.defaultReaction === '❤️'"
|
||||
class="ph-heart ph-bold ph-lg"
|
||||
:class="icon('ph-heart')"
|
||||
></i>
|
||||
<i v-else class="ph-star ph-bold ph-lg"></i>
|
||||
<i v-else :class="icon('ph-star')"></i>
|
||||
</span>
|
||||
<span v-else>
|
||||
<i
|
||||
v-if="instance.defaultReaction === '👍'"
|
||||
class="ph-thumbs-up ph-bold ph-lg ph-fill"
|
||||
class="ph-thumbs-up ph-lg ph-fill"
|
||||
:class="$style.yellow"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="instance.defaultReaction === '❤️'"
|
||||
class="ph-heart ph-bold ph-lg ph-fill"
|
||||
class="ph-heart ph-lg ph-fill"
|
||||
:class="$style.red"
|
||||
></i>
|
||||
<i
|
||||
v-else
|
||||
class="ph-star ph-bold ph-lg ph-fill"
|
||||
:class="$style.yellow"
|
||||
></i>
|
||||
<i v-else class="ph-star ph-lg ph-fill" :class="$style.yellow"></i>
|
||||
</span>
|
||||
<template v-if="count > 0"
|
||||
><p class="count">{{ count }}</p></template
|
||||
|
|
@ -51,6 +47,7 @@ import * as os from "@/os";
|
|||
import { i18n } from "@/i18n";
|
||||
import { instance } from "@/instance";
|
||||
import { useTooltip } from "@/scripts/use-tooltip";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
note: Note;
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
class="reply-icon"
|
||||
@click.stop
|
||||
>
|
||||
<i class="ph-quotes ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-quotes')"></i>
|
||||
</MkA>
|
||||
<MkA
|
||||
v-else-if="!detailed && note.replyId"
|
||||
|
|
@ -23,7 +23,7 @@
|
|||
class="reply-icon"
|
||||
@click.stop
|
||||
>
|
||||
<i class="ph-arrow-bend-left-up ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-arrow-bend-left-up')"></i>
|
||||
</MkA>
|
||||
<Mfm
|
||||
v-if="note.cw != ''"
|
||||
|
|
@ -81,7 +81,7 @@
|
|||
class="reply-icon"
|
||||
@click.stop
|
||||
>
|
||||
<i class="ph-quotes ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-quotes')"></i>
|
||||
</MkA>
|
||||
<MkA
|
||||
v-else-if="!detailed && note.replyId"
|
||||
|
|
@ -95,7 +95,7 @@
|
|||
class="reply-icon"
|
||||
@click.stop
|
||||
>
|
||||
<i class="ph-arrow-bend-left-up ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-arrow-bend-left-up')"></i>
|
||||
</MkA>
|
||||
</template>
|
||||
<Mfm
|
||||
|
|
@ -162,10 +162,12 @@
|
|||
@click.stop="toggleMfm"
|
||||
>
|
||||
<template v-if="disableMfm">
|
||||
<i class="ph-play ph-bold"></i> {{ i18n.ts._mfm.play }}
|
||||
<i :class="icon('ph-play', false)"></i>
|
||||
{{ i18n.ts._mfm.play }}
|
||||
</template>
|
||||
<template v-else>
|
||||
<i class="ph-stop ph-bold"></i> {{ i18n.ts._mfm.stop }}
|
||||
<i :class="icon('ph-stop', false)"></i>
|
||||
{{ i18n.ts._mfm.stop }}
|
||||
</template>
|
||||
</MkButton>
|
||||
<!-- <div
|
||||
|
|
@ -192,6 +194,7 @@ import { extractUrlFromMfm } from "@/scripts/extract-url-from-mfm";
|
|||
import { extractMfmWithAnimation } from "@/scripts/extract-mfm";
|
||||
import { i18n } from "@/i18n";
|
||||
import { defaultStore } from "@/store";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
note: firefish.entities.Note;
|
||||
|
|
|
|||
|
|
@ -12,16 +12,16 @@
|
|||
<div v-if="queue > 0" class="new">
|
||||
<button
|
||||
class="_buttonPrimary _shadow"
|
||||
:class="{ instant: !$store.state.animation }"
|
||||
:class="{ instant: !defaultStore.state.animation }"
|
||||
@click="tlComponent.scrollTop()"
|
||||
>
|
||||
{{ i18n.ts.newNoteRecived }}
|
||||
<i class="ph-arrow-up ph-bold"></i>
|
||||
<i :class="icon('ph-arrow-up', false)"></i>
|
||||
</button>
|
||||
</div>
|
||||
<XNotes
|
||||
ref="tlComponent"
|
||||
:no-gap="!$store.state.showGapBetweenNotesInTimeline"
|
||||
:no-gap="!defaultStore.state.showGapBetweenNotesInTimeline"
|
||||
:pagination="pagination"
|
||||
@queue="(x) => (queue = x)"
|
||||
/>
|
||||
|
|
@ -36,6 +36,7 @@ import * as sound from "@/scripts/sound";
|
|||
import { $i } from "@/account";
|
||||
import { i18n } from "@/i18n";
|
||||
import { defaultStore } from "@/store";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
src: string;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="mk-toast">
|
||||
<transition
|
||||
:name="$store.state.animation ? 'toast' : ''"
|
||||
:name="defaultStore.state.animation ? 'toast' : ''"
|
||||
appear
|
||||
@after-leave="emit('closed')"
|
||||
>
|
||||
|
|
@ -20,6 +20,7 @@
|
|||
<script lang="ts" setup>
|
||||
import { onMounted, ref } from "vue";
|
||||
import * as os from "@/os";
|
||||
import { defaultStore } from "@/store";
|
||||
|
||||
defineProps<{
|
||||
message: string;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<transition
|
||||
:name="$store.state.animation ? 'tooltip' : ''"
|
||||
:name="defaultStore.state.animation ? 'tooltip' : ''"
|
||||
appear
|
||||
@after-leave="emit('closed')"
|
||||
>
|
||||
|
|
@ -22,6 +22,7 @@
|
|||
import { nextTick, onMounted, onUnmounted, ref } from "vue";
|
||||
import * as os from "@/os";
|
||||
import { calcPopupPosition } from "@/scripts/popup-position";
|
||||
import { defaultStore } from "@/store";
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@
|
|||
:disabled="tutorial === 0"
|
||||
@click="tutorial--"
|
||||
>
|
||||
<i class="ph-caret-left ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-caret-left')"></i>
|
||||
</button>
|
||||
<span>{{ tutorial + 1 }} / 6</span>
|
||||
<button
|
||||
|
|
@ -25,7 +25,7 @@
|
|||
:disabled="tutorial === 5"
|
||||
@click="tutorial++"
|
||||
>
|
||||
<i class="ph-caret-right ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-caret-right')"></i>
|
||||
</button>
|
||||
</div>
|
||||
<MkButton
|
||||
|
|
@ -33,18 +33,18 @@
|
|||
class="ok"
|
||||
primary
|
||||
@click="close"
|
||||
><i class="ph-check ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-check')"></i>
|
||||
{{ i18n.ts.gotIt }}</MkButton
|
||||
>
|
||||
<MkButton v-else class="ok" primary @click="tutorial++"
|
||||
><i class="ph-check ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-check')"></i>
|
||||
{{ i18n.ts.next }}</MkButton
|
||||
>
|
||||
</div>
|
||||
<Transition name="fade">
|
||||
<section v-if="tutorial === 0" key="1" class="_content">
|
||||
<h2 class="_title title">
|
||||
<i class="ph-info ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-info')"></i>
|
||||
{{ i18n.ts._tutorial.title }}
|
||||
</h2>
|
||||
<h3>{{ i18n.ts._tutorial.step1_1 }}</h3>
|
||||
|
|
@ -53,7 +53,7 @@
|
|||
<!-- <FormSwitch v-model="autoplayMfm" class="_formBlock">
|
||||
{{ i18n.ts._mfm.alwaysPlay }}
|
||||
<template #caption>
|
||||
<i class="ph-warning ph-bold ph-lg" style="color: var(--warn)"></i>
|
||||
<i :class="icon('ph-warning')" style="color: var(--warn)"></i>
|
||||
{{ i18n.ts._mfm.warn }}
|
||||
</template>
|
||||
</FormSwitch> -->
|
||||
|
|
@ -85,7 +85,7 @@
|
|||
<XFeaturedUsers />
|
||||
<br />
|
||||
<MkButton class="ok" primary @click="tutorial++"
|
||||
><i class="ph-check ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-check')"></i>
|
||||
{{ i18n.ts.next }}</MkButton
|
||||
>
|
||||
</section>
|
||||
|
|
@ -126,7 +126,7 @@
|
|||
tag="div"
|
||||
>
|
||||
<template #icon>
|
||||
<i class="ph-house ph-bold ph-lg" />
|
||||
<i :class="icon('ph-house')" />
|
||||
</template>
|
||||
</I18n>
|
||||
</li>
|
||||
|
|
@ -136,7 +136,7 @@
|
|||
tag="div"
|
||||
>
|
||||
<template #icon>
|
||||
<i class="ph-users ph-bold ph-lg" />
|
||||
<i :class="icon('ph-users')" />
|
||||
</template>
|
||||
</I18n>
|
||||
</li>
|
||||
|
|
@ -146,9 +146,7 @@
|
|||
tag="div"
|
||||
>
|
||||
<template #icon>
|
||||
<i
|
||||
class="ph-handshake ph-bold ph-lg"
|
||||
/>
|
||||
<i :class="icon('ph-handshake')" />
|
||||
</template>
|
||||
</I18n>
|
||||
</li>
|
||||
|
|
@ -158,9 +156,7 @@
|
|||
tag="div"
|
||||
>
|
||||
<template #icon>
|
||||
<i
|
||||
class="ph-thumbs-up ph-bold ph-lg"
|
||||
/>
|
||||
<i :class="icon('ph-thumbs-up')" />
|
||||
</template>
|
||||
</I18n>
|
||||
</li>
|
||||
|
|
@ -170,9 +166,7 @@
|
|||
tag="div"
|
||||
>
|
||||
<template #icon>
|
||||
<i
|
||||
class="ph-planet ph-bold ph-lg"
|
||||
/>
|
||||
<i :class="icon('ph-planet')" />
|
||||
</template>
|
||||
</I18n>
|
||||
</li>
|
||||
|
|
@ -219,6 +213,7 @@ import { defaultStore } from "@/store";
|
|||
import { i18n } from "@/i18n";
|
||||
import { $i } from "@/account";
|
||||
import { instance } from "@/instance";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const isLocalTimelineAvailable =
|
||||
!instance.disableLocalTimeline ||
|
||||
|
|
|
|||
|
|
@ -28,9 +28,9 @@
|
|||
>
|
||||
<i
|
||||
v-if="!tweetExpanded"
|
||||
class="ph-twitter-logo ph-bold ph-lg"
|
||||
:class="iconClass('ph-twitter-logo')"
|
||||
></i>
|
||||
<i v-else class="ph-x ph-bold ph-lg"></i>
|
||||
<i v-else :class="iconClass('ph-x')"></i>
|
||||
</button>
|
||||
<button
|
||||
v-else-if="player.url"
|
||||
|
|
@ -42,9 +42,9 @@
|
|||
>
|
||||
<i
|
||||
v-if="!playerEnabled"
|
||||
class="ph-play ph-bold ph-lg"
|
||||
:class="iconClass('ph-play')"
|
||||
></i>
|
||||
<i v-else class="ph-x ph-bold ph-lg"></i>
|
||||
<i v-else :class="iconClass('ph-x')"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div v-if="fetching">
|
||||
|
|
@ -103,6 +103,7 @@ import { onUnmounted, ref } from "vue";
|
|||
import { lang, url as local } from "@/config";
|
||||
import { i18n } from "@/i18n";
|
||||
import { defaultStore } from "@/store";
|
||||
import iconClass from "@/scripts/icon";
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
:style="{ zIndex, top: top + 'px', left: left + 'px' }"
|
||||
>
|
||||
<transition
|
||||
:name="$store.state.animation ? 'zoom' : ''"
|
||||
:name="defaultStore.state.animation ? 'zoom' : ''"
|
||||
@after-leave="emit('closed')"
|
||||
>
|
||||
<MkUrlPreview v-if="showing" class="_popup _shadow" :url="url" />
|
||||
|
|
@ -16,6 +16,7 @@
|
|||
import { onMounted, ref } from "vue";
|
||||
import MkUrlPreview from "@/components/MkUrlPreview.vue";
|
||||
import * as os from "@/os";
|
||||
import { defaultStore } from "@/store";
|
||||
|
||||
const props = defineProps<{
|
||||
showing: boolean;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<transition
|
||||
:name="$store.state.animation ? 'popup' : ''"
|
||||
:name="defaultStore.state.animation ? 'popup' : ''"
|
||||
appear
|
||||
@after-leave="emit('closed')"
|
||||
>
|
||||
|
|
@ -33,6 +33,7 @@ import * as Acct from "firefish-js/built/acct";
|
|||
import type * as firefish from "firefish-js";
|
||||
import MkUserInfo from "@/components/MkUserInfo.vue";
|
||||
import * as os from "@/os";
|
||||
import { defaultStore } from "@/store";
|
||||
|
||||
const props = defineProps<{
|
||||
showing: boolean;
|
||||
|
|
|
|||
|
|
@ -3,34 +3,31 @@
|
|||
<i
|
||||
v-if="note.visibility === 'home'"
|
||||
v-tooltip="i18n.ts._visibility.home"
|
||||
class="ph-house ph-bold ph-lg"
|
||||
:class="icon('ph-house')"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="note.visibility === 'followers'"
|
||||
v-tooltip="i18n.ts._visibility.followers"
|
||||
class="ph-lock ph-bold ph-lg"
|
||||
:class="icon('ph-lock')"
|
||||
></i>
|
||||
<i
|
||||
v-else-if="note.visibility === 'specified'"
|
||||
ref="specified"
|
||||
class="ph-envelope-simple-open ph-bold ph-lg"
|
||||
:class="icon('ph-envelope-simple-open')"
|
||||
></i>
|
||||
</span>
|
||||
<span v-if="note.localOnly" :class="$style.localOnly"
|
||||
><i
|
||||
v-tooltip="i18n.ts._visibility.localOnly"
|
||||
class="ph-users ph-bold ph-lg"
|
||||
></i
|
||||
><i v-tooltip="i18n.ts._visibility.localOnly" class="ph-users ph-lg"></i
|
||||
></span>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from "vue";
|
||||
|
||||
import XDetails from "@/components/MkUsersTooltip.vue";
|
||||
import * as os from "@/os";
|
||||
import { useTooltip } from "@/scripts/use-tooltip";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
note: {
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@
|
|||
@click="choose('public')"
|
||||
>
|
||||
<div :class="$style.icon">
|
||||
<i class="ph-planet ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-planet')"></i>
|
||||
</div>
|
||||
<div :class="$style.body">
|
||||
<span :class="$style.itemTitle">{{
|
||||
|
|
@ -34,7 +34,7 @@
|
|||
@click="choose('home')"
|
||||
>
|
||||
<div :class="$style.icon">
|
||||
<i class="ph-house ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-house')"></i>
|
||||
</div>
|
||||
<div :class="$style.body">
|
||||
<span :class="$style.itemTitle">{{
|
||||
|
|
@ -53,7 +53,7 @@
|
|||
@click="choose('followers')"
|
||||
>
|
||||
<div :class="$style.icon">
|
||||
<i class="ph-lock ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-lock')"></i>
|
||||
</div>
|
||||
<div :class="$style.body">
|
||||
<span :class="$style.itemTitle">{{
|
||||
|
|
@ -73,7 +73,7 @@
|
|||
@click="choose('specified')"
|
||||
>
|
||||
<div :class="$style.icon">
|
||||
<i class="ph-envelope-simple-open ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-envelope-simple-open')"></i>
|
||||
</div>
|
||||
<div :class="$style.body">
|
||||
<span :class="$style.itemTitle">{{
|
||||
|
|
@ -97,7 +97,7 @@
|
|||
@click="localOnly = !localOnly"
|
||||
>
|
||||
<div :class="$style.icon">
|
||||
<i class="ph-users ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-users')"></i>
|
||||
</div>
|
||||
<div :class="$style.body">
|
||||
<span :class="$style.itemTitle">{{
|
||||
|
|
@ -110,9 +110,11 @@
|
|||
<div :class="$style.toggle">
|
||||
<i
|
||||
:class="
|
||||
icon(
|
||||
localOnly
|
||||
? 'ph-toggle-right ph-bold ph-lg'
|
||||
: 'ph-toggle-left ph-bold ph-lg'
|
||||
? 'ph-toggle-right'
|
||||
: 'ph-toggle-left',
|
||||
)
|
||||
"
|
||||
></i>
|
||||
</div>
|
||||
|
|
@ -126,6 +128,8 @@ import { nextTick, ref, shallowRef, watch } from "vue";
|
|||
import type * as firefish from "firefish-js";
|
||||
import MkModal from "@/components/MkModal.vue";
|
||||
import { i18n } from "@/i18n";
|
||||
import { defaultStore } from "@/store";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const modal = shallowRef<InstanceType<typeof MkModal>>();
|
||||
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@
|
|||
<i
|
||||
v-if="success"
|
||||
:class="[$style.icon, $style.success]"
|
||||
class="ph-check ph-bold ph-lg"
|
||||
class="ph-check ph-lg"
|
||||
></i>
|
||||
<MkLoading
|
||||
v-else
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@
|
|||
primary
|
||||
class="mk-widget-add"
|
||||
@click="addWidget"
|
||||
><i class="ph-plus ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-plus')"></i>
|
||||
{{ i18n.ts.add }}</MkButton
|
||||
>
|
||||
<MkButton inline @click="$emit('exit')">{{
|
||||
|
|
@ -35,14 +35,14 @@
|
|||
class="config _button"
|
||||
@click.prevent.stop="configWidget(element.id)"
|
||||
>
|
||||
<i class="ph-gear-six ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-gear-six')"></i>
|
||||
</button>
|
||||
<button
|
||||
class="remove _button"
|
||||
:aria-label="i18n.t('close')"
|
||||
@click.prevent.stop="removeWidget(element)"
|
||||
>
|
||||
<i class="ph-x ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-x')"></i>
|
||||
</button>
|
||||
<div class="handle">
|
||||
<component
|
||||
|
|
@ -80,6 +80,7 @@ import MkButton from "@/components/MkButton.vue";
|
|||
import { widgets as widgetDefs } from "@/widgets";
|
||||
import * as os from "@/os";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
interface Widget {
|
||||
name: string;
|
||||
|
|
@ -153,7 +154,7 @@ function onContextmenu(widget: Widget, ev: MouseEvent) {
|
|||
text: i18n.t(`_widgets.${widget.name}`),
|
||||
},
|
||||
{
|
||||
icon: "ph-gear-six ph-bold ph-lg",
|
||||
icon: `${icon("ph-gear-six")}`,
|
||||
text: i18n.ts.settings,
|
||||
action: () => {
|
||||
configWidget(widget.id);
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<transition
|
||||
:name="$store.state.animation ? 'window' : ''"
|
||||
:name="defaultStore.state.animation ? 'window' : ''"
|
||||
appear
|
||||
@after-leave="$emit('closed')"
|
||||
>
|
||||
|
|
@ -54,21 +54,21 @@
|
|||
class="button _button"
|
||||
@click="unMaximize()"
|
||||
>
|
||||
<i class="ph-copy ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-copy')"></i>
|
||||
</button>
|
||||
<button
|
||||
v-else-if="canResize && !maximized"
|
||||
class="button _button"
|
||||
@click="maximize()"
|
||||
>
|
||||
<i class="ph-browser ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-browser')"></i>
|
||||
</button>
|
||||
<button
|
||||
v-if="closeButton"
|
||||
class="button _button"
|
||||
@click="close()"
|
||||
>
|
||||
<i class="ph-x ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-x')"></i>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
|
|
@ -119,6 +119,8 @@ import { onBeforeUnmount, onMounted, provide, ref } from "vue";
|
|||
import contains from "@/scripts/contains";
|
||||
import * as os from "@/os";
|
||||
import type { MenuItem } from "@/types/menu";
|
||||
import { defaultStore } from "@/store";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const minHeight = 50;
|
||||
const minWidth = 250;
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
class="button"
|
||||
@click.prevent="toggle"
|
||||
>
|
||||
<i class="check ph-check ph-bold ph-lg"></i>
|
||||
<i class="check ph-check ph-lg"></i>
|
||||
</span>
|
||||
<span class="label">
|
||||
<!-- TODO: 無名slotの方は廃止 -->
|
||||
|
|
|
|||
|
|
@ -5,8 +5,8 @@
|
|||
<span class="text"><slot name="label"></slot></span>
|
||||
<span class="right">
|
||||
<span class="text"><slot name="suffix"></slot></span>
|
||||
<i v-if="opened" class="ph-caret-up ph-bold ph-lg icon"></i>
|
||||
<i v-else class="ph-caret-down ph-bold ph-lg icon"></i>
|
||||
<i v-if="opened" :class="icon('ph-caret-up icon')"></i>
|
||||
<i v-else :class="icon('ph-caret-down icon')"></i>
|
||||
</span>
|
||||
</summary>
|
||||
<div class="body">
|
||||
|
|
@ -18,6 +18,8 @@
|
|||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
defineProps<{
|
||||
defaultOpen: boolean;
|
||||
}>();
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@
|
|||
primary
|
||||
class="save"
|
||||
@click="updated"
|
||||
><i class="ph-check ph-bold ph-lg"></i> {{ i18n.ts.save }}</MkButton
|
||||
><i :class="icon('ph-check')"></i> {{ i18n.ts.save }}</MkButton
|
||||
>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -51,6 +51,7 @@ import { debounce } from "throttle-debounce";
|
|||
import MkButton from "@/components/MkButton.vue";
|
||||
import { useInterval } from "@/scripts/use-interval";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
modelValue: string | number | null;
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
<span class="text"><slot></slot></span>
|
||||
<span class="right">
|
||||
<span class="text"><slot name="suffix"></slot></span>
|
||||
<i class="ph-arrow-square-out ph-bold ph-lg icon"></i>
|
||||
<i :class="icon('ph-arrow-square-out icon')"></i>
|
||||
</span>
|
||||
</a>
|
||||
<MkA
|
||||
|
|
@ -19,14 +19,16 @@
|
|||
<span class="text"><slot></slot></span>
|
||||
<span class="right">
|
||||
<span class="text"><slot name="suffix"></slot></span>
|
||||
<i class="ph-caret-right ph-bold ph-lg icon"></i>
|
||||
<i :class="icon('ph-caret-right icon')"></i>
|
||||
</span>
|
||||
</MkA>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
const props = defineProps<{
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
defineProps<{
|
||||
to: string;
|
||||
active?: boolean;
|
||||
external?: boolean;
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@
|
|||
</select>
|
||||
<div ref="suffixEl" class="suffix">
|
||||
<i
|
||||
class="ph-caret-down ph-bold ph-lg"
|
||||
class="ph-caret-down ph-lg"
|
||||
:class="[
|
||||
$style.chevron,
|
||||
{ [$style.chevronOpening]: opening },
|
||||
|
|
@ -36,7 +36,7 @@
|
|||
<div class="caption"><slot name="caption"></slot></div>
|
||||
|
||||
<MkButton v-if="manualSave && changed" primary @click="updated"
|
||||
><i class="ph-floppy-disk-back ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-floppy-disk-back')"></i>
|
||||
{{ i18n.ts.save }}</MkButton
|
||||
>
|
||||
</div>
|
||||
|
|
@ -57,6 +57,7 @@ import MkButton from "@/components/MkButton.vue";
|
|||
import * as os from "@/os";
|
||||
import { useInterval } from "@/scripts/use-interval";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
modelValue: string | null;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,8 @@
|
|||
<template>
|
||||
<transition :name="$store.state.animation ? 'fade' : ''" mode="out-in">
|
||||
<transition
|
||||
:name="defaultStore.state.animation ? 'fade' : ''"
|
||||
mode="out-in"
|
||||
>
|
||||
<div v-if="pending">
|
||||
<MkLoading />
|
||||
</div>
|
||||
|
|
@ -9,11 +12,11 @@
|
|||
<div v-else>
|
||||
<div class="wszdbhzo">
|
||||
<div>
|
||||
<i class="ph-warning ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-warning')"></i>
|
||||
{{ i18n.ts.somethingHappened }}
|
||||
</div>
|
||||
<MkButton inline class="retry" @click="retry"
|
||||
><i class="ph-arrow-clockwise ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-arrow-clockwise')"></i>
|
||||
{{ i18n.ts.retry }}</MkButton
|
||||
>
|
||||
</div>
|
||||
|
|
@ -26,6 +29,8 @@ import type { PropType } from "vue";
|
|||
import { defineComponent, ref, watch } from "vue";
|
||||
import MkButton from "@/components/MkButton.vue";
|
||||
import { i18n } from "@/i18n";
|
||||
import { defaultStore } from "@/store";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
|
|
|
|||
|
|
@ -31,7 +31,10 @@
|
|||
primary
|
||||
class="save"
|
||||
@click="updated"
|
||||
><i class="ph-floppy-disk-back ph-bold ph-lg"></i>
|
||||
>
|
||||
<!-- FIXME: icon function doesn't work here -->
|
||||
<!-- <i :class="icon('ph-floppy-disk-back')"></i> -->
|
||||
<i class="ph-floppy-disk-back ph-bold ph-lg"></i>
|
||||
{{ i18n.ts.save }}</MkButton
|
||||
>
|
||||
</div>
|
||||
|
|
@ -50,6 +53,7 @@ import {
|
|||
import { debounce } from "throttle-debounce";
|
||||
import MkButton from "@/components/MkButton.vue";
|
||||
import { i18n } from "@/i18n";
|
||||
// import icon from "@/scripts/icon";
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
|
|
|
|||
|
|
@ -18,6 +18,7 @@ import { url } from "@/config";
|
|||
// import { popout as popout_ } from "@/scripts/popout";
|
||||
import { i18n } from "@/i18n";
|
||||
import { useRouter } from "@/router";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
|
|
@ -53,14 +54,14 @@ function onContextmenu(ev) {
|
|||
text: props.to,
|
||||
},
|
||||
{
|
||||
icon: "ph-browser ph-bold ph-lg",
|
||||
icon: `${icon("ph-browser")}`,
|
||||
text: i18n.ts.openInWindow,
|
||||
action: () => {
|
||||
os.pageWindow(props.to);
|
||||
},
|
||||
},
|
||||
{
|
||||
icon: "ph-arrows-out-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-arrows-out-simple")}`,
|
||||
text: i18n.ts.showInPage,
|
||||
action: () => {
|
||||
router.push(props.to, "forcePage");
|
||||
|
|
@ -68,14 +69,14 @@ function onContextmenu(ev) {
|
|||
},
|
||||
null,
|
||||
{
|
||||
icon: "ph-arrow-square-out ph-bold ph-lg",
|
||||
icon: `${icon("ph-arrow-square-out")}`,
|
||||
text: i18n.ts.openInNewTab,
|
||||
action: () => {
|
||||
window.open(props.to, "_blank");
|
||||
},
|
||||
},
|
||||
{
|
||||
icon: "ph-link-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-link-simple")}`,
|
||||
text: i18n.ts.copyLink,
|
||||
action: () => {
|
||||
copyToClipboard(`${url}${props.to}`);
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<span class="mk-acct">
|
||||
<span class="name">@{{ user.username }}</span>
|
||||
<span
|
||||
v-if="user.host || detail || $store.state.showFullAcct"
|
||||
v-if="user.host || detail || defaultStore.state.showFullAcct"
|
||||
class="host"
|
||||
>@{{ user.host || host }}</span
|
||||
>
|
||||
|
|
@ -13,6 +13,7 @@
|
|||
import type * as firefish from "firefish-js";
|
||||
import { toUnicode } from "punycode/";
|
||||
import { host as hostRaw } from "@/config";
|
||||
import { defaultStore } from "@/store";
|
||||
|
||||
defineProps<{
|
||||
user: firefish.entities.UserDetailed;
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@
|
|||
<a :href="chosen.url" target="_blank">
|
||||
<img :src="chosen.imageUrl" />
|
||||
<button class="_button menu" @click.prevent.stop="toggleMenu">
|
||||
<span class="ph-info ph-bold ph-lg info-circle"></span>
|
||||
<span :class="icon('ph-info info-circle')"></span>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -46,6 +46,7 @@ import MkButton from "@/components/MkButton.vue";
|
|||
import { defaultStore } from "@/store";
|
||||
import * as os from "@/os";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
type Ad = (typeof instance)["ads"][number];
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,10 @@
|
|||
v-if="disableLink"
|
||||
v-user-preview="disablePreview ? undefined : user.id"
|
||||
class="eiwwqkts _noSelect"
|
||||
:class="{ cat: user.isCat, square: $store.state.squareAvatars }"
|
||||
:class="{
|
||||
cat: user.isCat,
|
||||
square: defaultStore.state.squareAvatars,
|
||||
}"
|
||||
:style="{ color }"
|
||||
:title="acct(user)"
|
||||
@click="onClick"
|
||||
|
|
@ -19,7 +22,10 @@
|
|||
v-else
|
||||
v-user-preview="disablePreview ? undefined : user.id"
|
||||
class="eiwwqkts _noSelect"
|
||||
:class="{ cat: user.isCat, square: $store.state.squareAvatars }"
|
||||
:class="{
|
||||
cat: user.isCat,
|
||||
square: defaultStore.state.squareAvatars,
|
||||
}"
|
||||
:style="{ color }"
|
||||
:to="userPage(user)"
|
||||
:title="acct(user)"
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<transition :name="$store.state.animation ? 'zoom' : ''" appear>
|
||||
<transition :name="defaultStore.state.animation ? 'zoom' : ''" appear>
|
||||
<div class="mjndxjcg">
|
||||
<img
|
||||
src="/static-assets/badges/error.webp"
|
||||
|
|
@ -7,7 +7,7 @@
|
|||
alt="Error"
|
||||
/>
|
||||
<p>
|
||||
<i class="ph-warning ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-warning')"></i>
|
||||
{{ i18n.ts.somethingHappened }}
|
||||
</p>
|
||||
<MkButton class="button" @click="() => $emit('retry')">{{
|
||||
|
|
@ -20,6 +20,8 @@
|
|||
<script lang="ts" setup>
|
||||
import MkButton from "@/components/MkButton.vue";
|
||||
import { i18n } from "@/i18n";
|
||||
import { defaultStore } from "@/store";
|
||||
import icon from "@/scripts/icon";
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@
|
|||
@click.stop="goBack()"
|
||||
@touchstart="preventDrag"
|
||||
>
|
||||
<i class="ph-caret-left ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-caret-left')"></i>
|
||||
</button>
|
||||
<MkAvatar
|
||||
v-if="narrow && props.displayMyAvatar && $i"
|
||||
|
|
@ -140,6 +140,7 @@ import { scrollToTop } from "@/scripts/scroll";
|
|||
import { injectPageMetadata } from "@/scripts/page-metadata";
|
||||
import { $i, openAccountMenu as openAccountMenu_ } from "@/account";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
interface Tab {
|
||||
key?: string | null;
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@
|
|||
<span class="hash">{{ hash }}</span>
|
||||
<i
|
||||
v-if="target === '_blank'"
|
||||
class="ph-arrow-square-out ph-bold ph-lg icon"
|
||||
:class="icon('ph-arrow-square-out icon')"
|
||||
></i>
|
||||
</component>
|
||||
</template>
|
||||
|
|
@ -37,6 +37,7 @@ import { url as local } from "@/config";
|
|||
import * as os from "@/os";
|
||||
import { useTooltip } from "@/scripts/use-tooltip";
|
||||
import { safeURIDecode } from "@/scripts/safe-uri-decode";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
url: string;
|
||||
|
|
|
|||
|
|
@ -7,8 +7,8 @@
|
|||
:disabled="posting || posted"
|
||||
@click="post()"
|
||||
>
|
||||
<i v-if="posted" class="ph-check ph-bold ph-lg"></i>
|
||||
<i v-else class="ph-paper-plane-tilt ph-bold ph-lg"></i>
|
||||
<i v-if="posted" :class="icon('ph-check')"></i>
|
||||
<i v-else :class="icon('ph-paper-plane-tilt')"></i>
|
||||
</MkButton>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -22,6 +22,7 @@ import { apiUrl } from "@/config";
|
|||
import * as os from "@/os";
|
||||
import type { PostBlock } from "@/scripts/hpml/block";
|
||||
import type { Hpml } from "@/scripts/hpml/evaluator";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
|
|
@ -60,10 +61,10 @@ export default defineComponent({
|
|||
canvas.toBlob((blob) => {
|
||||
const formData = new FormData();
|
||||
formData.append("file", blob);
|
||||
if (this.$store.state.uploadFolder) {
|
||||
if (this.defaultStore.state.uploadFolder) {
|
||||
formData.append(
|
||||
"folderId",
|
||||
this.$store.state.uploadFolder,
|
||||
this.defaultStore.state.uploadFolder,
|
||||
);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -6,8 +6,12 @@
|
|||
import "vite/modulepreload-polyfill";
|
||||
|
||||
import "@/style.scss";
|
||||
import "@phosphor-icons/web/bold";
|
||||
|
||||
import "@phosphor-icons/web/fill";
|
||||
import "@phosphor-icons/web/bold";
|
||||
import "@phosphor-icons/web/regular";
|
||||
import "@phosphor-icons/web/light";
|
||||
import "@phosphor-icons/web/duotone";
|
||||
|
||||
// #region account indexedDB migration
|
||||
import { set } from "@/scripts/idb-proxy";
|
||||
|
|
@ -72,7 +76,6 @@ function checkForSplash() {
|
|||
console.info(`vue ${vueVersion}`);
|
||||
|
||||
(window as any).$i = $i;
|
||||
(window as any).$store = defaultStore;
|
||||
|
||||
window.addEventListener("error", (event) => {
|
||||
console.error(event);
|
||||
|
|
@ -201,10 +204,7 @@ function checkForSplash() {
|
|||
|
||||
app.config.globalProperties = {
|
||||
$i,
|
||||
$store: defaultStore,
|
||||
$instance: instance,
|
||||
$t: i18n.t,
|
||||
$ts: i18n.ts,
|
||||
};
|
||||
|
||||
widgets(app);
|
||||
|
|
|
|||
|
|
@ -1,102 +1,103 @@
|
|||
import { computed, reactive, ref } from "vue";
|
||||
import { computed, reactive } from "vue";
|
||||
import { $i } from "./account";
|
||||
import { search } from "@/scripts/search";
|
||||
import * as os from "@/os";
|
||||
import { i18n } from "@/i18n";
|
||||
import { ui } from "@/config";
|
||||
import { unisonReload } from "@/scripts/unison-reload";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
export const navbarItemDef = reactive({
|
||||
notifications: {
|
||||
title: "notifications",
|
||||
icon: "ph-bell ph-bold ph-lg",
|
||||
icon: `${icon("ph-bell")}`,
|
||||
show: computed(() => $i != null),
|
||||
indicated: computed(() => $i?.hasUnreadNotification),
|
||||
to: "/my/notifications",
|
||||
},
|
||||
messaging: {
|
||||
title: "messaging",
|
||||
icon: "ph-chats-teardrop ph-bold ph-lg",
|
||||
icon: `${icon("ph-chats-teardrop")}`,
|
||||
show: computed(() => $i != null),
|
||||
indicated: computed(() => $i?.hasUnreadMessagingMessage),
|
||||
to: "/my/messaging",
|
||||
},
|
||||
drive: {
|
||||
title: "drive",
|
||||
icon: "ph-cloud ph-bold ph-lg",
|
||||
icon: `${icon("ph-cloud")}`,
|
||||
show: computed(() => $i != null),
|
||||
to: "/my/drive",
|
||||
},
|
||||
followRequests: {
|
||||
title: "followRequests",
|
||||
icon: "ph-hand-waving ph-bold ph-lg",
|
||||
icon: `${icon("ph-hand-waving")}`,
|
||||
show: computed(() => $i?.isLocked || $i?.hasPendingReceivedFollowRequest),
|
||||
indicated: computed(() => $i?.hasPendingReceivedFollowRequest),
|
||||
to: "/my/follow-requests",
|
||||
},
|
||||
explore: {
|
||||
title: "explore",
|
||||
icon: "ph-compass ph-bold ph-lg",
|
||||
icon: `${icon("ph-compass")}`,
|
||||
to: "/explore",
|
||||
},
|
||||
announcements: {
|
||||
title: "announcements",
|
||||
icon: "ph-megaphone-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-megaphone-simple")}`,
|
||||
indicated: computed(() => $i?.hasUnreadAnnouncement),
|
||||
to: "/announcements",
|
||||
},
|
||||
search: {
|
||||
title: "search",
|
||||
icon: "ph-magnifying-glass ph-bold ph-lg",
|
||||
icon: `${icon("ph-magnifying-glass")}`,
|
||||
action: () => search(),
|
||||
},
|
||||
lists: {
|
||||
title: "lists",
|
||||
icon: "ph-list-bullets ph-bold ph-lg",
|
||||
icon: `${icon("ph-list-bullets")}`,
|
||||
show: computed(() => $i != null),
|
||||
to: "/my/lists",
|
||||
},
|
||||
antennas: {
|
||||
title: "antennas",
|
||||
icon: "ph-flying-saucer ph-bold ph-lg",
|
||||
icon: `${icon("ph-flying-saucer")}`,
|
||||
show: computed(() => $i != null),
|
||||
to: "/my/antennas",
|
||||
},
|
||||
favorites: {
|
||||
title: "favorites",
|
||||
icon: "ph-bookmark-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-bookmark-simple")}`,
|
||||
show: computed(() => $i != null),
|
||||
to: "/my/favorites",
|
||||
},
|
||||
pages: {
|
||||
title: "pages",
|
||||
icon: "ph-file-text ph-bold ph-lg",
|
||||
icon: `${icon("ph-file-text")}`,
|
||||
to: "/pages",
|
||||
},
|
||||
gallery: {
|
||||
title: "gallery",
|
||||
icon: "ph-image-square ph-bold ph-lg",
|
||||
icon: `${icon("ph-image-square")}`,
|
||||
to: "/gallery",
|
||||
},
|
||||
clips: {
|
||||
title: "clips",
|
||||
icon: "ph-paperclip ph-bold ph-lg",
|
||||
icon: `${icon("ph-paperclip")}`,
|
||||
show: computed(() => $i != null),
|
||||
to: "/my/clips",
|
||||
},
|
||||
channels: {
|
||||
title: "channel",
|
||||
icon: "ph-television ph-bold ph-lg",
|
||||
icon: `${icon("ph-television")}`,
|
||||
to: "/channels",
|
||||
},
|
||||
groups: {
|
||||
title: "groups",
|
||||
icon: "ph-users-three ph-bold ph-lg",
|
||||
icon: `${icon("ph-users-three")}`,
|
||||
to: "/my/groups",
|
||||
},
|
||||
ui: {
|
||||
title: "switchUi",
|
||||
icon: "ph-layout ph-bold ph-lg",
|
||||
icon: `${icon("ph-layout")}`,
|
||||
action: (ev) => {
|
||||
os.popupMenu(
|
||||
[
|
||||
|
|
@ -131,7 +132,7 @@ export const navbarItemDef = reactive({
|
|||
},
|
||||
reload: {
|
||||
title: "reload",
|
||||
icon: "ph-arrows-clockwise ph-bold ph-lg",
|
||||
icon: `${icon("ph-arrows-clockwise")}`,
|
||||
action: (ev) => {
|
||||
location.reload();
|
||||
},
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<MkLoading v-if="!loaded" />
|
||||
<transition :name="$store.state.animation ? 'zoom' : ''" appear>
|
||||
<transition :name="defaultStore.state.animation ? 'zoom' : ''" appear>
|
||||
<div v-show="loaded" class="mjndxjch">
|
||||
<img
|
||||
src="/static-assets/badges/error.webp"
|
||||
|
|
@ -9,7 +9,7 @@
|
|||
/>
|
||||
<p>
|
||||
<b
|
||||
><i class="ph-warning ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-warning')"></i>
|
||||
{{ i18n.ts.pageLoadError }}</b
|
||||
>
|
||||
</p>
|
||||
|
|
@ -44,8 +44,10 @@ import * as os from "@/os";
|
|||
import { unisonReload } from "@/scripts/unison-reload";
|
||||
import { i18n } from "@/i18n";
|
||||
import { definePageMetadata } from "@/scripts/page-metadata";
|
||||
import { defaultStore } from "@/store";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = withDefaults(
|
||||
withDefaults(
|
||||
defineProps<{
|
||||
error?: Error;
|
||||
}>(),
|
||||
|
|
@ -77,7 +79,7 @@ function reload() {
|
|||
|
||||
definePageMetadata({
|
||||
title: i18n.ts.error,
|
||||
icon: "ph-warning ph-bold ph-lg",
|
||||
icon: `${icon("ph-warning")}`,
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -61,7 +61,7 @@
|
|||
external
|
||||
>
|
||||
<template #icon
|
||||
><i class="ph-code ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-code')"></i
|
||||
></template>
|
||||
{{ i18n.ts._aboutFirefish.source }}
|
||||
<template #suffix>GitLab</template>
|
||||
|
|
@ -71,7 +71,7 @@
|
|||
external
|
||||
>
|
||||
<template #icon
|
||||
><i class="ph-money ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-money')"></i
|
||||
></template>
|
||||
{{ i18n.ts._aboutFirefish.donate }}
|
||||
<template #suffix>Donate</template>
|
||||
|
|
@ -81,7 +81,7 @@
|
|||
external
|
||||
>
|
||||
<template #icon
|
||||
><i class="ph-translate ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-translate')"></i
|
||||
></template>
|
||||
{{ i18n.ts._aboutFirefish.translation }}
|
||||
<template #suffix>Translate</template>
|
||||
|
|
@ -219,6 +219,7 @@ import { i18n } from "@/i18n";
|
|||
import { defaultStore } from "@/store";
|
||||
import * as os from "@/os";
|
||||
import { definePageMetadata } from "@/scripts/page-metadata";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
let patrons = [],
|
||||
sponsors = [];
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<div class="query">
|
||||
<MkInput v-model="q" class="" :placeholder="i18n.ts.search">
|
||||
<template #prefix
|
||||
><i class="ph-magnifying-glass ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-magnifying-glass')"></i
|
||||
></template>
|
||||
</MkInput>
|
||||
|
||||
|
|
@ -56,6 +56,7 @@ import MkFolder from "@/components/MkFolder.vue";
|
|||
import MkTab from "@/components/MkTab.vue";
|
||||
import { emojiCategories, emojiTags } from "@/instance";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<div class="query">
|
||||
<MkInput v-model="host" :debounce="true" class="">
|
||||
<template #prefix
|
||||
><i class="ph-magnifying-glass ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-magnifying-glass')"></i
|
||||
></template>
|
||||
<template #label>{{ i18n.ts.host }}</template>
|
||||
</MkInput>
|
||||
|
|
@ -112,6 +112,7 @@ import MkPagination from "@/components/MkPagination.vue";
|
|||
import MkInstanceCardMini from "@/components/MkInstanceCardMini.vue";
|
||||
import FormSplit from "@/components/form/split.vue";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const host = ref("");
|
||||
const state = ref("federating");
|
||||
|
|
|
|||
|
|
@ -95,7 +95,7 @@
|
|||
external
|
||||
>
|
||||
<template #icon
|
||||
><i class="ph-money ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-money')"></i
|
||||
></template>
|
||||
{{
|
||||
i18n.t("_aboutFirefish.donateHost", {
|
||||
|
|
@ -193,6 +193,7 @@ import { deviceKind } from "@/scripts/device-kind";
|
|||
import { iAmModerator } from "@/account";
|
||||
import { instance } from "@/instance";
|
||||
import { defaultStore } from "@/store";
|
||||
import icon from "@/scripts/icon";
|
||||
import "swiper/scss";
|
||||
import "swiper/scss/virtual";
|
||||
|
||||
|
|
@ -227,17 +228,17 @@ const theTabs = [
|
|||
{
|
||||
key: "overview",
|
||||
title: i18n.ts.overview,
|
||||
icon: "ph-map-trifold ph-bold ph-lg",
|
||||
icon: `${icon("ph-map-trifold")}`,
|
||||
},
|
||||
{
|
||||
key: "emojis",
|
||||
title: i18n.ts.customEmojis,
|
||||
icon: "ph-smiley ph-bold ph-lg",
|
||||
icon: `${icon("ph-smiley")}`,
|
||||
},
|
||||
{
|
||||
key: "charts",
|
||||
title: i18n.ts.charts,
|
||||
icon: "ph-chart-bar ph-bold ph-lg",
|
||||
icon: `${icon("ph-chart-bar")}`,
|
||||
},
|
||||
];
|
||||
|
||||
|
|
@ -245,7 +246,7 @@ if (iAmModerator) {
|
|||
theTabs.push({
|
||||
key: "federation",
|
||||
title: i18n.ts.federation,
|
||||
icon: "ph-planet ph-bold ph-lg",
|
||||
icon: `${icon("ph-planet")}`,
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -254,7 +255,7 @@ const headerTabs = computed(() => theTabs);
|
|||
definePageMetadata(
|
||||
computed(() => ({
|
||||
title: i18n.ts.instanceInfo,
|
||||
icon: "ph-info ph-bold ph-lg",
|
||||
icon: `${icon("ph-info")}`,
|
||||
})),
|
||||
);
|
||||
|
||||
|
|
|
|||
|
|
@ -111,7 +111,7 @@
|
|||
|
||||
<div class="_formBlock">
|
||||
<MkButton danger @click="del"
|
||||
><i class="ph-trash ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-trash')"></i>
|
||||
{{ i18n.ts.delete }}</MkButton
|
||||
>
|
||||
</div>
|
||||
|
|
@ -174,6 +174,7 @@ import { definePageMetadata } from "@/scripts/page-metadata";
|
|||
import { deviceKind } from "@/scripts/device-kind";
|
||||
import { iAmAdmin, iAmModerator } from "@/account";
|
||||
import { defaultStore } from "@/store";
|
||||
import icon from "@/scripts/icon";
|
||||
import "swiper/scss";
|
||||
import "swiper/scss/virtual";
|
||||
|
||||
|
|
@ -224,7 +225,7 @@ async function toggleIsSensitive(v) {
|
|||
const headerActions = computed(() => [
|
||||
{
|
||||
text: i18n.ts.openInNewTab,
|
||||
icon: "ph-arrow-square-out ph-bold ph-lg",
|
||||
icon: `${icon("ph-arrow-square-out")}`,
|
||||
handler: () => {
|
||||
window.open(file.value.url, "_blank");
|
||||
},
|
||||
|
|
@ -235,19 +236,19 @@ const headerTabs = computed(() => [
|
|||
{
|
||||
key: "overview",
|
||||
title: i18n.ts.overview,
|
||||
icon: "ph-info ph-bold ph-lg",
|
||||
icon: `${icon("ph-info")}`,
|
||||
},
|
||||
iAmModerator
|
||||
? {
|
||||
key: "ip",
|
||||
title: "IP",
|
||||
icon: "ph-receipt ph-bold ph-lg",
|
||||
icon: `${icon("ph-receipt")}`,
|
||||
}
|
||||
: null,
|
||||
{
|
||||
key: "raw",
|
||||
title: "Raw data",
|
||||
icon: "ph-code ph-bold ph-lg",
|
||||
icon: `${icon("ph-code")}`,
|
||||
},
|
||||
]);
|
||||
|
||||
|
|
@ -256,7 +257,7 @@ definePageMetadata(
|
|||
title: file.value
|
||||
? i18n.ts.file + ": " + file.value.name
|
||||
: i18n.ts.file,
|
||||
icon: "ph-file ph-bold ph-lg",
|
||||
icon: `${icon("ph-file")}`,
|
||||
})),
|
||||
);
|
||||
|
||||
|
|
|
|||
|
|
@ -98,6 +98,7 @@ import MkPagination from "@/components/MkPagination.vue";
|
|||
import XAbuseReport from "@/components/MkAbuseReport.vue";
|
||||
import { i18n } from "@/i18n";
|
||||
import { definePageMetadata } from "@/scripts/page-metadata";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const reports = ref<InstanceType<typeof MkPagination>>();
|
||||
|
||||
|
|
@ -127,7 +128,7 @@ const headerTabs = computed(() => []);
|
|||
|
||||
definePageMetadata({
|
||||
title: i18n.ts.abuseReports,
|
||||
icon: "ph-warning-circle ph-bold ph-lg",
|
||||
icon: `${icon("ph-warning-circle")}`,
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -44,16 +44,14 @@
|
|||
inline
|
||||
primary
|
||||
@click="save(announcement)"
|
||||
><i
|
||||
class="ph-floppy-disk-back ph-bold ph-lg"
|
||||
></i>
|
||||
><i :class="icon('ph-floppy-disk-back')"></i>
|
||||
{{ i18n.ts.save }}</MkButton
|
||||
>
|
||||
<MkButton
|
||||
class="button"
|
||||
inline
|
||||
@click="remove(announcement)"
|
||||
><i class="ph-trash ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-trash')"></i>
|
||||
{{ i18n.ts.remove }}</MkButton
|
||||
>
|
||||
</div>
|
||||
|
|
@ -74,6 +72,7 @@ import MkTextarea from "@/components/form/textarea.vue";
|
|||
import * as os from "@/os";
|
||||
import { i18n } from "@/i18n";
|
||||
import { definePageMetadata } from "@/scripts/page-metadata";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const announcements = ref<any[]>([]);
|
||||
|
||||
|
|
@ -140,7 +139,7 @@ function save(announcement) {
|
|||
const headerActions = computed(() => [
|
||||
{
|
||||
asFullButton: true,
|
||||
icon: "ph-plus ph-bold ph-lg",
|
||||
icon: `${icon("ph-plus")}`,
|
||||
text: i18n.ts.add,
|
||||
handler: add,
|
||||
},
|
||||
|
|
@ -150,7 +149,7 @@ const headerTabs = computed(() => []);
|
|||
|
||||
definePageMetadata({
|
||||
title: i18n.ts.announcements,
|
||||
icon: "ph-megaphone-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-megaphone-simple")}`,
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
<template v-if="provider === 'hcaptcha'">
|
||||
<FormInput v-model="hcaptchaSiteKey" class="_formBlock">
|
||||
<template #prefix
|
||||
><i class="ph-key ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-key')"></i
|
||||
></template>
|
||||
<template #label>{{
|
||||
i18n.ts.hcaptchaSiteKey
|
||||
|
|
@ -21,7 +21,7 @@
|
|||
</FormInput>
|
||||
<FormInput v-model="hcaptchaSecretKey" class="_formBlock">
|
||||
<template #prefix
|
||||
><i class="ph-key ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-key')"></i
|
||||
></template>
|
||||
<template #label>{{
|
||||
i18n.ts.hcaptchaSecretKey
|
||||
|
|
@ -41,7 +41,7 @@
|
|||
<template v-else-if="provider === 'recaptcha'">
|
||||
<FormInput v-model="recaptchaSiteKey" class="_formBlock">
|
||||
<template #prefix
|
||||
><i class="ph-key ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-key')"></i
|
||||
></template>
|
||||
<template #label>{{
|
||||
i18n.ts.recaptchaSiteKey
|
||||
|
|
@ -49,7 +49,7 @@
|
|||
</FormInput>
|
||||
<FormInput v-model="recaptchaSecretKey" class="_formBlock">
|
||||
<template #prefix
|
||||
><i class="ph-key ph-bold ph-lg"></i
|
||||
><i :class="icon('ph-key')"></i
|
||||
></template>
|
||||
<template #label>{{
|
||||
i18n.ts.recaptchaSecretKey
|
||||
|
|
@ -65,7 +65,7 @@
|
|||
</template>
|
||||
|
||||
<FormButton primary @click="save"
|
||||
><i class="ph-floppy-disk-back ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-floppy-disk-back')"></i>
|
||||
{{ i18n.ts.save }}</FormButton
|
||||
>
|
||||
</div>
|
||||
|
|
@ -83,6 +83,7 @@ import FormSlot from "@/components/form/slot.vue";
|
|||
import * as os from "@/os";
|
||||
import { fetchInstance } from "@/instance";
|
||||
import { i18n } from "@/i18n";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const MkCaptcha = defineAsyncComponent(
|
||||
() => import("@/components/MkCaptcha.vue"),
|
||||
|
|
|
|||
|
|
@ -22,6 +22,7 @@ import FormTextarea from "@/components/form/textarea.vue";
|
|||
import FormInfo from "@/components/MkInfo.vue";
|
||||
import { i18n } from "@/i18n";
|
||||
import { definePageMetadata } from "@/scripts/page-metadata";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
// const localCustomCss = ref(localStorage.getItem("customCss") ?? "");
|
||||
|
||||
|
|
@ -45,6 +46,6 @@ watch(globalCustomCss, async () => {
|
|||
|
||||
definePageMetadata({
|
||||
title: i18n.ts.customCss,
|
||||
icon: "ph-code ph-bold ph-lg",
|
||||
icon: `${icon("ph-code")}`,
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -45,6 +45,7 @@ import number from "@/filters/number";
|
|||
import { i18n } from "@/i18n";
|
||||
import { definePageMetadata } from "@/scripts/page-metadata";
|
||||
import { indexPosts } from "@/scripts/index-posts";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const databasePromiseFactory = () =>
|
||||
os
|
||||
|
|
@ -59,6 +60,6 @@ const headerTabs = computed(() => []);
|
|||
|
||||
definePageMetadata({
|
||||
title: i18n.ts.database,
|
||||
icon: "ph-database ph-bold ph-lg",
|
||||
icon: `${icon("ph-database")}`,
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -103,6 +103,7 @@ import * as os from "@/os";
|
|||
import { fetchInstance, instance } from "@/instance";
|
||||
import { i18n } from "@/i18n";
|
||||
import { definePageMetadata } from "@/scripts/page-metadata";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const enableEmail = ref(false);
|
||||
const email: any = ref(null);
|
||||
|
|
@ -154,13 +155,13 @@ function save() {
|
|||
const headerActions = computed(() => [
|
||||
{
|
||||
asFullButton: true,
|
||||
icon: "ph-test-tube ph-bold ph-lg",
|
||||
icon: `${icon("ph-test-tube")}`,
|
||||
text: i18n.ts.testEmail,
|
||||
handler: testEmail,
|
||||
},
|
||||
{
|
||||
asFullButton: true,
|
||||
icon: "ph-check ph-bold ph-lg",
|
||||
icon: `${icon("ph-check")}`,
|
||||
text: i18n.ts.save,
|
||||
handler: save,
|
||||
},
|
||||
|
|
@ -170,6 +171,6 @@ const headerTabs = computed(() => []);
|
|||
|
||||
definePageMetadata({
|
||||
title: i18n.ts.emailServer,
|
||||
icon: "ph-envelope-simple-open ph-bold ph-lg",
|
||||
icon: `${icon("ph-envelope-simple-open")}`,
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@
|
|||
<template #label>{{ i18n.ts.license }}</template>
|
||||
</MkTextarea>
|
||||
<MkButton danger @click="del()"
|
||||
><i class="ph-trash ph-bold ph-lg"></i>
|
||||
><i :class="icon('ph-trash')"></i>
|
||||
{{ i18n.ts.delete }}</MkButton
|
||||
>
|
||||
</div>
|
||||
|
|
@ -50,6 +50,7 @@ import MkTextarea from "@/components/form/textarea.vue";
|
|||
import * as os from "@/os";
|
||||
import { i18n } from "@/i18n";
|
||||
import { emojiCategories } from "@/instance";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const props = defineProps<{
|
||||
emoji: any;
|
||||
|
|
|
|||
|
|
@ -13,9 +13,7 @@
|
|||
<div v-if="tab === 'local'" class="local">
|
||||
<MkInput v-model="query" :debounce="true" type="search">
|
||||
<template #prefix
|
||||
><i
|
||||
class="ph-magnifying-glass ph-bold ph-lg"
|
||||
></i
|
||||
><i :class="icon('ph-magnifying-glass')"></i
|
||||
></template>
|
||||
<template #label>{{ i18n.ts.search }}</template>
|
||||
</MkInput>
|
||||
|
|
@ -105,9 +103,7 @@
|
|||
type="search"
|
||||
>
|
||||
<template #prefix
|
||||
><i
|
||||
class="ph-magnifying-glass ph-bold ph-lg"
|
||||
></i
|
||||
><i :class="icon('ph-magnifying-glass')"></i
|
||||
></template>
|
||||
<template #label>{{ i18n.ts.search }}</template>
|
||||
</MkInput>
|
||||
|
|
@ -164,6 +160,7 @@ import { selectFile, selectFiles } from "@/scripts/select-file";
|
|||
import * as os from "@/os";
|
||||
import { i18n } from "@/i18n";
|
||||
import { definePageMetadata } from "@/scripts/page-metadata";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const emojisPaginationComponent = ref<InstanceType<typeof MkPagination>>();
|
||||
|
||||
|
|
@ -272,7 +269,7 @@ const remoteMenu = (emoji, ev: MouseEvent) => {
|
|||
},
|
||||
{
|
||||
text: i18n.ts.import,
|
||||
icon: "ph-plus ph-bold ph-lg",
|
||||
icon: `${icon("ph-plus")}`,
|
||||
action: () => {
|
||||
im(emoji);
|
||||
},
|
||||
|
|
@ -286,7 +283,7 @@ const menu = (ev: MouseEvent) => {
|
|||
os.popupMenu(
|
||||
[
|
||||
{
|
||||
icon: "ph-download-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-download-simple")}`,
|
||||
text: i18n.ts.exportZip,
|
||||
action: async () => {
|
||||
os.api("export-custom-emojis", {})
|
||||
|
|
@ -305,7 +302,7 @@ const menu = (ev: MouseEvent) => {
|
|||
},
|
||||
},
|
||||
{
|
||||
icon: "ph-upload-simple ph-bold ph-lg",
|
||||
icon: `${icon("ph-upload-simple")}`,
|
||||
text: i18n.ts.importZip,
|
||||
action: async () => {
|
||||
const file = await selectFile(
|
||||
|
|
@ -329,7 +326,7 @@ const menu = (ev: MouseEvent) => {
|
|||
},
|
||||
},
|
||||
{
|
||||
icon: "ph-info ph-bold ph-lg",
|
||||
icon: `${icon("ph-info")}`,
|
||||
text: i18n.ts.emojiPackCreator,
|
||||
action: () => {
|
||||
window.open(
|
||||
|
|
@ -418,12 +415,12 @@ const delBulk = async () => {
|
|||
const headerActions = computed(() => [
|
||||
{
|
||||
asFullButton: true,
|
||||
icon: "ph-plus ph-bold ph-lg",
|
||||
icon: `${icon("ph-plus")}`,
|
||||
text: i18n.ts.addEmoji,
|
||||
handler: add,
|
||||
},
|
||||
{
|
||||
icon: "ph-file-zip ph-bold ph-lg",
|
||||
icon: `${icon("ph-file-zip")}`,
|
||||
handler: menu,
|
||||
},
|
||||
]);
|
||||
|
|
@ -431,12 +428,12 @@ const headerActions = computed(() => [
|
|||
const headerTabs = computed(() => [
|
||||
{
|
||||
key: "local",
|
||||
icon: "ph-users ph-bold ph-lg",
|
||||
icon: `${icon("ph-users")}`,
|
||||
title: i18n.ts.local,
|
||||
},
|
||||
{
|
||||
key: "remote",
|
||||
icon: "ph-planet ph-bold ph-lg",
|
||||
icon: `${icon("ph-planet")}`,
|
||||
title: i18n.ts.remote,
|
||||
},
|
||||
]);
|
||||
|
|
@ -444,7 +441,7 @@ const headerTabs = computed(() => [
|
|||
definePageMetadata(
|
||||
computed(() => ({
|
||||
title: i18n.ts.customEmojis,
|
||||
icon: "ph-smiley ph-bold ph-lg",
|
||||
icon: `${icon("ph-smiley")}`,
|
||||
})),
|
||||
);
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
@update:modelValue="save"
|
||||
>
|
||||
<template #label>
|
||||
<i class="ph-download-simple ph-bold ph-lg"></i>
|
||||
<i :class="icon('ph-download-simple')"></i>
|
||||
{{ i18n.ts._experiments.enablePostImports }}
|
||||
</template>
|
||||
<template #caption>{{
|
||||
|
|
@ -36,6 +36,7 @@ import * as os from "@/os";
|
|||
import { fetchInstance } from "@/instance";
|
||||
import { i18n } from "@/i18n";
|
||||
import { definePageMetadata } from "@/scripts/page-metadata";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const enablePostImports = ref(false);
|
||||
const meta = ref<MetaExperiments | null>(null);
|
||||
|
|
@ -71,6 +72,6 @@ const headerTabs = computed(() => []);
|
|||
|
||||
definePageMetadata({
|
||||
title: i18n.ts._experiments.title,
|
||||
icon: "ph-flask ph-bold ph-lg",
|
||||
icon: `${icon("ph-flask")}`,
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -19,6 +19,7 @@ import { computed } from "vue";
|
|||
import { definePageMetadata } from "@/scripts/page-metadata";
|
||||
import { i18n } from "@/i18n";
|
||||
import XFederation from "@/pages/about.federation.vue";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const headerActions = computed(() => []);
|
||||
|
||||
|
|
@ -27,7 +28,7 @@ const headerTabs = computed(() => []);
|
|||
definePageMetadata(
|
||||
computed(() => ({
|
||||
title: i18n.ts.federation,
|
||||
icon: "ph-planet ph-bold ph-lg",
|
||||
icon: `${icon("ph-planet")}`,
|
||||
})),
|
||||
);
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -88,6 +88,7 @@ import { lookupFile } from "@/scripts/lookup-file";
|
|||
import * as os from "@/os";
|
||||
import { i18n } from "@/i18n";
|
||||
import { definePageMetadata } from "@/scripts/page-metadata";
|
||||
import icon from "@/scripts/icon";
|
||||
|
||||
const origin = ref("local");
|
||||
const type = ref(null);
|
||||
|
|
@ -122,12 +123,12 @@ function clear() {
|
|||
const headerActions = computed(() => [
|
||||
{
|
||||
text: i18n.ts.lookup,
|
||||
icon: "ph-magnifying-glass ph-bold ph-lg",
|
||||
icon: `${icon("ph-magnifying-glass")}`,
|
||||
handler: lookupFile,
|
||||
},
|
||||
{
|
||||
text: i18n.ts.clearCachedFiles,
|
||||
icon: "ph-trash ph-bold ph-lg",
|
||||
icon: `${icon("ph-trash")}`,
|
||||
handler: clear,
|
||||
},
|
||||
]);
|
||||
|
|
@ -135,7 +136,7 @@ const headerActions = computed(() => [
|
|||
definePageMetadata(
|
||||
computed(() => ({
|
||||
title: i18n.ts.files,
|
||||
icon: "ph-cloud ph-bold ph-lg",
|
||||
icon: `${icon("ph-cloud")}`,
|
||||
})),
|
||||
);
|
||||
</script>
|
||||
|
|
|
|||
Some files were not shown because too many files have changed in this diff Show more
Loading…
Reference in a new issue