Use FontAwesome as web font instead of vue component (#7469)
* wip * wip * wip * wip * wip * wip * wip * wip * wip * Update yarn.lock * wip * wip
This commit is contained in:
parent
8bb6ed625b
commit
11349561d6
|
@ -1,7 +1,7 @@
|
|||
{
|
||||
"name": "misskey",
|
||||
"author": "syuilo <syuilotan@yahoo.co.jp>",
|
||||
"version": "12.77.1",
|
||||
"version": "12.78.0-beta.1",
|
||||
"codename": "indigo",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
|
@ -39,11 +39,6 @@
|
|||
"dependencies": {
|
||||
"@babel/plugin-transform-runtime": "7.13.15",
|
||||
"@elastic/elasticsearch": "7.11.0",
|
||||
"@fortawesome/fontawesome-svg-core": "1.2.35",
|
||||
"@fortawesome/free-brands-svg-icons": "5.15.3",
|
||||
"@fortawesome/free-regular-svg-icons": "5.15.3",
|
||||
"@fortawesome/free-solid-svg-icons": "5.15.3",
|
||||
"@fortawesome/vue-fontawesome": "3.0.0-3",
|
||||
"@koa/cors": "3.1.0",
|
||||
"@koa/multer": "3.0.0",
|
||||
"@koa/router": "9.0.1",
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<XWindow ref="window" :initial-width="400" :initial-height="500" :can-resize="true" @closed="$emit('closed')">
|
||||
<template #header>
|
||||
<Fa :icon="faExclamationCircle" style="margin-right: 0.5em;"/>
|
||||
<i class="fas fa-exclamation-circle" style="margin-right: 0.5em;"></i>
|
||||
<I18n :src="$ts.reportAbuseOf" tag="span">
|
||||
<template #name>
|
||||
<b><MkAcct :user="user"/></b>
|
||||
|
@ -24,7 +24,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent, markRaw } from 'vue';
|
||||
import { faExclamationCircle } from '@fortawesome/free-solid-svg-icons';
|
||||
import XWindow from '@client/components/ui/window.vue';
|
||||
import MkTextarea from '@client/components/ui/textarea.vue';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
|
@ -53,7 +52,6 @@ export default defineComponent({
|
|||
data() {
|
||||
return {
|
||||
comment: this.initialComment || '',
|
||||
faExclamationCircle,
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -6,21 +6,20 @@
|
|||
>
|
||||
<template v-if="!wait">
|
||||
<template v-if="isFollowing">
|
||||
<span v-if="full">{{ $ts.unfollow }}</span><Fa :icon="faMinus"/>
|
||||
<span v-if="full">{{ $ts.unfollow }}</span><i class="fas fa-minus"></i>
|
||||
</template>
|
||||
<template v-else>
|
||||
<span v-if="full">{{ $ts.follow }}</span><Fa :icon="faPlus"/>
|
||||
<span v-if="full">{{ $ts.follow }}</span><i class="fas fa-plus"></i>
|
||||
</template>
|
||||
</template>
|
||||
<template v-else>
|
||||
<span v-if="full">{{ $ts.processing }}</span><Fa :icon="faSpinner" pulse fixed-width/>
|
||||
<span v-if="full">{{ $ts.processing }}</span><i class="fas fa-spinner fa-pulse fa-fw"></i>
|
||||
</template>
|
||||
</button>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faSpinner, faPlus, faMinus, } from '@fortawesome/free-solid-svg-icons';
|
||||
import * as os from '@client/os';
|
||||
|
||||
export default defineComponent({
|
||||
|
@ -40,7 +39,6 @@ export default defineComponent({
|
|||
return {
|
||||
isFollowing: this.channel.isFollowing,
|
||||
wait: false,
|
||||
faSpinner, faPlus, faMinus,
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -2,10 +2,10 @@
|
|||
<MkA :to="`/channels/${channel.id}`" class="eftoefju _panel" tabindex="-1">
|
||||
<div class="banner" :style="bannerStyle">
|
||||
<div class="fade"></div>
|
||||
<div class="name"><Fa :icon="faSatelliteDish"/> {{ channel.name }}</div>
|
||||
<div class="name"><i class="fas fa-satellite-dish"></i> {{ channel.name }}</div>
|
||||
<div class="status">
|
||||
<div>
|
||||
<Fa :icon="faUsers" fixed-width/>
|
||||
<i class="fas fa-users fa-fw"></i>
|
||||
<I18n :src="$ts._channel.usersCount" tag="span" style="margin-left: 4px;">
|
||||
<template #n>
|
||||
<b>{{ channel.usersCount }}</b>
|
||||
|
@ -13,7 +13,7 @@
|
|||
</I18n>
|
||||
</div>
|
||||
<div>
|
||||
<Fa :icon="faPencilAlt" fixed-width/>
|
||||
<i class="fas fa-pencil-alt fa-fw"></i>
|
||||
<I18n :src="$ts._channel.notesCount" tag="span" style="margin-left: 4px;">
|
||||
<template #n>
|
||||
<b>{{ channel.notesCount }}</b>
|
||||
|
@ -35,7 +35,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faSatelliteDish, faUsers, faPencilAlt } from '@fortawesome/free-solid-svg-icons';
|
||||
|
||||
export default defineComponent({
|
||||
props: {
|
||||
|
@ -57,7 +56,6 @@ export default defineComponent({
|
|||
|
||||
data() {
|
||||
return {
|
||||
faSatelliteDish, faUsers, faPencilAlt,
|
||||
};
|
||||
},
|
||||
});
|
||||
|
|
|
@ -1,7 +1,5 @@
|
|||
<script lang="ts">
|
||||
import { defineComponent, h, TransitionGroup } from 'vue';
|
||||
import { faAngleUp, faAngleDown } from '@fortawesome/free-solid-svg-icons';
|
||||
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
|
||||
|
||||
export default defineComponent({
|
||||
props: {
|
||||
|
@ -73,17 +71,15 @@ export default defineComponent({
|
|||
class: 'date'
|
||||
}, [
|
||||
h('span', [
|
||||
h(FontAwesomeIcon, {
|
||||
class: 'icon',
|
||||
icon: faAngleUp,
|
||||
h('i', {
|
||||
class: 'fas fa-angle-up icon',
|
||||
}),
|
||||
this.getDateText(item.createdAt)
|
||||
]),
|
||||
h('span', [
|
||||
this.getDateText(this.items[i + 1].createdAt),
|
||||
h(FontAwesomeIcon, {
|
||||
class: 'icon',
|
||||
icon: faAngleDown,
|
||||
h('i', {
|
||||
class: 'fas fa-angle-down icon',
|
||||
})
|
||||
])
|
||||
]));
|
||||
|
|
|
@ -2,15 +2,15 @@
|
|||
<MkModal ref="modal" @click="done(true)" @closed="$emit('closed')">
|
||||
<div class="mk-dialog">
|
||||
<div class="icon" v-if="icon">
|
||||
<Fa :icon="icon"/>
|
||||
<i :class="icon"></i>
|
||||
</div>
|
||||
<div class="icon" v-else-if="!input && !select" :class="type">
|
||||
<Fa :icon="faCheck" v-if="type === 'success'"/>
|
||||
<Fa :icon="faTimesCircle" v-if="type === 'error'"/>
|
||||
<Fa :icon="faExclamationTriangle" v-if="type === 'warning'"/>
|
||||
<Fa :icon="faInfoCircle" v-if="type === 'info'"/>
|
||||
<Fa :icon="faQuestionCircle" v-if="type === 'question'"/>
|
||||
<Fa :icon="faSpinner" pulse v-if="type === 'waiting'"/>
|
||||
<i v-if="type === 'success'" class="fas fa-check"></i>
|
||||
<i v-else-if="type === 'error'" class="fas fa-times-circle"></i>
|
||||
<i v-else-if="type === 'warning'" class="fas fa-exclamation-triangle"></i>
|
||||
<i v-else-if="type === 'info'" class="fas fa-information-circle"></i>
|
||||
<i v-else-if="type === 'question'" class="fas fa-question-circle"></i>
|
||||
<i v-else-if="type === 'waiting'" class="fas fa-spinner fa-pulse"></i>
|
||||
</div>
|
||||
<header v-if="title"><Mfm :text="title"/></header>
|
||||
<div class="body" v-if="text"><Mfm :text="text"/></div>
|
||||
|
@ -38,8 +38,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faSpinner, faInfoCircle, faExclamationTriangle, faCheck } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faTimesCircle, faQuestionCircle } from '@fortawesome/free-regular-svg-icons';
|
||||
import MkModal from '@client/components/ui/modal.vue';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import MkInput from '@client/components/ui/input.vue';
|
||||
|
@ -99,7 +97,6 @@ export default defineComponent({
|
|||
return {
|
||||
inputValue: this.input && this.input.default ? this.input.default : null,
|
||||
selectedValue: this.select ? this.select.default ? this.select.default : this.select.items ? this.select.items[0].value : this.select.groupedItems[0].items[0].value : null,
|
||||
faTimesCircle, faQuestionCircle, faSpinner, faInfoCircle, faExclamationTriangle, faCheck
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -1,31 +1,21 @@
|
|||
<template>
|
||||
<div class="zdjebgpv" ref="thumbnail">
|
||||
<ImgWithBlurhash v-if="isThumbnailAvailable" :hash="file.blurhash" :src="file.thumbnailUrl" :alt="file.name" :title="file.name" :style="`object-fit: ${ fit }`"/>
|
||||
<Fa :icon="faFileImage" class="icon" v-else-if="is === 'image'"/>
|
||||
<Fa :icon="faFileVideo" class="icon" v-else-if="is === 'video'"/>
|
||||
<Fa :icon="faMusic" class="icon" v-else-if="is === 'audio' || is === 'midi'"/>
|
||||
<Fa :icon="faFileCsv" class="icon" v-else-if="is === 'csv'"/>
|
||||
<Fa :icon="faFilePdf" class="icon" v-else-if="is === 'pdf'"/>
|
||||
<Fa :icon="faFileAlt" class="icon" v-else-if="is === 'textfile'"/>
|
||||
<Fa :icon="faFileArchive" class="icon" v-else-if="is === 'archive'"/>
|
||||
<Fa :icon="faFile" class="icon" v-else/>
|
||||
<Fa :icon="faFilm" class="icon-sub" v-if="isThumbnailAvailable && is === 'video'"/>
|
||||
<i v-else-if="is === 'image'" class="fas fa-file-image icon"></i>
|
||||
<i v-else-if="is === 'video'" class="fas fa-file-video icon"></i>
|
||||
<i v-else-if="is === 'audio' || is === 'midi'" class="fas fa-music icon"></i>
|
||||
<i v-else-if="is === 'csv'" class="fas fa-file-csv icon"></i>
|
||||
<i v-else-if="is === 'pdf'" class="fas fa-file-pdf icon"></i>
|
||||
<i v-else-if="is === 'textfile'" class="fas fa-file-alt icon"></i>
|
||||
<i v-else-if="is === 'archive'" class="fas fa-file-archive icon"></i>
|
||||
<i v-else class="fas fa-file icon"></i>
|
||||
|
||||
<i v-if="isThumbnailAvailable && is === 'video'" class="fas fa-film icon-sub"></i>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import {
|
||||
faFile,
|
||||
faFileAlt,
|
||||
faFileImage,
|
||||
faMusic,
|
||||
faFileVideo,
|
||||
faFileCsv,
|
||||
faFilePdf,
|
||||
faFileArchive,
|
||||
faFilm
|
||||
} from '@fortawesome/free-solid-svg-icons';
|
||||
import ImgWithBlurhash from '@client/components/img-with-blurhash.vue';
|
||||
import { ColdDeviceStorage } from '@client/store';
|
||||
|
||||
|
@ -49,15 +39,6 @@ export default defineComponent({
|
|||
isContextmenuShowing: false,
|
||||
isDragging: false,
|
||||
|
||||
faFile,
|
||||
faFileAlt,
|
||||
faFileImage,
|
||||
faMusic,
|
||||
faFileVideo,
|
||||
faFileCsv,
|
||||
faFilePdf,
|
||||
faFileArchive,
|
||||
faFilm
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
|
|
|
@ -32,8 +32,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faEye, faEyeSlash } from '@fortawesome/free-regular-svg-icons';
|
||||
import { faDownload, faLink, faICursor, faTrashAlt } from '@fortawesome/free-solid-svg-icons';
|
||||
import copyToClipboard from '@client/scripts/copy-to-clipboard';
|
||||
import MkDriveFileThumbnail from './drive-file-thumbnail.vue';
|
||||
import bytes from '@client/filters/bytes';
|
||||
|
@ -87,22 +85,22 @@ export default defineComponent({
|
|||
action: this.rename
|
||||
}, {
|
||||
text: this.file.isSensitive ? this.$ts.unmarkAsSensitive : this.$ts.markAsSensitive,
|
||||
icon: this.file.isSensitive ? faEye : faEyeSlash,
|
||||
icon: this.file.isSensitive ? 'fas fa-eye' : 'fas fa-eye-slash',
|
||||
action: this.toggleSensitive
|
||||
}, null, {
|
||||
text: this.$ts.copyUrl,
|
||||
icon: faLink,
|
||||
icon: 'fas fa-link',
|
||||
action: this.copyUrl
|
||||
}, {
|
||||
type: 'a',
|
||||
href: this.file.url,
|
||||
target: '_blank',
|
||||
text: this.$ts.download,
|
||||
icon: faDownload,
|
||||
icon: 'fas fa-download',
|
||||
download: this.file.name
|
||||
}, null, {
|
||||
text: this.$ts.delete,
|
||||
icon: faTrashAlt,
|
||||
icon: 'fas fa-trash-alt',
|
||||
danger: true,
|
||||
action: this.deleteFile
|
||||
}];
|
||||
|
|
|
@ -15,8 +15,8 @@
|
|||
:title="title"
|
||||
>
|
||||
<p class="name">
|
||||
<template v-if="hover"><Fa :icon="faFolderOpen" fixed-width/></template>
|
||||
<template v-if="!hover"><Fa :icon="faFolder" fixed-width/></template>
|
||||
<template v-if="hover"><i class="fas fa-folder-open fa-fw"></i></template>
|
||||
<template v-if="!hover"><i class="fas fa-folder fa-fw"></i></template>
|
||||
{{ folder.name }}
|
||||
</p>
|
||||
<p class="upload" v-if="$store.state.uploadFolder == folder.id">
|
||||
|
@ -28,9 +28,7 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faFolder, faFolderOpen, faTrashAlt, faWindowRestore } from '@fortawesome/free-regular-svg-icons';
|
||||
import * as os from '@client/os';
|
||||
import { faICursor } from '@fortawesome/free-solid-svg-icons';
|
||||
|
||||
export default defineComponent({
|
||||
props: {
|
||||
|
@ -57,7 +55,6 @@ export default defineComponent({
|
|||
hover: false,
|
||||
draghover: false,
|
||||
isDragging: false,
|
||||
faFolder, faFolderOpen
|
||||
};
|
||||
},
|
||||
|
||||
|
@ -241,7 +238,7 @@ export default defineComponent({
|
|||
onContextmenu(e) {
|
||||
os.contextMenu([{
|
||||
text: this.$ts.openInWindow,
|
||||
icon: faWindowRestore,
|
||||
icon: 'fas fa-window-restore',
|
||||
action: () => {
|
||||
os.popup(import('./drive-window.vue'), {
|
||||
initialFolder: this.folder
|
||||
|
@ -254,7 +251,7 @@ export default defineComponent({
|
|||
action: this.rename
|
||||
}, null, {
|
||||
text: this.$ts.delete,
|
||||
icon: faTrashAlt,
|
||||
icon: 'fas fa-trash-alt',
|
||||
danger: true,
|
||||
action: this.deleteFolder
|
||||
}], e);
|
||||
|
@ -312,7 +309,7 @@ export default defineComponent({
|
|||
font-size: 0.9em;
|
||||
color: var(--desktopDriveFolderFg);
|
||||
|
||||
> [data-icon] {
|
||||
> i {
|
||||
margin-right: 4px;
|
||||
margin-left: 2px;
|
||||
text-align: left;
|
||||
|
|
|
@ -7,14 +7,13 @@
|
|||
@dragleave="onDragleave"
|
||||
@drop.stop="onDrop"
|
||||
>
|
||||
<i v-if="folder == null"><Fa :icon="faCloud"/></i>
|
||||
<i v-if="folder == null" class="fas fa-cloud"></i>
|
||||
<span>{{ folder == null ? $ts.drive : folder.name }}</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faCloud } from '@fortawesome/free-solid-svg-icons';
|
||||
import * as os from '@client/os';
|
||||
|
||||
export default defineComponent({
|
||||
|
@ -29,7 +28,6 @@ export default defineComponent({
|
|||
return {
|
||||
hover: false,
|
||||
draghover: false,
|
||||
faCloud
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -4,10 +4,10 @@
|
|||
<div class="path" @contextmenu.prevent.stop="() => {}">
|
||||
<XNavFolder :class="{ current: folder == null }"/>
|
||||
<template v-for="f in hierarchyFolders">
|
||||
<span class="separator"><Fa :icon="faAngleRight"/></span>
|
||||
<span class="separator"><i class="fas fa-angle-right"></i></span>
|
||||
<XNavFolder :folder="f"/>
|
||||
</template>
|
||||
<span class="separator" v-if="folder != null"><Fa :icon="faAngleRight"/></span>
|
||||
<span class="separator" v-if="folder != null"><i class="fas fa-angle-right"></i></span>
|
||||
<span class="folder current" v-if="folder != null">{{ folder.name }}</span>
|
||||
</div>
|
||||
</nav>
|
||||
|
@ -47,13 +47,11 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faAngleRight, faFolderPlus, faICursor, faLink, faUpload } from '@fortawesome/free-solid-svg-icons';
|
||||
import XNavFolder from './drive.nav-folder.vue';
|
||||
import XFolder from './drive.folder.vue';
|
||||
import XFile from './drive.file.vue';
|
||||
import MkButton from './ui/button.vue';
|
||||
import * as os from '@client/os';
|
||||
import { faTrashAlt } from '@fortawesome/free-regular-svg-icons';
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
|
@ -125,7 +123,6 @@ export default defineComponent({
|
|||
),
|
||||
moreFilesElement: null as Element,
|
||||
|
||||
faAngleRight
|
||||
};
|
||||
},
|
||||
|
||||
|
@ -606,11 +603,11 @@ export default defineComponent({
|
|||
type: 'label'
|
||||
}, {
|
||||
text: this.$ts.upload,
|
||||
icon: faUpload,
|
||||
icon: 'fas fa-upload',
|
||||
action: () => { this.selectLocalFile(); }
|
||||
}, {
|
||||
text: this.$ts.fromUrl,
|
||||
icon: faLink,
|
||||
icon: 'fas fa-link',
|
||||
action: () => { this.urlUpload(); }
|
||||
}, null, {
|
||||
text: this.folder ? this.folder.name : this.$ts.drive,
|
||||
|
@ -621,11 +618,11 @@ export default defineComponent({
|
|||
action: () => { this.renameFolder(this.folder); }
|
||||
} : undefined, this.folder ? {
|
||||
text: this.$ts.deleteFolder,
|
||||
icon: faTrashAlt,
|
||||
icon: 'fas fa-trash-alt',
|
||||
action: () => { this.deleteFolder(this.folder); }
|
||||
} : undefined, {
|
||||
text: this.$ts.createFolder,
|
||||
icon: faFolderPlus,
|
||||
icon: 'fas fa-folder-plus',
|
||||
action: () => { this.createFolder(); }
|
||||
}];
|
||||
},
|
||||
|
@ -693,7 +690,7 @@ export default defineComponent({
|
|||
opacity: 0.5;
|
||||
cursor: default;
|
||||
|
||||
> [data-icon] {
|
||||
> i {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<section>
|
||||
<header class="_acrylic" @click="shown = !shown">
|
||||
<Fa :icon="shown ? faChevronDown : faChevronUp" :key="shown" fixed-width class="toggle"/> <slot></slot> ({{ emojis.length }})
|
||||
<i class="toggle fa-fw" :class="shown ? 'fas fa-chevron-down' : 'fas fa-chevron-up'"></i> <slot></slot> ({{ emojis.length }})
|
||||
</header>
|
||||
<div v-if="shown">
|
||||
<button v-for="emoji in emojis"
|
||||
|
@ -17,7 +17,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent, markRaw } from 'vue';
|
||||
import { faChevronUp, faChevronDown } from '@fortawesome/free-solid-svg-icons';
|
||||
import { getStaticImageUrl } from '@client/scripts/get-static-image-url';
|
||||
|
||||
export default defineComponent({
|
||||
|
@ -36,7 +35,6 @@ export default defineComponent({
|
|||
return {
|
||||
getStaticImageUrl,
|
||||
shown: this.initialShown,
|
||||
faChevronUp, faChevronDown,
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -42,7 +42,7 @@
|
|||
</section>
|
||||
|
||||
<section>
|
||||
<header class="_acrylic"><Fa :icon="faClock" fixed-width/> {{ $ts.recentUsed }}</header>
|
||||
<header class="_acrylic"><i class="far fa-clock fa-fw"></i> {{ $ts.recentUsed }}</header>
|
||||
<div>
|
||||
<button v-for="emoji in $store.state.recentlyUsedEmojis"
|
||||
class="_button"
|
||||
|
@ -64,10 +64,10 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="tabs">
|
||||
<button class="_button tab" :class="{ active: tab === 'index' }" @click="tab = 'index'"><Fa :icon="faAsterisk" fixed-width/></button>
|
||||
<button class="_button tab" :class="{ active: tab === 'custom' }" @click="tab = 'custom'"><Fa :icon="faLaugh" fixed-width/></button>
|
||||
<button class="_button tab" :class="{ active: tab === 'unicode' }" @click="tab = 'unicode'"><Fa :icon="faLeaf" fixed-width/></button>
|
||||
<button class="_button tab" :class="{ active: tab === 'tags' }" @click="tab = 'tags'"><Fa :icon="faHashtag" fixed-width/></button>
|
||||
<button class="_button tab" :class="{ active: tab === 'index' }" @click="tab = 'index'"><i class="fas fa-asterisk fa-fw"></i></button>
|
||||
<button class="_button tab" :class="{ active: tab === 'custom' }" @click="tab = 'custom'"><i class="fas fa-laugh fa-fw"></i></button>
|
||||
<button class="_button tab" :class="{ active: tab === 'unicode' }" @click="tab = 'unicode'"><i class="fas fa-leaf fa-fw"></i></button>
|
||||
<button class="_button tab" :class="{ active: tab === 'tags' }" @click="tab = 'tags'"><i class="fas fa-hashtag fa-fw"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -76,8 +76,6 @@
|
|||
import { defineComponent, markRaw } from 'vue';
|
||||
import { emojilist } from '@/misc/emojilist';
|
||||
import { getStaticImageUrl } from '@client/scripts/get-static-image-url';
|
||||
import { faAsterisk, faLeaf, faUtensils, faFutbol, faCity, faDice, faGlobe, faClock, faUser, faChevronDown, faShapes, faBicycle, faHashtag } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faHeart, faFlag, faLaugh } from '@fortawesome/free-regular-svg-icons';
|
||||
import Particle from '@client/components/particle.vue';
|
||||
import * as os from '@client/os';
|
||||
import { isDeviceTouch } from '@client/scripts/is-device-touch';
|
||||
|
@ -117,7 +115,6 @@ export default defineComponent({
|
|||
searchResultUnicode: [],
|
||||
tab: 'index',
|
||||
categories: ['face', 'people', 'animals_and_nature', 'food_and_drink', 'activity', 'travel_and_places', 'objects', 'symbols', 'flags'],
|
||||
faGlobe, faClock, faChevronDown, faAsterisk, faLaugh, faUtensils, faLeaf, faShapes, faBicycle, faHashtag,
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -1,12 +1,11 @@
|
|||
<template>
|
||||
<span class="mk-file-type-icon">
|
||||
<template v-if="kind == 'image'"><Fa :icon="faFileImage"/></template>
|
||||
<template v-if="kind == 'image'"><i class="fas fa-file-image"></i></template>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faFileImage } from '@fortawesome/free-solid-svg-icons';
|
||||
import * as os from '@client/os';
|
||||
|
||||
export default defineComponent({
|
||||
|
@ -18,7 +17,6 @@ export default defineComponent({
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
faFileImage
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
|
|
|
@ -6,30 +6,29 @@
|
|||
>
|
||||
<template v-if="!wait">
|
||||
<template v-if="hasPendingFollowRequestFromYou && user.isLocked">
|
||||
<span v-if="full">{{ $ts.followRequestPending }}</span><Fa :icon="faHourglassHalf"/>
|
||||
<span v-if="full">{{ $ts.followRequestPending }}</span><i class="fas fa-hourglass-half"></i>
|
||||
</template>
|
||||
<template v-else-if="hasPendingFollowRequestFromYou && !user.isLocked"> <!-- つまりリモートフォローの場合。 -->
|
||||
<span v-if="full">{{ $ts.processing }}</span><Fa :icon="faSpinner" pulse/>
|
||||
<span v-if="full">{{ $ts.processing }}</span><i class="fas fa-spinner fa-pulse"></i>
|
||||
</template>
|
||||
<template v-else-if="isFollowing">
|
||||
<span v-if="full">{{ $ts.unfollow }}</span><Fa :icon="faMinus"/>
|
||||
<span v-if="full">{{ $ts.unfollow }}</span><i class="fas fa-minus"></i>
|
||||
</template>
|
||||
<template v-else-if="!isFollowing && user.isLocked">
|
||||
<span v-if="full">{{ $ts.followRequest }}</span><Fa :icon="faPlus"/>
|
||||
<span v-if="full">{{ $ts.followRequest }}</span><i class="fas fa-plus"></i>
|
||||
</template>
|
||||
<template v-else-if="!isFollowing && !user.isLocked">
|
||||
<span v-if="full">{{ $ts.follow }}</span><Fa :icon="faPlus"/>
|
||||
<span v-if="full">{{ $ts.follow }}</span><i class="fas fa-plus"></i>
|
||||
</template>
|
||||
</template>
|
||||
<template v-else>
|
||||
<span v-if="full">{{ $ts.processing }}</span><Fa :icon="faSpinner" pulse fixed-width/>
|
||||
<span v-if="full">{{ $ts.processing }}</span><i class="fas fa-spinner fa-pulse fa-fw"></i>
|
||||
</template>
|
||||
</button>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faSpinner, faPlus, faMinus, faHourglassHalf } from '@fortawesome/free-solid-svg-icons';
|
||||
import * as os from '@client/os';
|
||||
|
||||
export default defineComponent({
|
||||
|
@ -56,7 +55,6 @@ export default defineComponent({
|
|||
hasPendingFollowRequestFromYou: this.user.hasPendingFollowRequestFromYou,
|
||||
wait: false,
|
||||
connection: null,
|
||||
faSpinner, faPlus, faMinus, faHourglassHalf
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
<template>
|
||||
<div class="fzenkabp _formItem">
|
||||
<div class="_formPanel" :class="{ warn }">
|
||||
<i v-if="warn"><Fa :icon="faExclamationTriangle"/></i>
|
||||
<i v-else><Fa :icon="faInfoCircle"/></i>
|
||||
<i v-if="warn" class="fas fa-exclamation-triangle"></i>
|
||||
<i v-else class="fas fa-info-circle"></i>
|
||||
<slot></slot>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -10,7 +10,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faInfoCircle, faExclamationTriangle } from '@fortawesome/free-solid-svg-icons';
|
||||
|
||||
export default defineComponent({
|
||||
props: {
|
||||
|
@ -22,7 +21,6 @@ export default defineComponent({
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
faInfoCircle, faExclamationTriangle
|
||||
};
|
||||
}
|
||||
});
|
||||
|
|
|
@ -30,13 +30,12 @@
|
|||
</div>
|
||||
<template #caption><slot name="desc"></slot></template>
|
||||
|
||||
<FormButton v-if="manualSave && changed" @click="updated" primary><Fa :icon="faSave"/> {{ $ts.save }}</FormButton>
|
||||
<FormButton v-if="manualSave && changed" @click="updated" primary><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
|
||||
</FormGroup>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted, onUnmounted, nextTick, ref, watch, computed, toRefs } from 'vue';
|
||||
import { faExclamationCircle, faSave } from '@fortawesome/free-solid-svg-icons';
|
||||
import './form.scss';
|
||||
import FormButton from './button.vue';
|
||||
import FormGroup from './group.vue';
|
||||
|
@ -191,7 +190,6 @@ export default defineComponent({
|
|||
onInput,
|
||||
onKeydown,
|
||||
updated,
|
||||
faExclamationCircle, faSave,
|
||||
};
|
||||
},
|
||||
});
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
<span class="text"><slot></slot></span>
|
||||
<span class="right">
|
||||
<span class="text"><slot name="suffix"></slot></span>
|
||||
<Fa :icon="faExternalLinkAlt" class="icon"/>
|
||||
<i class="fas fa-external-link-alt icon"></i>
|
||||
</span>
|
||||
</a>
|
||||
<MkA class="main _button _formPanel _formClickable" :class="{ active }" :to="to" :behavior="behavior" v-else>
|
||||
|
@ -13,7 +13,7 @@
|
|||
<span class="text"><slot></slot></span>
|
||||
<span class="right">
|
||||
<span class="text"><slot name="suffix"></slot></span>
|
||||
<Fa :icon="faChevronRight" class="icon"/>
|
||||
<i class="fas fa-chevron-right icon"></i>
|
||||
</span>
|
||||
</MkA>
|
||||
</div>
|
||||
|
@ -21,7 +21,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faChevronRight, faExternalLinkAlt } from '@fortawesome/free-solid-svg-icons';
|
||||
import './form.scss';
|
||||
|
||||
export default defineComponent({
|
||||
|
@ -45,7 +44,6 @@ export default defineComponent({
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
faChevronRight, faExternalLinkAlt
|
||||
};
|
||||
}
|
||||
});
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
<slot></slot>
|
||||
</select>
|
||||
<div class="suffix">
|
||||
<Fa :icon="faChevronDown"/>
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="_formCaption"><slot name="caption"></slot></div>
|
||||
|
@ -23,7 +23,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faChevronDown } from '@fortawesome/free-solid-svg-icons';
|
||||
import './form.scss';
|
||||
|
||||
export default defineComponent({
|
||||
|
@ -47,7 +46,6 @@ export default defineComponent({
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
faChevronDown,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
|
|
|
@ -18,13 +18,12 @@
|
|||
</div>
|
||||
<template #caption><slot name="desc"></slot></template>
|
||||
|
||||
<FormButton v-if="manualSave && changed" @click="updated" primary><Fa :icon="faSave"/> {{ $ts.save }}</FormButton>
|
||||
<FormButton v-if="manualSave && changed" @click="updated" primary><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
|
||||
</FormGroup>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, ref, toRefs, watch } from 'vue';
|
||||
import { faSave } from '@fortawesome/free-solid-svg-icons';
|
||||
import './form.scss';
|
||||
import FormButton from './button.vue';
|
||||
import FormGroup from './group.vue';
|
||||
|
@ -106,7 +105,6 @@ export default defineComponent({
|
|||
changed,
|
||||
focus,
|
||||
onInput,
|
||||
faSave,
|
||||
};
|
||||
}
|
||||
});
|
||||
|
|
|
@ -6,7 +6,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faExpandAlt, faColumns, faExternalLinkAlt, faLink, faWindowMaximize } from '@fortawesome/free-solid-svg-icons';
|
||||
import * as os from '@client/os';
|
||||
import copyToClipboard from '@client/scripts/copy-to-clipboard';
|
||||
import { router } from '@client/router';
|
||||
|
@ -57,31 +56,31 @@ export default defineComponent({
|
|||
type: 'label',
|
||||
text: this.to,
|
||||
}, {
|
||||
icon: faWindowMaximize,
|
||||
icon: 'fas fa-window-maximize',
|
||||
text: this.$ts.openInWindow,
|
||||
action: () => {
|
||||
os.pageWindow(this.to);
|
||||
}
|
||||
}, this.sideViewHook ? {
|
||||
icon: faColumns,
|
||||
icon: 'fas fa-columns',
|
||||
text: this.$ts.openInSideView,
|
||||
action: () => {
|
||||
this.sideViewHook(this.to);
|
||||
}
|
||||
} : undefined, {
|
||||
icon: faExpandAlt,
|
||||
icon: 'fas fa-expand-alt',
|
||||
text: this.$ts.showInPage,
|
||||
action: () => {
|
||||
this.$router.push(this.to);
|
||||
}
|
||||
}, null, {
|
||||
icon: faExternalLinkAlt,
|
||||
icon: 'fas fa-external-link-alt',
|
||||
text: this.$ts.openInNewTab,
|
||||
action: () => {
|
||||
window.open(this.to, '_blank');
|
||||
}
|
||||
}, {
|
||||
icon: faLink,
|
||||
icon: 'fas fa-link',
|
||||
text: this.$ts.copyLink,
|
||||
action: () => {
|
||||
copyToClipboard(`${url}${this.to}`);
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
<transition :name="$store.state.animation ? 'zoom' : ''" appear>
|
||||
<div class="mjndxjcg">
|
||||
<img src="https://xn--931a.moe/assets/error.jpg" class="_ghost"/>
|
||||
<p><Fa :icon="faExclamationTriangle"/> {{ $ts.somethingHappened }}</p>
|
||||
<p><i class="fas fa-exclamation-triangle"></i> {{ $ts.somethingHappened }}</p>
|
||||
<MkButton @click="() => $emit('retry')" class="button">{{ $ts.retry }}</MkButton>
|
||||
</div>
|
||||
</transition>
|
||||
|
@ -10,7 +10,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faExclamationTriangle } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
|
||||
export default defineComponent({
|
||||
|
@ -19,7 +18,6 @@ export default defineComponent({
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
faExclamationTriangle
|
||||
};
|
||||
},
|
||||
});
|
||||
|
|
|
@ -15,13 +15,12 @@
|
|||
<span class="pathname" v-if="pathname != ''">{{ self ? pathname.substr(1) : pathname }}</span>
|
||||
<span class="query">{{ query }}</span>
|
||||
<span class="hash">{{ hash }}</span>
|
||||
<Fa :icon="faExternalLinkSquareAlt" v-if="target === '_blank'" class="icon"/>
|
||||
<i v-if="target === '_blank'" class="fas fa-external-link-square-alt icon"></i>
|
||||
</component>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faExternalLinkSquareAlt } from '@fortawesome/free-solid-svg-icons';
|
||||
import { toUnicode as decodePunycode } from 'punycode/';
|
||||
import { url as local } from '@client/config';
|
||||
import { isDeviceTouch } from '@client/scripts/is-device-touch';
|
||||
|
@ -55,7 +54,6 @@ export default defineComponent({
|
|||
hideTimer: null,
|
||||
checkTimer: null,
|
||||
close: null,
|
||||
faExternalLinkSquareAlt
|
||||
};
|
||||
},
|
||||
created() {
|
||||
|
|
|
@ -1,13 +1,12 @@
|
|||
<template>
|
||||
<div class="mk-google">
|
||||
<input type="search" v-model="query" :placeholder="q">
|
||||
<button @click="search"><Fa :icon="faSearch"/> {{ $ts.search }}</button>
|
||||
<button @click="search"><i class="fas fa-search"></i> {{ $ts.search }}</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faSearch } from '@fortawesome/free-solid-svg-icons';
|
||||
import * as os from '@client/os';
|
||||
|
||||
export default defineComponent({
|
||||
|
@ -15,7 +14,6 @@ export default defineComponent({
|
|||
data() {
|
||||
return {
|
||||
query: null,
|
||||
faSearch
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
<div class="stats" v-if="info">
|
||||
<div class="_panel">
|
||||
<div>
|
||||
<b><Fa :icon="faUser"/>{{ $ts.users }}</b>
|
||||
<b><i class="fas fa-user"></i>{{ $ts.users }}</b>
|
||||
<small>{{ $ts.local }}</small>
|
||||
</div>
|
||||
<div>
|
||||
|
@ -23,7 +23,7 @@
|
|||
</div>
|
||||
<div class="_panel">
|
||||
<div>
|
||||
<b><Fa :icon="faUser"/>{{ $ts.users }}</b>
|
||||
<b><i class="fas fa-user"></i>{{ $ts.users }}</b>
|
||||
<small>{{ $ts.remote }}</small>
|
||||
</div>
|
||||
<div>
|
||||
|
@ -43,7 +43,7 @@
|
|||
</div>
|
||||
<div class="_panel">
|
||||
<div>
|
||||
<b><Fa :icon="faPencilAlt"/>{{ $ts.notes }}</b>
|
||||
<b><i class="fas fa-pencil-alt"></i>{{ $ts.notes }}</b>
|
||||
<small>{{ $ts.local }}</small>
|
||||
</div>
|
||||
<div>
|
||||
|
@ -63,7 +63,7 @@
|
|||
</div>
|
||||
<div class="_panel">
|
||||
<div>
|
||||
<b><Fa :icon="faPencilAlt"/>{{ $ts.notes }}</b>
|
||||
<b><i class="fas fa-pencil-alt"></i>{{ $ts.notes }}</b>
|
||||
<small>{{ $ts.remote }}</small>
|
||||
</div>
|
||||
<div>
|
||||
|
@ -84,7 +84,7 @@
|
|||
</div>
|
||||
|
||||
<section class="_card">
|
||||
<div class="_title" style="position: relative;"><Fa :icon="faChartBar"/> {{ $ts.statistics }}<button @click="fetchChart" class="_button" style="position: absolute; right: 0; bottom: 0; top: 0; padding: inherit;"><Fa :icon="faSync"/></button></div>
|
||||
<div class="_title" style="position: relative;"><i class="fas fa-chart-bar"></i> {{ $ts.statistics }}<button @click="fetchChart" class="_button" style="position: absolute; right: 0; bottom: 0; top: 0; padding: inherit;"><i class="fas fa-sync"></i></button></div>
|
||||
<div class="_content" style="margin-top: -8px;">
|
||||
<div class="selects" style="display: flex;">
|
||||
<MkSelect v-model:value="chartSrc" style="margin: 0; flex: 1;">
|
||||
|
@ -123,7 +123,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent, markRaw } from 'vue';
|
||||
import { faChartBar, faUser, faPencilAlt, faSync } from '@fortawesome/free-solid-svg-icons';
|
||||
import Chart from 'chart.js';
|
||||
import MkSelect from './ui/select.vue';
|
||||
import number from '@client/filters/number';
|
||||
|
@ -173,7 +172,6 @@ export default defineComponent({
|
|||
chartInstance: null,
|
||||
chartSrc: 'notes',
|
||||
chartSpan: 'hour',
|
||||
faChartBar, faUser, faPencilAlt, faSync
|
||||
}
|
||||
},
|
||||
|
||||
|
@ -666,7 +664,7 @@ export default defineComponent({
|
|||
> b {
|
||||
display: block;
|
||||
|
||||
> [data-icon] {
|
||||
> i {
|
||||
width: 16px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
|
|
@ -4,28 +4,28 @@
|
|||
<div class="main">
|
||||
<template v-for="item in items">
|
||||
<button v-if="item.action" class="_button" @click="$event => { item.action($event); close(); }">
|
||||
<Fa :icon="item.icon" class="icon"/>
|
||||
<i class="icon" :class="item.icon"></i>
|
||||
<div class="text">{{ item.text }}</div>
|
||||
<i v-if="item.indicate"><Fa :icon="faCircle"/></i>
|
||||
<span v-if="item.indicate" class="indicator"><i class="fas fa-circle"></i></span>
|
||||
</button>
|
||||
<MkA v-else :to="item.to" @click.passive="close()">
|
||||
<Fa :icon="item.icon" class="icon"/>
|
||||
<i class="icon" :class="item.icon"></i>
|
||||
<div class="text">{{ item.text }}</div>
|
||||
<i v-if="item.indicate"><Fa :icon="faCircle"/></i>
|
||||
<span v-if="item.indicate" class="indicator"><i class="fas fa-circle"></i></span>
|
||||
</MkA>
|
||||
</template>
|
||||
</div>
|
||||
<div class="sub">
|
||||
<MkA to="/docs" @click.passive="close()">
|
||||
<Fa :icon="faQuestionCircle" class="icon"/>
|
||||
<i class="fas fa-question-circle icon"></i>
|
||||
<div class="text">{{ $ts.help }}</div>
|
||||
</MkA>
|
||||
<MkA to="/about" @click.passive="close()">
|
||||
<Fa :icon="faInfoCircle" class="icon"/>
|
||||
<i class="fas fa-info-circle icon"></i>
|
||||
<div class="text">{{ $t('aboutX', { x: instanceName }) }}</div>
|
||||
</MkA>
|
||||
<MkA to="/about-misskey" @click.passive="close()">
|
||||
<Fa :icon="faInfoCircle" class="icon"/>
|
||||
<i class="fas fa-info-circle icon"></i>
|
||||
<div class="text">{{ $ts.aboutMisskey }}</div>
|
||||
</MkA>
|
||||
</div>
|
||||
|
@ -35,7 +35,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faQuestionCircle, faInfoCircle, faCircle } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkModal from '@client/components/ui/modal.vue';
|
||||
import { sidebarDef } from '@client/sidebar';
|
||||
import { instanceName } from '@client/config';
|
||||
|
@ -52,7 +51,6 @@ export default defineComponent({
|
|||
menuDef: sidebarDef,
|
||||
items: [],
|
||||
instanceName,
|
||||
faQuestionCircle, faInfoCircle, faCircle,
|
||||
};
|
||||
},
|
||||
|
||||
|
@ -127,7 +125,7 @@ export default defineComponent({
|
|||
line-height: 1.5em;
|
||||
}
|
||||
|
||||
> i {
|
||||
> .indicator {
|
||||
position: absolute;
|
||||
top: 32px;
|
||||
left: 32px;
|
||||
|
|
|
@ -5,13 +5,12 @@
|
|||
:title="url"
|
||||
>
|
||||
<slot></slot>
|
||||
<Fa :icon="faExternalLinkSquareAlt" v-if="target === '_blank'" class="icon"/>
|
||||
<i v-if="target === '_blank'" class="fas fa-external-link-square-alt icon"></i>
|
||||
</component>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faExternalLinkSquareAlt } from '@fortawesome/free-solid-svg-icons';
|
||||
import { url as local } from '@client/config';
|
||||
import { isDeviceTouch } from '@client/scripts/is-device-touch';
|
||||
import * as os from '@client/os';
|
||||
|
@ -38,7 +37,6 @@ export default defineComponent({
|
|||
hideTimer: null,
|
||||
checkTimer: null,
|
||||
close: null,
|
||||
faExternalLinkSquareAlt
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="mk-media-banner">
|
||||
<div class="sensitive" v-if="media.isSensitive && hide" @click="hide = false">
|
||||
<span class="icon"><Fa :icon="faExclamationTriangle"/></span>
|
||||
<span class="icon"><i class="fas fa-exclamation-triangle"></i></span>
|
||||
<b>{{ $ts.sensitive }}</b>
|
||||
<span>{{ $ts.clickToShow }}</span>
|
||||
</div>
|
||||
|
@ -19,7 +19,7 @@
|
|||
:title="media.name"
|
||||
:download="media.name"
|
||||
>
|
||||
<span class="icon"><Fa icon="download"/></span>
|
||||
<span class="icon"><i class="fas fa-download"></i></span>
|
||||
<b>{{ media.name }}</b>
|
||||
</a>
|
||||
</div>
|
||||
|
@ -27,7 +27,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faExclamationTriangle } from '@fortawesome/free-solid-svg-icons';
|
||||
import * as os from '@client/os';
|
||||
import { ColdDeviceStorage } from '@client/store';
|
||||
|
||||
|
@ -41,7 +40,6 @@ export default defineComponent({
|
|||
data() {
|
||||
return {
|
||||
hide: true,
|
||||
faExclamationTriangle
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
|
|
@ -3,13 +3,13 @@
|
|||
<ImgWithBlurhash class="bg" :hash="image.blurhash" :title="image.name"/>
|
||||
<div class="text">
|
||||
<div>
|
||||
<b><Fa :icon="faExclamationTriangle"/> {{ $ts.sensitive }}</b>
|
||||
<b><i class="fas fa-exclamation-triangle"></i> {{ $ts.sensitive }}</b>
|
||||
<span>{{ $ts.clickToShow }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="gqnyydlz" :style="{ background: color }" v-else>
|
||||
<i><Fa :icon="faEyeSlash" @click="hide = true"/></i>
|
||||
<i class="fas fa-eye-slash" @click="hide = true"></i>
|
||||
<a
|
||||
:href="image.url"
|
||||
:title="image.name"
|
||||
|
@ -23,7 +23,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faExclamationTriangle, faEyeSlash } from '@fortawesome/free-solid-svg-icons';
|
||||
import { getStaticImageUrl } from '@client/scripts/get-static-image-url';
|
||||
import { extractAvgColorFromBlurhash } from '@client/scripts/extract-avg-color-from-blurhash';
|
||||
import ImageViewer from './image-viewer.vue';
|
||||
|
@ -47,7 +46,6 @@ export default defineComponent({
|
|||
return {
|
||||
hide: true,
|
||||
color: null,
|
||||
faExclamationTriangle, faEyeSlash,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="icozogqfvdetwohsdglrbswgrejoxbdj" v-if="hide" @click="hide = false">
|
||||
<div>
|
||||
<b><Fa :icon="faExclamationTriangle"/> {{ $ts.sensitive }}</b>
|
||||
<b><i class="fas fa-exclamation-triangle"></i> {{ $ts.sensitive }}</b>
|
||||
<span>{{ $ts.clickToShow }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -18,13 +18,12 @@
|
|||
:type="video.type"
|
||||
>
|
||||
</video>
|
||||
<i><Fa :icon="faEyeSlash" @click="hide = true"/></i>
|
||||
<i class="fas fa-eye-slash" @click="hide = true"></i>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faExclamationTriangle, faEyeSlash } from '@fortawesome/free-solid-svg-icons';
|
||||
import * as os from '@client/os';
|
||||
|
||||
export default defineComponent({
|
||||
|
@ -37,8 +36,6 @@ export default defineComponent({
|
|||
data() {
|
||||
return {
|
||||
hide: true,
|
||||
faExclamationTriangle,
|
||||
faEyeSlash
|
||||
};
|
||||
},
|
||||
created() {
|
||||
|
|
|
@ -2,12 +2,12 @@
|
|||
<MkModal ref="modal" @click="$emit('click')" @closed="$emit('closed')">
|
||||
<div class="hrmcaedk _popup _narrow_" :style="{ width: `${width}px`, height: (height ? `min(${height}px, 100%)` : '100%') }">
|
||||
<div class="header">
|
||||
<button class="_button" @click="back()" v-if="history.length > 0"><Fa :icon="faChevronLeft"/></button>
|
||||
<button class="_button" @click="back()" v-if="history.length > 0"><i class="fas fa-chevron-left"></i></button>
|
||||
<button class="_button" style="pointer-events: none;" v-else><!-- マージンのバランスを取るためのダミー --></button>
|
||||
<span class="title">
|
||||
<XHeader :info="pageInfo" :with-back="false"/>
|
||||
</span>
|
||||
<button class="_button" @click="$refs.modal.close()"><Fa :icon="faTimes"/></button>
|
||||
<button class="_button" @click="$refs.modal.close()"><i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
<div class="body _flat_">
|
||||
<keep-alive>
|
||||
|
@ -20,7 +20,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faExternalLinkAlt, faExpandAlt, faLink, faChevronLeft, faColumns, faTimes } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkModal from '@client/components/ui/modal.vue';
|
||||
import XHeader from '@client/ui/_common_/header.vue';
|
||||
import { popout } from '@client/scripts/popout';
|
||||
|
@ -76,7 +75,6 @@ export default defineComponent({
|
|||
component: this.initialComponent,
|
||||
props: this.initialProps,
|
||||
history: [],
|
||||
faChevronLeft, faTimes,
|
||||
};
|
||||
},
|
||||
|
||||
|
@ -90,29 +88,29 @@ export default defineComponent({
|
|||
type: 'label',
|
||||
text: this.path,
|
||||
}, {
|
||||
icon: faExpandAlt,
|
||||
icon: 'fas fa-expand-alt',
|
||||
text: this.$ts.showInPage,
|
||||
action: this.expand
|
||||
}, this.sideViewHook ? {
|
||||
icon: faColumns,
|
||||
icon: 'fas fa-columns',
|
||||
text: this.$ts.openInSideView,
|
||||
action: () => {
|
||||
this.sideViewHook(this.path);
|
||||
this.$refs.window.close();
|
||||
}
|
||||
} : undefined, {
|
||||
icon: faExternalLinkAlt,
|
||||
icon: 'fas fa-external-link-alt',
|
||||
text: this.$ts.popout,
|
||||
action: this.popout
|
||||
}, null, {
|
||||
icon: faExternalLinkAlt,
|
||||
icon: 'fas fa-external-link-alt',
|
||||
text: this.$ts.openInNewTab,
|
||||
action: () => {
|
||||
window.open(this.url, '_blank');
|
||||
this.$refs.window.close();
|
||||
}
|
||||
}, {
|
||||
icon: faLink,
|
||||
icon: 'fas fa-link',
|
||||
text: this.$ts.copyLink,
|
||||
action: () => {
|
||||
copyToClipboard(this.url);
|
||||
|
|
|
@ -12,7 +12,7 @@
|
|||
<XSub :note="appearNote.reply" class="reply-to" v-if="appearNote.reply"/>
|
||||
<div class="renote" v-if="isRenote">
|
||||
<MkAvatar class="avatar" :user="note.user"/>
|
||||
<Fa :icon="faRetweet"/>
|
||||
<i class="fas fa-retweet"></i>
|
||||
<I18n :src="$ts.renotedBy" tag="span">
|
||||
<template #user>
|
||||
<MkA class="name" :to="userPage(note.user)" v-user-preview="note.userId">
|
||||
|
@ -22,15 +22,15 @@
|
|||
</I18n>
|
||||
<div class="info">
|
||||
<button class="_button time" @click="showRenoteMenu()" ref="renoteTime">
|
||||
<Fa class="dropdownIcon" v-if="isMyRenote" :icon="faEllipsisH"/>
|
||||
<i v-if="isMyRenote" class="fas fa-ellipsis-h dropdownIcon"></i>
|
||||
<MkTime :time="note.createdAt"/>
|
||||
</button>
|
||||
<span class="visibility" v-if="note.visibility !== 'public'">
|
||||
<Fa v-if="note.visibility === 'home'" :icon="faHome"/>
|
||||
<Fa v-if="note.visibility === 'followers'" :icon="faUnlock"/>
|
||||
<Fa v-if="note.visibility === 'specified'" :icon="faEnvelope"/>
|
||||
<i v-if="note.visibility === 'home'" class="fas fa-home"></i>
|
||||
<i v-else-if="note.visibility === 'followers'" class="fas fa-unlock"></i>
|
||||
<i v-else-if="note.visibility === 'specified'" class="fas fa-envelope"></i>
|
||||
</span>
|
||||
<span class="localOnly" v-if="note.localOnly"><Fa :icon="faBiohazard"/></span>
|
||||
<span class="localOnly" v-if="note.localOnly"><i class="fas fa-biohazard"></i></span>
|
||||
</div>
|
||||
</div>
|
||||
<article class="article" @contextmenu.stop="onContextmenu">
|
||||
|
@ -42,14 +42,14 @@
|
|||
<MkUserName :user="appearNote.user"/>
|
||||
</MkA>
|
||||
<span class="is-bot" v-if="appearNote.user.isBot">bot</span>
|
||||
<span class="admin" v-if="appearNote.user.isAdmin"><Fa :icon="faBookmark"/></span>
|
||||
<span class="moderator" v-if="!appearNote.user.isAdmin && appearNote.user.isModerator"><Fa :icon="farBookmark"/></span>
|
||||
<span class="admin" v-if="appearNote.user.isAdmin"><i class="fas fa-bookmark"></i></span>
|
||||
<span class="moderator" v-if="!appearNote.user.isAdmin && appearNote.user.isModerator"><i class="far fa-bookmark"></i></span>
|
||||
<span class="visibility" v-if="appearNote.visibility !== 'public'">
|
||||
<Fa v-if="appearNote.visibility === 'home'" :icon="faHome"/>
|
||||
<Fa v-if="appearNote.visibility === 'followers'" :icon="faUnlock"/>
|
||||
<Fa v-if="appearNote.visibility === 'specified'" :icon="faEnvelope"/>
|
||||
<i v-if="appearNote.visibility === 'home'" class="fas fa-home"></i>
|
||||
<i v-else-if="appearNote.visibility === 'followers'" class="fas fa-unlock"></i>
|
||||
<i v-else-if="appearNote.visibility === 'specified'" class="fas fa-envelope"></i>
|
||||
</span>
|
||||
<span class="localOnly" v-if="appearNote.localOnly"><Fa :icon="faBiohazard"/></span>
|
||||
<span class="localOnly" v-if="appearNote.localOnly"><i class="fas fa-biohazard"></i></span>
|
||||
</div>
|
||||
<div class="username"><MkAcct :user="appearNote.user"/></div>
|
||||
<MkInstanceTicker v-if="showTicker" class="ticker" :instance="appearNote.user.instance"/>
|
||||
|
@ -64,7 +64,7 @@
|
|||
<div class="content" v-show="appearNote.cw == null || showContent">
|
||||
<div class="text">
|
||||
<span v-if="appearNote.isHidden" style="opacity: 0.5">({{ $ts.private }})</span>
|
||||
<MkA class="reply" v-if="appearNote.replyId" :to="`/notes/${appearNote.replyId}`"><Fa :icon="faReply"/></MkA>
|
||||
<MkA class="reply" v-if="appearNote.replyId" :to="`/notes/${appearNote.replyId}`"><i class="fas fa-reply"></i></MkA>
|
||||
<Mfm v-if="appearNote.text" :text="appearNote.text" :author="appearNote.user" :i="$i" :custom-emojis="appearNote.emojis"/>
|
||||
<a class="rp" v-if="appearNote.renote != null">RN:</a>
|
||||
</div>
|
||||
|
@ -75,33 +75,33 @@
|
|||
<MkUrlPreview v-for="url in urls" :url="url" :key="url" :compact="true" :detail="true" class="url-preview"/>
|
||||
<div class="renote" v-if="appearNote.renote"><XNotePreview :note="appearNote.renote"/></div>
|
||||
</div>
|
||||
<MkA v-if="appearNote.channel && !inChannel" class="channel" :to="`/channels/${appearNote.channel.id}`"><Fa :icon="faSatelliteDish"/> {{ appearNote.channel.name }}</MkA>
|
||||
<MkA v-if="appearNote.channel && !inChannel" class="channel" :to="`/channels/${appearNote.channel.id}`"><i class="fas fa-satellite-dish"></i> {{ appearNote.channel.name }}</MkA>
|
||||
</div>
|
||||
<footer class="footer">
|
||||
<div class="info">
|
||||
<span class="mobile" v-if="note.viaMobile"><Fa :icon="faMobileAlt"/></span>
|
||||
<span class="mobile" v-if="note.viaMobile"><i class="fas fa-mobile-alt"></i></span>
|
||||
<MkTime class="created-at" :time="note.createdAt" mode="detail"/>
|
||||
</div>
|
||||
<XReactionsViewer :note="appearNote" ref="reactionsViewer"/>
|
||||
<button @click="reply()" class="button _button">
|
||||
<template v-if="appearNote.reply"><Fa :icon="faReplyAll"/></template>
|
||||
<template v-else><Fa :icon="faReply"/></template>
|
||||
<template v-if="appearNote.reply"><i class="fas fa-reply-all"></i></template>
|
||||
<template v-else><i class="fas fa-reply"></i></template>
|
||||
<p class="count" v-if="appearNote.repliesCount > 0">{{ appearNote.repliesCount }}</p>
|
||||
</button>
|
||||
<button v-if="canRenote" @click="renote()" class="button _button" ref="renoteButton">
|
||||
<Fa :icon="faRetweet"/><p class="count" v-if="appearNote.renoteCount > 0">{{ appearNote.renoteCount }}</p>
|
||||
<i class="fas fa-retweet"></i><p class="count" v-if="appearNote.renoteCount > 0">{{ appearNote.renoteCount }}</p>
|
||||
</button>
|
||||
<button v-else class="button _button">
|
||||
<Fa :icon="faBan"/>
|
||||
<i class="fas fa-ban"></i>
|
||||
</button>
|
||||
<button v-if="appearNote.myReaction == null" class="button _button" @click="react()" ref="reactButton">
|
||||
<Fa :icon="faPlus"/>
|
||||
<i class="fas fa-plus"></i>
|
||||
</button>
|
||||
<button v-if="appearNote.myReaction != null" class="button _button reacted" @click="undoReact(appearNote)" ref="reactButton">
|
||||
<Fa :icon="faMinus"/>
|
||||
<i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button class="button _button" @click="menu()" ref="menuButton">
|
||||
<Fa :icon="faEllipsisH"/>
|
||||
<i class="fas fa-ellipsis-h"></i>
|
||||
</button>
|
||||
</footer>
|
||||
</div>
|
||||
|
@ -121,8 +121,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineAsyncComponent, defineComponent, markRaw } from 'vue';
|
||||
import { faSatelliteDish, faBolt, faTimes, faBullhorn, faStar, faLink, faExternalLinkSquareAlt, faPlus, faMinus, faRetweet, faReply, faReplyAll, faEllipsisH, faHome, faUnlock, faEnvelope, faThumbtack, faBan, faQuoteRight, faInfoCircle, faBiohazard, faPlug, faExclamationCircle, faPaperclip, faShareAlt } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faCopy, faTrashAlt, faEdit, faEye, faEyeSlash } from '@fortawesome/free-regular-svg-icons';
|
||||
import * as mfm from 'mfm-js';
|
||||
import { sum } from '../../prelude/array';
|
||||
import XSub from './note.sub.vue';
|
||||
|
@ -143,14 +141,6 @@ import { noteActions, noteViewInterruptors } from '@client/store';
|
|||
import { reactionPicker } from '@client/scripts/reaction-picker';
|
||||
import { extractUrlFromMfm } from '@/misc/extract-url-from-mfm';
|
||||
|
||||
function markRawAll(...xs) {
|
||||
for (const x of xs) {
|
||||
markRaw(x);
|
||||
}
|
||||
}
|
||||
|
||||
markRawAll(faEdit, faBolt, faTimes, faBullhorn, faPlus, faMinus, faRetweet, faReply, faReplyAll, faEllipsisH, faHome, faUnlock, faEnvelope, faThumbtack, faBan, faBiohazard, faPlug, faSatelliteDish);
|
||||
|
||||
// TODO: note.vueとほぼ同じなので共通化したい
|
||||
export default defineComponent({
|
||||
components: {
|
||||
|
@ -188,7 +178,6 @@ export default defineComponent({
|
|||
showContent: false,
|
||||
isDeleted: false,
|
||||
muted: false,
|
||||
faEdit, faBolt, faTimes, faBullhorn, faPlus, faMinus, faRetweet, faReply, faReplyAll, faEllipsisH, faHome, faUnlock, faEnvelope, faThumbtack, faBan, faBiohazard, faPlug, faSatelliteDish
|
||||
};
|
||||
},
|
||||
|
||||
|
@ -467,7 +456,7 @@ export default defineComponent({
|
|||
this.blur();
|
||||
os.modalMenu([{
|
||||
text: this.$ts.renote,
|
||||
icon: faRetweet,
|
||||
icon: 'fas fa-retweet',
|
||||
action: () => {
|
||||
os.api('notes/create', {
|
||||
renoteId: this.appearNote.id
|
||||
|
@ -475,7 +464,7 @@ export default defineComponent({
|
|||
}
|
||||
}, {
|
||||
text: this.$ts.quote,
|
||||
icon: faQuoteRight,
|
||||
icon: 'fas fa-quote-right',
|
||||
action: () => {
|
||||
os.post({
|
||||
renote: this.appearNote,
|
||||
|
@ -611,62 +600,62 @@ export default defineComponent({
|
|||
});
|
||||
|
||||
menu = [{
|
||||
icon: faCopy,
|
||||
icon: 'fas fa-copy',
|
||||
text: this.$ts.copyContent,
|
||||
action: this.copyContent
|
||||
}, {
|
||||
icon: faLink,
|
||||
icon: 'fas fa-link',
|
||||
text: this.$ts.copyLink,
|
||||
action: this.copyLink
|
||||
}, (this.appearNote.url || this.appearNote.uri) ? {
|
||||
icon: faExternalLinkSquareAlt,
|
||||
icon: 'fas fa-external-link-square-alt',
|
||||
text: this.$ts.showOnRemote,
|
||||
action: () => {
|
||||
window.open(this.appearNote.url || this.appearNote.uri, '_blank');
|
||||
}
|
||||
} : undefined,
|
||||
{
|
||||
icon: faShareAlt,
|
||||
icon: 'fas fa-share-alt',
|
||||
text: this.$ts.share,
|
||||
action: this.share
|
||||
},
|
||||
null,
|
||||
statePromise.then(state => state.isFavorited ? {
|
||||
icon: faStar,
|
||||
icon: 'fas fa-star',
|
||||
text: this.$ts.unfavorite,
|
||||
action: () => this.toggleFavorite(false)
|
||||
} : {
|
||||
icon: faStar,
|
||||
icon: 'fas fa-star',
|
||||
text: this.$ts.favorite,
|
||||
action: () => this.toggleFavorite(true)
|
||||
}),
|
||||
{
|
||||
icon: faPaperclip,
|
||||
icon: 'fas fa-paperclip',
|
||||
text: this.$ts.clip,
|
||||
action: () => this.clip()
|
||||
},
|
||||
(this.appearNote.userId != this.$i.id) ? statePromise.then(state => state.isWatching ? {
|
||||
icon: faEyeSlash,
|
||||
icon: 'fas fa-eye-slash',
|
||||
text: this.$ts.unwatch,
|
||||
action: () => this.toggleWatch(false)
|
||||
} : {
|
||||
icon: faEye,
|
||||
icon: 'fas fa-eye',
|
||||
text: this.$ts.watch,
|
||||
action: () => this.toggleWatch(true)
|
||||
}) : undefined,
|
||||
this.appearNote.userId == this.$i.id ? (this.$i.pinnedNoteIds || []).includes(this.appearNote.id) ? {
|
||||
icon: faThumbtack,
|
||||
icon: 'fas fa-thumbtack',
|
||||
text: this.$ts.unpin,
|
||||
action: () => this.togglePin(false)
|
||||
} : {
|
||||
icon: faThumbtack,
|
||||
icon: 'fas fa-thumbtack',
|
||||
text: this.$ts.pin,
|
||||
action: () => this.togglePin(true)
|
||||
} : undefined,
|
||||
...(this.$i.isModerator || this.$i.isAdmin ? [
|
||||
null,
|
||||
{
|
||||
icon: faBullhorn,
|
||||
icon: 'fas fa-bullhorn',
|
||||
text: this.$ts.promote,
|
||||
action: this.promote
|
||||
}]
|
||||
|
@ -675,7 +664,7 @@ export default defineComponent({
|
|||
...(this.appearNote.userId != this.$i.id ? [
|
||||
null,
|
||||
{
|
||||
icon: faExclamationCircle,
|
||||
icon: 'fas fa-exclamation-circle',
|
||||
text: this.$ts.reportAbuse,
|
||||
action: () => {
|
||||
const u = `${url}/notes/${this.appearNote.id}`;
|
||||
|
@ -690,12 +679,12 @@ export default defineComponent({
|
|||
...(this.appearNote.userId == this.$i.id || this.$i.isModerator || this.$i.isAdmin ? [
|
||||
null,
|
||||
this.appearNote.userId == this.$i.id ? {
|
||||
icon: faEdit,
|
||||
icon: 'fas fa-edit',
|
||||
text: this.$ts.deleteAndEdit,
|
||||
action: this.delEdit
|
||||
} : undefined,
|
||||
{
|
||||
icon: faTrashAlt,
|
||||
icon: 'fas fa-trash-alt',
|
||||
text: this.$ts.delete,
|
||||
danger: true,
|
||||
action: this.del
|
||||
|
@ -705,15 +694,15 @@ export default defineComponent({
|
|||
.filter(x => x !== undefined);
|
||||
} else {
|
||||
menu = [{
|
||||
icon: faCopy,
|
||||
icon: 'fas fa-copy',
|
||||
text: this.$ts.copyContent,
|
||||
action: this.copyContent
|
||||
}, {
|
||||
icon: faLink,
|
||||
icon: 'fas fa-link',
|
||||
text: this.$ts.copyLink,
|
||||
action: this.copyLink
|
||||
}, (this.appearNote.url || this.appearNote.uri) ? {
|
||||
icon: faExternalLinkSquareAlt,
|
||||
icon: 'fas fa-external-link-square-alt',
|
||||
text: this.$ts.showOnRemote,
|
||||
action: () => {
|
||||
window.open(this.appearNote.url || this.appearNote.uri, '_blank');
|
||||
|
@ -724,7 +713,7 @@ export default defineComponent({
|
|||
|
||||
if (noteActions.length > 0) {
|
||||
menu = menu.concat([null, ...noteActions.map(action => ({
|
||||
icon: faPlug,
|
||||
icon: 'fas fa-plug',
|
||||
text: action.title,
|
||||
action: () => {
|
||||
action.handler(this.appearNote);
|
||||
|
@ -763,7 +752,7 @@ export default defineComponent({
|
|||
if (!this.isMyRenote) return;
|
||||
os.modalMenu([{
|
||||
text: this.$ts.unrenote,
|
||||
icon: faTrashAlt,
|
||||
icon: 'fas fa-trash-alt',
|
||||
danger: true,
|
||||
action: () => {
|
||||
os.api('notes/delete', {
|
||||
|
@ -806,7 +795,7 @@ export default defineComponent({
|
|||
async clip() {
|
||||
const clips = await os.api('clips/list');
|
||||
os.modalMenu([{
|
||||
icon: faPlus,
|
||||
icon: 'fas fa-plus',
|
||||
text: this.$ts.createNew,
|
||||
action: async () => {
|
||||
const { canceled, result } = await os.form(this.$ts.createNewClip, {
|
||||
|
@ -943,7 +932,7 @@ export default defineComponent({
|
|||
border-radius: 6px;
|
||||
}
|
||||
|
||||
> [data-icon] {
|
||||
> i {
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
|
|
|
@ -5,27 +5,25 @@
|
|||
</MkA>
|
||||
<span class="is-bot" v-if="note.user.isBot">bot</span>
|
||||
<span class="username"><MkAcct :user="note.user"/></span>
|
||||
<span class="admin" v-if="note.user.isAdmin"><Fa :icon="faBookmark"/></span>
|
||||
<span class="moderator" v-if="!note.user.isAdmin && note.user.isModerator"><Fa :icon="farBookmark"/></span>
|
||||
<span class="admin" v-if="note.user.isAdmin"><i class="fas fa-bookmark"></i></span>
|
||||
<span class="moderator" v-if="!note.user.isAdmin && note.user.isModerator"><i class="far fa-bookmark"></i></span>
|
||||
<div class="info">
|
||||
<span class="mobile" v-if="note.viaMobile"><Fa :icon="faMobileAlt"/></span>
|
||||
<span class="mobile" v-if="note.viaMobile"><i class="fas fa-mobile-alt"></i></span>
|
||||
<MkA class="created-at" :to="notePage(note)">
|
||||
<MkTime :time="note.createdAt"/>
|
||||
</MkA>
|
||||
<span class="visibility" v-if="note.visibility !== 'public'">
|
||||
<Fa v-if="note.visibility === 'home'" :icon="faHome"/>
|
||||
<Fa v-if="note.visibility === 'followers'" :icon="faUnlock"/>
|
||||
<Fa v-if="note.visibility === 'specified'" :icon="faEnvelope"/>
|
||||
<i v-if="note.visibility === 'home'" class="fas fa-home"></i>
|
||||
<i v-else-if="note.visibility === 'followers'" class="fas fa-unlock"></i>
|
||||
<i v-else-if="note.visibility === 'specified'" class="fas fa-envelope"></i>
|
||||
</span>
|
||||
<span class="localOnly" v-if="note.localOnly"><Fa :icon="faBiohazard"/></span>
|
||||
<span class="localOnly" v-if="note.localOnly"><i class="fas fa-biohazard"></i></span>
|
||||
</div>
|
||||
</header>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faHome, faUnlock, faEnvelope, faMobileAlt, faBookmark, faBiohazard } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faBookmark as farBookmark } from '@fortawesome/free-regular-svg-icons';
|
||||
import notePage from '../filters/note';
|
||||
import { userPage } from '../filters/user';
|
||||
import * as os from '@client/os';
|
||||
|
@ -40,7 +38,6 @@ export default defineComponent({
|
|||
|
||||
data() {
|
||||
return {
|
||||
faHome, faUnlock, faEnvelope, faMobileAlt, faBookmark, farBookmark, faBiohazard
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -9,12 +9,12 @@
|
|||
v-size="{ max: [500, 450, 350, 300] }"
|
||||
>
|
||||
<XSub :note="appearNote.reply" class="reply-to" v-if="appearNote.reply"/>
|
||||
<div class="info" v-if="pinned"><Fa :icon="faThumbtack"/> {{ $ts.pinnedNote }}</div>
|
||||
<div class="info" v-if="appearNote._prId_"><Fa :icon="faBullhorn"/> {{ $ts.promotion }}<button class="_textButton hide" @click="readPromo()">{{ $ts.hideThisNote }} <Fa :icon="faTimes"/></button></div>
|
||||
<div class="info" v-if="appearNote._featuredId_"><Fa :icon="faBolt"/> {{ $ts.featured }}</div>
|
||||
<div class="info" v-if="pinned"><i class="fas fa-thumbtack"></i> {{ $ts.pinnedNote }}</div>
|
||||
<div class="info" v-if="appearNote._prId_"><i class="fas fa-bullhorn"></i> {{ $ts.promotion }}<button class="_textButton hide" @click="readPromo()">{{ $ts.hideThisNote }} <i class="fas fa-times"></i></button></div>
|
||||
<div class="info" v-if="appearNote._featuredId_"><i class="fas fa-bolt"></i> {{ $ts.featured }}</div>
|
||||
<div class="renote" v-if="isRenote">
|
||||
<MkAvatar class="avatar" :user="note.user"/>
|
||||
<Fa :icon="faRetweet"/>
|
||||
<i class="fas fa-retweet"></i>
|
||||
<I18n :src="$ts.renotedBy" tag="span">
|
||||
<template #user>
|
||||
<MkA class="name" :to="userPage(note.user)" v-user-preview="note.userId">
|
||||
|
@ -24,15 +24,15 @@
|
|||
</I18n>
|
||||
<div class="info">
|
||||
<button class="_button time" @click="showRenoteMenu()" ref="renoteTime">
|
||||
<Fa class="dropdownIcon" v-if="isMyRenote" :icon="faEllipsisH"/>
|
||||
<i v-if="isMyRenote" class="fas fa-ellipsis-h dropdownIcon"></i>
|
||||
<MkTime :time="note.createdAt"/>
|
||||
</button>
|
||||
<span class="visibility" v-if="note.visibility !== 'public'">
|
||||
<Fa v-if="note.visibility === 'home'" :icon="faHome"/>
|
||||
<Fa v-if="note.visibility === 'followers'" :icon="faUnlock"/>
|
||||
<Fa v-if="note.visibility === 'specified'" :icon="faEnvelope"/>
|
||||
<i v-if="note.visibility === 'home'" class="fas fa-home"></i>
|
||||
<i v-else-if="note.visibility === 'followers'" class="fas fa-unlock"></i>
|
||||
<i v-else-if="note.visibility === 'specified'" class="fas fa-envelope"></i>
|
||||
</span>
|
||||
<span class="localOnly" v-if="note.localOnly"><Fa :icon="faBiohazard"/></span>
|
||||
<span class="localOnly" v-if="note.localOnly"><i class="fas fa-biohazard"></i></span>
|
||||
</div>
|
||||
</div>
|
||||
<article class="article" @contextmenu.stop="onContextmenu">
|
||||
|
@ -48,7 +48,7 @@
|
|||
<div class="content" :class="{ collapsed }" v-show="appearNote.cw == null || showContent">
|
||||
<div class="text">
|
||||
<span v-if="appearNote.isHidden" style="opacity: 0.5">({{ $ts.private }})</span>
|
||||
<MkA class="reply" v-if="appearNote.replyId" :to="`/notes/${appearNote.replyId}`"><Fa :icon="faReply"/></MkA>
|
||||
<MkA class="reply" v-if="appearNote.replyId" :to="`/notes/${appearNote.replyId}`"><i class="fas fa-reply"></i></MkA>
|
||||
<Mfm v-if="appearNote.text" :text="appearNote.text" :author="appearNote.user" :i="$i" :custom-emojis="appearNote.emojis"/>
|
||||
<a class="rp" v-if="appearNote.renote != null">RN:</a>
|
||||
</div>
|
||||
|
@ -62,29 +62,29 @@
|
|||
<span>{{ $ts.showMore }}</span>
|
||||
</button>
|
||||
</div>
|
||||
<MkA v-if="appearNote.channel && !inChannel" class="channel" :to="`/channels/${appearNote.channel.id}`"><Fa :icon="faSatelliteDish"/> {{ appearNote.channel.name }}</MkA>
|
||||
<MkA v-if="appearNote.channel && !inChannel" class="channel" :to="`/channels/${appearNote.channel.id}`"><i class="fas fa-satellite-dish"></i> {{ appearNote.channel.name }}</MkA>
|
||||
</div>
|
||||
<footer class="footer">
|
||||
<XReactionsViewer :note="appearNote" ref="reactionsViewer"/>
|
||||
<button @click="reply()" class="button _button">
|
||||
<template v-if="appearNote.reply"><Fa :icon="faReplyAll"/></template>
|
||||
<template v-else><Fa :icon="faReply"/></template>
|
||||
<template v-if="appearNote.reply"><i class="fas fa-reply-all"></i></template>
|
||||
<template v-else><i class="fas fa-reply"></i></template>
|
||||
<p class="count" v-if="appearNote.repliesCount > 0">{{ appearNote.repliesCount }}</p>
|
||||
</button>
|
||||
<button v-if="canRenote" @click="renote()" class="button _button" ref="renoteButton">
|
||||
<Fa :icon="faRetweet"/><p class="count" v-if="appearNote.renoteCount > 0">{{ appearNote.renoteCount }}</p>
|
||||
<i class="fas fa-retweet"></i><p class="count" v-if="appearNote.renoteCount > 0">{{ appearNote.renoteCount }}</p>
|
||||
</button>
|
||||
<button v-else class="button _button">
|
||||
<Fa :icon="faBan"/>
|
||||
<i class="fas fa-ban"></i>
|
||||
</button>
|
||||
<button v-if="appearNote.myReaction == null" class="button _button" @click="react()" ref="reactButton">
|
||||
<Fa :icon="faPlus"/>
|
||||
<i class="fas fa-plus"></i>
|
||||
</button>
|
||||
<button v-if="appearNote.myReaction != null" class="button _button reacted" @click="undoReact(appearNote)" ref="reactButton">
|
||||
<Fa :icon="faMinus"/>
|
||||
<i class="fas fa-minus"></i>
|
||||
</button>
|
||||
<button class="button _button" @click="menu()" ref="menuButton">
|
||||
<Fa :icon="faEllipsisH"/>
|
||||
<i class="fas fa-ellipsis-h"></i>
|
||||
</button>
|
||||
</footer>
|
||||
</div>
|
||||
|
@ -103,8 +103,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineAsyncComponent, defineComponent, markRaw } from 'vue';
|
||||
import { faSatelliteDish, faBolt, faTimes, faBullhorn, faStar, faLink, faExternalLinkSquareAlt, faPlus, faMinus, faRetweet, faReply, faReplyAll, faEllipsisH, faHome, faUnlock, faEnvelope, faThumbtack, faBan, faQuoteRight, faInfoCircle, faBiohazard, faPlug, faExclamationCircle, faPaperclip, faShareAlt } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faCopy, faTrashAlt, faEdit, faEye, faEyeSlash } from '@fortawesome/free-regular-svg-icons';
|
||||
import * as mfm from 'mfm-js';
|
||||
import { sum } from '../../prelude/array';
|
||||
import XSub from './note.sub.vue';
|
||||
|
@ -125,14 +123,6 @@ import { noteActions, noteViewInterruptors } from '@client/store';
|
|||
import { reactionPicker } from '@client/scripts/reaction-picker';
|
||||
import { extractUrlFromMfm } from '@/misc/extract-url-from-mfm';
|
||||
|
||||
function markRawAll(...xs) {
|
||||
for (const x of xs) {
|
||||
markRaw(x);
|
||||
}
|
||||
}
|
||||
|
||||
markRawAll(faEdit, faBolt, faTimes, faBullhorn, faPlus, faMinus, faRetweet, faReply, faReplyAll, faEllipsisH, faHome, faUnlock, faEnvelope, faThumbtack, faBan, faBiohazard, faPlug, faSatelliteDish);
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
XSub,
|
||||
|
@ -174,7 +164,6 @@ export default defineComponent({
|
|||
collapsed: false,
|
||||
isDeleted: false,
|
||||
muted: false,
|
||||
faEdit, faBolt, faTimes, faBullhorn, faPlus, faMinus, faRetweet, faReply, faReplyAll, faEllipsisH, faHome, faUnlock, faEnvelope, faThumbtack, faBan, faBiohazard, faPlug, faSatelliteDish
|
||||
};
|
||||
},
|
||||
|
||||
|
@ -442,7 +431,7 @@ export default defineComponent({
|
|||
this.blur();
|
||||
os.modalMenu([{
|
||||
text: this.$ts.renote,
|
||||
icon: faRetweet,
|
||||
icon: 'fas fa-retweet',
|
||||
action: () => {
|
||||
os.api('notes/create', {
|
||||
renoteId: this.appearNote.id
|
||||
|
@ -450,7 +439,7 @@ export default defineComponent({
|
|||
}
|
||||
}, {
|
||||
text: this.$ts.quote,
|
||||
icon: faQuoteRight,
|
||||
icon: 'fas fa-quote-right',
|
||||
action: () => {
|
||||
os.post({
|
||||
renote: this.appearNote,
|
||||
|
@ -586,62 +575,62 @@ export default defineComponent({
|
|||
});
|
||||
|
||||
menu = [{
|
||||
icon: faCopy,
|
||||
icon: 'fas fa-copy',
|
||||
text: this.$ts.copyContent,
|
||||
action: this.copyContent
|
||||
}, {
|
||||
icon: faLink,
|
||||
icon: 'fas fa-link',
|
||||
text: this.$ts.copyLink,
|
||||
action: this.copyLink
|
||||
}, (this.appearNote.url || this.appearNote.uri) ? {
|
||||
icon: faExternalLinkSquareAlt,
|
||||
icon: 'fas fa-external-link-square-alt',
|
||||
text: this.$ts.showOnRemote,
|
||||
action: () => {
|
||||
window.open(this.appearNote.url || this.appearNote.uri, '_blank');
|
||||
}
|
||||
} : undefined,
|
||||
{
|
||||
icon: faShareAlt,
|
||||
icon: 'fas fa-share-alt',
|
||||
text: this.$ts.share,
|
||||
action: this.share
|
||||
},
|
||||
null,
|
||||
statePromise.then(state => state.isFavorited ? {
|
||||
icon: faStar,
|
||||
icon: 'fas fa-star',
|
||||
text: this.$ts.unfavorite,
|
||||
action: () => this.toggleFavorite(false)
|
||||
} : {
|
||||
icon: faStar,
|
||||
icon: 'fas fa-star',
|
||||
text: this.$ts.favorite,
|
||||
action: () => this.toggleFavorite(true)
|
||||
}),
|
||||
{
|
||||
icon: faPaperclip,
|
||||
icon: 'fas fa-paperclip',
|
||||
text: this.$ts.clip,
|
||||
action: () => this.clip()
|
||||
},
|
||||
(this.appearNote.userId != this.$i.id) ? statePromise.then(state => state.isWatching ? {
|
||||
icon: faEyeSlash,
|
||||
icon: 'fas fa-eye-slash',
|
||||
text: this.$ts.unwatch,
|
||||
action: () => this.toggleWatch(false)
|
||||
} : {
|
||||
icon: faEye,
|
||||
icon: 'fas fa-eye',
|
||||
text: this.$ts.watch,
|
||||
action: () => this.toggleWatch(true)
|
||||
}) : undefined,
|
||||
this.appearNote.userId == this.$i.id ? (this.$i.pinnedNoteIds || []).includes(this.appearNote.id) ? {
|
||||
icon: faThumbtack,
|
||||
icon: 'fas fa-thumbtack',
|
||||
text: this.$ts.unpin,
|
||||
action: () => this.togglePin(false)
|
||||
} : {
|
||||
icon: faThumbtack,
|
||||
icon: 'fas fa-thumbtack',
|
||||
text: this.$ts.pin,
|
||||
action: () => this.togglePin(true)
|
||||
} : undefined,
|
||||
...(this.$i.isModerator || this.$i.isAdmin ? [
|
||||
null,
|
||||
{
|
||||
icon: faBullhorn,
|
||||
icon: 'fas fa-bullhorn',
|
||||
text: this.$ts.promote,
|
||||
action: this.promote
|
||||
}]
|
||||
|
@ -650,7 +639,7 @@ export default defineComponent({
|
|||
...(this.appearNote.userId != this.$i.id ? [
|
||||
null,
|
||||
{
|
||||
icon: faExclamationCircle,
|
||||
icon: 'fas fa-exclamation-circle',
|
||||
text: this.$ts.reportAbuse,
|
||||
action: () => {
|
||||
const u = `${url}/notes/${this.appearNote.id}`;
|
||||
|
@ -665,12 +654,12 @@ export default defineComponent({
|
|||
...(this.appearNote.userId == this.$i.id || this.$i.isModerator || this.$i.isAdmin ? [
|
||||
null,
|
||||
this.appearNote.userId == this.$i.id ? {
|
||||
icon: faEdit,
|
||||
icon: 'fas fa-edit',
|
||||
text: this.$ts.deleteAndEdit,
|
||||
action: this.delEdit
|
||||
} : undefined,
|
||||
{
|
||||
icon: faTrashAlt,
|
||||
icon: 'fas fa-trash-alt',
|
||||
text: this.$ts.delete,
|
||||
danger: true,
|
||||
action: this.del
|
||||
|
@ -680,15 +669,15 @@ export default defineComponent({
|
|||
.filter(x => x !== undefined);
|
||||
} else {
|
||||
menu = [{
|
||||
icon: faCopy,
|
||||
icon: 'fas fa-copy',
|
||||
text: this.$ts.copyContent,
|
||||
action: this.copyContent
|
||||
}, {
|
||||
icon: faLink,
|
||||
icon: 'fas fa-link',
|
||||
text: this.$ts.copyLink,
|
||||
action: this.copyLink
|
||||
}, (this.appearNote.url || this.appearNote.uri) ? {
|
||||
icon: faExternalLinkSquareAlt,
|
||||
icon: 'fas fa-external-link-square-alt',
|
||||
text: this.$ts.showOnRemote,
|
||||
action: () => {
|
||||
window.open(this.appearNote.url || this.appearNote.uri, '_blank');
|
||||
|
@ -699,7 +688,7 @@ export default defineComponent({
|
|||
|
||||
if (noteActions.length > 0) {
|
||||
menu = menu.concat([null, ...noteActions.map(action => ({
|
||||
icon: faPlug,
|
||||
icon: 'fas fa-plug',
|
||||
text: action.title,
|
||||
action: () => {
|
||||
action.handler(this.appearNote);
|
||||
|
@ -738,7 +727,7 @@ export default defineComponent({
|
|||
if (!this.isMyRenote) return;
|
||||
os.modalMenu([{
|
||||
text: this.$ts.unrenote,
|
||||
icon: faTrashAlt,
|
||||
icon: 'fas fa-trash-alt',
|
||||
danger: true,
|
||||
action: () => {
|
||||
os.api('notes/delete', {
|
||||
|
@ -781,7 +770,7 @@ export default defineComponent({
|
|||
async clip() {
|
||||
const clips = await os.api('clips/list');
|
||||
os.modalMenu([{
|
||||
icon: faPlus,
|
||||
icon: 'fas fa-plus',
|
||||
text: this.$ts.createNew,
|
||||
action: async () => {
|
||||
const { canceled, result } = await os.form(this.$ts.createNewClip, {
|
||||
|
@ -909,7 +898,7 @@ export default defineComponent({
|
|||
white-space: pre;
|
||||
color: #d28a3f;
|
||||
|
||||
> [data-icon] {
|
||||
> i {
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
|
@ -945,7 +934,7 @@ export default defineComponent({
|
|||
border-radius: 6px;
|
||||
}
|
||||
|
||||
> [data-icon] {
|
||||
> i {
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
|
|
|
@ -4,15 +4,15 @@
|
|||
<MkAvatar v-if="notification.user" class="icon" :user="notification.user"/>
|
||||
<img v-else-if="notification.icon" class="icon" :src="notification.icon" alt=""/>
|
||||
<div class="sub-icon" :class="notification.type">
|
||||
<Fa :icon="faPlus" v-if="notification.type === 'follow'"/>
|
||||
<Fa :icon="faClock" v-else-if="notification.type === 'receiveFollowRequest'"/>
|
||||
<Fa :icon="faCheck" v-else-if="notification.type === 'followRequestAccepted'"/>
|
||||
<Fa :icon="faIdCardAlt" v-else-if="notification.type === 'groupInvited'"/>
|
||||
<Fa :icon="faRetweet" v-else-if="notification.type === 'renote'"/>
|
||||
<Fa :icon="faReply" v-else-if="notification.type === 'reply'"/>
|
||||
<Fa :icon="faAt" v-else-if="notification.type === 'mention'"/>
|
||||
<Fa :icon="faQuoteLeft" v-else-if="notification.type === 'quote'"/>
|
||||
<Fa :icon="faPollH" v-else-if="notification.type === 'pollVote'"/>
|
||||
<i v-if="notification.type === 'follow'" class="fas fa-plus"></i>
|
||||
<i v-else-if="notification.type === 'receiveFollowRequest'" class="fas fa-clock"></i>
|
||||
<i v-else-if="notification.type === 'followRequestAccepted'" class="fas fa-check"></i>
|
||||
<i v-else-if="notification.type === 'groupInvited'" class="fas fa-id-card-alt"></i>
|
||||
<i v-else-if="notification.type === 'renote'" class="fas fa-retweet"></i>
|
||||
<i v-else-if="notification.type === 'reply'" class="fas fa-reply"></i>
|
||||
<i v-else-if="notification.type === 'mention'" class="fas fa-at"></i>
|
||||
<i v-else-if="notification.type === 'quote'" class="fas fa-quote-left"></i>
|
||||
<i v-else-if="notification.type === 'pollVote'" class="fas fa-poll-h"></i>
|
||||
<XReactionIcon v-else-if="notification.type === 'reaction'" :reaction="notification.reaction" :custom-emojis="notification.note.emojis" :no-style="true"/>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -23,14 +23,14 @@
|
|||
<MkTime :time="notification.createdAt" v-if="withTime" class="time"/>
|
||||
</header>
|
||||
<MkA v-if="notification.type === 'reaction'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
|
||||
<Fa :icon="faQuoteLeft"/>
|
||||
<i class="fas fa-quote-left"></i>
|
||||
<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.emojis"/>
|
||||
<Fa :icon="faQuoteRight"/>
|
||||
<i class="fas fa-quote-right"></i>
|
||||
</MkA>
|
||||
<MkA v-if="notification.type === 'renote'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note.renote)">
|
||||
<Fa :icon="faQuoteLeft"/>
|
||||
<i class="fas fa-quote-left"></i>
|
||||
<Mfm :text="getNoteSummary(notification.note.renote)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.renote.emojis"/>
|
||||
<Fa :icon="faQuoteRight"/>
|
||||
<i class="fas fa-quote-right"></i>
|
||||
</MkA>
|
||||
<MkA v-if="notification.type === 'reply'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
|
||||
<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.emojis"/>
|
||||
|
@ -42,9 +42,9 @@
|
|||
<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.emojis"/>
|
||||
</MkA>
|
||||
<MkA v-if="notification.type === 'pollVote'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
|
||||
<Fa :icon="faQuoteLeft"/>
|
||||
<i class="fas fa-quote-left"></i>
|
||||
<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.emojis"/>
|
||||
<Fa :icon="faQuoteRight"/>
|
||||
<i class="fas fa-quote-right"></i>
|
||||
</MkA>
|
||||
<span v-if="notification.type === 'follow'" class="text" style="opacity: 0.6;">{{ $ts.youGotNewFollower }}<div v-if="full"><MkFollowButton :user="notification.user" :full="true"/></div></span>
|
||||
<span v-if="notification.type === 'followRequestAccepted'" class="text" style="opacity: 0.6;">{{ $ts.followRequestAccepted }}</span>
|
||||
|
@ -59,8 +59,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faIdCardAlt, faPlus, faQuoteLeft, faQuoteRight, faRetweet, faReply, faAt, faCheck, faPollH } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faClock } from '@fortawesome/free-regular-svg-icons';
|
||||
import { getNoteSummary } from '@/misc/get-note-summary';
|
||||
import XReactionIcon from './reaction-icon.vue';
|
||||
import MkFollowButton from './follow-button.vue';
|
||||
|
@ -96,7 +94,6 @@ export default defineComponent({
|
|||
groupInviteDone: false,
|
||||
connection: null,
|
||||
readObserver: null,
|
||||
faIdCardAlt, faPlus, faQuoteLeft, faQuoteRight, faRetweet, faReply, faAt, faClock, faCheck, faPollH
|
||||
};
|
||||
},
|
||||
|
||||
|
@ -271,17 +268,17 @@ export default defineComponent({
|
|||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
> [data-icon] {
|
||||
> i {
|
||||
vertical-align: super;
|
||||
font-size: 50%;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
> [data-icon]:first-child {
|
||||
> i:first-child {
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
> [data-icon]:last-child {
|
||||
> i:last-child {
|
||||
margin-left: 4px;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
<XHeader :info="pageInfo" :with-back="false"/>
|
||||
</template>
|
||||
<template #buttons>
|
||||
<button class="_button" @click="back()" v-if="history.length > 0"><Fa :icon="faChevronLeft"/></button>
|
||||
<button class="_button" @click="back()" v-if="history.length > 0"><i class="fas fa-chevron-left"></i></button>
|
||||
<button class="_button" style="pointer-events: none;" v-else><!-- マージンのバランスを取るためのダミー --></button>
|
||||
</template>
|
||||
<div class="yrolvcoq _flat_">
|
||||
|
@ -22,7 +22,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faExternalLinkAlt, faExpandAlt, faLink, faChevronLeft, faColumns } from '@fortawesome/free-solid-svg-icons';
|
||||
import XWindow from '@client/components/ui/window.vue';
|
||||
import XHeader from '@client/ui/_common_/header.vue';
|
||||
import { popout } from '@client/scripts/popout';
|
||||
|
@ -76,7 +75,6 @@ export default defineComponent({
|
|||
component: this.initialComponent,
|
||||
props: this.initialProps,
|
||||
history: [],
|
||||
faChevronLeft,
|
||||
};
|
||||
},
|
||||
|
||||
|
@ -90,29 +88,29 @@ export default defineComponent({
|
|||
type: 'label',
|
||||
text: this.path,
|
||||
}, {
|
||||
icon: faExpandAlt,
|
||||
icon: 'fas fa-expand-alt',
|
||||
text: this.$ts.showInPage,
|
||||
action: this.expand
|
||||
}, this.sideViewHook ? {
|
||||
icon: faColumns,
|
||||
icon: 'fas fa-columns',
|
||||
text: this.$ts.openInSideView,
|
||||
action: () => {
|
||||
this.sideViewHook(this.path);
|
||||
this.$refs.window.close();
|
||||
}
|
||||
} : undefined, {
|
||||
icon: faExternalLinkAlt,
|
||||
icon: 'fas fa-external-link-alt',
|
||||
text: this.$ts.popout,
|
||||
action: this.popout
|
||||
}, null, {
|
||||
icon: faExternalLinkAlt,
|
||||
icon: 'fas fa-external-link-alt',
|
||||
text: this.$ts.openInNewTab,
|
||||
action: () => {
|
||||
window.open(this.url, '_blank');
|
||||
this.$refs.window.close();
|
||||
}
|
||||
}, {
|
||||
icon: faLink,
|
||||
icon: 'fas fa-link',
|
||||
text: this.$ts.copyLink,
|
||||
action: () => {
|
||||
copyToClipboard(this.url);
|
||||
|
|
|
@ -1,13 +1,15 @@
|
|||
<template>
|
||||
<div class="ngbfujlo">
|
||||
<MkTextarea :value="text" readonly style="margin: 0;"></MkTextarea>
|
||||
<MkButton class="button" primary @click="post()" :disabled="posting || posted"><Fa v-if="posted" :icon="faCheck"/><Fa v-else :icon="faPaperPlane"/></MkButton>
|
||||
<MkButton class="button" primary @click="post()" :disabled="posting || posted">
|
||||
<i v-if="posted" class="fas fa-check"></i>
|
||||
<i v-else class="fas fa-paper-plane"></i>
|
||||
</MkButton>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, PropType } from 'vue';
|
||||
import { faCheck, faPaperPlane } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkTextarea from '../ui/textarea.vue';
|
||||
import MkButton from '../ui/button.vue';
|
||||
import { apiUrl } from '@client/config';
|
||||
|
@ -35,7 +37,6 @@ export default defineComponent({
|
|||
text: this.hpml.interpolate(this.block.text),
|
||||
posted: false,
|
||||
posting: false,
|
||||
faCheck, faPaperPlane
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="zmdxowus">
|
||||
<p class="caution" v-if="choices.length < 2">
|
||||
<Fa :icon="faExclamationTriangle"/>{{ $ts._poll.noOnlyOneChoice }}
|
||||
<i class="fas fa-exclamation-triangle"></i>{{ $ts._poll.noOnlyOneChoice }}
|
||||
</p>
|
||||
<ul ref="choices">
|
||||
<li v-for="(choice, i) in choices" :key="i">
|
||||
|
@ -9,7 +9,7 @@
|
|||
<span>{{ $t('_poll.choiceN', { n: i + 1 }) }}</span>
|
||||
</MkInput>
|
||||
<button @click="remove(i)" class="_button">
|
||||
<Fa :icon="faTimes"/>
|
||||
<i class="fas fa-times"></i>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
|
@ -50,7 +50,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faExclamationTriangle, faTimes } from '@fortawesome/free-solid-svg-icons';
|
||||
import { addTime } from '../../prelude/time';
|
||||
import { formatDateTimeString } from '@/misc/format-time-string';
|
||||
import MkInput from './ui/input.vue';
|
||||
|
@ -84,7 +83,6 @@ export default defineComponent({
|
|||
atTime: '00:00',
|
||||
after: 0,
|
||||
unit: 'second',
|
||||
faExclamationTriangle, faTimes
|
||||
};
|
||||
},
|
||||
|
||||
|
@ -190,7 +188,7 @@ export default defineComponent({
|
|||
font-size: 0.8em;
|
||||
color: #f00;
|
||||
|
||||
> [data-icon] {
|
||||
> i {
|
||||
margin-right: 4px;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
<li v-for="(choice, i) in poll.choices" :key="i" @click="vote(i)" :class="{ voted: choice.voted }">
|
||||
<div class="backdrop" :style="{ 'width': `${showResult ? (choice.votes / total * 100) : 0}%` }"></div>
|
||||
<span>
|
||||
<template v-if="choice.isVoted"><Fa :icon="faCheck"/></template>
|
||||
<template v-if="choice.isVoted"><i class="fas fa-check"></i></template>
|
||||
<Mfm :text="choice.text" :plain="true" :custom-emojis="note.emojis"/>
|
||||
<span class="votes" v-if="showResult">({{ $t('_poll.votesCount', { n: choice.votes }) }})</span>
|
||||
</span>
|
||||
|
@ -23,7 +23,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faCheck } from '@fortawesome/free-solid-svg-icons';
|
||||
import { sum } from '../../prelude/array';
|
||||
import * as os from '@client/os';
|
||||
|
||||
|
@ -38,7 +37,6 @@ export default defineComponent({
|
|||
return {
|
||||
remaining: -1,
|
||||
showResult: false,
|
||||
faCheck
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
|
@ -135,7 +133,7 @@ export default defineComponent({
|
|||
> span {
|
||||
position: relative;
|
||||
|
||||
> [data-icon] {
|
||||
> i {
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
<div @click="showFileMenu(element, $event)" @contextmenu.prevent="showFileMenu(element, $event)">
|
||||
<MkDriveFileThumbnail :data-id="element.id" class="thumbnail" :file="element" fit="cover"/>
|
||||
<div class="sensitive" v-if="element.isSensitive">
|
||||
<Fa class="icon" :icon="faExclamationTriangle"/>
|
||||
<i class="fas fa-exclamation-triangle icon"></i>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -16,8 +16,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent, defineAsyncComponent } from 'vue';
|
||||
import { faTimesCircle, faEye, faEyeSlash } from '@fortawesome/free-regular-svg-icons';
|
||||
import { faExclamationTriangle, faICursor } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkDriveFileThumbnail from './drive-file-thumbnail.vue'
|
||||
import * as os from '@client/os';
|
||||
|
||||
|
@ -44,7 +42,6 @@ export default defineComponent({
|
|||
return {
|
||||
menu: null as Promise<null> | null,
|
||||
|
||||
faExclamationTriangle
|
||||
};
|
||||
},
|
||||
|
||||
|
@ -100,11 +97,11 @@ export default defineComponent({
|
|||
action: () => { this.rename(file) }
|
||||
}, {
|
||||
text: file.isSensitive ? this.$ts.unmarkAsSensitive : this.$ts.markAsSensitive,
|
||||
icon: file.isSensitive ? faEyeSlash : faEye,
|
||||
icon: file.isSensitive ? 'fas fa-eye-slash' : 'fas fa-eye',
|
||||
action: () => { this.toggleSensitive(file) }
|
||||
}, {
|
||||
text: this.$ts.attachCancel,
|
||||
icon: faTimesCircle,
|
||||
icon: 'fas fa-times-circle',
|
||||
action: () => { this.detachMedia(file.id) }
|
||||
}], ev.currentTarget || ev.target).then(() => this.menu = null);
|
||||
}
|
||||
|
|
|
@ -7,31 +7,31 @@
|
|||
@drop.stop="onDrop"
|
||||
>
|
||||
<header>
|
||||
<button v-if="!fixed" class="cancel _button" @click="cancel"><Fa :icon="faTimes"/></button>
|
||||
<button v-if="!fixed" class="cancel _button" @click="cancel"><i class="fas fa-times"></i></button>
|
||||
<div>
|
||||
<span class="text-count" :class="{ over: textLength > max }">{{ max - textLength }}</span>
|
||||
<span class="local-only" v-if="localOnly"><Fa :icon="faBiohazard"/></span>
|
||||
<span class="local-only" v-if="localOnly"><i class="fas fa-biohazard"></i></span>
|
||||
<button class="_button visibility" @click="setVisibility" ref="visibilityButton" v-tooltip="$ts.visibility" :disabled="channel != null">
|
||||
<span v-if="visibility === 'public'"><Fa :icon="faGlobe"/></span>
|
||||
<span v-if="visibility === 'home'"><Fa :icon="faHome"/></span>
|
||||
<span v-if="visibility === 'followers'"><Fa :icon="faUnlock"/></span>
|
||||
<span v-if="visibility === 'specified'"><Fa :icon="faEnvelope"/></span>
|
||||
<span v-if="visibility === 'public'"><i class="fas fa-globe"></i></span>
|
||||
<span v-if="visibility === 'home'"><i class="fas fa-home"></i></span>
|
||||
<span v-if="visibility === 'followers'"><i class="fas fa-unlock"></i></span>
|
||||
<span v-if="visibility === 'specified'"><i class="fas fa-envelope"></i></span>
|
||||
</button>
|
||||
<button class="submit _buttonPrimary" :disabled="!canPost" @click="post">{{ submitText }}<Fa :icon="reply ? faReply : renote ? faQuoteRight : faPaperPlane"/></button>
|
||||
<button class="submit _buttonPrimary" :disabled="!canPost" @click="post">{{ submitText }}<i :class="reply ? 'fas fa-reply' : renote ? 'fas fa-quote-right' : 'fas fa-paper-plane'"></i></button>
|
||||
</div>
|
||||
</header>
|
||||
<div class="form" :class="{ fixed }">
|
||||
<XNotePreview class="preview" v-if="reply" :note="reply"/>
|
||||
<XNotePreview class="preview" v-if="renote" :note="renote"/>
|
||||
<div class="with-quote" v-if="quoteId"><Fa icon="quote-left"/> {{ $ts.quoteAttached }}<button @click="quoteId = null"><Fa icon="times"/></button></div>
|
||||
<div class="with-quote" v-if="quoteId"><i class="fas fa-quote-left"></i> {{ $ts.quoteAttached }}<button @click="quoteId = null"><i class="fas fa-times"></i></button></div>
|
||||
<div v-if="visibility === 'specified'" class="to-specified">
|
||||
<span style="margin-right: 8px;">{{ $ts.recipient }}</span>
|
||||
<div class="visibleUsers">
|
||||
<span v-for="u in visibleUsers" :key="u.id">
|
||||
<MkAcct :user="u"/>
|
||||
<button class="_button" @click="removeVisibleUser(u)"><Fa :icon="faTimes"/></button>
|
||||
<button class="_button" @click="removeVisibleUser(u)"><i class="fas fa-times"></i></button>
|
||||
</span>
|
||||
<button @click="addVisibleUser" class="_buttonPrimary"><Fa :icon="faPlus" fixed-width/></button>
|
||||
<button @click="addVisibleUser" class="_buttonPrimary"><i class="fas fa-plus fa-fw"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<MkInfo warn v-if="hasNotSpecifiedMentions" class="hasNotSpecifiedMentions">{{ $ts.notSpecifiedMentionWarning }} - <button class="_textButton" @click="addMissingMention()">{{ $ts.add }}</button></MkInfo>
|
||||
|
@ -40,12 +40,12 @@
|
|||
<XPostFormAttaches class="attaches" :files="files" @updated="updateFiles" @detach="detachFile" @changeSensitive="updateFileSensitive" @changeName="updateFileName"/>
|
||||
<XPollEditor v-if="poll" :poll="poll" @destroyed="poll = null" @updated="onPollUpdate"/>
|
||||
<footer>
|
||||
<button class="_button" @click="chooseFileFrom" v-tooltip="$ts.attachFile"><Fa :icon="faPhotoVideo"/></button>
|
||||
<button class="_button" @click="togglePoll" :class="{ active: poll }" v-tooltip="$ts.poll"><Fa :icon="faPollH"/></button>
|
||||
<button class="_button" @click="useCw = !useCw" :class="{ active: useCw }" v-tooltip="$ts.useCw"><Fa :icon="faEyeSlash"/></button>
|
||||
<button class="_button" @click="insertMention" v-tooltip="$ts.mention"><Fa :icon="faAt"/></button>
|
||||
<button class="_button" @click="insertEmoji" v-tooltip="$ts.emoji"><Fa :icon="faLaughSquint"/></button>
|
||||
<button class="_button" @click="showActions" v-tooltip="$ts.plugin" v-if="postFormActions.length > 0"><Fa :icon="faPlug"/></button>
|
||||
<button class="_button" @click="chooseFileFrom" v-tooltip="$ts.attachFile"><i class="fas fa-photo-video"></i></button>
|
||||
<button class="_button" @click="togglePoll" :class="{ active: poll }" v-tooltip="$ts.poll"><i class="fas fa-poll-h"></i></button>
|
||||
<button class="_button" @click="useCw = !useCw" :class="{ active: useCw }" v-tooltip="$ts.useCw"><i class="fas fa-eye-slash"></i></button>
|
||||
<button class="_button" @click="insertMention" v-tooltip="$ts.mention"><i class="fas fa-at"></i></button>
|
||||
<button class="_button" @click="insertEmoji" v-tooltip="$ts.emoji"><i class="fas fa-laugh-squint"></i></button>
|
||||
<button class="_button" @click="showActions" v-tooltip="$ts.plugin" v-if="postFormActions.length > 0"><i class="fas fa-plug"></i></button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -53,8 +53,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent, defineAsyncComponent } from 'vue';
|
||||
import { faReply, faQuoteRight, faPaperPlane, faTimes, faUpload, faPollH, faGlobe, faHome, faUnlock, faEnvelope, faPlus, faPhotoVideo, faAt, faBiohazard, faPlug } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faEyeSlash, faLaughSquint } from '@fortawesome/free-regular-svg-icons';
|
||||
import insertTextAtCursor from 'insert-text-at-cursor';
|
||||
import { length } from 'stringz';
|
||||
import { toASCII } from 'punycode/';
|
||||
|
@ -155,7 +153,6 @@ export default defineComponent({
|
|||
}
|
||||
}),
|
||||
postFormActions,
|
||||
faReply, faQuoteRight, faPaperPlane, faTimes, faUpload, faPollH, faGlobe, faHome, faUnlock, faEnvelope, faEyeSlash, faLaughSquint, faPlus, faPhotoVideo, faAt, faBiohazard, faPlug
|
||||
};
|
||||
},
|
||||
|
||||
|
@ -724,7 +721,7 @@ export default defineComponent({
|
|||
opacity: 0.7;
|
||||
}
|
||||
|
||||
> [data-icon] {
|
||||
> i {
|
||||
margin-left: 6px;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,10 +1,9 @@
|
|||
<template>
|
||||
<div class="jmgmzlwq _block"><Fa :icon="faExclamationTriangle" style="margin-right: 8px;"/>{{ $ts.remoteUserCaution }}<a :href="href" rel="nofollow noopener" target="_blank">{{ $ts.showOnRemote }}</a></div>
|
||||
<div class="jmgmzlwq _block"><i class="fas fa-exclamation-triangle" style="margin-right: 8px;"></i>{{ $ts.remoteUserCaution }}<a :href="href" rel="nofollow noopener" target="_blank">{{ $ts.showOnRemote }}</a></div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faExclamationTriangle } from '@fortawesome/free-solid-svg-icons';
|
||||
import * as os from '@client/os';
|
||||
|
||||
export default defineComponent({
|
||||
|
@ -16,7 +15,6 @@ export default defineComponent({
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
faExclamationTriangle
|
||||
};
|
||||
}
|
||||
});
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
</MkInput>
|
||||
<MkInput v-model:value="password" type="password" :with-password-toggle="true" v-if="!user || user && !user.usePasswordLessLogin" required>
|
||||
<span>{{ $ts.password }}</span>
|
||||
<template #prefix><Fa :icon="faLock"/></template>
|
||||
<template #prefix><i class="fas fa-lock"></i></template>
|
||||
</MkInput>
|
||||
<MkButton type="submit" primary :disabled="signing" style="margin: 0 auto;">{{ signing ? $ts.loggingIn : $ts.login }}</MkButton>
|
||||
</div>
|
||||
|
@ -28,20 +28,20 @@
|
|||
<p style="margin-bottom:0;">{{ $ts.twoStepAuthentication }}</p>
|
||||
<MkInput v-model:value="password" type="password" :with-password-toggle="true" v-if="user && user.usePasswordLessLogin" required>
|
||||
<span>{{ $ts.password }}</span>
|
||||
<template #prefix><Fa :icon="faLock"/></template>
|
||||
<template #prefix><i class="fas fa-lock"></i></template>
|
||||
</MkInput>
|
||||
<MkInput v-model:value="token" type="text" pattern="^[0-9]{6}$" autocomplete="off" spellcheck="false" required>
|
||||
<span>{{ $ts.token }}</span>
|
||||
<template #prefix><Fa :icon="faGavel"/></template>
|
||||
<template #prefix><i class="fas fa-gavel"></i></template>
|
||||
</MkInput>
|
||||
<MkButton type="submit" :disabled="signing" primary style="margin: 0 auto;">{{ signing ? $ts.loggingIn : $ts.login }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="social _section">
|
||||
<a class="_borderButton _gap" v-if="meta && meta.enableTwitterIntegration" :href="`${apiUrl}/signin/twitter`"><Fa :icon="faTwitter" style="margin-right: 4px;"/>{{ $t('signinWith', { x: 'Twitter' }) }}</a>
|
||||
<a class="_borderButton _gap" v-if="meta && meta.enableGithubIntegration" :href="`${apiUrl}/signin/github`"><Fa :icon="faGithub" style="margin-right: 4px;"/>{{ $t('signinWith', { x: 'GitHub' }) }}</a>
|
||||
<a class="_borderButton _gap" v-if="meta && meta.enableDiscordIntegration" :href="`${apiUrl}/signin/discord`"><Fa :icon="faDiscord" style="margin-right: 4px;"/>{{ $t('signinWith', { x: 'Discord' }) }}</a>
|
||||
<a class="_borderButton _gap" v-if="meta && meta.enableTwitterIntegration" :href="`${apiUrl}/signin/twitter`"><i class="fab fa-twitter" style="margin-right: 4px;"></i>{{ $t('signinWith', { x: 'Twitter' }) }}</a>
|
||||
<a class="_borderButton _gap" v-if="meta && meta.enableGithubIntegration" :href="`${apiUrl}/signin/github`"><i class="fab fa-github" style="margin-right: 4px;"></i>{{ $t('signinWith', { x: 'GitHub' }) }}</a>
|
||||
<a class="_borderButton _gap" v-if="meta && meta.enableDiscordIntegration" :href="`${apiUrl}/signin/discord`"><i class="fab fa-discord" style="margin-right: 4px;"></i>{{ $t('signinWith', { x: 'Discord' }) }}</a>
|
||||
</div>
|
||||
</form>
|
||||
</template>
|
||||
|
@ -49,8 +49,6 @@
|
|||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { toUnicode } from 'punycode/';
|
||||
import { faLock, faGavel } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faTwitter, faDiscord, faGithub } from '@fortawesome/free-brands-svg-icons';
|
||||
import MkButton from './ui/button.vue';
|
||||
import MkInput from './ui/input.vue';
|
||||
import { apiUrl, host } from '@client/config';
|
||||
|
@ -92,7 +90,6 @@ export default defineComponent({
|
|||
credential: null,
|
||||
challengeData: null,
|
||||
queryingKey: false,
|
||||
faLock, faGavel, faTwitter, faDiscord, faGithub
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -3,37 +3,37 @@
|
|||
<template v-if="meta">
|
||||
<MkInput v-if="meta.disableRegistration" v-model:value="invitationCode" type="text" :autocomplete="Math.random()" spellcheck="false" required>
|
||||
<span>{{ $ts.invitationCode }}</span>
|
||||
<template #prefix><Fa :icon="faKey"/></template>
|
||||
<template #prefix><i class="fas fa-key"></i></template>
|
||||
</MkInput>
|
||||
<MkInput v-model:value="username" type="text" pattern="^[a-zA-Z0-9_]{1,20}$" :autocomplete="Math.random()" spellcheck="false" required @update:value="onChangeUsername">
|
||||
<span>{{ $ts.username }}</span>
|
||||
<template #prefix>@</template>
|
||||
<template #suffix>@{{ host }}</template>
|
||||
<template #desc>
|
||||
<span v-if="usernameState == 'wait'" style="color:#999"><Fa :icon="faSpinner" pulse fixed-width/> {{ $ts.checking }}</span>
|
||||
<span v-if="usernameState == 'ok'" style="color:#3CB7B5"><Fa :icon="faCheck" fixed-width/> {{ $ts.available }}</span>
|
||||
<span v-if="usernameState == 'unavailable'" style="color:#FF1161"><Fa :icon="faExclamationTriangle" fixed-width/> {{ $ts.unavailable }}</span>
|
||||
<span v-if="usernameState == 'error'" style="color:#FF1161"><Fa :icon="faExclamationTriangle" fixed-width/> {{ $ts.error }}</span>
|
||||
<span v-if="usernameState == 'invalid-format'" style="color:#FF1161"><Fa :icon="faExclamationTriangle" fixed-width/> {{ $ts.usernameInvalidFormat }}</span>
|
||||
<span v-if="usernameState == 'min-range'" style="color:#FF1161"><Fa :icon="faExclamationTriangle" fixed-width/> {{ $ts.tooShort }}</span>
|
||||
<span v-if="usernameState == 'max-range'" style="color:#FF1161"><Fa :icon="faExclamationTriangle" fixed-width/> {{ $ts.tooLong }}</span>
|
||||
<span v-if="usernameState == 'wait'" style="color:#999"><i class="fas fa-spinner fa-pulse fa-fw"></i> {{ $ts.checking }}</span>
|
||||
<span v-if="usernameState == 'ok'" style="color:#3CB7B5"><i class="fas fa-check fa-fw"></i> {{ $ts.available }}</span>
|
||||
<span v-if="usernameState == 'unavailable'" style="color:#FF1161"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.unavailable }}</span>
|
||||
<span v-if="usernameState == 'error'" style="color:#FF1161"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.error }}</span>
|
||||
<span v-if="usernameState == 'invalid-format'" style="color:#FF1161"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.usernameInvalidFormat }}</span>
|
||||
<span v-if="usernameState == 'min-range'" style="color:#FF1161"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.tooShort }}</span>
|
||||
<span v-if="usernameState == 'max-range'" style="color:#FF1161"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.tooLong }}</span>
|
||||
</template>
|
||||
</MkInput>
|
||||
<MkInput v-model:value="password" type="password" :autocomplete="Math.random()" required @update:value="onChangePassword">
|
||||
<span>{{ $ts.password }}</span>
|
||||
<template #prefix><Fa :icon="faLock"/></template>
|
||||
<template #prefix><i class="fas fa-lock"></i></template>
|
||||
<template #desc>
|
||||
<p v-if="passwordStrength == 'low'" style="color:#FF1161"><Fa :icon="faExclamationTriangle" fixed-width/> {{ $ts.weakPassword }}</p>
|
||||
<p v-if="passwordStrength == 'medium'" style="color:#3CB7B5"><Fa :icon="faCheck" fixed-width/> {{ $ts.normalPassword }}</p>
|
||||
<p v-if="passwordStrength == 'high'" style="color:#3CB7B5"><Fa :icon="faCheck" fixed-width/> {{ $ts.strongPassword }}</p>
|
||||
<p v-if="passwordStrength == 'low'" style="color:#FF1161"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.weakPassword }}</p>
|
||||
<p v-if="passwordStrength == 'medium'" style="color:#3CB7B5"><i class="fas fa-check fa-fw"></i> {{ $ts.normalPassword }}</p>
|
||||
<p v-if="passwordStrength == 'high'" style="color:#3CB7B5"><i class="fas fa-check fa-fw"></i> {{ $ts.strongPassword }}</p>
|
||||
</template>
|
||||
</MkInput>
|
||||
<MkInput v-model:value="retypedPassword" type="password" :autocomplete="Math.random()" required @update:value="onChangePasswordRetype">
|
||||
<span>{{ $ts.password }} ({{ $ts.retype }})</span>
|
||||
<template #prefix><Fa :icon="faLock"/></template>
|
||||
<template #prefix><i class="fas fa-lock"></i></template>
|
||||
<template #desc>
|
||||
<p v-if="passwordRetypeState == 'match'" style="color:#3CB7B5"><Fa :icon="faCheck" fixed-width/> {{ $ts.passwordMatched }}</p>
|
||||
<p v-if="passwordRetypeState == 'not-match'" style="color:#FF1161"><Fa :icon="faExclamationTriangle" fixed-width/> {{ $ts.passwordNotMatched }}</p>
|
||||
<p v-if="passwordRetypeState == 'match'" style="color:#3CB7B5"><i class="fas fa-check fa-fw"></i> {{ $ts.passwordMatched }}</p>
|
||||
<p v-if="passwordRetypeState == 'not-match'" style="color:#FF1161"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.passwordNotMatched }}</p>
|
||||
</template>
|
||||
</MkInput>
|
||||
<label v-if="meta.tosUrl" class="tou">
|
||||
|
@ -53,7 +53,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent, defineAsyncComponent } from 'vue';
|
||||
import { faLock, faExclamationTriangle, faSpinner, faCheck, faKey } from '@fortawesome/free-solid-svg-icons';
|
||||
const getPasswordStrength = require('syuilo-password-strength');
|
||||
import { toUnicode } from 'punycode/';
|
||||
import { host, url } from '@client/config';
|
||||
|
@ -96,7 +95,6 @@ export default defineComponent({
|
|||
ToSAgreement: false,
|
||||
hCaptchaResponse: null,
|
||||
reCaptchaResponse: null,
|
||||
faLock, faExclamationTriangle, faSpinner, faCheck, faKey
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
<div class="body">
|
||||
<span v-if="note.isHidden" style="opacity: 0.5">({{ $ts.private }})</span>
|
||||
<span v-if="note.deletedAt" style="opacity: 0.5">({{ $ts.deleted }})</span>
|
||||
<MkA class="reply" v-if="note.replyId" :to="`/notes/${note.replyId}`"><Fa :icon="faReply"/></MkA>
|
||||
<MkA class="reply" v-if="note.replyId" :to="`/notes/${note.replyId}`"><i class="fas fa-reply"></i></MkA>
|
||||
<Mfm v-if="note.text" :text="note.text" :author="note.user" :i="$i" :custom-emojis="note.emojis"/>
|
||||
<MkA class="rp" v-if="note.renoteId" :to="`/notes/${note.renoteId}`">RN: ...</MkA>
|
||||
</div>
|
||||
|
@ -20,7 +20,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faReply } from '@fortawesome/free-solid-svg-icons';
|
||||
import XPoll from './poll.vue';
|
||||
import XMediaList from './media-list.vue';
|
||||
import * as os from '@client/os';
|
||||
|
@ -38,7 +37,6 @@ export default defineComponent({
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
faReply
|
||||
};
|
||||
}
|
||||
});
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<XWindow ref="window" :initial-width="650" :initial-height="420" :can-resize="true" @closed="$emit('closed')">
|
||||
<template #header>
|
||||
<Fa :icon="faTerminal" style="margin-right: 0.5em;"/>Task Manager
|
||||
<i class="fas fa-terminal" style="margin-right: 0.5em;"></i>Task Manager
|
||||
</template>
|
||||
<div class="qljqmnzj _monospace">
|
||||
<MkTab v-model:value="tab" style="border-bottom: solid 0.5px var(--divider);">
|
||||
|
@ -78,7 +78,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent, markRaw, onBeforeUnmount, ref, shallowRef } from 'vue';
|
||||
import { faTerminal } from '@fortawesome/free-solid-svg-icons';
|
||||
import XWindow from '@client/components/ui/window.vue';
|
||||
import MkTab from '@client/components/tab.vue';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
|
@ -139,7 +138,6 @@ export default defineComponent({
|
|||
pools,
|
||||
killPopup,
|
||||
showReq,
|
||||
faTerminal,
|
||||
};
|
||||
},
|
||||
});
|
||||
|
|
|
@ -5,8 +5,8 @@
|
|||
<div class="sub">
|
||||
<slot name="func"></slot>
|
||||
<button class="_button" v-if="foldable" @click="() => showBody = !showBody">
|
||||
<template v-if="showBody"><Fa :icon="faAngleUp"/></template>
|
||||
<template v-else><Fa :icon="faAngleDown"/></template>
|
||||
<template v-if="showBody"><i class="fas fa-angle-up"></i></template>
|
||||
<template v-else><i class="fas fa-angle-down"></i></template>
|
||||
</button>
|
||||
</div>
|
||||
</header>
|
||||
|
@ -28,7 +28,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faAngleUp, faAngleDown } from '@fortawesome/free-solid-svg-icons';
|
||||
|
||||
export default defineComponent({
|
||||
props: {
|
||||
|
@ -68,7 +67,6 @@ export default defineComponent({
|
|||
showBody: this.expanded,
|
||||
omitted: null,
|
||||
ignoreOmit: false,
|
||||
faAngleUp, faAngleDown
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
@ -169,7 +167,7 @@ export default defineComponent({
|
|||
margin: 0;
|
||||
padding: 12px 16px;
|
||||
|
||||
> ::v-deep([data-icon]) {
|
||||
> ::v-deep(i) {
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
|
|
|
@ -4,8 +4,8 @@
|
|||
<div class="title"><slot name="header"></slot></div>
|
||||
<div class="divider"></div>
|
||||
<button class="_button">
|
||||
<template v-if="showBody"><Fa :icon="faAngleUp"/></template>
|
||||
<template v-else><Fa :icon="faAngleDown"/></template>
|
||||
<template v-if="showBody"><i class="fas fa-angle-up"></i></template>
|
||||
<template v-else><i class="fas fa-angle-down"></i></template>
|
||||
</button>
|
||||
</header>
|
||||
<transition name="folder-toggle"
|
||||
|
@ -23,7 +23,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faAngleUp, faAngleDown } from '@fortawesome/free-solid-svg-icons';
|
||||
|
||||
const localStoragePrefix = 'ui:folder:';
|
||||
|
||||
|
@ -43,7 +42,6 @@ export default defineComponent({
|
|||
data() {
|
||||
return {
|
||||
showBody: (this.persistKey && localStorage.getItem(localStoragePrefix + this.persistKey)) ? localStorage.getItem(localStoragePrefix + this.persistKey) === 't' : this.expanded,
|
||||
faAngleUp, faAngleDown
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
|
@ -109,7 +107,7 @@ export default defineComponent({
|
|||
margin: 0;
|
||||
padding: 12px 16px 12px 0;
|
||||
|
||||
> [data-icon] {
|
||||
> i {
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
|
|
|
@ -1,14 +1,13 @@
|
|||
<template>
|
||||
<div class="fpezltsf" :class="{ warn }">
|
||||
<i v-if="warn"><Fa :icon="faExclamationTriangle"/></i>
|
||||
<i v-else><Fa :icon="faInfoCircle"/></i>
|
||||
<i v-if="warn" class="fas fa-exclamation-triangle"></i>
|
||||
<i v-else class="fas fa-info-circle"></i>
|
||||
<slot></slot>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faInfoCircle, faExclamationTriangle } from '@fortawesome/free-solid-svg-icons';
|
||||
import * as os from '@client/os';
|
||||
|
||||
export default defineComponent({
|
||||
|
@ -21,7 +20,6 @@ export default defineComponent({
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
faInfoCircle, faExclamationTriangle
|
||||
};
|
||||
}
|
||||
});
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
<span class="label" ref="labelEl"><slot></slot></span>
|
||||
<span class="title" ref="title">
|
||||
<slot name="title"></slot>
|
||||
<span class="warning" v-if="invalid"><Fa :icon="faExclamationCircle"/>{{ $refs.input.validationMessage }}</span>
|
||||
<span class="warning" v-if="invalid"><i class="fas fa-exclamation-circle"></i>{{ $refs.input.validationMessage }}</span>
|
||||
</span>
|
||||
<div class="prefix" ref="prefixEl"><slot name="prefix"></slot></div>
|
||||
<input v-if="debounce" ref="inputEl"
|
||||
|
@ -56,7 +56,6 @@
|
|||
<script lang="ts">
|
||||
import { defineComponent, onMounted, onUnmounted, nextTick, ref, watch, computed, toRefs } from 'vue';
|
||||
import debounce from 'v-debounce';
|
||||
import { faExclamationCircle } from '@fortawesome/free-solid-svg-icons';
|
||||
import * as os from '@client/os';
|
||||
|
||||
export default defineComponent({
|
||||
|
@ -205,7 +204,6 @@ export default defineComponent({
|
|||
focus,
|
||||
onInput,
|
||||
onKeydown,
|
||||
faExclamationCircle,
|
||||
};
|
||||
},
|
||||
});
|
||||
|
|
|
@ -13,25 +13,25 @@
|
|||
<span><MkEllipsis/></span>
|
||||
</span>
|
||||
<MkA v-else-if="item.type === 'link'" :to="item.to" @click.passive="close()" :tabindex="i" class="_button item">
|
||||
<Fa v-if="item.icon" :icon="item.icon" fixed-width/>
|
||||
<i v-if="item.icon" class="fa-fw" :class="item.icon"></i>
|
||||
<MkAvatar v-if="item.avatar" :user="item.avatar" class="avatar"/>
|
||||
<span>{{ item.text }}</span>
|
||||
<i v-if="item.indicate"><Fa :icon="faCircle"/></i>
|
||||
<span v-if="item.indicate" class="indicator"><i class="fas fa-circle"></i></span>
|
||||
</MkA>
|
||||
<a v-else-if="item.type === 'a'" :href="item.href" :target="item.target" :download="item.download" @click="close()" :tabindex="i" class="_button item">
|
||||
<Fa v-if="item.icon" :icon="item.icon" fixed-width/>
|
||||
<i v-if="item.icon" class="fa-fw" :class="item.icon"></i>
|
||||
<span>{{ item.text }}</span>
|
||||
<i v-if="item.indicate"><Fa :icon="faCircle"/></i>
|
||||
<span v-if="item.indicate" class="indicator"><i class="fas fa-circle"></i></span>
|
||||
</a>
|
||||
<button v-else-if="item.type === 'user'" @click="clicked(item.action, $event)" :tabindex="i" class="_button item">
|
||||
<MkAvatar :user="item.user" class="avatar"/><MkUserName :user="item.user"/>
|
||||
<i v-if="item.indicate"><Fa :icon="faCircle"/></i>
|
||||
<span v-if="item.indicate" class="indicator"><i class="fas fa-circle"></i></span>
|
||||
</button>
|
||||
<button v-else @click="clicked(item.action, $event)" :tabindex="i" class="_button item" :class="{ danger: item.danger }">
|
||||
<Fa v-if="item.icon" :icon="item.icon" fixed-width/>
|
||||
<i v-if="item.icon" class="fa-fw" :class="item.icon"></i>
|
||||
<MkAvatar v-if="item.avatar" :user="item.avatar" class="avatar"/>
|
||||
<span>{{ item.text }}</span>
|
||||
<i v-if="item.indicate"><Fa :icon="faCircle"/></i>
|
||||
<span v-if="item.indicate" class="indicator"><i class="fas fa-circle"></i></span>
|
||||
</button>
|
||||
</template>
|
||||
<span v-if="_items.length === 0" class="none item">
|
||||
|
@ -42,7 +42,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent, ref } from 'vue';
|
||||
import { faCircle } from '@fortawesome/free-solid-svg-icons';
|
||||
import { focusPrev, focusNext } from '@client/scripts/focus';
|
||||
import contains from '@client/scripts/contains';
|
||||
|
||||
|
@ -65,7 +64,6 @@ export default defineComponent({
|
|||
data() {
|
||||
return {
|
||||
_items: [],
|
||||
faCircle,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
|
@ -207,7 +205,7 @@ export default defineComponent({
|
|||
opacity: 0.7;
|
||||
}
|
||||
|
||||
> [data-icon] {
|
||||
> i {
|
||||
margin-right: 4px;
|
||||
width: 20px;
|
||||
}
|
||||
|
@ -218,7 +216,7 @@ export default defineComponent({
|
|||
height: 20px;
|
||||
}
|
||||
|
||||
> i {
|
||||
> .indicator {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
left: 13px;
|
||||
|
|
|
@ -2,12 +2,12 @@
|
|||
<MkModal ref="modal" @click="$emit('click')" @closed="$emit('closed')">
|
||||
<div class="ebkgoccj _popup _narrow_" @keydown="onKeydown" :style="{ width: `${width}px`, height: scroll ? (height ? `${height}px` : null) : (height ? `min(${height}px, 100%)` : '100%') }">
|
||||
<div class="header">
|
||||
<button class="_button" v-if="withOkButton" @click="$emit('close')"><Fa :icon="faTimes"/></button>
|
||||
<button class="_button" v-if="withOkButton" @click="$emit('close')"><i class="fas fa-times"></i></button>
|
||||
<span class="title">
|
||||
<slot name="header"></slot>
|
||||
</span>
|
||||
<button class="_button" v-if="!withOkButton" @click="$emit('close')"><Fa :icon="faTimes"/></button>
|
||||
<button class="_button" v-if="withOkButton" @click="$emit('ok')" :disabled="okButtonDisabled"><Fa :icon="faCheck"/></button>
|
||||
<button class="_button" v-if="!withOkButton" @click="$emit('close')"><i class="fas fa-times"></i></button>
|
||||
<button class="_button" v-if="withOkButton" @click="$emit('ok')" :disabled="okButtonDisabled"><i class="fas fa-check"></i></button>
|
||||
</div>
|
||||
<div class="body" v-if="padding">
|
||||
<div class="_section">
|
||||
|
@ -23,7 +23,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faTimes, faCheck } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkModal from './modal.vue';
|
||||
|
||||
export default defineComponent({
|
||||
|
@ -72,7 +71,6 @@ export default defineComponent({
|
|||
|
||||
data() {
|
||||
return {
|
||||
faTimes, faCheck
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -15,7 +15,7 @@
|
|||
</select>
|
||||
<div class="suffix">
|
||||
<slot name="suffix">
|
||||
<Fa :icon="faChevronDown"/>
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
</slot>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -25,7 +25,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faChevronDown } from '@fortawesome/free-solid-svg-icons';
|
||||
|
||||
export default defineComponent({
|
||||
props: {
|
||||
|
@ -49,7 +48,6 @@ export default defineComponent({
|
|||
data() {
|
||||
return {
|
||||
focused: false,
|
||||
faChevronDown,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
|
|
|
@ -4,13 +4,13 @@
|
|||
<div class="body _popup _shadow _narrow_" @mousedown="onBodyMousedown" @keydown="onKeydown">
|
||||
<div class="header" :class="{ mini }" @contextmenu.prevent.stop="onContextmenu">
|
||||
<slot v-if="closeRight" name="buttons"><button class="_button" style="pointer-events: none;"></button></slot>
|
||||
<button v-else class="_button" @click="close()"><Fa :icon="faTimes"/></button>
|
||||
<button v-else class="_button" @click="close()"><i class="fas fa-times"></i></button>
|
||||
|
||||
<span class="title" @mousedown.prevent="onHeaderMousedown" @touchstart.prevent="onHeaderMousedown">
|
||||
<slot name="header"></slot>
|
||||
</span>
|
||||
|
||||
<button v-if="closeRight" class="_button" @click="close()"><Fa :icon="faTimes"/></button>
|
||||
<button v-if="closeRight" class="_button" @click="close()"><i class="fas fa-times"></i></button>
|
||||
<slot v-else name="buttons"><button class="_button" style="pointer-events: none;"></button></slot>
|
||||
</div>
|
||||
<div class="body" v-if="padding">
|
||||
|
@ -38,7 +38,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faTimes, faCheck } from '@fortawesome/free-solid-svg-icons';
|
||||
import contains from '@client/scripts/contains';
|
||||
import * as os from '@client/os';
|
||||
|
||||
|
@ -114,7 +113,6 @@ export default defineComponent({
|
|||
return {
|
||||
showing: true,
|
||||
id: Math.random().toString(), // TODO: UUIDとかにする
|
||||
faTimes
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div v-if="playerEnabled" class="player" :style="`padding: ${(player.height || 0) / (player.width || 1) * 100}% 0 0`">
|
||||
<button class="disablePlayer" @click="playerEnabled = false" :title="$ts.disablePlayer"><Fa icon="times"/></button>
|
||||
<button class="disablePlayer" @click="playerEnabled = false" :title="$ts.disablePlayer"><i class="fas fa-times"></i></button>
|
||||
<iframe :src="player.url + (player.url.match(/\?/) ? '&autoplay=1&auto_play=1' : '?autoplay=1&auto_play=1')" :width="player.width || '100%'" :heigth="player.height || 250" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen />
|
||||
</div>
|
||||
<div v-else-if="tweetId && tweetExpanded" class="twitter" ref="twitter">
|
||||
|
@ -10,7 +10,7 @@
|
|||
<transition name="zoom" mode="out-in">
|
||||
<component :is="self ? 'MkA' : 'a'" :class="{ compact }" :[attr]="self ? url.substr(local.length) : url" rel="nofollow noopener" :target="target" :title="url" v-if="!fetching">
|
||||
<div class="thumbnail" v-if="thumbnail" :style="`background-image: url('${thumbnail}')`">
|
||||
<button class="_button" v-if="!playerEnabled && player.url" @click.prevent="playerEnabled = true" :title="$ts.enablePlayer"><Fa :icon="faPlayCircle"/></button>
|
||||
<button class="_button" v-if="!playerEnabled && player.url" @click.prevent="playerEnabled = true" :title="$ts.enablePlayer"><i class="fas fa-play-circle"></i></button>
|
||||
</div>
|
||||
<article>
|
||||
<header>
|
||||
|
@ -26,7 +26,7 @@
|
|||
</transition>
|
||||
<div class="expandTweet" v-if="tweetId">
|
||||
<a @click="tweetExpanded = true">
|
||||
<Fa :icon="faTwitter"/> {{ $ts.expandTweet }}
|
||||
<i class="fab fa-twitter"></i> {{ $ts.expandTweet }}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -34,8 +34,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faPlayCircle } from '@fortawesome/free-regular-svg-icons';
|
||||
import { faTwitter } from '@fortawesome/free-brands-svg-icons';
|
||||
import { url as local, lang } from '@client/config';
|
||||
import * as os from '@client/os';
|
||||
|
||||
|
@ -83,7 +81,6 @@ export default defineComponent({
|
|||
self: self,
|
||||
attr: self ? 'to' : 'href',
|
||||
target: self ? null : '_blank',
|
||||
faPlayCircle, faTwitter
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
<MkUserInfo class="user" v-for="user in users" :user="user" :key="user.id"/>
|
||||
</div>
|
||||
<button class="more" v-appear="$store.state.enableInfiniteScroll ? fetchMore : null" @click="fetchMore" :class="{ fetching: moreFetching }" v-show="more" :disabled="moreFetching">
|
||||
<template v-if="moreFetching"><Fa icon="spinner" pulse fixed-width/></template>{{ moreFetching ? $ts.loading : $ts.loadMore }}
|
||||
<template v-if="moreFetching"><i class="fas fa-spinner fa-pulse fa-fw"></i></template>{{ moreFetching ? $ts.loading : $ts.loadMore }}
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -83,7 +83,7 @@ export default defineComponent({
|
|||
cursor: wait;
|
||||
}
|
||||
|
||||
> [data-icon] {
|
||||
> i {
|
||||
margin-right: 4px;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -44,7 +44,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faTimes, faCheck } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkInput from './ui/input.vue';
|
||||
import XModalWindow from '@client/components/ui/modal-window.vue';
|
||||
import * as os from '@client/os';
|
||||
|
@ -67,7 +66,6 @@ export default defineComponent({
|
|||
recentUsers: [],
|
||||
users: [],
|
||||
selected: null,
|
||||
faTimes, faCheck
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
<div class="mk-users-dialog">
|
||||
<div class="header">
|
||||
<span>{{ title }}</span>
|
||||
<button class="_button" @click="close()"><Fa :icon="faTimes"/></button>
|
||||
<button class="_button" @click="close()"><i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
|
||||
<div class="users">
|
||||
|
@ -16,7 +16,7 @@
|
|||
</div>
|
||||
<button class="more _button" v-appear="$store.state.enableInfiniteScroll ? fetchMore : null" @click="fetchMore" v-show="more" :disabled="moreFetching">
|
||||
<template v-if="!moreFetching">{{ $ts.loadMore }}</template>
|
||||
<template v-if="moreFetching"><Fa :icon="faSpinner" pulse fixed-width/></template>
|
||||
<template v-if="moreFetching"><i class="fas fa-spinner fa-pulse fa-fw"></i></template>
|
||||
</button>
|
||||
|
||||
<p class="empty" v-if="empty">{{ $ts.noUsers }}</p>
|
||||
|
@ -27,7 +27,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faTimes } from '@fortawesome/free-solid-svg-icons';
|
||||
import paging from '@client/scripts/paging';
|
||||
import { userPage } from '../filters/user';
|
||||
|
||||
|
@ -50,7 +49,6 @@ export default defineComponent({
|
|||
|
||||
data() {
|
||||
return {
|
||||
faTimes
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -2,28 +2,28 @@
|
|||
<MkModal ref="modal" :src="src" @click="$refs.modal.close()" @closed="$emit('closed')">
|
||||
<div class="gqyayizv _popup">
|
||||
<button class="_button" @click="choose('public')" :class="{ active: v == 'public' }" data-index="1" key="public">
|
||||
<div><Fa :icon="faGlobe"/></div>
|
||||
<div><i class="fas fa-globe"></i></div>
|
||||
<div>
|
||||
<span>{{ $ts._visibility.public }}</span>
|
||||
<span>{{ $ts._visibility.publicDescription }}</span>
|
||||
</div>
|
||||
</button>
|
||||
<button class="_button" @click="choose('home')" :class="{ active: v == 'home' }" data-index="2" key="home">
|
||||
<div><Fa :icon="faHome"/></div>
|
||||
<div><i class="fas fa-home"></i></div>
|
||||
<div>
|
||||
<span>{{ $ts._visibility.home }}</span>
|
||||
<span>{{ $ts._visibility.homeDescription }}</span>
|
||||
</div>
|
||||
</button>
|
||||
<button class="_button" @click="choose('followers')" :class="{ active: v == 'followers' }" data-index="3" key="followers">
|
||||
<div><Fa :icon="faUnlock"/></div>
|
||||
<div><i class="fas fa-unlock"></i></div>
|
||||
<div>
|
||||
<span>{{ $ts._visibility.followers }}</span>
|
||||
<span>{{ $ts._visibility.followersDescription }}</span>
|
||||
</div>
|
||||
</button>
|
||||
<button :disabled="localOnly" class="_button" @click="choose('specified')" :class="{ active: v == 'specified' }" data-index="4" key="specified">
|
||||
<div><Fa :icon="faEnvelope"/></div>
|
||||
<div><i class="fas fa-envelope"></i></div>
|
||||
<div>
|
||||
<span>{{ $ts._visibility.specified }}</span>
|
||||
<span>{{ $ts._visibility.specifiedDescription }}</span>
|
||||
|
@ -31,12 +31,12 @@
|
|||
</button>
|
||||
<div class="divider"></div>
|
||||
<button class="_button localOnly" @click="localOnly = !localOnly" :class="{ active: localOnly }" data-index="5" key="localOnly">
|
||||
<div><Fa :icon="faBiohazard"/></div>
|
||||
<div><i class="fas fa-biohazard"></i></div>
|
||||
<div>
|
||||
<span>{{ $ts._visibility.localOnly }}</span>
|
||||
<span>{{ $ts._visibility.localOnlyDescription }}</span>
|
||||
</div>
|
||||
<div><Fa :icon="localOnly ? faToggleOn : faToggleOff" :key="localOnly"/></div>
|
||||
<div><i :class="localOnly ? 'fas fa-toggle-on' : 'fas fa-toggle-off'"></i></div>
|
||||
</button>
|
||||
</div>
|
||||
</MkModal>
|
||||
|
@ -44,8 +44,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faGlobe, faUnlock, faHome, faBiohazard, faToggleOn, faToggleOff } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faEnvelope } from '@fortawesome/free-regular-svg-icons';
|
||||
import MkModal from '@client/components/ui/modal.vue';
|
||||
|
||||
export default defineComponent({
|
||||
|
@ -70,7 +68,6 @@ export default defineComponent({
|
|||
return {
|
||||
v: this.currentVisibility,
|
||||
localOnly: this.currentLocalOnly,
|
||||
faGlobe, faUnlock, faEnvelope, faHome, faBiohazard, faToggleOn, faToggleOff
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
<template>
|
||||
<MkModal ref="modal" @click="success ? done() : () => {}" @closed="$emit('closed')">
|
||||
<div class="iuyakobc" :class="{ iconOnly: (text == null) || success }">
|
||||
<Fa class="icon success" v-if="success" :icon="faCheck"/>
|
||||
<Fa class="icon waiting" v-else :icon="faSpinner" pulse/>
|
||||
<i v-if="success" class="fas fa-check icon success"></i>
|
||||
<i v-else class="fas fa-spinner fa-pulse icon waiting"></i>
|
||||
<div class="text" v-if="text && !success">{{ text }}<MkEllipsis/></div>
|
||||
</div>
|
||||
</MkModal>
|
||||
|
@ -10,7 +10,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faCheck, faSpinner } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkModal from '@client/components/ui/modal.vue';
|
||||
|
||||
export default defineComponent({
|
||||
|
@ -37,7 +36,6 @@ export default defineComponent({
|
|||
|
||||
data() {
|
||||
return {
|
||||
faCheck, faSpinner,
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
<template #label>{{ $ts.selectWidget }}</template>
|
||||
<option v-for="widget in widgetDefs" :value="widget" :key="widget">{{ $t(`_widgets.${widget}`) }}</option>
|
||||
</MkSelect>
|
||||
<MkButton inline @click="addWidget" primary><Fa :icon="faPlus"/> {{ $ts.add }}</MkButton>
|
||||
<MkButton inline @click="addWidget" primary><i class="fas fa-plus"></i> {{ $ts.add }}</MkButton>
|
||||
<MkButton inline @click="$emit('exit')">{{ $ts.close }}</MkButton>
|
||||
</header>
|
||||
<XDraggable
|
||||
|
@ -16,8 +16,8 @@
|
|||
>
|
||||
<template #item="{element}">
|
||||
<div class="customize-container">
|
||||
<button class="config _button" @click.prevent.stop="configWidget(element.id)"><Fa :icon="faCog"/></button>
|
||||
<button class="remove _button" @click.prevent.stop="removeWidget(element)"><Fa :icon="faTimes"/></button>
|
||||
<button class="config _button" @click.prevent.stop="configWidget(element.id)"><i class="fas fa-cog"></i></button>
|
||||
<button class="remove _button" @click.prevent.stop="removeWidget(element)"><i class="fas fa-times"></i></button>
|
||||
<component :is="`mkw-${element.name}`" :widget="element" :setting-callback="setting => settings[element.id] = setting" :column="column" @updateProps="updateWidget(element.id, $event)"/>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -30,7 +30,6 @@
|
|||
<script lang="ts">
|
||||
import { defineComponent, defineAsyncComponent } from 'vue';
|
||||
import { v4 as uuid } from 'uuid';
|
||||
import { faTimes, faCog, faPlus } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkSelect from '@client/components/ui/select.vue';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import { widgets as widgetDefs } from '@client/widgets';
|
||||
|
@ -59,7 +58,6 @@ export default defineComponent({
|
|||
widgetAdderSelected: null,
|
||||
widgetDefs,
|
||||
settings: {},
|
||||
faTimes, faPlus, faCog
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -7,7 +7,6 @@ import '@client/style.scss';
|
|||
import * as Sentry from '@sentry/browser';
|
||||
import { Integrations } from '@sentry/tracing';
|
||||
import { computed, createApp, watch } from 'vue';
|
||||
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
|
||||
|
||||
import widgets from '@client/widgets';
|
||||
import directives from '@client/directives';
|
||||
|
@ -184,8 +183,6 @@ app.config.globalProperties = {
|
|||
};
|
||||
|
||||
app.use(router);
|
||||
// eslint-disable-next-line vue/component-definition-name-casing
|
||||
app.component('Fa', FontAwesomeIcon);
|
||||
|
||||
widgets(app);
|
||||
directives(app);
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
<div class="_section">
|
||||
<div class="mjndxjch _content">
|
||||
<img src="https://xn--931a.moe/assets/error.jpg" class="_ghost"/>
|
||||
<p><Fa :icon="faExclamationTriangle"/> {{ $ts.pageLoadError }}</p>
|
||||
<p><i class="fas fa-exclamation-triangle"></i> {{ $ts.pageLoadError }}</p>
|
||||
<p>{{ $ts.pageLoadErrorDescription }}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -12,7 +12,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faExclamationTriangle } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import * as symbols from '@client/symbols';
|
||||
|
||||
|
@ -24,9 +23,8 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.error,
|
||||
icon: faExclamationTriangle
|
||||
icon: 'fas fa-exclamation-triangle'
|
||||
},
|
||||
faExclamationTriangle
|
||||
};
|
||||
},
|
||||
});
|
||||
|
|
|
@ -15,17 +15,17 @@
|
|||
</section>
|
||||
<FormGroup>
|
||||
<FormLink to="https://github.com/misskey-dev/misskey" external>
|
||||
<template #icon><Fa :icon="faCode"/></template>
|
||||
<template #icon><i class="fas fa-code"></i></template>
|
||||
{{ $ts._aboutMisskey.source }}
|
||||
<template #suffix>GitHub</template>
|
||||
</FormLink>
|
||||
<FormLink to="https://crowdin.com/project/misskey" external>
|
||||
<template #icon><Fa :icon="faLanguage"/></template>
|
||||
<template #icon><i class="fas fa-language"></i></template>
|
||||
{{ $ts._aboutMisskey.translation }}
|
||||
<template #suffix>Crowdin</template>
|
||||
</FormLink>
|
||||
<FormLink to="https://www.patreon.com/syuilo" external>
|
||||
<template #icon><Fa :icon="faHandHoldingMedical"/></template>
|
||||
<template #icon><i class="fas fa-hand-holding-medical"></i></template>
|
||||
{{ $ts._aboutMisskey.donate }}
|
||||
<template #suffix>Patreon</template>
|
||||
</FormLink>
|
||||
|
@ -54,7 +54,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faInfoCircle, faCode, faLanguage, faHandHoldingMedical, } from '@fortawesome/free-solid-svg-icons';
|
||||
import VanillaTilt from 'vanilla-tilt';
|
||||
import { version } from '@client/config';
|
||||
import FormLink from '@client/components/form/link.vue';
|
||||
|
@ -125,7 +124,6 @@ export default defineComponent({
|
|||
easterEggReady: false,
|
||||
easterEggEmojis: [],
|
||||
easterEggEngine: null,
|
||||
faInfoCircle, faCode, faLanguage, faHandHoldingMedical,
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
@ -40,7 +40,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faInfoCircle } from '@fortawesome/free-solid-svg-icons';
|
||||
import { version, instanceName } from '@client/config';
|
||||
import FormLink from '@client/components/form/link.vue';
|
||||
import FormBase from '@client/components/form/base.vue';
|
||||
|
@ -62,12 +61,11 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.instanceInfo,
|
||||
icon: faInfoCircle
|
||||
icon: 'fas fa-info-circle'
|
||||
},
|
||||
version,
|
||||
instanceName,
|
||||
stats: null,
|
||||
faInfoCircle
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
@ -34,7 +34,7 @@
|
|||
</div>
|
||||
<div>
|
||||
<div class="type" @click="chooseType($event, i)">
|
||||
{{ getTypeOf(v) }} <Fa :icon="faChevronDown"/>
|
||||
{{ getTypeOf(v) }} <i class="fas fa-chevron-down"></i>
|
||||
</div>
|
||||
<!-- default -->
|
||||
<div v-if="v === null" v-text="baseProps[k]" class="default-value" />
|
||||
|
@ -92,7 +92,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faPalette, faChevronDown, faKeyboard } from '@fortawesome/free-solid-svg-icons';
|
||||
import * as JSON5 from 'json5';
|
||||
import { toUnicode } from 'punycode/';
|
||||
|
||||
|
@ -125,7 +124,7 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.themeEditor,
|
||||
icon: faPalette,
|
||||
icon: 'fas fa-palette',
|
||||
},
|
||||
theme: [] as ThemeViewModel,
|
||||
name: '',
|
||||
|
@ -135,7 +134,6 @@ export default defineComponent({
|
|||
themeToImport: '',
|
||||
changed: false,
|
||||
lightTheme, darkTheme, themeProps,
|
||||
faPalette, faChevronDown, faKeyboard,
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
@ -8,7 +8,7 @@
|
|||
<img v-if="announcement.imageUrl" :src="announcement.imageUrl"/>
|
||||
</div>
|
||||
<div class="_footer" v-if="$i && !announcement.isRead">
|
||||
<MkButton @click="read(items, announcement, i)" primary><Fa :icon="faCheck"/> {{ $ts.gotIt }}</MkButton>
|
||||
<MkButton @click="read(items, announcement, i)" primary><i class="fas fa-check"></i> {{ $ts.gotIt }}</MkButton>
|
||||
</div>
|
||||
</section>
|
||||
</MkPagination>
|
||||
|
@ -17,7 +17,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faCheck, faBroadcastTower } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkPagination from '@client/components/ui/pagination.vue';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import * as os from '@client/os';
|
||||
|
@ -33,13 +32,12 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.announcements,
|
||||
icon: faBroadcastTower
|
||||
icon: 'fas fa-broadcast-tower'
|
||||
},
|
||||
pagination: {
|
||||
endpoint: 'announcements',
|
||||
limit: 10,
|
||||
},
|
||||
faCheck,
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -12,7 +12,7 @@
|
|||
</MkSwitch>
|
||||
<MkButton primary full @click="send" :disabled="sending">
|
||||
<template v-if="sending"><MkEllipsis/></template>
|
||||
<template v-else><Fa :icon="faPaperPlane"/> Send</template>
|
||||
<template v-else><i class="fas fa-paper-plane"></i> Send</template>
|
||||
</MkButton>
|
||||
</div>
|
||||
<div v-if="res" class="_block" style="padding: 24px;">
|
||||
|
@ -25,7 +25,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faTerminal, faPaperPlane } from '@fortawesome/free-solid-svg-icons';
|
||||
import * as JSON5 from 'json5';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import MkInput from '@client/components/ui/input.vue';
|
||||
|
@ -43,7 +42,7 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: 'API console',
|
||||
icon: faTerminal
|
||||
icon: 'fas fa-terminal'
|
||||
},
|
||||
|
||||
endpoint: '',
|
||||
|
@ -53,7 +52,6 @@ export default defineComponent({
|
|||
endpoints: [],
|
||||
withCredential: true,
|
||||
|
||||
faPaperPlane
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -7,15 +7,15 @@
|
|||
<MkTextarea v-model:value="description">{{ $ts.description }}</MkTextarea>
|
||||
|
||||
<div class="banner">
|
||||
<MkButton v-if="bannerId == null" @click="setBannerImage"><Fa :icon="faPlus"/> {{ $ts._channel.setBanner }}</MkButton>
|
||||
<MkButton v-if="bannerId == null" @click="setBannerImage"><i class="fas fa-plus"></i> {{ $ts._channel.setBanner }}</MkButton>
|
||||
<div v-else-if="bannerUrl">
|
||||
<img :src="bannerUrl" style="width: 100%;"/>
|
||||
<MkButton @click="removeBannerImage()"><Fa :icon="faTrashAlt"/> {{ $ts._channel.removeBanner }}</MkButton>
|
||||
<MkButton @click="removeBannerImage()"><i class="fas fa-trash-alt"></i> {{ $ts._channel.removeBanner }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="_footer">
|
||||
<MkButton @click="save()" primary><Fa :icon="faSave"/> {{ channelId ? $ts.save : $ts.create }}</MkButton>
|
||||
<MkButton @click="save()" primary><i class="fas fa-save"></i> {{ channelId ? $ts.save : $ts.create }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -23,8 +23,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent } from 'vue';
|
||||
import { faPlus, faSatelliteDish } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faSave, faTrashAlt } from '@fortawesome/free-regular-svg-icons';
|
||||
import MkTextarea from '@client/components/ui/textarea.vue';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import MkInput from '@client/components/ui/input.vue';
|
||||
|
@ -48,17 +46,16 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: computed(() => this.channelId ? {
|
||||
title: this.$ts._channel.edit,
|
||||
icon: faSatelliteDish,
|
||||
icon: 'fas fa-satellite-dish',
|
||||
} : {
|
||||
title: this.$ts._channel.create,
|
||||
icon: faSatelliteDish,
|
||||
icon: 'fas fa-satellite-dish',
|
||||
}),
|
||||
channel: null,
|
||||
name: null,
|
||||
description: null,
|
||||
bannerUrl: null,
|
||||
bannerId: null,
|
||||
faSave, faTrashAlt, faPlus,faSatelliteDish,
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -3,15 +3,15 @@
|
|||
<div class="wpgynlbz _content _panel _gap" :class="{ hide: !showBanner }">
|
||||
<XChannelFollowButton :channel="channel" :full="true" class="subscribe"/>
|
||||
<button class="_button toggle" @click="() => showBanner = !showBanner">
|
||||
<template v-if="showBanner"><Fa :icon="faAngleUp"/></template>
|
||||
<template v-else><Fa :icon="faAngleDown"/></template>
|
||||
<template v-if="showBanner"><i class="fas fa-angle-up"></i></template>
|
||||
<template v-else><i class="fas fa-angle-down"></i></template>
|
||||
</button>
|
||||
<div class="hideOverlay" v-if="!showBanner">
|
||||
</div>
|
||||
<div :style="{ backgroundImage: channel.bannerUrl ? `url(${channel.bannerUrl})` : null }" class="banner">
|
||||
<div class="status">
|
||||
<div><Fa :icon="faUsers" fixed-width/><I18n :src="$ts._channel.usersCount" tag="span" style="margin-left: 4px;"><template #n><b>{{ channel.usersCount }}</b></template></I18n></div>
|
||||
<div><Fa :icon="faPencilAlt" fixed-width/><I18n :src="$ts._channel.notesCount" tag="span" style="margin-left: 4px;"><template #n><b>{{ channel.notesCount }}</b></template></I18n></div>
|
||||
<div><i class="fas fa-users fa-fw"></i><I18n :src="$ts._channel.usersCount" tag="span" style="margin-left: 4px;"><template #n><b>{{ channel.usersCount }}</b></template></I18n></div>
|
||||
<div><i class="fas fa-pencil-alt fa-fw"></i><I18n :src="$ts._channel.notesCount" tag="span" style="margin-left: 4px;"><template #n><b>{{ channel.notesCount }}</b></template></I18n></div>
|
||||
</div>
|
||||
<div class="fade"></div>
|
||||
</div>
|
||||
|
@ -28,8 +28,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent } from 'vue';
|
||||
import { faSatelliteDish, faUsers, faPencilAlt, faAngleUp, faAngleDown } from '@fortawesome/free-solid-svg-icons';
|
||||
import { } from '@fortawesome/free-regular-svg-icons';
|
||||
import MkContainer from '@client/components/ui/container.vue';
|
||||
import XPostForm from '@client/components/post-form.vue';
|
||||
import XTimeline from '@client/components/timeline.vue';
|
||||
|
@ -56,7 +54,7 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: computed(() => this.channel ? {
|
||||
title: this.channel.name,
|
||||
icon: faSatelliteDish,
|
||||
icon: 'fas fa-satellite-dish',
|
||||
} : null),
|
||||
channel: null,
|
||||
showBanner: true,
|
||||
|
@ -67,7 +65,6 @@ export default defineComponent({
|
|||
channelId: this.channelId,
|
||||
})
|
||||
},
|
||||
faSatelliteDish, faUsers, faPencilAlt, faAngleUp, faAngleDown,
|
||||
};
|
||||
},
|
||||
|
||||
|
@ -111,7 +108,7 @@ export default defineComponent({
|
|||
background: rgba(0, 0, 0, 0.5);
|
||||
border-radius: 100%;
|
||||
|
||||
> [data-icon] {
|
||||
> i {
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -2,9 +2,9 @@
|
|||
<div>
|
||||
<div class="_section" style="padding: 0;" v-if="$i">
|
||||
<MkTab class="_content" v-model:value="tab">
|
||||
<option value="featured"><Fa :icon="faFireAlt"/> {{ $ts._channel.featured }}</option>
|
||||
<option value="following"><Fa :icon="faHeart"/> {{ $ts._channel.following }}</option>
|
||||
<option value="owned"><Fa :icon="faEdit"/> {{ $ts._channel.owned }}</option>
|
||||
<option value="featured"><i class="fas fa-fire-alt"></i> {{ $ts._channel.featured }}</option>
|
||||
<option value="following"><i class="fas fa-heart"></i> {{ $ts._channel.following }}</option>
|
||||
<option value="owned"><i class="fas fa-edit"></i> {{ $ts._channel.owned }}</option>
|
||||
</MkTab>
|
||||
</div>
|
||||
|
||||
|
@ -22,7 +22,7 @@
|
|||
</div>
|
||||
|
||||
<div class="_content grwlizim owned" v-if="tab === 'owned'">
|
||||
<MkButton class="new" @click="create()"><Fa :icon="faPlus"/></MkButton>
|
||||
<MkButton class="new" @click="create()"><i class="fas fa-plus"></i></MkButton>
|
||||
<MkPagination :pagination="ownedPagination" #default="{items}">
|
||||
<MkChannelPreview v-for="channel in items" class="_gap" :channel="channel" :key="channel.id"/>
|
||||
</MkPagination>
|
||||
|
@ -33,8 +33,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faSatelliteDish, faPlus, faEdit, faFireAlt } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faHeart } from '@fortawesome/free-regular-svg-icons';
|
||||
import MkChannelPreview from '@client/components/channel-preview.vue';
|
||||
import MkPagination from '@client/components/ui/pagination.vue';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
|
@ -49,9 +47,9 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.channel,
|
||||
icon: faSatelliteDish,
|
||||
icon: 'fas fa-satellite-dish',
|
||||
action: {
|
||||
icon: faPlus,
|
||||
icon: 'fas fa-plus',
|
||||
handler: this.create
|
||||
}
|
||||
},
|
||||
|
@ -68,7 +66,6 @@ export default defineComponent({
|
|||
endpoint: 'channels/owned',
|
||||
limit: 5,
|
||||
},
|
||||
faSatelliteDish, faPlus, faEdit, faHeart, faFireAlt
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
|
|
|
@ -15,7 +15,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent } from 'vue';
|
||||
import { faEllipsisH, faPaperclip, faPencilAlt, faTrashAlt } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkContainer from '@client/components/ui/container.vue';
|
||||
import XPostForm from '@client/components/post-form.vue';
|
||||
import XNotes from '@client/components/notes.vue';
|
||||
|
@ -40,9 +39,9 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: computed(() => this.clip ? {
|
||||
title: this.clip.name,
|
||||
icon: faPaperclip,
|
||||
icon: 'fas fa-paperclip',
|
||||
action: {
|
||||
icon: faEllipsisH,
|
||||
icon: 'fas fa-ellipsis'H,
|
||||
handler: this.menu
|
||||
}
|
||||
} : null),
|
||||
|
@ -81,7 +80,7 @@ export default defineComponent({
|
|||
methods: {
|
||||
menu(ev) {
|
||||
os.modalMenu([this.isOwned ? {
|
||||
icon: faPencilAlt,
|
||||
icon: 'fas fa-pencil-alt',
|
||||
text: this.$ts.edit,
|
||||
action: async () => {
|
||||
const { canceled, result } = await os.form(this.clip.name, {
|
||||
|
@ -111,7 +110,7 @@ export default defineComponent({
|
|||
});
|
||||
}
|
||||
} : undefined, this.isOwned ? {
|
||||
icon: faTrashAlt,
|
||||
icon: 'fas fa-trash-alt',
|
||||
text: this.$ts.delete,
|
||||
danger: true,
|
||||
action: async () => {
|
||||
|
|
|
@ -10,7 +10,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent } from 'vue';
|
||||
import { faQuestionCircle } from '@fortawesome/free-solid-svg-icons'
|
||||
import MarkdownIt from 'markdown-it';
|
||||
import MarkdownItAnchor from 'markdown-it-anchor';
|
||||
import { url, lang } from '@client/config';
|
||||
|
@ -41,7 +40,7 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: computed(() => this.title ? {
|
||||
title: this.title,
|
||||
icon: faQuestionCircle,
|
||||
icon: 'fas fa-question-circle',
|
||||
} : null),
|
||||
title: null,
|
||||
body: null,
|
||||
|
|
|
@ -14,7 +14,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faQuestionCircle } from '@fortawesome/free-solid-svg-icons'
|
||||
import { url, lang } from '@client/config';
|
||||
import * as symbols from '@client/symbols';
|
||||
|
||||
|
@ -23,10 +22,9 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.help,
|
||||
icon: faQuestionCircle
|
||||
icon: 'fas fa-question-circle'
|
||||
},
|
||||
docs: [],
|
||||
faQuestionCircle
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
@ -6,7 +6,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent } from 'vue';
|
||||
import { faCloud } from '@fortawesome/free-solid-svg-icons';
|
||||
import XDrive from '@client/components/drive.vue';
|
||||
import * as os from '@client/os';
|
||||
import * as symbols from '@client/symbols';
|
||||
|
@ -20,7 +19,7 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: computed(() => this.folder ? this.folder.name : this.$ts.drive),
|
||||
icon: faCloud,
|
||||
icon: 'fas fa-cloud',
|
||||
menu: () => this.$refs.drive.getMenu()
|
||||
},
|
||||
folder: null,
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
<div class="lznhrdub _root">
|
||||
<div>
|
||||
<div class="_isolated">
|
||||
<MkInput v-model:value="query" :debounce="true" type="search"><template #icon><Fa :icon="faSearch"/></template><span>{{ $ts.searchUser }}</span></MkInput>
|
||||
<MkInput v-model:value="query" :debounce="true" type="search"><template #icon><i class="fas fa-search"></i></template><span>{{ $ts.searchUser }}</span></MkInput>
|
||||
</div>
|
||||
|
||||
<XUserList v-if="query" class="_gap" :pagination="searchPagination" ref="search"/>
|
||||
|
@ -14,19 +14,19 @@
|
|||
|
||||
<template v-if="tag == null">
|
||||
<MkFolder class="_gap" persist-key="explore-pinned-users">
|
||||
<template #header><Fa :icon="faBookmark" fixed-width style="margin-right: 0.5em;"/>{{ $ts.pinnedUsers }}</template>
|
||||
<template #header><i class="fas fa-bookmark fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.pinnedUsers }}</template>
|
||||
<XUserList :pagination="pinnedUsers"/>
|
||||
</MkFolder>
|
||||
<MkFolder class="_gap" persist-key="explore-popular-users">
|
||||
<template #header><Fa :icon="faChartLine" fixed-width style="margin-right: 0.5em;"/>{{ $ts.popularUsers }}</template>
|
||||
<template #header><i class="fas fa-chart-line fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.popularUsers }}</template>
|
||||
<XUserList :pagination="popularUsers"/>
|
||||
</MkFolder>
|
||||
<MkFolder class="_gap" persist-key="explore-recently-updated-users">
|
||||
<template #header><Fa :icon="faCommentAlt" fixed-width style="margin-right: 0.5em;"/>{{ $ts.recentlyUpdatedUsers }}</template>
|
||||
<template #header><i class="fas fa-comment-alt fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.recentlyUpdatedUsers }}</template>
|
||||
<XUserList :pagination="recentlyUpdatedUsers"/>
|
||||
</MkFolder>
|
||||
<MkFolder class="_gap" persist-key="explore-recently-registered-users">
|
||||
<template #header><Fa :icon="faPlus" fixed-width style="margin-right: 0.5em;"/>{{ $ts.recentlyRegisteredUsers }}</template>
|
||||
<template #header><i class="fas fa-plus fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.recentlyRegisteredUsers }}</template>
|
||||
<XUserList :pagination="recentlyRegisteredUsers"/>
|
||||
</MkFolder>
|
||||
</template>
|
||||
|
@ -37,7 +37,7 @@
|
|||
</div>
|
||||
|
||||
<MkFolder :foldable="true" :expanded="false" ref="tags" class="_gap">
|
||||
<template #header><Fa :icon="faHashtag" fixed-width style="margin-right: 0.5em;"/>{{ $ts.popularTags }}</template>
|
||||
<template #header><i class="fas fa-hashtag fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.popularTags }}</template>
|
||||
|
||||
<div class="vxjfqztj">
|
||||
<MkA v-for="tag in tagsLocal" :to="`/explore/tags/${tag.tag}`" :key="'local:' + tag.tag" class="local">{{ tag.tag }}</MkA>
|
||||
|
@ -46,21 +46,21 @@
|
|||
</MkFolder>
|
||||
|
||||
<MkFolder v-if="tag != null" :key="`${tag}`" class="_gap">
|
||||
<template #header><Fa :icon="faHashtag" fixed-width style="margin-right: 0.5em;"/>{{ tag }}</template>
|
||||
<template #header><i class="fas fa-hashtag fa-fw" style="margin-right: 0.5em;"></i>{{ tag }}</template>
|
||||
<XUserList :pagination="tagUsers"/>
|
||||
</MkFolder>
|
||||
|
||||
<template v-if="tag == null">
|
||||
<MkFolder class="_gap">
|
||||
<template #header><Fa :icon="faChartLine" fixed-width style="margin-right: 0.5em;"/>{{ $ts.popularUsers }}</template>
|
||||
<template #header><i class="fas fa-chart-line fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.popularUsers }}</template>
|
||||
<XUserList :pagination="popularUsersF"/>
|
||||
</MkFolder>
|
||||
<MkFolder class="_gap">
|
||||
<template #header><Fa :icon="faCommentAlt" fixed-width style="margin-right: 0.5em;"/>{{ $ts.recentlyUpdatedUsers }}</template>
|
||||
<template #header><i class="fas fa-comment-alt fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.recentlyUpdatedUsers }}</template>
|
||||
<XUserList :pagination="recentlyUpdatedUsersF"/>
|
||||
</MkFolder>
|
||||
<MkFolder class="_gap">
|
||||
<template #header><Fa :icon="faRocket" fixed-width style="margin-right: 0.5em;"/>{{ $ts.recentlyDiscoveredUsers }}</template>
|
||||
<template #header><i class="fas fa-rocket fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.recentlyDiscoveredUsers }}</template>
|
||||
<XUserList :pagination="recentlyRegisteredUsersF"/>
|
||||
</MkFolder>
|
||||
</template>
|
||||
|
@ -70,8 +70,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent } from 'vue';
|
||||
import { faChartLine, faPlus, faHashtag, faRocket, faSearch } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faBookmark, faCommentAlt } from '@fortawesome/free-regular-svg-icons';
|
||||
import XUserList from '@client/components/user-list.vue';
|
||||
import MkFolder from '@client/components/ui/folder.vue';
|
||||
import MkInput from '@client/components/ui/input.vue';
|
||||
|
@ -97,7 +95,7 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.explore,
|
||||
icon: faHashtag
|
||||
icon: 'fas fa-hashtag'
|
||||
},
|
||||
pinnedUsers: { endpoint: 'pinned-users' },
|
||||
popularUsers: { endpoint: 'users', limit: 10, noPaging: true, params: {
|
||||
|
@ -139,7 +137,6 @@ export default defineComponent({
|
|||
stats: null,
|
||||
query: null,
|
||||
num: number,
|
||||
faBookmark, faChartLine, faCommentAlt, faPlus, faHashtag, faRocket, faSearch,
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -6,7 +6,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faStar } from '@fortawesome/free-solid-svg-icons';
|
||||
import Progress from '@client/scripts/loading';
|
||||
import XNotes from '@client/components/notes.vue';
|
||||
import * as os from '@client/os';
|
||||
|
@ -21,7 +20,7 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.favorites,
|
||||
icon: faStar
|
||||
icon: 'fas fa-star'
|
||||
},
|
||||
pagination: {
|
||||
endpoint: 'i/favorites',
|
||||
|
|
|
@ -6,7 +6,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faFireAlt } from '@fortawesome/free-solid-svg-icons';
|
||||
import Progress from '@client/scripts/loading';
|
||||
import XNotes from '@client/components/notes.vue';
|
||||
import * as symbols from '@client/symbols';
|
||||
|
@ -20,14 +19,13 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.featured,
|
||||
icon: faFireAlt
|
||||
icon: 'fas fa-fire-alt'
|
||||
},
|
||||
pagination: {
|
||||
endpoint: 'notes/featured',
|
||||
limit: 10,
|
||||
offsetMode: true
|
||||
},
|
||||
faFireAlt
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -19,8 +19,8 @@
|
|||
<Mfm :text="req.follower.description" :is-note="false" :author="req.follower" :i="$i" :custom-emojis="req.follower.emojis" :plain="true" :nowrap="true"/>
|
||||
</div>
|
||||
<div class="actions">
|
||||
<button class="_button" @click="accept(req.follower)"><Fa :icon="faCheck"/></button>
|
||||
<button class="_button" @click="reject(req.follower)"><Fa :icon="faTimes"/></button>
|
||||
<button class="_button" @click="accept(req.follower)"><i class="fas fa-check"></i></button>
|
||||
<button class="_button" @click="reject(req.follower)"><i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -31,7 +31,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faUserClock, faCheck, faTimes } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkPagination from '@client/components/ui/pagination.vue';
|
||||
import { userPage, acct } from '../filters/user';
|
||||
import * as os from '@client/os';
|
||||
|
@ -46,13 +45,12 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.followRequests,
|
||||
icon: faUserClock,
|
||||
icon: 'fas fa-user-clock',
|
||||
},
|
||||
pagination: {
|
||||
endpoint: 'following/requests/list',
|
||||
limit: 10,
|
||||
},
|
||||
faCheck, faTimes, faUserClock
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -133,7 +133,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineAsyncComponent, defineComponent } from 'vue';
|
||||
import { faExternalLinkAlt, faInfoCircle } from '@fortawesome/free-solid-svg-icons';
|
||||
import Chart from 'chart.js';
|
||||
import FormObjectView from '@client/components/form/object-view.vue';
|
||||
import FormTextarea from '@client/components/form/textarea.vue';
|
||||
|
@ -185,10 +184,10 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.instanceInfo,
|
||||
icon: faInfoCircle,
|
||||
icon: 'fas fa-info-circle',
|
||||
actions: [{
|
||||
text: `https://${this.host}`,
|
||||
icon: faExternalLinkAlt,
|
||||
icon: 'fas fa-external-link-alt',
|
||||
handler: () => {
|
||||
window.open(`https://${this.host}`, '_blank');
|
||||
}
|
||||
|
|
|
@ -63,8 +63,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faPlus, faUsers, faSearch, faBookmark, faMicrophoneSlash, faExclamationCircle } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faSnowflake, faBookmark as farBookmark } from '@fortawesome/free-regular-svg-icons';
|
||||
import parseAcct from '@/misc/acct/parse';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import MkInput from '@client/components/ui/input.vue';
|
||||
|
@ -86,7 +84,7 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.abuseReports,
|
||||
icon: faExclamationCircle
|
||||
icon: 'fas fa-exclamation-circle'
|
||||
},
|
||||
searchUsername: '',
|
||||
searchHost: '',
|
||||
|
@ -102,7 +100,6 @@ export default defineComponent({
|
|||
targetUserOrigin: this.targetUserOrigin,
|
||||
}),
|
||||
},
|
||||
faPlus, faUsers, faSearch, faBookmark, farBookmark, faMicrophoneSlash, faSnowflake
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
<div class="ztgjmzrw">
|
||||
<div class="_section">
|
||||
<div class="_content">
|
||||
<MkButton @click="add()" primary style="margin: 0 auto 16px auto;"><Fa :icon="faPlus"/> {{ $ts.add }}</MkButton>
|
||||
<MkButton @click="add()" primary style="margin: 0 auto 16px auto;"><i class="fas fa-plus"></i> {{ $ts.add }}</MkButton>
|
||||
<section class="_card _gap announcements" v-for="announcement in announcements">
|
||||
<div class="_content announcement">
|
||||
<MkInput v-model:value="announcement.title">
|
||||
|
@ -16,8 +16,8 @@
|
|||
</MkInput>
|
||||
<p v-if="announcement.reads">{{ $t('nUsersRead', { n: announcement.reads }) }}</p>
|
||||
<div class="buttons">
|
||||
<MkButton class="button" inline @click="save(announcement)" primary><Fa :icon="faSave"/> {{ $ts.save }}</MkButton>
|
||||
<MkButton class="button" inline @click="remove(announcement)"><Fa :icon="faTrashAlt"/> {{ $ts.remove }}</MkButton>
|
||||
<MkButton class="button" inline @click="save(announcement)" primary><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
|
||||
<MkButton class="button" inline @click="remove(announcement)"><i class="fas fa-trash-alt"></i> {{ $ts.remove }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
@ -28,8 +28,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faBroadcastTower, faPlus } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faSave, faTrashAlt } from '@fortawesome/free-regular-svg-icons';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import MkInput from '@client/components/ui/input.vue';
|
||||
import MkTextarea from '@client/components/ui/textarea.vue';
|
||||
|
@ -47,10 +45,9 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.announcements,
|
||||
icon: faBroadcastTower
|
||||
icon: 'fas fa-broadcast-tower'
|
||||
},
|
||||
announcements: [],
|
||||
faBroadcastTower, faSave, faTrashAlt, faPlus
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
@ -16,14 +16,13 @@
|
|||
<span>{{ $ts.tags }}</span>
|
||||
<template #desc>{{ $ts.setMultipleBySeparatingWithSpace }}</template>
|
||||
</MkInput>
|
||||
<MkButton danger @click="del()"><Fa :icon="faTrashAlt"/> {{ $ts.delete }}</MkButton>
|
||||
<MkButton danger @click="del()"><i class="fas fa-trash-alt"></i> {{ $ts.delete }}</MkButton>
|
||||
</div>
|
||||
</XModalWindow>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faTrashAlt } from '@fortawesome/free-regular-svg-icons';
|
||||
import XModalWindow from '@client/components/ui/modal-window.vue';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import MkInput from '@client/components/ui/input.vue';
|
||||
|
@ -51,7 +50,6 @@ export default defineComponent({
|
|||
category: this.emoji.category,
|
||||
aliases: this.emoji.aliases?.join(' '),
|
||||
categories: [],
|
||||
faTrashAlt,
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
@ -9,8 +9,8 @@
|
|||
|
||||
<div class="_section">
|
||||
<div class="local" v-if="tab === 'local'">
|
||||
<MkButton primary @click="add" style="margin: 0 auto var(--margin) auto;"><Fa :icon="faPlus"/> {{ $ts.addEmoji }}</MkButton>
|
||||
<MkInput v-model:value="query" :debounce="true" type="search"><template #icon><Fa :icon="faSearch"/></template><span>{{ $ts.search }}</span></MkInput>
|
||||
<MkButton primary @click="add" style="margin: 0 auto var(--margin) auto;"><i class="fas fa-plus"></i> {{ $ts.addEmoji }}</MkButton>
|
||||
<MkInput v-model:value="query" :debounce="true" type="search"><template #icon><i class="fas fa-search"></i></template><span>{{ $ts.search }}</span></MkInput>
|
||||
<MkPagination :pagination="pagination" ref="emojis">
|
||||
<template #empty><span>{{ $ts.noCustomEmojis }}</span></template>
|
||||
<template #default="{items}">
|
||||
|
@ -28,7 +28,7 @@
|
|||
</div>
|
||||
|
||||
<div class="remote" v-else-if="tab === 'remote'">
|
||||
<MkInput v-model:value="queryRemote" :debounce="true" type="search"><template #icon><Fa :icon="faSearch"/></template><span>{{ $ts.search }}</span></MkInput>
|
||||
<MkInput v-model:value="queryRemote" :debounce="true" type="search"><template #icon><i class="fas fa-search"></i></template><span>{{ $ts.search }}</span></MkInput>
|
||||
<MkInput v-model:value="host" :debounce="true"><span>{{ $ts.host }}</span></MkInput>
|
||||
<MkPagination :pagination="remotePagination" ref="remoteEmojis">
|
||||
<template #empty><span>{{ $ts.noCustomEmojis }}</span></template>
|
||||
|
@ -51,8 +51,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent } from 'vue';
|
||||
import { faPlus, faSave, faSearch } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faTrashAlt, faLaugh } from '@fortawesome/free-regular-svg-icons';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import MkInput from '@client/components/ui/input.vue';
|
||||
import MkPagination from '@client/components/ui/pagination.vue';
|
||||
|
@ -73,9 +71,9 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.customEmojis,
|
||||
icon: faLaugh,
|
||||
icon: 'fas fa-laugh',
|
||||
action: {
|
||||
icon: faPlus,
|
||||
icon: 'fas fa-plus',
|
||||
handler: this.add
|
||||
}
|
||||
},
|
||||
|
@ -98,7 +96,6 @@ export default defineComponent({
|
|||
host: (this.host && this.host !== '') ? this.host : null
|
||||
}))
|
||||
},
|
||||
faTrashAlt, faPlus, faLaugh, faSave, faSearch,
|
||||
}
|
||||
},
|
||||
|
||||
|
@ -144,7 +141,7 @@ export default defineComponent({
|
|||
text: ':' + emoji.name + ':',
|
||||
}, {
|
||||
text: this.$ts.import,
|
||||
icon: faPlus,
|
||||
icon: 'fas fa-plus',
|
||||
action: () => { this.im(emoji) }
|
||||
}], ev.currentTarget || ev.target);
|
||||
}
|
||||
|
|
|
@ -42,14 +42,14 @@
|
|||
<div class="_content">
|
||||
<MkPagination :pagination="pagination" #default="{items}" ref="instances" :key="host + state">
|
||||
<div class="ppgwaixt _panel" v-for="instance in items" :key="instance.id" @click="info(instance)">
|
||||
<div class="host"><Fa :icon="faCircle" class="indicator" :class="getStatus(instance)"/><b>{{ instance.host }}</b></div>
|
||||
<div class="host"><i class="fas fa-circle indicator" :class="getStatus(instance)"></i><b>{{ instance.host }}</b></div>
|
||||
<div class="status">
|
||||
<span class="sub" v-if="instance.followersCount > 0"><Fa :icon="faCaretDown" class="icon"/>Sub</span>
|
||||
<span class="sub" v-else><Fa :icon="faCaretDown" class="icon"/>-</span>
|
||||
<span class="pub" v-if="instance.followingCount > 0"><Fa :icon="faCaretUp" class="icon"/>Pub</span>
|
||||
<span class="pub" v-else><Fa :icon="faCaretUp" class="icon"/>-</span>
|
||||
<span class="lastCommunicatedAt"><Fa :icon="faExchangeAlt" class="icon"/><MkTime :time="instance.lastCommunicatedAt"/></span>
|
||||
<span class="latestStatus"><Fa :icon="faTrafficLight" class="icon"/>{{ instance.latestStatus || '-' }}</span>
|
||||
<span class="sub" v-if="instance.followersCount > 0"><i class="fas fa-caret-down icon"></i>Sub</span>
|
||||
<span class="sub" v-else><i class="fas fa-caret-down icon"></i>-</span>
|
||||
<span class="pub" v-if="instance.followingCount > 0"><i class="fas fa-caret-up icon"></i>Pub</span>
|
||||
<span class="pub" v-else><i class="fas fa-caret-up icon"></i>-</span>
|
||||
<span class="lastCommunicatedAt"><i class="fas fa-exchange-alt icon"></i><MkTime :time="instance.lastCommunicatedAt"/></span>
|
||||
<span class="latestStatus"><i class="fas fa-traffic-light icon"></i>{{ instance.latestStatus || '-' }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</MkPagination>
|
||||
|
@ -60,7 +60,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faGlobe, faCircle, faExchangeAlt, faCaretDown, faCaretUp, faTrafficLight } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import MkInput from '@client/components/ui/input.vue';
|
||||
import MkSelect from '@client/components/ui/select.vue';
|
||||
|
@ -81,7 +80,7 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.federation,
|
||||
icon: faGlobe
|
||||
icon: 'fas fa-globe'
|
||||
},
|
||||
host: '',
|
||||
state: 'federating',
|
||||
|
@ -103,7 +102,6 @@ export default defineComponent({
|
|||
{})
|
||||
})
|
||||
},
|
||||
faGlobe, faCircle, faExchangeAlt, faCaretDown, faCaretUp, faTrafficLight
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
@ -21,8 +21,8 @@
|
|||
</div>
|
||||
<div class="_section">
|
||||
<div class="_content">
|
||||
<MkButton full @click="showUser"><Fa :icon="faExternalLinkSquareAlt"/> {{ $ts.user }}</MkButton>
|
||||
<MkButton full danger @click="del"><Fa :icon="faTrashAlt"/> {{ $ts.delete }}</MkButton>
|
||||
<MkButton full @click="showUser"><i class="fas fa-external-link-square-alt"></i> {{ $ts.user }}</MkButton>
|
||||
<MkButton full danger @click="del"><i class="fas fa-trash-alt"></i> {{ $ts.delete }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
<div class="_section" v-if="info">
|
||||
|
@ -36,8 +36,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent } from 'vue';
|
||||
import { faTimes, faBookmark, faKey, faSync, faMicrophoneSlash, faExternalLinkSquareAlt } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faSnowflake, faTrashAlt, faBookmark as farBookmark } from '@fortawesome/free-regular-svg-icons';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import MkSwitch from '@client/components/ui/switch.vue';
|
||||
import XModalWindow from '@client/components/ui/modal-window.vue';
|
||||
|
@ -67,7 +65,6 @@ export default defineComponent({
|
|||
file: null,
|
||||
info: null,
|
||||
isSensitive: false,
|
||||
faTimes, faBookmark, farBookmark, faKey, faSync, faMicrophoneSlash, faSnowflake, faTrashAlt, faExternalLinkSquareAlt
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -2,17 +2,17 @@
|
|||
<div class="xrmjdkdw">
|
||||
<div class="_section">
|
||||
<div class="_content">
|
||||
<MkButton primary @click="clear()"><Fa :icon="faTrashAlt"/> {{ $ts.clearCachedFiles }}</MkButton>
|
||||
<MkButton primary @click="clear()"><i class="fas fa-trash-alt"></i> {{ $ts.clearCachedFiles }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="_section lookup">
|
||||
<div class="_title"><Fa :icon="faSearch"/> {{ $ts.lookup }}</div>
|
||||
<div class="_title"><i class="fas fa-search"></i> {{ $ts.lookup }}</div>
|
||||
<div class="_content">
|
||||
<MkInput class="target" v-model:value="q" type="text" @enter="find()">
|
||||
<span>{{ $ts.fileIdOrUrl }}</span>
|
||||
</MkInput>
|
||||
<MkButton @click="find()" primary><Fa :icon="faSearch"/> {{ $ts.lookup }}</MkButton>
|
||||
<MkButton @click="find()" primary><i class="fas fa-search"></i> {{ $ts.lookup }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -62,8 +62,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faCloud, faSearch } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faTrashAlt } from '@fortawesome/free-regular-svg-icons';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import MkInput from '@client/components/ui/input.vue';
|
||||
import MkSelect from '@client/components/ui/select.vue';
|
||||
|
@ -86,7 +84,7 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.files,
|
||||
icon: faCloud
|
||||
icon: 'fas fa-cloud'
|
||||
},
|
||||
q: null,
|
||||
origin: 'local',
|
||||
|
@ -101,7 +99,6 @@ export default defineComponent({
|
|||
hostname: (this.hostname && this.hostname !== '') ? this.hostname : null,
|
||||
}),
|
||||
},
|
||||
faTrashAlt, faCloud, faSearch,
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
@ -1,15 +1,15 @@
|
|||
<template>
|
||||
<div>
|
||||
<MkFolder>
|
||||
<template #header><Fa :icon="faHeartbeat"/> {{ $ts.metrics }}</template>
|
||||
<template #header><i class="fas fa-heartbeat"></i> {{ $ts.metrics }}</template>
|
||||
<div class="_section" style="padding: 0 var(--margin);">
|
||||
<div class="_content">
|
||||
<MkContainer :foldable="false" class="_gap">
|
||||
<template #header><Fa :icon="faMicrochip"/>{{ $ts.cpuAndMemory }}</template>
|
||||
<template #header><i class="fas fa-microchip"></i>{{ $ts.cpuAndMemory }}</template>
|
||||
<!--
|
||||
<template #func>
|
||||
<button class="_button" @click="resume" :disabled="!paused"><Fa :icon="faPlay"/></button>
|
||||
<button class="_button" @click="pause" :disabled="paused"><Fa :icon="faPause"/></button>
|
||||
<button class="_button" @click="resume" :disabled="!paused"><i class="fas fa-play"></i></button>
|
||||
<button class="_button" @click="pause" :disabled="paused"><i class="fas fa-pause"></i></button>
|
||||
</template>
|
||||
-->
|
||||
|
||||
|
@ -28,11 +28,11 @@
|
|||
</MkContainer>
|
||||
|
||||
<MkContainer :foldable="false" class="_gap">
|
||||
<template #header><Fa :icon="faHdd"/> {{ $ts.disk }}</template>
|
||||
<template #header><i class="fas fa-hdd"></i> {{ $ts.disk }}</template>
|
||||
<!--
|
||||
<template #func>
|
||||
<button class="_button" @click="resume" :disabled="!paused"><Fa :icon="faPlay"/></button>
|
||||
<button class="_button" @click="pause" :disabled="paused"><Fa :icon="faPause"/></button>
|
||||
<button class="_button" @click="resume" :disabled="!paused"><i class="fas fa-play"></i></button>
|
||||
<button class="_button" @click="pause" :disabled="paused"><i class="fas fa-pause"></i></button>
|
||||
</template>
|
||||
-->
|
||||
|
||||
|
@ -51,11 +51,11 @@
|
|||
</MkContainer>
|
||||
|
||||
<MkContainer :foldable="false" class="_gap">
|
||||
<template #header><Fa :icon="faExchangeAlt"/> {{ $ts.network }}</template>
|
||||
<template #header><i class="fas fa-exchange-alt"></i> {{ $ts.network }}</template>
|
||||
<!--
|
||||
<template #func>
|
||||
<button class="_button" @click="resume" :disabled="!paused"><Fa :icon="faPlay"/></button>
|
||||
<button class="_button" @click="pause" :disabled="paused"><Fa :icon="faPause"/></button>
|
||||
<button class="_button" @click="resume" :disabled="!paused"><i class="fas fa-play"></i></button>
|
||||
<button class="_button" @click="pause" :disabled="paused"><i class="fas fa-pause"></i></button>
|
||||
</template>
|
||||
-->
|
||||
|
||||
|
@ -75,11 +75,11 @@
|
|||
</MkFolder>
|
||||
|
||||
<MkFolder>
|
||||
<template #header><Fa :icon="faClipboardList"/> {{ $ts.jobQueue }}</template>
|
||||
<template #header><i class="fas fa-clipboard-list"></i> {{ $ts.jobQueue }}</template>
|
||||
|
||||
<div class="vkyrmkwb" :style="{ gridTemplateRows: queueHeight }">
|
||||
<MkContainer :foldable="false" :scrollable="true" :resize-base-el="() => $el">
|
||||
<template #header><Fa :icon="faExclamationTriangle"/> {{ $ts.delayed }}</template>
|
||||
<template #header><i class="fas fa-exclamation-triangle"></i> {{ $ts.delayed }}</template>
|
||||
|
||||
<div class="_content">
|
||||
<div class="_keyValue" v-for="job in jobs" :key="job[0]">
|
||||
|
@ -89,10 +89,10 @@
|
|||
</div>
|
||||
</MkContainer>
|
||||
<XQueue :connection="queueConnection" domain="inbox" ref="queue" class="queue">
|
||||
<template #title><Fa :icon="faExchangeAlt"/> In</template>
|
||||
<template #title><i class="fas fa-exchange-alt"></i> In</template>
|
||||
</XQueue>
|
||||
<XQueue :connection="queueConnection" domain="deliver" class="queue">
|
||||
<template #title><Fa :icon="faExchangeAlt"/> Out</template>
|
||||
<template #title><i class="fas fa-exchange-alt"></i> Out</template>
|
||||
</XQueue>
|
||||
</div>
|
||||
</MkFolder>
|
||||
|
@ -101,7 +101,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent, markRaw } from 'vue';
|
||||
import { faPlay, faPause, faDatabase, faServer, faExchangeAlt, faMicrochip, faHdd, faStream, faTrashAlt, faInfoCircle, faExclamationTriangle, faTachometerAlt, faHeartbeat, faClipboardList } from '@fortawesome/free-solid-svg-icons';
|
||||
import Chart from 'chart.js';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import MkSelect from '@client/components/ui/select.vue';
|
||||
|
@ -153,7 +152,6 @@ export default defineComponent({
|
|||
overviewHeight: '1fr',
|
||||
queueHeight: '1fr',
|
||||
paused: false,
|
||||
faPlay, faPause, faDatabase, faServer, faExchangeAlt, faMicrochip, faHdd, faStream, faTrashAlt, faInfoCircle, faExclamationTriangle, faTachometerAlt, faHeartbeat, faClipboardList,
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
@ -1,13 +1,13 @@
|
|||
<template>
|
||||
<div v-if="meta" v-show="page === 'index'" class="xhexznfu _section">
|
||||
<MkFolder>
|
||||
<template #header><Fa :icon="faTachometerAlt"/> {{ $ts.overview }}</template>
|
||||
<template #header><i class="fas fa-tachometer-alt"></i> {{ $ts.overview }}</template>
|
||||
|
||||
<div class="sboqnrfi" :style="{ gridTemplateRows: overviewHeight }">
|
||||
<MkInstanceStats :chart-limit="300" :detailed="true" class="_gap" ref="stats"/>
|
||||
|
||||
<MkContainer :foldable="true" class="_gap">
|
||||
<template #header><Fa :icon="faInfoCircle"/>{{ $ts.instanceInfo }}</template>
|
||||
<template #header><i class="fas fa-info-circle"></i>{{ $ts.instanceInfo }}</template>
|
||||
|
||||
<div class="_content">
|
||||
<div class="_keyValue"><b>Misskey</b><span>v{{ version }}</span></div>
|
||||
|
@ -20,7 +20,7 @@
|
|||
</MkContainer>
|
||||
|
||||
<MkContainer :foldable="true" :scrollable="true" class="_gap" style="height: 300px;">
|
||||
<template #header><Fa :icon="faDatabase"/>{{ $ts.database }}</template>
|
||||
<template #header><i class="fas fa-database"></i>{{ $ts.database }}</template>
|
||||
|
||||
<div class="_content" v-if="dbInfo">
|
||||
<table style="border-collapse: collapse; width: 100%;">
|
||||
|
@ -42,7 +42,7 @@
|
|||
</div>
|
||||
<div v-if="page === 'logs'" class="_section">
|
||||
<MkFolder>
|
||||
<template #header><Fa :icon="faStream"/> {{ $ts.logs }}</template>
|
||||
<template #header><i class="fas fa-stream"></i> {{ $ts.logs }}</template>
|
||||
|
||||
<div class="_keyValue" v-for="log in modLogs">
|
||||
<b>{{ log.type }}</b><span>by {{ log.user.username }}</span><MkTime :time="log.createdAt" style="opacity: 0.7;"/>
|
||||
|
@ -56,7 +56,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent, markRaw } from 'vue';
|
||||
import { faPlay, faPause, faDatabase, faServer, faExchangeAlt, faMicrochip, faHdd, faStream, faTrashAlt, faInfoCircle, faExclamationTriangle, faTachometerAlt, faHeartbeat, faClipboardList } from '@fortawesome/free-solid-svg-icons';
|
||||
import VueJsonPretty from 'vue-json-pretty';
|
||||
import MkInstanceStats from '@client/components/instance-stats.vue';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
|
@ -91,21 +90,21 @@ export default defineComponent({
|
|||
id: 'index',
|
||||
title: null,
|
||||
tooltip: this.$ts.instance,
|
||||
icon: faServer,
|
||||
icon: 'fas fa-server',
|
||||
onClick: () => { this.page = 'index'; },
|
||||
selected: computed(() => this.page === 'index')
|
||||
}, {
|
||||
id: 'metrics',
|
||||
title: null,
|
||||
tooltip: this.$ts.metrics,
|
||||
icon: faHeartbeat,
|
||||
icon: 'fas fa-heartbeat',
|
||||
onClick: () => { this.page = 'metrics'; },
|
||||
selected: computed(() => this.page === 'metrics')
|
||||
}, {
|
||||
id: 'logs',
|
||||
title: null,
|
||||
tooltip: this.$ts.logs,
|
||||
icon: faStream,
|
||||
icon: 'fas fa-stream',
|
||||
onClick: () => { this.page = 'logs'; },
|
||||
selected: computed(() => this.page === 'logs')
|
||||
}]
|
||||
|
@ -117,7 +116,6 @@ export default defineComponent({
|
|||
serverInfo: null,
|
||||
modLogs: [],
|
||||
dbInfo: null,
|
||||
faPlay, faPause, faDatabase, faServer, faExchangeAlt, faMicrochip, faHdd, faStream, faTrashAlt, faInfoCircle, faExclamationTriangle, faTachometerAlt, faHeartbeat, faClipboardList,
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
@ -106,11 +106,11 @@
|
|||
<MkSwitch :value="isBlocked" class="switch" @update:value="changeBlock">{{ $ts.blockThisInstance }}</MkSwitch>
|
||||
<details>
|
||||
<summary>{{ $ts.deleteAllFiles }}</summary>
|
||||
<MkButton @click="deleteAllFiles()" style="margin: 0.5em 0 0.5em 0;"><Fa :icon="faTrashAlt"/> {{ $ts.deleteAllFiles }}</MkButton>
|
||||
<MkButton @click="deleteAllFiles()" style="margin: 0.5em 0 0.5em 0;"><i class="fas fa-trash-alt"></i> {{ $ts.deleteAllFiles }}</MkButton>
|
||||
</details>
|
||||
<details>
|
||||
<summary>{{ $ts.removeAllFollowing }}</summary>
|
||||
<MkButton @click="removeAllFollowing()" style="margin: 0.5em 0 0.5em 0;"><Fa :icon="faMinusCircle"/> {{ $ts.removeAllFollowing }}</MkButton>
|
||||
<MkButton @click="removeAllFollowing()" style="margin: 0.5em 0 0.5em 0;"><i class="fas fa-minus-circle"></i> {{ $ts.removeAllFollowing }}</MkButton>
|
||||
<MkInfo warn>{{ $t('removeAllFollowingDescription', { host: instance.host }) }}</MkInfo>
|
||||
</details>
|
||||
</div>
|
||||
|
@ -125,7 +125,6 @@
|
|||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import Chart from 'chart.js';
|
||||
import { faTimes, faCrosshairs, faCloudDownloadAlt, faCloudUploadAlt, faUsers, faPencilAlt, faFileImage, faDatabase, faTrafficLight, faLongArrowAltUp, faLongArrowAltDown, faMinusCircle, faTrashAlt } from '@fortawesome/free-solid-svg-icons';
|
||||
import XModalWindow from '@client/components/ui/modal-window.vue';
|
||||
import MkUsersDialog from '@client/components/users-dialog.vue';
|
||||
import MkSelect from '@client/components/ui/select.vue';
|
||||
|
@ -174,7 +173,6 @@ export default defineComponent({
|
|||
chartInstance: null,
|
||||
chartSrc: 'requests',
|
||||
chartSpan: 'hour',
|
||||
faTimes, faCrosshairs, faCloudDownloadAlt, faCloudUploadAlt, faUsers, faPencilAlt, faFileImage, faDatabase, faTrafficLight, faLongArrowAltUp, faLongArrowAltDown, faMinusCircle, faTrashAlt
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -24,14 +24,12 @@
|
|||
</code>
|
||||
</div>
|
||||
|
||||
<MkButton @click="deleteAllLogs()" primary><Fa :icon="faTrashAlt"/> {{ $ts.deleteAll }}</MkButton>
|
||||
<MkButton @click="deleteAllLogs()" primary><i class="fas fa-trash-alt"></i> {{ $ts.deleteAll }}</MkButton>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faStream } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faTrashAlt } from '@fortawesome/free-regular-svg-icons';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import MkInput from '@client/components/ui/input.vue';
|
||||
import MkSelect from '@client/components/ui/select.vue';
|
||||
|
@ -51,12 +49,11 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.serverLogs,
|
||||
icon: faStream
|
||||
icon: 'fas fa-stream'
|
||||
},
|
||||
logs: [],
|
||||
logLevel: 'all',
|
||||
logDomain: '',
|
||||
faTrashAlt,
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
@ -1,14 +1,14 @@
|
|||
<template>
|
||||
<div>
|
||||
<XQueue :connection="connection" domain="inbox">
|
||||
<template #title><Fa :icon="faExchangeAlt"/> In</template>
|
||||
<template #title><i class="fas fa-exchange-alt"></i> In</template>
|
||||
</XQueue>
|
||||
<XQueue :connection="connection" domain="deliver">
|
||||
<template #title><Fa :icon="faExchangeAlt"/> Out</template>
|
||||
<template #title><i class="fas fa-exchange-alt"></i> Out</template>
|
||||
</XQueue>
|
||||
<section class="_section">
|
||||
<div class="_content">
|
||||
<MkButton @click="clear()"><Fa :icon="faTrashAlt"/> {{ $ts.clearQueue }}</MkButton>
|
||||
<MkButton @click="clear()"><i class="fas fa-trash-alt"></i> {{ $ts.clearQueue }}</MkButton>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
@ -16,8 +16,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faExchangeAlt } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faTrashAlt } from '@fortawesome/free-regular-svg-icons';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import XQueue from './queue.chart.vue';
|
||||
import * as os from '@client/os';
|
||||
|
@ -33,10 +31,9 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.jobQueue,
|
||||
icon: faExchangeAlt,
|
||||
icon: 'fas fa-exchange-alt',
|
||||
},
|
||||
connection: os.stream.useSharedConnection('queueStats'),
|
||||
faExchangeAlt, faTrashAlt
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
@ -1,21 +1,21 @@
|
|||
<template>
|
||||
<div class="relaycxt">
|
||||
<section class="_section add">
|
||||
<div class="_title"><Fa :icon="faPlus"/> {{ $ts.addRelay }}</div>
|
||||
<div class="_title"><i class="fas fa-plus"></i> {{ $ts.addRelay }}</div>
|
||||
<div class="_content">
|
||||
<MkInput v-model:value="inbox">
|
||||
<span>{{ $ts.inboxUrl }}</span>
|
||||
</MkInput>
|
||||
<MkButton @click="add(inbox)" primary><Fa :icon="faPlus"/> {{ $ts.add }}</MkButton>
|
||||
<MkButton @click="add(inbox)" primary><i class="fas fa-plus"></i> {{ $ts.add }}</MkButton>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="_section relays">
|
||||
<div class="_title"><Fa :icon="faProjectDiagram"/> {{ $ts.addedRelays }}</div>
|
||||
<div class="_title"><i class="fas fa-project-diagram"></i> {{ $ts.addedRelays }}</div>
|
||||
<div class="_content relay" v-for="relay in relays" :key="relay.inbox">
|
||||
<div>{{ relay.inbox }}</div>
|
||||
<div>{{ $t(`_relayStatus.${relay.status}`) }}</div>
|
||||
<MkButton class="button" inline @click="remove(relay.inbox)"><Fa :icon="faTrashAlt"/> {{ $ts.remove }}</MkButton>
|
||||
<MkButton class="button" inline @click="remove(relay.inbox)"><i class="fas fa-trash-alt"></i> {{ $ts.remove }}</MkButton>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
@ -23,8 +23,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faPlus, faProjectDiagram } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faSave, faTrashAlt } from '@fortawesome/free-regular-svg-icons';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import MkInput from '@client/components/ui/input.vue';
|
||||
import * as os from '@client/os';
|
||||
|
@ -40,11 +38,10 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.relays,
|
||||
icon: faProjectDiagram,
|
||||
icon: 'fas fa-project-diagram',
|
||||
},
|
||||
relays: [],
|
||||
inbox: '',
|
||||
faPlus, faProjectDiagram, faSave, faTrashAlt
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
@ -1,20 +1,20 @@
|
|||
<template>
|
||||
<div v-if="meta" class="_section">
|
||||
<section class="_card _gap">
|
||||
<div class="_title"><Fa :icon="faInfoCircle"/> {{ $ts.basicInfo }}</div>
|
||||
<div class="_title"><i class="fas fa-info-circle"></i> {{ $ts.basicInfo }}</div>
|
||||
<div class="_content">
|
||||
<MkInput v-model:value="name">{{ $ts.instanceName }}</MkInput>
|
||||
<MkTextarea v-model:value="description">{{ $ts.instanceDescription }}</MkTextarea>
|
||||
<MkInput v-model:value="iconUrl"><template #icon><Fa :icon="faLink"/></template>{{ $ts.iconUrl }}</MkInput>
|
||||
<MkInput v-model:value="bannerUrl"><template #icon><Fa :icon="faLink"/></template>{{ $ts.bannerUrl }}</MkInput>
|
||||
<MkInput v-model:value="backgroundImageUrl"><template #icon><Fa :icon="faLink"/></template>{{ $ts.backgroundImageUrl }}</MkInput>
|
||||
<MkInput v-model:value="logoImageUrl"><template #icon><Fa :icon="faLink"/></template>{{ $ts.logoImageUrl }}</MkInput>
|
||||
<MkInput v-model:value="tosUrl"><template #icon><Fa :icon="faLink"/></template>{{ $ts.tosUrl }}</MkInput>
|
||||
<MkInput v-model:value="iconUrl"><template #icon><i class="fas fa-link"></i></template>{{ $ts.iconUrl }}</MkInput>
|
||||
<MkInput v-model:value="bannerUrl"><template #icon><i class="fas fa-link"></i></template>{{ $ts.bannerUrl }}</MkInput>
|
||||
<MkInput v-model:value="backgroundImageUrl"><template #icon><i class="fas fa-link"></i></template>{{ $ts.backgroundImageUrl }}</MkInput>
|
||||
<MkInput v-model:value="logoImageUrl"><template #icon><i class="fas fa-link"></i></template>{{ $ts.logoImageUrl }}</MkInput>
|
||||
<MkInput v-model:value="tosUrl"><template #icon><i class="fas fa-link"></i></template>{{ $ts.tosUrl }}</MkInput>
|
||||
<MkInput v-model:value="maintainerName">{{ $ts.maintainerName }}</MkInput>
|
||||
<MkInput v-model:value="maintainerEmail" type="email"><template #icon><Fa :icon="faEnvelope"/></template>{{ $ts.maintainerEmail }}</MkInput>
|
||||
<MkInput v-model:value="maintainerEmail" type="email"><template #icon><i class="fas fa-envelope"></i></template>{{ $ts.maintainerEmail }}</MkInput>
|
||||
</div>
|
||||
<div class="_footer">
|
||||
<MkButton primary @click="save(true)"><Fa :icon="faSave"/> {{ $ts.save }}</MkButton>
|
||||
<MkButton primary @click="save(true)"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
@ -22,7 +22,7 @@
|
|||
|
||||
<section class="_card _gap">
|
||||
<div class="_content">
|
||||
<MkInput v-model:value="maxNoteTextLength" type="number" :save="() => save()"><template #icon><Fa :icon="faPencilAlt"/></template>{{ $ts.maxNoteTextLength }}</MkInput>
|
||||
<MkInput v-model:value="maxNoteTextLength" type="number" :save="() => save()"><template #icon><i class="fas fa-pencil-alt"></i></template>{{ $ts.maxNoteTextLength }}</MkInput>
|
||||
</div>
|
||||
<div class="_content">
|
||||
<MkSwitch v-model:value="enableLocalTimeline" @update:value="save()">{{ $ts.enableLocalTimeline }}</MkSwitch>
|
||||
|
@ -35,7 +35,7 @@
|
|||
</section>
|
||||
|
||||
<section class="_card _gap">
|
||||
<div class="_title"><Fa :icon="faUser"/> {{ $ts.registration }}</div>
|
||||
<div class="_title"><i class="fas fa-user"></i> {{ $ts.registration }}</div>
|
||||
<div class="_content">
|
||||
<MkSwitch v-model:value="enableRegistration" @update:value="save()">{{ $ts.enableRegistration }}</MkSwitch>
|
||||
<MkButton v-if="!enableRegistration" @click="invite">{{ $ts.invite }}</MkButton>
|
||||
|
@ -43,12 +43,12 @@
|
|||
</section>
|
||||
|
||||
<section class="_card _gap">
|
||||
<div class="_title"><Fa :icon="faShieldAlt"/> {{ $ts.hcaptcha }}</div>
|
||||
<div class="_title"><i class="fas fa-shield-alt"></i> {{ $ts.hcaptcha }}</div>
|
||||
<div class="_content">
|
||||
<MkSwitch v-model:value="enableHcaptcha">{{ $ts.enableHcaptcha }}</MkSwitch>
|
||||
<template v-if="enableHcaptcha">
|
||||
<MkInput v-model:value="hcaptchaSiteKey" :disabled="!enableHcaptcha"><template #icon><Fa :icon="faKey"/></template>{{ $ts.hcaptchaSiteKey }}</MkInput>
|
||||
<MkInput v-model:value="hcaptchaSecretKey" :disabled="!enableHcaptcha"><template #icon><Fa :icon="faKey"/></template>{{ $ts.hcaptchaSecretKey }}</MkInput>
|
||||
<MkInput v-model:value="hcaptchaSiteKey" :disabled="!enableHcaptcha"><template #icon><i class="fas fa-key"></i></template>{{ $ts.hcaptchaSiteKey }}</MkInput>
|
||||
<MkInput v-model:value="hcaptchaSecretKey" :disabled="!enableHcaptcha"><template #icon><i class="fas fa-key"></i></template>{{ $ts.hcaptchaSecretKey }}</MkInput>
|
||||
</template>
|
||||
</div>
|
||||
<div class="_content" v-if="enableHcaptcha">
|
||||
|
@ -56,17 +56,17 @@
|
|||
<captcha v-if="enableHcaptcha" provider="hcaptcha" :sitekey="hcaptchaSiteKey || '10000000-ffff-ffff-ffff-000000000001'"/>
|
||||
</div>
|
||||
<div class="_footer">
|
||||
<MkButton primary @click="save(true)"><Fa :icon="faSave"/> {{ $ts.save }}</MkButton>
|
||||
<MkButton primary @click="save(true)"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="_card _gap">
|
||||
<div class="_title"><Fa :icon="faShieldAlt"/> {{ $ts.recaptcha }}</div>
|
||||
<div class="_title"><i class="fas fa-shield-alt"></i> {{ $ts.recaptcha }}</div>
|
||||
<div class="_content">
|
||||
<MkSwitch v-model:value="enableRecaptcha" ref="enableRecaptcha">{{ $ts.enableRecaptcha }}</MkSwitch>
|
||||
<template v-if="enableRecaptcha">
|
||||
<MkInput v-model:value="recaptchaSiteKey" :disabled="!enableRecaptcha"><template #icon><Fa :icon="faKey"/></template>{{ $ts.recaptchaSiteKey }}</MkInput>
|
||||
<MkInput v-model:value="recaptchaSecretKey" :disabled="!enableRecaptcha"><template #icon><Fa :icon="faKey"/></template>{{ $ts.recaptchaSecretKey }}</MkInput>
|
||||
<MkInput v-model:value="recaptchaSiteKey" :disabled="!enableRecaptcha"><template #icon><i class="fas fa-key"></i></template>{{ $ts.recaptchaSiteKey }}</MkInput>
|
||||
<MkInput v-model:value="recaptchaSecretKey" :disabled="!enableRecaptcha"><template #icon><i class="fas fa-key"></i></template>{{ $ts.recaptchaSecretKey }}</MkInput>
|
||||
</template>
|
||||
</div>
|
||||
<div class="_content" v-if="enableRecaptcha && recaptchaSiteKey">
|
||||
|
@ -74,12 +74,12 @@
|
|||
<captcha v-if="enableRecaptcha" provider="grecaptcha" :sitekey="recaptchaSiteKey"/>
|
||||
</div>
|
||||
<div class="_footer">
|
||||
<MkButton primary @click="save(true)"><Fa :icon="faSave"/> {{ $ts.save }}</MkButton>
|
||||
<MkButton primary @click="save(true)"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="_card _gap">
|
||||
<div class="_title"><Fa :icon="faEnvelope" /> {{ $ts.emailConfig }}</div>
|
||||
<div class="_title"><i class="fas fa-envelope"></i> {{ $ts.emailConfig }}</div>
|
||||
<div class="_content">
|
||||
<MkSwitch v-model:value="enableEmail" @update:value="save()">{{ $ts.enableEmail }}<template #desc>{{ $ts.emailConfigInfo }}</template></MkSwitch>
|
||||
<MkInput v-model:value="email" type="email" :disabled="!enableEmail">{{ $ts.email }}</MkInput>
|
||||
|
@ -95,54 +95,54 @@
|
|||
<MkInfo>{{ $ts.emptyToDisableSmtpAuth }}</MkInfo>
|
||||
<MkSwitch v-model:value="smtpSecure" :disabled="!enableEmail">{{ $ts.smtpSecure }}<template #desc>{{ $ts.smtpSecureInfo }}</template></MkSwitch>
|
||||
<div>
|
||||
<MkButton :disabled="!enableEmail" primary inline @click="save(true)"><Fa :icon="faSave"/> {{ $ts.save }}</MkButton>
|
||||
<MkButton :disabled="!enableEmail" primary inline @click="save(true)"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
|
||||
<MkButton :disabled="!enableEmail" inline @click="testEmail()">{{ $ts.testEmail }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="_card _gap">
|
||||
<div class="_title"><Fa :icon="faBolt"/> {{ $ts.serviceworker }}</div>
|
||||
<div class="_title"><i class="fas fa-bolt"></i> {{ $ts.serviceworker }}</div>
|
||||
<div class="_content">
|
||||
<MkSwitch v-model:value="enableServiceWorker">{{ $ts.enableServiceworker }}<template #desc>{{ $ts.serviceworkerInfo }}</template></MkSwitch>
|
||||
<template v-if="enableServiceWorker">
|
||||
<div class="_inputs">
|
||||
<MkInput v-model:value="swPublicKey" :disabled="!enableServiceWorker"><template #icon><Fa :icon="faKey"/></template>Public key</MkInput>
|
||||
<MkInput v-model:value="swPrivateKey" :disabled="!enableServiceWorker"><template #icon><Fa :icon="faKey"/></template>Private key</MkInput>
|
||||
<MkInput v-model:value="swPublicKey" :disabled="!enableServiceWorker"><template #icon><i class="fas fa-key"></i></template>Public key</MkInput>
|
||||
<MkInput v-model:value="swPrivateKey" :disabled="!enableServiceWorker"><template #icon><i class="fas fa-key"></i></template>Private key</MkInput>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
<div class="_footer">
|
||||
<MkButton primary @click="save(true)"><Fa :icon="faSave"/> {{ $ts.save }}</MkButton>
|
||||
<MkButton primary @click="save(true)"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="_card _gap">
|
||||
<div class="_title"><Fa :icon="faThumbtack"/> {{ $ts.pinnedUsers }}</div>
|
||||
<div class="_title"><i class="fas fa-thumbtack"></i> {{ $ts.pinnedUsers }}</div>
|
||||
<div class="_content">
|
||||
<MkTextarea v-model:value="pinnedUsers">
|
||||
<template #desc>{{ $ts.pinnedUsersDescription }} <button class="_textButton" @click="addPinUser">{{ $ts.addUser }}</button></template>
|
||||
</MkTextarea>
|
||||
</div>
|
||||
<div class="_footer">
|
||||
<MkButton primary @click="save(true)"><Fa :icon="faSave"/> {{ $ts.save }}</MkButton>
|
||||
<MkButton primary @click="save(true)"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="_card _gap">
|
||||
<div class="_title"><Fa :icon="faThumbtack"/> {{ $ts.pinnedPages }}</div>
|
||||
<div class="_title"><i class="fas fa-thumbtack"></i> {{ $ts.pinnedPages }}</div>
|
||||
<div class="_content">
|
||||
<MkTextarea v-model:value="pinnedPages">
|
||||
<template #desc>{{ $ts.pinnedPagesDescription }}</template>
|
||||
</MkTextarea>
|
||||
</div>
|
||||
<div class="_footer">
|
||||
<MkButton primary @click="save(true)"><Fa :icon="faSave"/> {{ $ts.save }}</MkButton>
|
||||
<MkButton primary @click="save(true)"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="_card _gap">
|
||||
<div class="_title"><Fa :icon="faCloud"/> {{ $ts.files }}</div>
|
||||
<div class="_title"><i class="fas fa-cloud"></i> {{ $ts.files }}</div>
|
||||
<div class="_content">
|
||||
<MkSwitch v-model:value="cacheRemoteFiles">{{ $ts.cacheRemoteFiles }}<template #desc>{{ $ts.cacheRemoteFilesDescription }}</template></MkSwitch>
|
||||
<MkSwitch v-model:value="proxyRemoteFiles">{{ $ts.proxyRemoteFiles }}<template #desc>{{ $ts.proxyRemoteFilesDescription }}</template></MkSwitch>
|
||||
|
@ -150,12 +150,12 @@
|
|||
<MkInput v-model:value="remoteDriveCapacityMb" type="number" :disabled="!cacheRemoteFiles">{{ $ts.driveCapacityPerRemoteAccount }}<template #suffix>MB</template><template #desc>{{ $ts.inMb }}</template></MkInput>
|
||||
</div>
|
||||
<div class="_footer">
|
||||
<MkButton primary @click="save(true)"><Fa :icon="faSave"/> {{ $ts.save }}</MkButton>
|
||||
<MkButton primary @click="save(true)"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="_card _gap">
|
||||
<div class="_title"><Fa :icon="faCloud"/> {{ $ts.objectStorage }}</div>
|
||||
<div class="_title"><i class="fas fa-cloud"></i> {{ $ts.objectStorage }}</div>
|
||||
<div class="_content">
|
||||
<MkSwitch v-model:value="useObjectStorage">{{ $ts.useObjectStorage }}</MkSwitch>
|
||||
<template v-if="useObjectStorage">
|
||||
|
@ -169,8 +169,8 @@
|
|||
<MkInput v-model:value="objectStorageRegion" :disabled="!useObjectStorage">{{ $ts.objectStorageRegion }}<template #desc>{{ $ts.objectStorageRegionDesc }}</template></MkInput>
|
||||
</div>
|
||||
<div class="_inputs">
|
||||
<MkInput v-model:value="objectStorageAccessKey" :disabled="!useObjectStorage"><template #icon><Fa :icon="faKey"/></template>Access key</MkInput>
|
||||
<MkInput v-model:value="objectStorageSecretKey" :disabled="!useObjectStorage"><template #icon><Fa :icon="faKey"/></template>Secret key</MkInput>
|
||||
<MkInput v-model:value="objectStorageAccessKey" :disabled="!useObjectStorage"><template #icon><i class="fas fa-key"></i></template>Access key</MkInput>
|
||||
<MkInput v-model:value="objectStorageSecretKey" :disabled="!useObjectStorage"><template #icon><i class="fas fa-key"></i></template>Secret key</MkInput>
|
||||
</div>
|
||||
<MkSwitch v-model:value="objectStorageUseSSL" :disabled="!useObjectStorage">{{ $ts.objectStorageUseSSL }}<template #desc>{{ $ts.objectStorageUseSSLDesc }}</template></MkSwitch>
|
||||
<MkSwitch v-model:value="objectStorageUseProxy" :disabled="!useObjectStorage">{{ $ts.objectStorageUseProxy }}<template #desc>{{ $ts.objectStorageUseProxyDesc }}</template></MkSwitch>
|
||||
|
@ -179,12 +179,12 @@
|
|||
</template>
|
||||
</div>
|
||||
<div class="_footer">
|
||||
<MkButton primary @click="save(true)"><Fa :icon="faSave"/> {{ $ts.save }}</MkButton>
|
||||
<MkButton primary @click="save(true)"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="_card _gap">
|
||||
<div class="_title"><Fa :icon="faGhost"/> {{ $ts.proxyAccount }}</div>
|
||||
<div class="_title"><i class="fas fa-ghost"></i> {{ $ts.proxyAccount }}</div>
|
||||
<div class="_content">
|
||||
<MkInput :value="proxyAccount ? proxyAccount.username : null" disabled><template #prefix>@</template>{{ $ts.proxyAccount }}<template #desc>{{ $ts.proxyAccountDescription }}</template></MkInput>
|
||||
<MkButton primary @click="chooseProxyAccount">{{ $ts.chooseProxyAccount }}</MkButton>
|
||||
|
@ -192,56 +192,56 @@
|
|||
</section>
|
||||
|
||||
<section class="_card _gap">
|
||||
<div class="_title"><Fa :icon="faBan"/> {{ $ts.blockedInstances }}</div>
|
||||
<div class="_title"><i class="fas fa-ban"></i> {{ $ts.blockedInstances }}</div>
|
||||
<div class="_content">
|
||||
<MkTextarea v-model:value="blockedHosts">
|
||||
<template #desc>{{ $ts.blockedInstancesDescription }}</template>
|
||||
</MkTextarea>
|
||||
</div>
|
||||
<div class="_footer">
|
||||
<MkButton primary @click="save(true)"><Fa :icon="faSave"/> {{ $ts.save }}</MkButton>
|
||||
<MkButton primary @click="save(true)"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="_card _gap">
|
||||
<div class="_title"><Fa :icon="faShareAlt"/> {{ $ts.integration }}</div>
|
||||
<div class="_title"><i class="fas fa-share-alt"></i> {{ $ts.integration }}</div>
|
||||
<div class="_content">
|
||||
<header><Fa :icon="faTwitter"/> Twitter</header>
|
||||
<header><i class="fab fa-twitter"></i> Twitter</header>
|
||||
<MkSwitch v-model:value="enableTwitterIntegration">{{ $ts.enable }}</MkSwitch>
|
||||
<template v-if="enableTwitterIntegration">
|
||||
<MkInfo>Callback URL: {{ `${url}/api/tw/cb` }}</MkInfo>
|
||||
<MkInput v-model:value="twitterConsumerKey" :disabled="!enableTwitterIntegration"><template #icon><Fa :icon="faKey"/></template>Consumer Key</MkInput>
|
||||
<MkInput v-model:value="twitterConsumerSecret" :disabled="!enableTwitterIntegration"><template #icon><Fa :icon="faKey"/></template>Consumer Secret</MkInput>
|
||||
<MkInput v-model:value="twitterConsumerKey" :disabled="!enableTwitterIntegration"><template #icon><i class="fas fa-key"></i></template>Consumer Key</MkInput>
|
||||
<MkInput v-model:value="twitterConsumerSecret" :disabled="!enableTwitterIntegration"><template #icon><i class="fas fa-key"></i></template>Consumer Secret</MkInput>
|
||||
</template>
|
||||
</div>
|
||||
<div class="_content">
|
||||
<header><Fa :icon="faGithub"/> GitHub</header>
|
||||
<header><i class="fas fa-github"></i> GitHub</header>
|
||||
<MkSwitch v-model:value="enableGithubIntegration">{{ $ts.enable }}</MkSwitch>
|
||||
<template v-if="enableGithubIntegration">
|
||||
<MkInfo>Callback URL: {{ `${url}/api/gh/cb` }}</MkInfo>
|
||||
<MkInput v-model:value="githubClientId" :disabled="!enableGithubIntegration"><template #icon><Fa :icon="faKey"/></template>Client ID</MkInput>
|
||||
<MkInput v-model:value="githubClientSecret" :disabled="!enableGithubIntegration"><template #icon><Fa :icon="faKey"/></template>Client Secret</MkInput>
|
||||
<MkInput v-model:value="githubClientId" :disabled="!enableGithubIntegration"><template #icon><i class="fas fa-key"></i></template>Client ID</MkInput>
|
||||
<MkInput v-model:value="githubClientSecret" :disabled="!enableGithubIntegration"><template #icon><i class="fas fa-key"></i></template>Client Secret</MkInput>
|
||||
</template>
|
||||
</div>
|
||||
<div class="_content">
|
||||
<header><Fa :icon="faDiscord"/> Discord</header>
|
||||
<header><i class="fas fa-discord"></i> Discord</header>
|
||||
<MkSwitch v-model:value="enableDiscordIntegration">{{ $ts.enable }}</MkSwitch>
|
||||
<template v-if="enableDiscordIntegration">
|
||||
<MkInfo>Callback URL: {{ `${url}/api/dc/cb` }}</MkInfo>
|
||||
<MkInput v-model:value="discordClientId" :disabled="!enableDiscordIntegration"><template #icon><Fa :icon="faKey"/></template>Client ID</MkInput>
|
||||
<MkInput v-model:value="discordClientSecret" :disabled="!enableDiscordIntegration"><template #icon><Fa :icon="faKey"/></template>Client Secret</MkInput>
|
||||
<MkInput v-model:value="discordClientId" :disabled="!enableDiscordIntegration"><template #icon><i class="fas fa-key"></i></template>Client ID</MkInput>
|
||||
<MkInput v-model:value="discordClientSecret" :disabled="!enableDiscordIntegration"><template #icon><i class="fas fa-key"></i></template>Client Secret</MkInput>
|
||||
</template>
|
||||
</div>
|
||||
<div class="_footer">
|
||||
<MkButton primary @click="save(true)"><Fa :icon="faSave"/> {{ $ts.save }}</MkButton>
|
||||
<MkButton primary @click="save(true)"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="_card _gap">
|
||||
<div class="_title"><Fa :icon="faArchway" /> Summaly Proxy</div>
|
||||
<div class="_title"><i class="fas fa-archway"></i> Summaly Proxy</div>
|
||||
<div class="_content">
|
||||
<MkInput v-model:value="summalyProxy">URL</MkInput>
|
||||
<MkButton primary @click="save(true)"><Fa :icon="faSave"/> {{ $ts.save }}</MkButton>
|
||||
<MkButton primary @click="save(true)"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
@ -249,9 +249,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent, defineAsyncComponent } from 'vue';
|
||||
import { faPencilAlt, faShareAlt, faGhost, faCog, faPlus, faCloud, faInfoCircle, faBan, faSave, faServer, faLink, faThumbtack, faUser, faShieldAlt, faKey, faBolt, faArchway } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faTrashAlt, faEnvelope } from '@fortawesome/free-regular-svg-icons';
|
||||
import { faTwitter, faDiscord, faGithub } from '@fortawesome/free-brands-svg-icons';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import MkInput from '@client/components/ui/input.vue';
|
||||
import MkTextarea from '@client/components/ui/textarea.vue';
|
||||
|
@ -277,7 +274,7 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.instance,
|
||||
icon: faCog,
|
||||
icon: 'fas fa-cog',
|
||||
},
|
||||
meta: null,
|
||||
url,
|
||||
|
@ -344,7 +341,6 @@ export default defineComponent({
|
|||
smtpUser: '',
|
||||
smtpPass: '',
|
||||
summalyProxy: '',
|
||||
faPencilAlt, faTwitter, faDiscord, faGithub, faShareAlt, faTrashAlt, faGhost, faCog, faPlus, faCloud, faInfoCircle, faBan, faSave, faServer, faLink, faEnvelope, faThumbtack, faUser, faShieldAlt, faKey, faBolt, faArchway
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
@ -16,10 +16,10 @@
|
|||
<span class="acct">@{{ acct(user) }}</span>
|
||||
</div>
|
||||
<div class="status">
|
||||
<span class="staff" v-if="user.isAdmin"><Fa :icon="faBookmark"/></span>
|
||||
<span class="staff" v-if="user.isModerator"><Fa :icon="farBookmark"/></span>
|
||||
<span class="punished" v-if="user.isSilenced"><Fa :icon="faMicrophoneSlash"/></span>
|
||||
<span class="punished" v-if="user.isSuspended"><Fa :icon="faSnowflake"/></span>
|
||||
<span class="staff" v-if="user.isAdmin"><i class="fas fa-bookmark"></i></span>
|
||||
<span class="staff" v-if="user.isModerator"><i class="far fa-bookmark"></i></span>
|
||||
<span class="punished" v-if="user.isSilenced"><i class="fas fa-microphone-slash"></i></span>
|
||||
<span class="punished" v-if="user.isSuspended"><i class="fas fa-snowflake"></i></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="_section">
|
||||
|
@ -31,10 +31,10 @@
|
|||
</div>
|
||||
<div class="_section">
|
||||
<div class="_content">
|
||||
<MkButton full @click="openProfile"><Fa :icon="faExternalLinkSquareAlt"/> {{ $ts.profile }}</MkButton>
|
||||
<MkButton full v-if="user.host != null" @click="updateRemoteUser"><Fa :icon="faSync"/> {{ $ts.updateRemoteUser }}</MkButton>
|
||||
<MkButton full @click="resetPassword"><Fa :icon="faKey"/> {{ $ts.resetPassword }}</MkButton>
|
||||
<MkButton full @click="deleteAllFiles" danger><Fa :icon="faTrashAlt"/> {{ $ts.deleteAllFiles }}</MkButton>
|
||||
<MkButton full @click="openProfile"><i class="fas fa-external-link-square-alt"></i> {{ $ts.profile }}</MkButton>
|
||||
<MkButton full v-if="user.host != null" @click="updateRemoteUser"><i class="fas fa-sync"></i> {{ $ts.updateRemoteUser }}</MkButton>
|
||||
<MkButton full @click="resetPassword"><i class="fas fa-key"></i> {{ $ts.resetPassword }}</MkButton>
|
||||
<MkButton full @click="deleteAllFiles" danger><i class="fas fa-trash-alt"></i> {{ $ts.deleteAllFiles }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
<div class="_section">
|
||||
|
@ -48,8 +48,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent } from 'vue';
|
||||
import { faTimes, faBookmark, faKey, faSync, faMicrophoneSlash, faExternalLinkSquareAlt } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faSnowflake, faTrashAlt, faBookmark as farBookmark } from '@fortawesome/free-regular-svg-icons';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import MkSwitch from '@client/components/ui/switch.vue';
|
||||
import XModalWindow from '@client/components/ui/modal-window.vue';
|
||||
|
@ -79,7 +77,6 @@ export default defineComponent({
|
|||
moderator: false,
|
||||
silenced: false,
|
||||
suspended: false,
|
||||
faTimes, faBookmark, farBookmark, faKey, faSync, faMicrophoneSlash, faSnowflake, faTrashAlt, faExternalLinkSquareAlt
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -2,22 +2,22 @@
|
|||
<div class="mk-instance-users">
|
||||
<div class="_section">
|
||||
<div class="_content">
|
||||
<MkButton inline primary @click="addUser()"><Fa :icon="faPlus"/> {{ $ts.addUser }}</MkButton>
|
||||
<MkButton inline primary @click="addUser()"><i class="fas fa-plus"></i> {{ $ts.addUser }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="_section lookup">
|
||||
<div class="_title"><Fa :icon="faSearch"/> {{ $ts.lookup }}</div>
|
||||
<div class="_title"><i class="fas fa-search"></i> {{ $ts.lookup }}</div>
|
||||
<div class="_content">
|
||||
<MkInput class="target" v-model:value="target" type="text" @enter="showUser()">
|
||||
<span>{{ $ts.usernameOrUserId }}</span>
|
||||
</MkInput>
|
||||
<MkButton @click="showUser()" primary><Fa :icon="faSearch"/> {{ $ts.lookup }}</MkButton>
|
||||
<MkButton @click="showUser()" primary><i class="fas fa-search"></i> {{ $ts.lookup }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="_section users">
|
||||
<div class="_title"><Fa :icon="faUsers"/> {{ $ts.users }}</div>
|
||||
<div class="_title"><i class="fas fa-users"></i> {{ $ts.users }}</div>
|
||||
<div class="_content">
|
||||
<div class="inputs" style="display: flex;">
|
||||
<MkSelect v-model:value="sort" style="margin: 0; flex: 1;">
|
||||
|
@ -59,10 +59,10 @@
|
|||
<header>
|
||||
<MkUserName class="name" :user="user"/>
|
||||
<span class="acct">@{{ acct(user) }}</span>
|
||||
<span class="staff" v-if="user.isAdmin"><Fa :icon="faBookmark"/></span>
|
||||
<span class="staff" v-if="user.isModerator"><Fa :icon="farBookmark"/></span>
|
||||
<span class="punished" v-if="user.isSilenced"><Fa :icon="faMicrophoneSlash"/></span>
|
||||
<span class="punished" v-if="user.isSuspended"><Fa :icon="faSnowflake"/></span>
|
||||
<span class="staff" v-if="user.isAdmin"><i class="fas fa-bookmark"></i></span>
|
||||
<span class="staff" v-if="user.isModerator"><i class="far fa-bookmark"></i></span>
|
||||
<span class="punished" v-if="user.isSilenced"><i class="fas fa-microphone-slash"></i></span>
|
||||
<span class="punished" v-if="user.isSuspended"><i class="fas fa-snowflake"></i></span>
|
||||
</header>
|
||||
<div>
|
||||
<span>{{ $ts.lastUsed }}: <MkTime v-if="user.updatedAt" :time="user.updatedAt" mode="detail"/></span>
|
||||
|
@ -80,8 +80,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faPlus, faUsers, faSearch, faBookmark, faMicrophoneSlash } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faSnowflake, faBookmark as farBookmark } from '@fortawesome/free-regular-svg-icons';
|
||||
import parseAcct from '@/misc/acct/parse';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import MkInput from '@client/components/ui/input.vue';
|
||||
|
@ -103,9 +101,9 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.users,
|
||||
icon: faUsers,
|
||||
icon: 'fas fa-users',
|
||||
action: {
|
||||
icon: faSearch,
|
||||
icon: 'fas fa-search',
|
||||
handler: this.searchUser
|
||||
}
|
||||
},
|
||||
|
@ -127,7 +125,6 @@ export default defineComponent({
|
|||
}),
|
||||
offsetMode: true
|
||||
},
|
||||
faPlus, faUsers, faSearch, faBookmark, farBookmark, faMicrophoneSlash, faSnowflake
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
@ -6,7 +6,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faAt } from '@fortawesome/free-solid-svg-icons';
|
||||
import Progress from '@client/scripts/loading';
|
||||
import XNotes from '@client/components/notes.vue';
|
||||
import * as symbols from '@client/symbols';
|
||||
|
@ -20,7 +19,7 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.mentions,
|
||||
icon: faAt
|
||||
icon: 'fas fa-at'
|
||||
},
|
||||
pagination: {
|
||||
endpoint: 'notes/mentions',
|
||||
|
|
|
@ -6,7 +6,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faEnvelope } from '@fortawesome/free-solid-svg-icons';
|
||||
import Progress from '@client/scripts/loading';
|
||||
import XNotes from '@client/components/notes.vue';
|
||||
import * as symbols from '@client/symbols';
|
||||
|
@ -20,7 +19,7 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.directNotes,
|
||||
icon: faEnvelope
|
||||
icon: 'fas fa-envelope'
|
||||
},
|
||||
pagination: {
|
||||
endpoint: 'notes/mentions',
|
||||
|
@ -29,7 +28,6 @@ export default defineComponent({
|
|||
visibility: 'specified'
|
||||
})
|
||||
},
|
||||
faEnvelope
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div class="yweeujhr _root" v-size="{ max: [400] }">
|
||||
<MkButton @click="start" primary class="start"><Fa :icon="faPlus"/> {{ $ts.startMessaging }}</MkButton>
|
||||
<MkButton @click="start" primary class="start"><i class="fas fa-plus"></i> {{ $ts.startMessaging }}</MkButton>
|
||||
|
||||
<div class="history" v-if="messages.length > 0">
|
||||
<MkA v-for="(message, i) in messages"
|
||||
|
@ -38,7 +38,6 @@
|
|||
|
||||
<script lang="ts">
|
||||
import { defineAsyncComponent, defineComponent } from 'vue';
|
||||
import { faUser, faUsers, faComments, faPlus } from '@fortawesome/free-solid-svg-icons';
|
||||
import getAcct from '@/misc/acct/render';
|
||||
import MkButton from '@client/components/ui/button.vue';
|
||||
import { acct } from '../../filters/user';
|
||||
|
@ -54,13 +53,12 @@ export default defineComponent({
|
|||
return {
|
||||
[symbols.PAGE_INFO]: {
|
||||
title: this.$ts.messaging,
|
||||
icon: faComments
|
||||
icon: 'fas fa-comments'
|
||||
},
|
||||
fetching: true,
|
||||
moreFetching: false,
|
||||
messages: [],
|
||||
connection: null,
|
||||
faUser, faUsers, faComments, faPlus
|
||||
};
|
||||
},
|
||||
|
||||
|
@ -120,11 +118,11 @@ export default defineComponent({
|
|||
start(ev) {
|
||||
os.modalMenu([{
|
||||
text: this.$ts.messagingWithUser,
|
||||
icon: faUser,
|
||||
icon: 'fas fa-user',
|
||||
action: () => { this.startUser() }
|
||||
}, {
|
||||
text: this.$ts.messagingWithGroup,
|
||||
icon: faUsers,
|
||||
icon: 'fas fa-users',
|
||||
action: () => { this.startGroup() }
|
||||
}], ev.currentTarget || ev.target);
|
||||
},
|
||||
|
|
|
@ -13,17 +13,16 @@
|
|||
></textarea>
|
||||
<div class="file" @click="file = null" v-if="file">{{ file.name }}</div>
|
||||
<button class="send _button" @click="send" :disabled="!canSend || sending" :title="$ts.send">
|
||||
<template v-if="!sending"><Fa :icon="faPaperPlane"/></template><template v-if="sending"><Fa icon="spinner .spin"/></template>
|
||||
<template v-if="!sending"><i class="fas fa-paper-plane"></i></template><template v-if="sending"><i class="fas fa-spinner fa-pulse fa-fw"></i></template>
|
||||
</button>
|
||||
<button class="_button" @click="chooseFile"><Fa :icon="faPhotoVideo"/></button>
|
||||
<button class="_button" @click="insertEmoji"><Fa :icon="faLaughSquint"/></button>
|
||||
<button class="_button" @click="chooseFile"><i class="fas fa-photo-video"></i></button>
|
||||
<button class="_button" @click="insertEmoji"><i class="fas fa-laugh-squint"></i></button>
|
||||
<input ref="file" type="file" @change="onChangeFile"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, defineAsyncComponent } from 'vue';
|
||||
import { faPaperPlane, faPhotoVideo, faLaughSquint } from '@fortawesome/free-solid-svg-icons';
|
||||
import insertTextAtCursor from 'insert-text-at-cursor';
|
||||
import * as autosize from 'autosize';
|
||||
import { formatTimeString } from '@/misc/format-time-string';
|
||||
|
@ -51,7 +50,6 @@ export default defineComponent({
|
|||
typing: throttle(3000, () => {
|
||||
os.stream.send('typingOnMessaging', this.user ? { partner: this.user.id } : { group: this.group.id });
|
||||
}),
|
||||
faPaperPlane, faPhotoVideo, faLaughSquint
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
|
|
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue