oscar-surf/misskey
oscar-surf/misskey
0
0
Fork 0
Code Issues Activity

Use FontAwesome as web font instead of vue component (#7469)

Browse source 
* wip

* wip

* wip

* wip

* wip

* wip

* wip

* wip

* wip

* Update yarn.lock

* wip

* wip
This commit is contained in:
syuilo 2021-04-20 23:22:59 +09:00 • committed by GitHub
parent 8bb6ed625b
commit 11349561d6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
245 changed files with 1156 additions and 1775 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/client/pages/_error_.vue
View file

@ -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
};
},
});

8
src/client/pages/about-misskey.vue
View file

@ -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,
}
},

4
src/client/pages/about.vue
View file

@ -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
}
},

6
src/client/pages/advanced-theme-editor.vue
View file

@ -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,
}
},

6
src/client/pages/announcements.vue
View file

@ -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,
};
},

6
src/client/pages/api-console.vue
View file

@ -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
};
},

13
src/client/pages/channel-editor.vue
View file

@ -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,
};
},

15
src/client/pages/channel.vue
View file

@ -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;
}
}

15
src/client/pages/channels.vue
View file

@ -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: {

9
src/client/pages/clip.vue
View file

@ -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 () => {

3
src/client/pages/doc.vue
View file

@ -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,

4
src/client/pages/docs.vue
View file

@ -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
}
},

3
src/client/pages/drive.vue
View file

@ -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,

25
src/client/pages/explore.vue
View file

@ -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,
};
},

3
src/client/pages/favorites.vue
View file

@ -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',

4
src/client/pages/featured.vue
View file

@ -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
};
},

8
src/client/pages/follow-requests.vue
View file

@ -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
};
},

5
src/client/pages/instance-info.vue
View file

@ -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');
}

5
src/client/pages/instance/abuses.vue
View file

@ -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
}
},

11
src/client/pages/instance/announcements.vue
View file

@ -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
}
},

4
src/client/pages/instance/emoji-edit-dialog.vue
View file

@ -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,
}
},

15
src/client/pages/instance/emojis.vue
View file

@ -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);
}

18
src/client/pages/instance/federation.vue
View file

@ -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
}
},

7
src/client/pages/instance/file-dialog.vue
View file

@ -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
};
},

11
src/client/pages/instance/files.vue
View file

@ -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,
}
},

30
src/client/pages/instance/index.metrics.vue
View file

@ -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,
}
},

16
src/client/pages/instance/index.vue
View file

@ -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,
}
},

6
src/client/pages/instance/instance.vue
View file

@ -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
};
},

7
src/client/pages/instance/logs.vue
View file

@ -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,
}
},

11
src/client/pages/instance/queue.vue
View file

@ -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
}
},

13
src/client/pages/instance/relays.vue
View file

@ -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
}
},

106
src/client/pages/instance/settings.vue
View file

@ -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
}
},

19
src/client/pages/instance/user-dialog.vue
View file

@ -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
};
},

23
src/client/pages/instance/users.vue
View file

@ -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
}
},

3
src/client/pages/mentions.vue
View file

@ -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',

4
src/client/pages/messages.vue
View file

@ -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
};
},

10
src/client/pages/messaging/index.vue
View file

@ -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);
},

8
src/client/pages/messaging/messaging-room.form.vue
View file

@ -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: {

4
src/client/pages/messaging/messaging-room.message.vue
View file

@ -29,7 +29,7 @@
<span class="read" v-if="isMe && message.isRead">{{ $ts.messageRead }}</span>
</template>
<MkTime :time="message.createdAt"/>
<template v-if="message.is_edited"><Fa icon="pencil-alt"/></template>
<template v-if="message.is_edited"><i class="fas fa-pencil-alt"></i></template>
</footer>
</div>
</div>
@ -221,7 +221,7 @@ export default defineComponent({
margin: 0 8px;
}
> [data-icon] {
> i {
margin-left: 4px;
}
}

27
src/client/pages/messaging/messaging-room.vue
View file

@ -6,10 +6,10 @@
<div class="_content mk-messaging-room">
<div class="body">
<MkLoading v-if="fetching"/>
<p class="empty" v-if="!fetching && messages.length == 0"><Fa :icon="faInfoCircle"/>{{ $ts.noMessagesYet }}</p>
<p class="no-history" v-if="!fetching && messages.length > 0 && !existMoreMessages"><Fa :icon="faFlag"/>{{ $ts.noMoreHistory }}</p>
<p class="empty" v-if="!fetching && messages.length == 0"><i class="fas fa-info-circle"></i>{{ $ts.noMessagesYet }}</p>
<p class="no-history" v-if="!fetching && messages.length > 0 && !existMoreMessages"><i class="fas fa-flag"></i>{{ $ts.noMoreHistory }}</p>
<button class="more _button" ref="loadMore" :class="{ fetching: fetchingMoreMessages }" v-show="existMoreMessages" @click="fetchMoreMessages" :disabled="fetchingMoreMessages">
<template v-if="fetchingMoreMessages"><Fa icon="spinner" pulse fixed-width/></template>{{ fetchingMoreMessages ? $ts.loading : $ts.loadMore }}
<template v-if="fetchingMoreMessages"><i class="fas fa-spinner fa-pulse fa-fw"></i></template>{{ fetchingMoreMessages ? $ts.loading : $ts.loadMore }}
</button>
<XList class="messages" :items="messages" v-slot="{ item: message }" direction="up" reversed>
<XMessage :message="message" :is-group="group != null" :key="message.id"/>
@ -26,7 +26,7 @@
</div>
<transition name="fade">
<div class="new-message" v-show="showIndicator">
<button class="_buttonPrimary" @click="onIndicatorClick"><i><Fa :icon="faArrowCircleDown"/></i>{{ $ts.newMessageExists }}</button>
<button class="_buttonPrimary" @click="onIndicatorClick"><i class="fas fa-arrow-circle-down"></i>{{ $ts.newMessageExists }}</button>
</div>
</transition>
<XForm v-if="!fetching" :user="user" :group="group" ref="form"/>
@ -37,8 +37,6 @@
<script lang="ts">
import { computed, defineComponent } from 'vue';
import { faArrowCircleDown, faFlag, faUsers, faInfoCircle, faEllipsisH, faExternalLinkAlt } from '@fortawesome/free-solid-svg-icons';
import { faWindowMaximize } from '@fortawesome/free-regular-svg-icons';
import XList from '@client/components/date-separated-list.vue';
import XMessage from './messaging-room.message.vue';
import XForm from './messaging-room.form.vue';
@ -75,14 +73,14 @@ const Component = defineComponent({
userName: this.user,
avatar: this.user,
action: {
icon: faEllipsisH,
icon: 'fas fa-ellipsis'H,
handler: this.menu,
},
} : {
title: this.group.name,
icon: faUsers,
icon: 'fas fa-users',
action: {
icon: faEllipsisH,
icon: 'fas fa-ellipsis'H,
handler: this.menu,
},
} : null),
@ -103,7 +101,6 @@ const Component = defineComponent({
&& this.existMoreMessages
&& this.fetchMoreMessages()
),
faArrowCircleDown, faFlag, faInfoCircle
};
},
@ -325,14 +322,14 @@ const Component = defineComponent({
os.modalMenu([this.inWindow ? undefined : {
text: this.$ts.openInWindow,
icon: faWindowMaximize,
icon: 'fas fa-window-maximize',
action: () => {
os.pageWindow(path);
this.$router.back();
},
}, this.inWindow ? undefined : {
text: this.$ts.popout,
icon: faExternalLinkAlt,
icon: 'fas fa-external-link-alt',
action: () => {
popout(path);
this.$router.back();
@ -356,7 +353,7 @@ export default Component;
font-size: 0.8em;
opacity: 0.5;
[data-icon] {
i {
margin-right: 4px;
}
}
@ -370,7 +367,7 @@ export default Component;
color: var(--messagingRoomInfo);
opacity: 0.5;
[data-icon] {
i {
margin-right: 4px;
}
}
@ -396,7 +393,7 @@ export default Component;
cursor: wait;
}
> [data-icon] {
> i {
margin-right: 4px;
}
}

3
src/client/pages/mfm-cheat-sheet.vue
View file

@ -266,7 +266,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faQuestionCircle } from '@fortawesome/free-regular-svg-icons';
import MkTextarea from '@client/components/ui/textarea.vue';
import * as symbols from '@client/symbols';
@ -279,7 +278,7 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts._mfm.cheatSheet,
icon: faQuestionCircle,
icon: 'fas fa-question-circle',
},
preview_mention: '@example',
preview_hashtag: '#test',

6
src/client/pages/my-antennas/index.antenna.vue
View file

@ -39,15 +39,14 @@
<MkSwitch v-model:value="notify">{{ $ts.notifyAntenna }}</MkSwitch>
</div>
<div class="_footer">
<MkButton inline @click="saveAntenna()" primary><Fa :icon="faSave"/> {{ $ts.save }}</MkButton>
<MkButton inline @click="deleteAntenna()" v-if="antenna.id != null"><Fa :icon="faTrash"/> {{ $ts.delete }}</MkButton>
<MkButton inline @click="saveAntenna()" primary><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
<MkButton inline @click="deleteAntenna()" v-if="antenna.id != null"><i class="fas fa-trash"></i> {{ $ts.delete }}</MkButton>
</div>
</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { faSave, faTrash } from '@fortawesome/free-solid-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';
@ -83,7 +82,6 @@ export default defineComponent({
notify: false,
userLists: null,
userGroups: null,
faSave, faTrash
};
},

8
src/client/pages/my-antennas/index.vue
View file

@ -1,6 +1,6 @@
<template>
<div class="ieepwinx _section">
<MkButton @click="create" primary class="add"><Fa :icon="faPlus"/> {{ $ts.add }}</MkButton>
<MkButton @click="create" primary class="add"><i class="fas fa-plus"></i> {{ $ts.add }}</MkButton>
<div class="_content">
<XAntenna v-if="draft" :antenna="draft" @created="onAntennaCreated" style="margin-bottom: var(--margin);"/>
@ -14,7 +14,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faSatellite, faPlus } from '@fortawesome/free-solid-svg-icons';
import MkPagination from '@client/components/ui/pagination.vue';
import MkButton from '@client/components/ui/button.vue';
import XAntenna from './index.antenna.vue';
@ -31,9 +30,9 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.manageAntennas,
icon: faSatellite,
icon: 'fas fa-satellite',
action: {
icon: faPlus,
icon: 'fas fa-plus',
handler: this.create
}
},
@ -42,7 +41,6 @@ export default defineComponent({
limit: 10,
},
draft: null,
faSatellite, faPlus
};
},

8
src/client/pages/my-clips/index.vue
View file

@ -1,6 +1,6 @@
<template>
<div class="_section qtcaoidl">
<MkButton @click="create" primary class="add"><Fa :icon="faPlus"/> {{ $ts.add }}</MkButton>
<MkButton @click="create" primary class="add"><i class="fas fa-plus"></i> {{ $ts.add }}</MkButton>
<div class="_content">
<MkPagination :pagination="pagination" #default="{items}" ref="list" class="list">
@ -15,7 +15,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faPlus, faPaperclip } 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';
@ -31,9 +30,9 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.clip,
icon: faPaperclip,
icon: 'fas fa-paperclip',
action: {
icon: faPlus,
icon: 'fas fa-plus',
handler: this.create
}
},
@ -42,7 +41,6 @@ export default defineComponent({
limit: 10,
},
draft: null,
faPlus
};
},

6
src/client/pages/my-groups/group.vue
View file

@ -23,7 +23,7 @@
<MkAcct :user="user" class="acct"/>
</div>
<div class="action">
<button class="_button" @click="removeUser(user)"><Fa :icon="faTimes"/></button>
<button class="_button" @click="removeUser(user)"><i class="fas fa-times"></i></button>
</div>
</div>
</div>
@ -35,7 +35,6 @@
<script lang="ts">
import { computed, defineComponent } from 'vue';
import { faTimes, faUsers } from '@fortawesome/free-solid-svg-icons';
import Progress from '@client/scripts/loading';
import MkButton from '@client/components/ui/button.vue';
import * as os from '@client/os';
@ -57,11 +56,10 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: computed(() => this.group ? {
title: this.group.name,
icon: faUsers,
icon: 'fas fa-users',
} : null),
group: null,
users: [],
faTimes, faUsers
};
},

12
src/client/pages/my-groups/index.vue
View file

@ -4,13 +4,13 @@
<MkTab v-model:value="tab">
<option value="owned">{{ $ts.ownedGroups }}</option>
<option value="joined">{{ $ts.joinedGroups }}</option>
<option value="invites"><Fa :icon="faEnvelopeOpenText"/> {{ $ts.invites }}</option>
<option value="invites"><i class="fas fa-envelope-open-text"></i> {{ $ts.invites }}</option>
</MkTab>
</div>
<div class="_section">
<div class="_content" v-if="tab === 'owned'">
<MkButton @click="create" primary style="margin: 0 auto var(--margin) auto;"><Fa :icon="faPlus"/> {{ $ts.createGroup }}</MkButton>
<MkButton @click="create" primary style="margin: 0 auto var(--margin) auto;"><i class="fas fa-plus"></i> {{ $ts.createGroup }}</MkButton>
<MkPagination :pagination="ownedPagination" #default="{items}" ref="owned">
<div class="_card" v-for="group in items" :key="group.id">
@ -35,8 +35,8 @@
<div class="_title">{{ invitation.group.name }}</div>
<div class="_content"><MkAvatars :user-ids="invitation.group.userIds"/></div>
<div class="_footer">
<MkButton @click="acceptInvite(invitation)" primary inline><Fa :icon="faCheck"/> {{ $ts.accept }}</MkButton>
<MkButton @click="rejectInvite(invitation)" primary inline><Fa :icon="faBan"/> {{ $ts.reject }}</MkButton>
<MkButton @click="acceptInvite(invitation)" primary inline><i class="fas fa-check"></i> {{ $ts.accept }}</MkButton>
<MkButton @click="rejectInvite(invitation)" primary inline><i class="fas fa-ban"></i> {{ $ts.reject }}</MkButton>
</div>
</div>
</MkPagination>
@ -47,7 +47,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faUsers, faPlus, faEnvelopeOpenText } from '@fortawesome/free-solid-svg-icons';
import MkPagination from '@client/components/ui/pagination.vue';
import MkButton from '@client/components/ui/button.vue';
import MkContainer from '@client/components/ui/container.vue';
@ -69,7 +68,7 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.groups,
icon: faUsers
icon: 'fas fa-users'
},
tab: 'owned',
ownedPagination: {
@ -84,7 +83,6 @@ export default defineComponent({
endpoint: 'i/user-group-invites',
limit: 10,
},
faUsers, faPlus, faEnvelopeOpenText
};
},

8
src/client/pages/my-lists/index.vue
View file

@ -1,6 +1,6 @@
<template>
<div class="qkcjvfiv _section">
<MkButton @click="create" primary class="add"><Fa :icon="faPlus"/> {{ $ts.createList }}</MkButton>
<MkButton @click="create" primary class="add"><i class="fas fa-plus"></i> {{ $ts.createList }}</MkButton>
<MkPagination :pagination="pagination" #default="{items}" class="lists _content" ref="list">
<div class="list _panel" v-for="(list, i) in items" :key="list.id">
@ -12,7 +12,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faListUl, faPlus } 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';
@ -28,9 +27,9 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.manageLists,
icon: faListUl,
icon: 'fas fa-list-ul',
action: {
icon: faPlus,
icon: 'fas fa-plus',
handler: this.create
}
},
@ -38,7 +37,6 @@ export default defineComponent({
endpoint: 'users/lists/list',
limit: 10,
},
faListUl, faPlus
};
},

6
src/client/pages/my-lists/list.vue
View file

@ -22,7 +22,7 @@
<MkAcct :user="user" class="acct"/>
</div>
<div class="action">
<button class="_button" @click="removeUser(user)"><Fa :icon="faTimes"/></button>
<button class="_button" @click="removeUser(user)"><i class="fas fa-times"></i></button>
</div>
</div>
</div>
@ -34,7 +34,6 @@
<script lang="ts">
import { computed, defineComponent } from 'vue';
import { faTimes, faListUl } from '@fortawesome/free-solid-svg-icons';
import Progress from '@client/scripts/loading';
import MkButton from '@client/components/ui/button.vue';
import * as os from '@client/os';
@ -49,11 +48,10 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: computed(() => this.list ? {
title: this.list.name,
icon: faListUl,
icon: 'fas fa-list-ul',
} : null),
list: null,
users: [],
faTimes, faListUl
};
},

3
src/client/pages/not-found.vue
View file

@ -9,7 +9,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faExclamationTriangle } from '@fortawesome/free-solid-svg-icons';
import * as os from '@client/os';
import * as symbols from '@client/symbols';
@ -18,7 +17,7 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.notFound,
icon: faExclamationTriangle
icon: 'fas fa-exclamation-triangle'
},
}
},

6
src/client/pages/note.vue
View file

@ -7,7 +7,7 @@
</div>
<div class="main _gap">
<MkButton v-if="!showNext && hasNext" class="load next" @click="showNext = true"><Fa :icon="faChevronUp"/></MkButton>
<MkButton v-if="!showNext && hasNext" class="load next" @click="showNext = true"><i class="fas fa-chevron-up"></i></MkButton>
<div class="_content _gap">
<MkRemoteCaution v-if="note.user.host != null" :href="note.url || note.uri" class="_gap"/>
<XNoteDetailed v-model:note="note" :key="note.id" class="_gap"/>
@ -22,7 +22,7 @@
</div>
</MkA>
</div>
<MkButton v-if="!showPrev && hasPrev" class="load prev" @click="showPrev = true"><Fa :icon="faChevronDown"/></MkButton>
<MkButton v-if="!showPrev && hasPrev" class="load prev" @click="showPrev = true"><i class="fas fa-chevron-down"></i></MkButton>
</div>
<div class="_gap" v-if="showPrev">
@ -37,7 +37,6 @@
<script lang="ts">
import { computed, defineComponent } from 'vue';
import { faChevronUp, faChevronDown } from '@fortawesome/free-solid-svg-icons';
import XNote from '@client/components/note.vue';
import XNoteDetailed from '@client/components/note-detailed.vue';
import XNotes from '@client/components/notes.vue';
@ -95,7 +94,6 @@ export default defineComponent({
sinceId: this.note.id,
})
},
faChevronUp, faChevronDown
};
},
watch: {

5
src/client/pages/notifications.vue
View file

@ -6,7 +6,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faBell, faCheck } from '@fortawesome/free-solid-svg-icons';
import Progress from '@client/scripts/loading';
import XNotifications from '@client/components/notifications.vue';
import * as os from '@client/os';
@ -21,10 +20,10 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.notifications,
icon: faBell,
icon: 'fas fa-bell',
actions: [{
text: this.$ts.markAllAsRead,
icon: faCheck,
icon: 'fas fa-check',
handler: () => {
os.apiWithDialog('notifications/mark-all-as-read');
}

4
src/client/pages/page-editor/els/page-editor.el.button.vue
View file

@ -1,6 +1,6 @@
<template>
<XContainer @remove="() => $emit('remove')" :draggable="true">
<template #header><Fa :icon="faBolt"/> {{ $ts._pages.blocks.button }}</template>
<template #header><i class="fas fa-bolt"></i> {{ $ts._pages.blocks.button }}</template>
<section class="xfhsjczc">
<MkInput v-model:value="value.text"><span>{{ $ts._pages.blocks._button.text }}</span></MkInput>
@ -39,7 +39,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faBolt } from '@fortawesome/free-solid-svg-icons';
import XContainer from '../page-editor.container.vue';
import MkSelect from '@client/components/ui/select.vue';
import MkInput from '@client/components/ui/input.vue';
@ -62,7 +61,6 @@ export default defineComponent({
data() {
return {
faBolt
};
},

6
src/client/pages/page-editor/els/page-editor.el.canvas.vue
View file

@ -1,9 +1,9 @@
<template>
<XContainer @remove="() => $emit('remove')" :draggable="true">
<template #header><Fa :icon="faPaintBrush"/> {{ $ts._pages.blocks.canvas }}</template>
<template #header><i class="fas fa-paint-brush"></i> {{ $ts._pages.blocks.canvas }}</template>
<section style="padding: 0 16px 0 16px;">
<MkInput v-model:value="value.name"><template #prefix><Fa :icon="faMagic"/></template><span>{{ $ts._pages.blocks._canvas.id }}</span></MkInput>
<MkInput v-model:value="value.name"><template #prefix><i class="fas fa-magic"></i></template><span>{{ $ts._pages.blocks._canvas.id }}</span></MkInput>
<MkInput v-model:value="value.width" type="number"><span>{{ $ts._pages.blocks._canvas.width }}</span><template #suffix>px</template></MkInput>
<MkInput v-model:value="value.height" type="number"><span>{{ $ts._pages.blocks._canvas.height }}</span><template #suffix>px</template></MkInput>
</section>
@ -12,7 +12,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faPaintBrush, faMagic } from '@fortawesome/free-solid-svg-icons';
import XContainer from '../page-editor.container.vue';
import MkInput from '@client/components/ui/input.vue';
import * as os from '@client/os';
@ -30,7 +29,6 @@ export default defineComponent({
data() {
return {
faPaintBrush, faMagic
};
},

6
src/client/pages/page-editor/els/page-editor.el.counter.vue
View file

@ -1,9 +1,9 @@
<template>
<XContainer @remove="() => $emit('remove')" :draggable="true">
<template #header><Fa :icon="faBolt"/> {{ $ts._pages.blocks.counter }}</template>
<template #header><i class="fas fa-bolt"></i> {{ $ts._pages.blocks.counter }}</template>
<section style="padding: 0 16px 0 16px;">
<MkInput v-model:value="value.name"><template #prefix><Fa :icon="faMagic"/></template><span>{{ $ts._pages.blocks._counter.name }}</span></MkInput>
<MkInput v-model:value="value.name"><template #prefix><i class="fas fa-magic"></i></template><span>{{ $ts._pages.blocks._counter.name }}</span></MkInput>
<MkInput v-model:value="value.text"><span>{{ $ts._pages.blocks._counter.text }}</span></MkInput>
<MkInput v-model:value="value.inc" type="number"><span>{{ $ts._pages.blocks._counter.inc }}</span></MkInput>
</section>
@ -12,7 +12,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faBolt, faMagic } from '@fortawesome/free-solid-svg-icons';
import XContainer from '../page-editor.container.vue';
import MkInput from '@client/components/ui/input.vue';
import * as os from '@client/os';
@ -30,7 +29,6 @@ export default defineComponent({
data() {
return {
faBolt, faMagic
};
},

6
src/client/pages/page-editor/els/page-editor.el.if.vue
View file

@ -1,9 +1,9 @@
<template>
<XContainer @remove="() => $emit('remove')" :draggable="true">
<template #header><Fa :icon="faQuestion"/> {{ $ts._pages.blocks.if }}</template>
<template #header><i class="fas fa-question"></i> {{ $ts._pages.blocks.if }}</template>
<template #func>
<button @click="add()" class="_button">
<Fa :icon="faPlus"/>
<i class="fas fa-plus"></i>
</button>
</template>
@ -27,7 +27,6 @@
<script lang="ts">
import { defineComponent, defineAsyncComponent } from 'vue';
import { v4 as uuid } from 'uuid';
import { faPlus, faQuestion } from '@fortawesome/free-solid-svg-icons';
import XContainer from '../page-editor.container.vue';
import MkSelect from '@client/components/ui/select.vue';
import * as os from '@client/os';
@ -51,7 +50,6 @@ export default defineComponent({
data() {
return {
faPlus, faQuestion
};
},

7
src/client/pages/page-editor/els/page-editor.el.image.vue
View file

@ -1,9 +1,9 @@
<template>
<XContainer @remove="() => $emit('remove')" :draggable="true">
<template #header><Fa :icon="faImage"/> {{ $ts._pages.blocks.image }}</template>
<template #header><i class="fas fa-image"></i> {{ $ts._pages.blocks.image }}</template>
<template #func>
<button @click="choose()">
<Fa :icon="faFolderOpen"/>
<i class="fas fa-folder-open"></i>
</button>
</template>
@ -15,8 +15,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faPencilAlt } from '@fortawesome/free-solid-svg-icons';
import { faImage, faFolderOpen } from '@fortawesome/free-regular-svg-icons';
import XContainer from '../page-editor.container.vue';
import MkDriveFileThumbnail from '@client/components/drive-file-thumbnail.vue';
import * as os from '@client/os';
@ -35,7 +33,6 @@ export default defineComponent({
data() {
return {
file: null,
faPencilAlt, faImage, faFolderOpen
};
},

4
src/client/pages/page-editor/els/page-editor.el.note.vue
View file

@ -1,6 +1,6 @@
<template>
<XContainer @remove="() => $emit('remove')" :draggable="true">
<template #header><Fa :icon="faStickyNote"/> {{ $ts._pages.blocks.note }}</template>
<template #header><i class="fas fa-sticky-note"></i> {{ $ts._pages.blocks.note }}</template>
<section style="padding: 0 16px 0 16px;">
<MkInput v-model:value="id">
@ -17,7 +17,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faStickyNote } from '@fortawesome/free-solid-svg-icons';
import XContainer from '../page-editor.container.vue';
import MkInput from '@client/components/ui/input.vue';
import MkSwitch from '@client/components/ui/switch.vue';
@ -40,7 +39,6 @@ export default defineComponent({
return {
id: this.value.note,
note: null,
faStickyNote
};
},

6
src/client/pages/page-editor/els/page-editor.el.number-input.vue
View file

@ -1,9 +1,9 @@
<template>
<XContainer @remove="() => $emit('remove')" :draggable="true">
<template #header><Fa :icon="faBolt"/> {{ $ts._pages.blocks.numberInput }}</template>
<template #header><i class="fas fa-bolt"></i> {{ $ts._pages.blocks.numberInput }}</template>
<section style="padding: 0 16px 0 16px;">
<MkInput v-model:value="value.name"><template #prefix><Fa :icon="faMagic"/></template><span>{{ $ts._pages.blocks._numberInput.name }}</span></MkInput>
<MkInput v-model:value="value.name"><template #prefix><i class="fas fa-magic"></i></template><span>{{ $ts._pages.blocks._numberInput.name }}</span></MkInput>
<MkInput v-model:value="value.text"><span>{{ $ts._pages.blocks._numberInput.text }}</span></MkInput>
<MkInput v-model:value="value.default" type="number"><span>{{ $ts._pages.blocks._numberInput.default }}</span></MkInput>
</section>
@ -12,7 +12,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faBolt, faMagic } from '@fortawesome/free-solid-svg-icons';
import XContainer from '../page-editor.container.vue';
import MkInput from '@client/components/ui/input.vue';
import * as os from '@client/os';
@ -30,7 +29,6 @@ export default defineComponent({
data() {
return {
faBolt, faMagic
};
},

4
src/client/pages/page-editor/els/page-editor.el.post.vue
View file

@ -1,6 +1,6 @@
<template>
<XContainer @remove="() => $emit('remove')" :draggable="true">
<template #header><Fa :icon="faPaperPlane"/> {{ $ts._pages.blocks.post }}</template>
<template #header><i class="fas fa-paper-plane"></i> {{ $ts._pages.blocks.post }}</template>
<section style="padding: 16px;">
<MkTextarea v-model:value="value.text">{{ $ts._pages.blocks._post.text }}</MkTextarea>
@ -12,7 +12,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faPaperPlane } from '@fortawesome/free-regular-svg-icons';
import XContainer from '../page-editor.container.vue';
import MkTextarea from '@client/components/ui/textarea.vue';
import MkInput from '@client/components/ui/input.vue';
@ -32,7 +31,6 @@ export default defineComponent({
data() {
return {
faPaperPlane
};
},

6
src/client/pages/page-editor/els/page-editor.el.radio-button.vue
View file

@ -1,9 +1,9 @@
<template>
<XContainer @remove="() => $emit('remove')" :draggable="true">
<template #header><Fa :icon="faBolt"/> {{ $ts._pages.blocks.radioButton }}</template>
<template #header><i class="fas fa-bolt"></i> {{ $ts._pages.blocks.radioButton }}</template>
<section style="padding: 0 16px 16px 16px;">
<MkInput v-model:value="value.name"><template #prefix><Fa :icon="faMagic"/></template><span>{{ $ts._pages.blocks._radioButton.name }}</span></MkInput>
<MkInput v-model:value="value.name"><template #prefix><i class="fas fa-magic"></i></template><span>{{ $ts._pages.blocks._radioButton.name }}</span></MkInput>
<MkInput v-model:value="value.title"><span>{{ $ts._pages.blocks._radioButton.title }}</span></MkInput>
<MkTextarea v-model:value="values"><span>{{ $ts._pages.blocks._radioButton.values }}</span></MkTextarea>
<MkInput v-model:value="value.default"><span>{{ $ts._pages.blocks._radioButton.default }}</span></MkInput>
@ -13,7 +13,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faBolt, faMagic } from '@fortawesome/free-solid-svg-icons';
import XContainer from '../page-editor.container.vue';
import MkTextarea from '@client/components/ui/textarea.vue';
import MkInput from '@client/components/ui/input.vue';
@ -31,7 +30,6 @@ export default defineComponent({
data() {
return {
values: '',
faBolt, faMagic
};
},
watch: {

9
src/client/pages/page-editor/els/page-editor.el.section.vue
View file

@ -1,12 +1,12 @@
<template>
<XContainer @remove="() => $emit('remove')" :draggable="true">
<template #header><Fa :icon="faStickyNote"/> {{ value.title }}</template>
<template #header><i class="fas fa-sticky-note"></i> {{ value.title }}</template>
<template #func>
<button @click="rename()" class="_button">
<Fa :icon="faPencilAlt"/>
<i class="fas fa-pencil-alt"></i>
</button>
<button @click="add()" class="_button">
<Fa :icon="faPlus"/>
<i class="fas fa-plus"></i>
</button>
</template>
@ -19,8 +19,6 @@
<script lang="ts">
import { defineComponent, defineAsyncComponent } from 'vue';
import { v4 as uuid } from 'uuid';
import { faPlus, faPencilAlt } from '@fortawesome/free-solid-svg-icons';
import { faStickyNote } from '@fortawesome/free-regular-svg-icons';
import XContainer from '../page-editor.container.vue';
import * as os from '@client/os';
@ -43,7 +41,6 @@ export default defineComponent({
data() {
return {
faStickyNote, faPlus, faPencilAlt
};
},

6
src/client/pages/page-editor/els/page-editor.el.switch.vue
View file

@ -1,9 +1,9 @@
<template>
<XContainer @remove="() => $emit('remove')" :draggable="true">
<template #header><Fa :icon="faBolt"/> {{ $ts._pages.blocks.switch }}</template>
<template #header><i class="fas fa-bolt"></i> {{ $ts._pages.blocks.switch }}</template>
<section class="kjuadyyj">
<MkInput v-model:value="value.name"><template #prefix><Fa :icon="faMagic"/></template><span>{{ $ts._pages.blocks._switch.name }}</span></MkInput>
<MkInput v-model:value="value.name"><template #prefix><i class="fas fa-magic"></i></template><span>{{ $ts._pages.blocks._switch.name }}</span></MkInput>
<MkInput v-model:value="value.text"><span>{{ $ts._pages.blocks._switch.text }}</span></MkInput>
<MkSwitch v-model:value="value.default"><span>{{ $ts._pages.blocks._switch.default }}</span></MkSwitch>
</section>
@ -12,7 +12,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faBolt, faMagic } from '@fortawesome/free-solid-svg-icons';
import XContainer from '../page-editor.container.vue';
import MkSwitch from '@client/components/ui/switch.vue';
import MkInput from '@client/components/ui/input.vue';
@ -31,7 +30,6 @@ export default defineComponent({
data() {
return {
faBolt, faMagic
};
},

6
src/client/pages/page-editor/els/page-editor.el.text-input.vue
View file

@ -1,9 +1,9 @@
<template>
<XContainer @remove="() => $emit('remove')" :draggable="true">
<template #header><Fa :icon="faBolt"/> {{ $ts._pages.blocks.textInput }}</template>
<template #header><i class="fas fa-bolt"></i> {{ $ts._pages.blocks.textInput }}</template>
<section style="padding: 0 16px 0 16px;">
<MkInput v-model:value="value.name"><template #prefix><Fa :icon="faMagic"/></template><span>{{ $ts._pages.blocks._textInput.name }}</span></MkInput>
<MkInput v-model:value="value.name"><template #prefix><i class="fas fa-magic"></i></template><span>{{ $ts._pages.blocks._textInput.name }}</span></MkInput>
<MkInput v-model:value="value.text"><span>{{ $ts._pages.blocks._textInput.text }}</span></MkInput>
<MkInput v-model:value="value.default" type="text"><span>{{ $ts._pages.blocks._textInput.default }}</span></MkInput>
</section>
@ -12,7 +12,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faBolt, faMagic } from '@fortawesome/free-solid-svg-icons';
import XContainer from '../page-editor.container.vue';
import MkInput from '@client/components/ui/input.vue';
import * as os from '@client/os';
@ -30,7 +29,6 @@ export default defineComponent({
data() {
return {
faBolt, faMagic
};
},

4
src/client/pages/page-editor/els/page-editor.el.text.vue
View file

@ -1,6 +1,6 @@
<template>
<XContainer @remove="() => $emit('remove')" :draggable="true">
<template #header><Fa :icon="faAlignLeft"/> {{ $ts._pages.blocks.text }}</template>
<template #header><i class="fas fa-align-left"></i> {{ $ts._pages.blocks.text }}</template>
<section class="vckmsadr">
<textarea v-model="value.text"></textarea>
@ -10,7 +10,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faAlignLeft } from '@fortawesome/free-solid-svg-icons';
import XContainer from '../page-editor.container.vue';
import * as os from '@client/os';
@ -27,7 +26,6 @@ export default defineComponent({
data() {
return {
faAlignLeft,
};
},

6
src/client/pages/page-editor/els/page-editor.el.textarea-input.vue
View file

@ -1,9 +1,9 @@
<template>
<XContainer @remove="() => $emit('remove')" :draggable="true">
<template #header><Fa :icon="faBolt"/> {{ $ts._pages.blocks.textareaInput }}</template>
<template #header><i class="fas fa-bolt"></i> {{ $ts._pages.blocks.textareaInput }}</template>
<section style="padding: 0 16px 16px 16px;">
<MkInput v-model:value="value.name"><template #prefix><Fa :icon="faMagic"/></template><span>{{ $ts._pages.blocks._textareaInput.name }}</span></MkInput>
<MkInput v-model:value="value.name"><template #prefix><i class="fas fa-magic"></i></template><span>{{ $ts._pages.blocks._textareaInput.name }}</span></MkInput>
<MkInput v-model:value="value.text"><span>{{ $ts._pages.blocks._textareaInput.text }}</span></MkInput>
<MkTextarea v-model:value="value.default"><span>{{ $ts._pages.blocks._textareaInput.default }}</span></MkTextarea>
</section>
@ -12,7 +12,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faBolt, faMagic } from '@fortawesome/free-solid-svg-icons';
import XContainer from '../page-editor.container.vue';
import MkTextarea from '@client/components/ui/textarea.vue';
import MkInput from '@client/components/ui/input.vue';
@ -31,7 +30,6 @@ export default defineComponent({
data() {
return {
faBolt, faMagic
};
},

4
src/client/pages/page-editor/els/page-editor.el.textarea.vue
View file

@ -1,6 +1,6 @@
<template>
<XContainer @remove="() => $emit('remove')" :draggable="true">
<template #header><Fa :icon="faAlignLeft"/> {{ $ts._pages.blocks.textarea }}</template>
<template #header><i class="fas fa-align-left"></i> {{ $ts._pages.blocks.textarea }}</template>
<section class="ihymsbbe">
<textarea v-model="value.text"></textarea>
@ -10,7 +10,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faAlignLeft } from '@fortawesome/free-solid-svg-icons';
import XContainer from '../page-editor.container.vue';
import * as os from '@client/os';
@ -27,7 +26,6 @@ export default defineComponent({
data() {
return {
faAlignLeft,
};
},

13
src/client/pages/page-editor/page-editor.container.vue
View file

@ -5,14 +5,14 @@
<div class="buttons">
<slot name="func"></slot>
<button v-if="removable" @click="remove()" class="_button">
<Fa :icon="faTrashAlt"/>
<i class="fas fa-trash-alt"></i>
</button>
<button v-if="draggable" class="drag-handle _button">
<Fa :icon="faBars"/>
<i class="fas fa-bars"></i>
</button>
<button @click="toggleContent(!showBody)" 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>
</div>
</header>
@ -26,8 +26,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faBars, faAngleUp, faAngleDown } from '@fortawesome/free-solid-svg-icons';
import { faTrashAlt } from '@fortawesome/free-regular-svg-icons';
export default defineComponent({
props: {
@ -56,7 +54,6 @@ export default defineComponent({
data() {
return {
showBody: this.expanded,
faTrashAlt, faBars, faAngleUp, faAngleDown
};
},
methods: {
@ -105,7 +102,7 @@ export default defineComponent({
font-weight: bold;
box-shadow: 0 1px rgba(#000, 0.07);
> [data-icon] {
> i {
margin-right: 6px;
}

8
src/client/pages/page-editor/page-editor.script-block.vue
View file

@ -1,9 +1,9 @@
<template>
<XContainer :removable="removable" @remove="() => $emit('remove')" :error="error" :warn="warn" :draggable="draggable">
<template #header><Fa v-if="icon" :icon="icon"/> <template v-if="title">{{ title }} <span class="turmquns" v-if="typeText">({{ typeText }})</span></template><template v-else-if="typeText">{{ typeText }}</template></template>
<template #header><i v-if="icon" :class="icon"></i> <template v-if="title">{{ title }} <span class="turmquns" v-if="typeText">({{ typeText }})</span></template><template v-else-if="typeText">{{ typeText }}</template></template>
<template #func>
<button @click="changeType()" class="_button">
<Fa :icon="faPencilAlt"/>
<i class="fas fa-pencil-alt"></i>
</button>
</template>
@ -57,7 +57,6 @@
<script lang="ts">
import { defineAsyncComponent, defineComponent } from 'vue';
import { faPencilAlt, faPlug } from '@fortawesome/free-solid-svg-icons';
import { v4 as uuid } from 'uuid';
import XContainer from './page-editor.container.vue';
import MkTextarea from '@client/components/ui/textarea.vue';
@ -109,14 +108,13 @@ export default defineComponent({
error: null,
warn: null,
slots: '',
faPencilAlt
};
},
computed: {
icon(): any {
if (this.value.type === null) return null;
if (this.value.type.startsWith('fn:')) return faPlug;
if (this.value.type.startsWith('fn:')) return 'fas fa-plug';
return blockDefs.find(x => x.type === this.value.type).icon;
},
typeText(): any {

31
src/client/pages/page-editor/page-editor.vue
View file

@ -1,15 +1,15 @@
<template>
<div class="_root">
<MkA class="view" v-if="pageId" :to="`/@${ author.username }/pages/${ currentName }`"><Fa :icon="faExternalLinkSquareAlt"/> {{ $ts._pages.viewPage }}</MkA>
<MkA class="view" v-if="pageId" :to="`/@${ author.username }/pages/${ currentName }`"><i class="fas fa-external-link-square-alt"></i> {{ $ts._pages.viewPage }}</MkA>
<div class="buttons" style="margin: 16px;">
<MkButton inline @click="save" primary class="save" v-if="!readonly"><Fa :icon="faSave"/> {{ $ts.save }}</MkButton>
<MkButton inline @click="duplicate" class="duplicate" v-if="pageId"><Fa :icon="faCopy"/> {{ $ts.duplicate }}</MkButton>
<MkButton inline @click="del" class="delete" v-if="pageId && !readonly"><Fa :icon="faTrashAlt"/> {{ $ts.delete }}</MkButton>
<MkButton inline @click="save" primary class="save" v-if="!readonly"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
<MkButton inline @click="duplicate" class="duplicate" v-if="pageId"><i class="fas fa-copy"></i> {{ $ts.duplicate }}</MkButton>
<MkButton inline @click="del" class="delete" v-if="pageId && !readonly"><i class="fas fa-trash-alt"></i> {{ $ts.delete }}</MkButton>
</div>
<MkContainer :foldable="true" :expanded="true" class="_gap">
<template #header><Fa :icon="faCog"/> {{ $ts._pages.pageSetting }}</template>
<template #header><i class="fas fa-cog"></i> {{ $ts._pages.pageSetting }}</template>
<div style="padding: 16px;">
<MkInput v-model:value="title">
<span>{{ $ts._pages.title }}</span>
@ -35,26 +35,26 @@
<MkSwitch v-model:value="hideTitleWhenPinned">{{ $ts._pages.hideTitleWhenPinned }}</MkSwitch>
<div class="eyeCatch">
<MkButton v-if="eyeCatchingImageId == null && !readonly" @click="setEyeCatchingImage"><Fa :icon="faPlus"/> {{ $ts._pages.eyeCatchingImageSet }}</MkButton>
<MkButton v-if="eyeCatchingImageId == null && !readonly" @click="setEyeCatchingImage"><i class="fas fa-plus"></i> {{ $ts._pages.eyeCatchingImageSet }}</MkButton>
<div v-else-if="eyeCatchingImage">
<img :src="eyeCatchingImage.url" :alt="eyeCatchingImage.name" style="max-width: 100%;"/>
<MkButton @click="removeEyeCatchingImage()" v-if="!readonly"><Fa :icon="faTrashAlt"/> {{ $ts._pages.eyeCatchingImageRemove }}</MkButton>
<MkButton @click="removeEyeCatchingImage()" v-if="!readonly"><i class="fas fa-trash-alt"></i> {{ $ts._pages.eyeCatchingImageRemove }}</MkButton>
</div>
</div>
</div>
</MkContainer>
<MkContainer :foldable="true" :expanded="true" class="_gap">
<template #header><Fa :icon="faStickyNote"/> {{ $ts._pages.contents }}</template>
<template #header><i class="fas fa-sticky-note"></i> {{ $ts._pages.contents }}</template>
<div style="padding: 16px;">
<XBlocks class="content" v-model:value="content" :hpml="hpml"/>
<MkButton @click="add()" v-if="!readonly"><Fa :icon="faPlus"/></MkButton>
<MkButton @click="add()" v-if="!readonly"><i class="fas fa-plus"></i></MkButton>
</div>
</MkContainer>
<MkContainer :foldable="true" class="_gap">
<template #header><Fa :icon="faMagic"/> {{ $ts._pages.variables }}</template>
<template #header><i class="fas fa-magic"></i> {{ $ts._pages.variables }}</template>
<div class="qmuvgica">
<XDraggable tag="div" class="variables" v-show="variables.length > 0" v-model="variables" item-key="name" handle=".drag-handle" :group="{ name: 'variables' }" animation="150" swap-threshold="0.5">
<template #item="{element}">
@ -70,12 +70,12 @@
</template>
</XDraggable>
<MkButton @click="addVariable()" class="add" v-if="!readonly"><Fa :icon="faPlus"/></MkButton>
<MkButton @click="addVariable()" class="add" v-if="!readonly"><i class="fas fa-plus"></i></MkButton>
</div>
</MkContainer>
<MkContainer :foldable="true" :expanded="true" class="_gap">
<template #header><Fa :icon="faCode"/> {{ $ts.script }}</template>
<template #header><i class="fas fa-code"></i> {{ $ts.script }}</template>
<div>
<MkTextarea class="_code" v-model:value="script"/>
</div>
@ -91,8 +91,6 @@ import 'prismjs/components/prism-clike';
import 'prismjs/components/prism-javascript';
import 'prismjs/themes/prism-okaidia.css';
import 'vue-prism-editor/dist/prismeditor.min.css';
import { faICursor, faPlus, faMagic, faCog, faCode, faExternalLinkSquareAlt, faPencilAlt, faCopy } from '@fortawesome/free-solid-svg-icons';
import { faSave, faStickyNote, faTrashAlt } from '@fortawesome/free-regular-svg-icons';
import { v4 as uuid } from 'uuid';
import XVariable from './page-editor.script-block.vue';
import XBlocks from './page-editor.blocks.vue';
@ -143,7 +141,7 @@ export default defineComponent({
}
return {
title: title,
icon: faPencilAlt,
icon: 'fas fa-pencil-alt',
};
}),
author: this.$i,
@ -164,7 +162,6 @@ export default defineComponent({
hpml: null,
script: '',
url,
faPlus, faICursor, faSave, faStickyNote, faMagic, faCog, faTrashAlt, faExternalLinkSquareAlt, faCode, faCopy
};
},
@ -471,7 +468,7 @@ export default defineComponent({
font-weight: bold;
box-shadow: 0 1px rgba(#000, 0.07);
> [data-icon] {
> i {
margin-right: 6px;
}

11
src/client/pages/page.vue
View file

@ -14,8 +14,8 @@
<small style="display: block; opacity: 0.7; margin-top: 1em;">@{{ page.user.username }}</small>
</div>
<div class="like">
<MkButton class="button" @click="unlike()" v-if="page.isLiked" v-tooltip="$ts._pages.unlike" primary><Fa :icon="faHeartS"/><span class="count" v-if="page.likedCount > 0">{{ page.likedCount }}</span></MkButton>
<MkButton class="button" @click="like()" v-else v-tooltip="$ts._pages.like"><Fa :icon="faHeartR"/><span class="count" v-if="page.likedCount > 0">{{ page.likedCount }}</span></MkButton>
<MkButton class="button" @click="unlike()" v-if="page.isLiked" v-tooltip="$ts._pages.unlike" primary><i class="fas fa-heart"></i><span class="count" v-if="page.likedCount > 0">{{ page.likedCount }}</span></MkButton>
<MkButton class="button" @click="like()" v-else v-tooltip="$ts._pages.like"><i class="far fa-heart"></i><span class="count" v-if="page.likedCount > 0">{{ page.likedCount }}</span></MkButton>
</div>
<div class="links">
<MkA :to="`/@${username}/pages/${pageName}/view-source`" class="link">{{ $ts._pages.viewSource }}</MkA>
@ -27,16 +27,14 @@
</div>
</div>
<div class="footer">
<div><Fa :icon="faClock"/> {{ $ts.createdAt }}: <MkTime :time="page.createdAt" mode="detail"/></div>
<div v-if="page.createdAt != page.updatedAt"><Fa :icon="faClock"/> {{ $ts.updatedAt }}: <MkTime :time="page.updatedAt" mode="detail"/></div>
<div><i class="far fa-clock"></i> {{ $ts.createdAt }}: <MkTime :time="page.createdAt" mode="detail"/></div>
<div v-if="page.createdAt != page.updatedAt"><i class="far fa-clock"></i> {{ $ts.updatedAt }}: <MkTime :time="page.updatedAt" mode="detail"/></div>
</div>
</div>
</template>
<script lang="ts">
import { computed, defineComponent } from 'vue';
import { faHeart as faHeartS } from '@fortawesome/free-solid-svg-icons';
import { faHeart as faHeartR, faClock } from '@fortawesome/free-regular-svg-icons';
import XPage from '@client/components/page/page.vue';
import MkButton from '@client/components/ui/button.vue';
import * as os from '@client/os';
@ -71,7 +69,6 @@ export default defineComponent({
},
} : null),
page: null,
faHeartS, faHeartR, faClock,
};
},

15
src/client/pages/pages.vue
View file

@ -1,9 +1,9 @@
<template>
<div>
<MkTab v-model:value="tab" v-if="$i">
<option value="featured"><Fa :icon="faFireAlt"/> {{ $ts._pages.featured }}</option>
<option value="my"><Fa :icon="faEdit"/> {{ $ts._pages.my }}</option>
<option value="liked"><Fa :icon="faHeart"/> {{ $ts._pages.liked }}</option>
<option value="featured"><i class="fas fa-fire-alt"></i> {{ $ts._pages.featured }}</option>
<option value="my"><i class="fas fa-edit"></i> {{ $ts._pages.my }}</option>
<option value="liked"><i class="fas fa-heart"></i> {{ $ts._pages.liked }}</option>
</MkTab>
<div class="_section">
@ -14,7 +14,7 @@
</div>
<div class="rknalgpo _content my" v-if="tab === 'my'">
<MkButton class="new" @click="create()"><Fa :icon="faPlus"/></MkButton>
<MkButton class="new" @click="create()"><i class="fas fa-plus"></i></MkButton>
<MkPagination :pagination="myPagesPagination" #default="{items}">
<MkPagePreview v-for="page in items" class="ckltabjg" :page="page" :key="page.id"/>
</MkPagination>
@ -31,8 +31,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faPlus, faEdit, faFireAlt } from '@fortawesome/free-solid-svg-icons';
import { faStickyNote, faHeart } from '@fortawesome/free-regular-svg-icons';
import MkPagePreview from '@client/components/page-preview.vue';
import MkPagination from '@client/components/ui/pagination.vue';
import MkButton from '@client/components/ui/button.vue';
@ -47,9 +45,9 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.pages,
icon: faStickyNote,
icon: 'fas fa-sticky-note',
actions: [{
icon: faPlus,
icon: 'fas fa-plus',
text: this.$ts.create,
handler: this.create
}]
@ -67,7 +65,6 @@ export default defineComponent({
endpoint: 'i/page-likes',
limit: 5,
},
faStickyNote, faPlus, faEdit, faHeart, faFireAlt
};
},
methods: {

3
src/client/pages/preview.vue
View file

@ -6,7 +6,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faEye } from '@fortawesome/free-solid-svg-icons';
import MkSample from '@client/components/sample.vue';
import * as symbols from '@client/symbols';
@ -19,7 +18,7 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.preview,
icon: faEye,
icon: 'fas fa-eye',
},
}
},

18
src/client/pages/reversi/game.board.vue
View file

@ -40,8 +40,8 @@
<img v-if="stone === false" :src="whiteUser.avatarUrl" alt="white">
</template>
<template v-else>
<fa v-if="stone === true" :icon="fasCircle"/>
<fa v-if="stone === false" :icon="farCircle"/>
<i v-if="stone === true" class="fas fa-circle"></i>
<i v-if="stone === false" class="far fa-circle"></i>
</template>
</div>
</div>
@ -63,12 +63,12 @@
<div class="player" v-if="game.isEnded">
<span>{{ logPos }} / {{ logs.length }}</span>
<div class="buttons" v-if="!autoplaying">
<MkButton inline @click="logPos = 0" :disabled="logPos == 0"><fa :icon="faAngleDoubleLeft"/></MkButton>
<MkButton inline @click="logPos--" :disabled="logPos == 0"><fa :icon="faAngleLeft"/></MkButton>
<MkButton inline @click="logPos++" :disabled="logPos == logs.length"><fa :icon="faAngleRight"/></MkButton>
<MkButton inline @click="logPos = logs.length" :disabled="logPos == logs.length"><fa :icon="faAngleDoubleRight"/></MkButton>
<MkButton inline @click="logPos = 0" :disabled="logPos == 0"><i class="fas fa-angle-double-left"></i></MkButton>
<MkButton inline @click="logPos--" :disabled="logPos == 0"><i class="fas fa-angle-left"></i></MkButton>
<MkButton inline @click="logPos++" :disabled="logPos == logs.length"><i class="fas fa-angle-right"></i></MkButton>
<MkButton inline @click="logPos = logs.length" :disabled="logPos == logs.length"><i class="fas fa-angle-double-right"></i></MkButton>
</div>
<MkButton @click="autoplay()" :disabled="autoplaying" style="margin: var(--margin) auto 0 auto;"><fa :icon="faPlay"/></MkButton>
<MkButton @click="autoplay()" :disabled="autoplaying" style="margin: var(--margin) auto 0 auto;"><i class="fas fa-play"></i></MkButton>
</div>
<div class="info">
@ -85,9 +85,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faAngleDoubleLeft, faAngleLeft, faAngleRight, faAngleDoubleRight, faPlay } from '@fortawesome/free-solid-svg-icons';
import { faCircle as fasCircle } from '@fortawesome/free-solid-svg-icons';
import { faCircle as farCircle } from '@fortawesome/free-regular-svg-icons';
import * as CRC32 from 'crc-32';
import Reversi, { Color } from '../../../games/reversi/core';
import { url } from '@client/config';
@ -120,7 +117,6 @@ export default defineComponent({
logPos: 0,
watchers: [],
pollingClock: null,
faAngleDoubleLeft, faAngleLeft, faAngleRight, faAngleDoubleRight, fasCircle, farCircle, faPlay
};
},

8
src/client/pages/reversi/game.setting.vue
View file

@ -17,11 +17,11 @@
</header>
<div>
<div class="random" v-if="game.map == null"><fa icon="dice"/></div>
<div class="random" v-if="game.map == null"><i class="fas fa-dice"></i></div>
<div class="board" v-else :style="{ 'grid-template-rows': `repeat(${ game.map.length }, 1fr)`, 'grid-template-columns': `repeat(${ game.map[0].length }, 1fr)` }">
<div v-for="(x, i) in game.map.join('')" :class="{ none: x == ' ' }" @click="onPixelClick(i, x)">
<fa v-if="x == 'b'" :icon="fasCircle"/>
<fa v-if="x == 'w'" :icon="farCircle"/>
<i v-if="x === 'b'" class="fas fa-circle"></i>
<i v-if="x === 'w'" class="far fa-circle"></i>
</div>
</div>
</div>
@ -125,8 +125,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faCircle as fasCircle } from '@fortawesome/free-solid-svg-icons';
import { faCircle as farCircle } from '@fortawesome/free-regular-svg-icons';
import * as maps from '../../../games/reversi/maps';
import MkButton from '@client/components/ui/button.vue';
import MkSwitch from '@client/components/ui/switch.vue';

3
src/client/pages/reversi/game.vue
View file

@ -9,7 +9,6 @@ import { defineComponent } from 'vue';
import GameSetting from './game.setting.vue';
import GameBoard from './game.board.vue';
import * as os from '@client/os';
import { faGamepad } from '@fortawesome/free-solid-svg-icons';
import * as symbols from '@client/symbols';
export default defineComponent({
@ -29,7 +28,7 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts._reversi.reversi,
icon: faGamepad
icon: 'fas fa-gamepad'
},
game: null,
connection: null,

3
src/client/pages/reversi/index.vue
View file

@ -64,7 +64,6 @@ import { defineComponent } from 'vue';
import * as os from '@client/os';
import MkButton from '@client/components/ui/button.vue';
import MkFolder from '@client/components/ui/folder.vue';
import { faGamepad } from '@fortawesome/free-solid-svg-icons';
import * as symbols from '@client/symbols';
export default defineComponent({
@ -78,7 +77,7 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts._reversi.reversi,
icon: faGamepad
icon: 'fas fa-gamepad'
},
games: [],
gamesFetching: true,

17
src/client/pages/room/room.vue
View file

@ -17,18 +17,18 @@
</template>
</div>
<div class="_content">
<MkButton inline @click="translate()" :primary="isTranslateMode"><Fa :icon="faArrowsAlt"/> {{ $ts._rooms.translate }}</MkButton>
<MkButton inline @click="rotate()" :primary="isRotateMode"><Fa :icon="faUndo"/> {{ $ts._rooms.rotate }}</MkButton>
<MkButton inline v-if="isTranslateMode || isRotateMode" @click="exit()"><Fa :icon="faBan"/> {{ $ts._rooms.exit }}</MkButton>
<MkButton inline @click="translate()" :primary="isTranslateMode"><i class="fas fa-arrows-alt"></i> {{ $ts._rooms.translate }}</MkButton>
<MkButton inline @click="rotate()" :primary="isRotateMode"><i class="fas fa-undo"></i> {{ $ts._rooms.rotate }}</MkButton>
<MkButton inline v-if="isTranslateMode || isRotateMode" @click="exit()"><i class="fas fa-ban"></i> {{ $ts._rooms.exit }}</MkButton>
</div>
<div class="_content">
<MkButton @click="remove()"><Fa :icon="faTrashAlt"/> {{ $ts._rooms.remove }}</MkButton>
<MkButton @click="remove()"><i class="fas fa-trash-alt"></i> {{ $ts._rooms.remove }}</MkButton>
</div>
</div>
<div class="menu _section" v-if="isMyRoom">
<div class="_content">
<MkButton @click="add()"><Fa :icon="faBoxOpen"/> {{ $ts._rooms.addFurniture }}</MkButton>
<MkButton @click="add()"><i class="fas fa-box-open"></i> {{ $ts._rooms.addFurniture }}</MkButton>
</div>
<div class="_content">
<MkSelect :value="roomType" @update:value="updateRoomType($event)">
@ -42,8 +42,8 @@
</label>
</div>
<div class="_content">
<MkButton inline :disabled="!changed" primary @click="save()"><Fa :icon="faSave"/> {{ $ts.save }}</MkButton>
<MkButton inline @click="clear()"><Fa :icon="faBroom"/> {{ $ts._rooms.clear }}</MkButton>
<MkButton inline :disabled="!changed" primary @click="save()"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
<MkButton inline @click="clear()"><i class="fas fa-broom"></i> {{ $ts._rooms.clear }}</MkButton>
</div>
</div>
</div>
@ -55,8 +55,6 @@ import { Room } from '@client/scripts/room/room';
import parseAcct from '@/misc/acct/parse';
import XPreview from './preview.vue';
const storeItems = require('@client/scripts/room/furnitures.json5');
import { faBoxOpen, faUndo, faArrowsAlt, faBan, faBroom } from '@fortawesome/free-solid-svg-icons';
import { faSave, faTrashAlt } from '@fortawesome/free-regular-svg-icons';
import { query as urlQuery } from '../../../prelude/url';
import MkButton from '@client/components/ui/button.vue';
import MkSelect from '@client/components/ui/select.vue';
@ -98,7 +96,6 @@ export default defineComponent({
isRotateMode: false,
isMyRoom: false,
changed: false,
faBoxOpen, faSave, faTrashAlt, faUndo, faArrowsAlt, faBan, faBroom,
};
},

8
src/client/pages/scratchpad.vue
View file

@ -2,11 +2,11 @@
<div class="iltifgqe">
<div class="editor _panel _gap">
<PrismEditor class="_code code" v-model="code" :highlight="highlighter" :line-numbers="false"/>
<MkButton style="position: absolute; top: 8px; right: 8px;" @click="run()" primary><Fa :icon="faPlay"/></MkButton>
<MkButton style="position: absolute; top: 8px; right: 8px;" @click="run()" primary><i class="fas fa-play"></i></MkButton>
</div>
<MkContainer :foldable="true" class="_gap">
<template #header><Fa fixed-width/>{{ $ts.output }}</template>
<template #header>{{ $ts.output }}</template>
<div class="bepmlvbi">
<div v-for="log in logs" class="log" :key="log.id" :class="{ print: log.print }">{{ log.text }}</div>
</div>
@ -20,7 +20,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faTerminal, faPlay } from '@fortawesome/free-solid-svg-icons';
import 'prismjs';
import { highlight, languages } from 'prismjs/components/prism-core';
import 'prismjs/components/prism-clike';
@ -46,11 +45,10 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.scratchpad,
icon: faTerminal,
icon: 'fas fa-terminal',
},
code: '',
logs: [],
faTerminal, faPlay
}
},

3
src/client/pages/search.vue
View file

@ -8,7 +8,6 @@
<script lang="ts">
import { computed, defineComponent } from 'vue';
import { faSearch } 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';
@ -22,7 +21,7 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: computed(() => this.$t('searchWith', { q: this.$route.query.q })),
icon: faSearch
icon: 'fas fa-search'
},
pagination: {
endpoint: 'notes/search',

10
src/client/pages/settings/2fa.vue
View file

@ -1,6 +1,6 @@
<template>
<section class="_card">
<div class="_title"><Fa :icon="faLock"/> {{ $ts.twoStepAuthentication }}</div>
<div class="_title"><i class="fas fa-lock"></i> {{ $ts.twoStepAuthentication }}</div>
<div class="_content">
<MkButton v-if="!data && !$i.twoFactorEnabled" @click="register">{{ $ts._2fa.registerDevice }}</MkButton>
<template v-if="$i.twoFactorEnabled">
@ -28,7 +28,7 @@
<ol v-if="registration && !registration.error">
<li v-if="registration.stage >= 0">
{{ $ts.tapSecurityKey }}
<Fa icon="spinner" pulse fixed-width v-if="registration.saving && registration.stage == 0" />
<i v-if="registration.saving && registration.stage == 0" class="fas fa-spinner fa-pulse fa-fw"></i>
</li>
<li v-if="registration.stage >= 1">
<MkForm :disabled="registration.stage != 1 || registration.saving">
@ -36,7 +36,7 @@
<span>{{ $ts.securityKeyName }}</span>
</MkInput>
<MkButton @click="registerKey" :disabled="keyName.length == 0">{{ $ts.registerSecurityKey }}</MkButton>
<Fa icon="spinner" pulse fixed-width v-if="registration.saving && registration.stage == 1" />
<i v-if="registration.saving && registration.stage == 1" class="fas fa-spinner fa-pulse fa-fw"></i>
</MkForm>
</li>
</ol>
@ -68,7 +68,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faLock } from '@fortawesome/free-solid-svg-icons';
import { hostname } from '@client/config';
import { byteify, hexify, stringify } from '@client/scripts/2fa';
import MkButton from '@client/components/ui/button.vue';
@ -93,7 +92,7 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.twoStepAuthentication,
icon: faLock
icon: 'fas fa-lock'
},
data: null,
supportsCredentials: !!navigator.credentials,
@ -101,7 +100,6 @@ export default defineComponent({
registration: null,
keyName: '',
token: null,
faLock
};
},

3
src/client/pages/settings/account-info.vue
View file

@ -132,7 +132,6 @@
<script lang="ts">
import { defineAsyncComponent, defineComponent } from 'vue';
import { faInfoCircle } from '@fortawesome/free-solid-svg-icons';
import FormSwitch from '@client/components/form/switch.vue';
import FormSelect from '@client/components/form/select.vue';
import FormLink from '@client/components/form/link.vue';
@ -162,7 +161,7 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.accountInfo,
icon: faInfoCircle
icon: 'fas fa-info-circle'
},
stats: null
}

3
src/client/pages/settings/api.vue
View file

@ -8,7 +8,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faKey } from '@fortawesome/free-solid-svg-icons';
import FormSwitch from '@client/components/form/switch.vue';
import FormSelect from '@client/components/form/select.vue';
import FormLink from '@client/components/form/link.vue';
@ -31,7 +30,7 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: 'API',
icon: faKey
icon: 'fas fa-key'
},
isDesktop: window.innerWidth >= 1100,
};

6
src/client/pages/settings/apps.vue
View file

@ -22,7 +22,7 @@
<div><MkTime :time="token.lastUsedAt"/></div>
</div>
<div class="actions">
<button class="_button" @click="revoke(token)"><Fa :icon="faTrashAlt"/></button>
<button class="_button" @click="revoke(token)"><i class="fas fa-trash-alt"></i></button>
</div>
<details>
<summary>{{ $ts.details }}</summary>
@ -39,7 +39,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faTrashAlt, faPlug } from '@fortawesome/free-solid-svg-icons';
import FormPagination from '@client/components/form/pagination.vue';
import FormSelect from '@client/components/form/select.vue';
import FormLink from '@client/components/form/link.vue';
@ -61,7 +60,7 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.installedApps,
icon: faPlug,
icon: 'fas fa-plug',
},
pagination: {
endpoint: 'i/apps',
@ -70,7 +69,6 @@ export default defineComponent({
sort: '+lastUsedAt'
}
},
faTrashAlt, faPlug
};
},

4
src/client/pages/settings/deck.vue
View file

@ -31,7 +31,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faImage, faCog, faColumns } from '@fortawesome/free-solid-svg-icons';
import FormSwitch from '@client/components/form/switch.vue';
import FormLink from '@client/components/form/link.vue';
import FormRadios from '@client/components/form/radios.vue';
@ -59,9 +58,8 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.deck,
icon: faColumns
icon: 'fas fa-columns'
},
faImage, faCog,
}
},

7
src/client/pages/settings/drive.vue
View file

@ -27,7 +27,7 @@
<FormButton :center="false" @click="chooseUploadFolder()" primary>
{{ $ts.uploadFolder }}
<template #suffix>{{ uploadFolder ? uploadFolder.name : '-' }}</template>
<template #suffixIcon><Fa :icon="faFolderOpen"/></template>
<template #suffixIcon><i class="fas fa-folder-open"></i></template>
</FormButton>
</FormBase>
</template>
@ -36,8 +36,6 @@
import { defineComponent } from 'vue';
import * as tinycolor from 'tinycolor2';
import ApexCharts from 'apexcharts';
import { faCloud, faFolderOpen } from '@fortawesome/free-solid-svg-icons';
import { faClock, faEyeSlash, faTrashAlt } from '@fortawesome/free-regular-svg-icons';
import FormButton from '@client/components/form/button.vue';
import FormGroup from '@client/components/form/group.vue';
import FormKeyValueView from '@client/components/form/key-value-view.vue';
@ -60,13 +58,12 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.drive,
icon: faCloud
icon: 'fas fa-cloud'
},
fetching: true,
usage: null,
capacity: null,
uploadFolder: null,
faCloud, faClock, faEyeSlash, faFolderOpen, faTrashAlt
}
},

5
src/client/pages/settings/email-address.vue
View file

@ -13,8 +13,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faCog } from '@fortawesome/free-solid-svg-icons';
import { faBell, faEnvelope } from '@fortawesome/free-regular-svg-icons';
import FormButton from '@client/components/form/button.vue';
import FormInput from '@client/components/form/input.vue';
import FormBase from '@client/components/form/base.vue';
@ -36,11 +34,10 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.emailAddress,
icon: faEnvelope
icon: 'fas fa-envelope'
},
emailAddress: null,
code: null,
faCog
}
},

4
src/client/pages/settings/email-notification.vue
View file

@ -25,8 +25,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faCog } from '@fortawesome/free-solid-svg-icons';
import { faBell, faEnvelope } from '@fortawesome/free-regular-svg-icons';
import FormButton from '@client/components/form/button.vue';
import FormSwitch from '@client/components/form/switch.vue';
import FormBase from '@client/components/form/base.vue';
@ -49,7 +47,7 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.emailNotification,
icon: faEnvelope
icon: 'fas fa-envelope'
},
mention: this.$i.emailNotificationTypes.includes('mention'),

11
src/client/pages/settings/email.vue
View file

@ -3,14 +3,14 @@
<FormGroup>
<template #label>{{ $ts.emailAddress }}</template>
<FormLink to="/settings/email/address">
<template v-if="$i.email && !$i.emailVerified" #icon><Fa :icon="faExclamationTriangle" style="color: var(--warn);"/></template>
<template v-else-if="$i.email && $i.emailVerified" #icon><Fa :icon="faCheck" style="color: var(--success);"/></template>
<template v-if="$i.email && !$i.emailVerified" #icon><i class="fas fa-exclamation-triangle" style="color: var(--warn);"></i></template>
<template v-else-if="$i.email && $i.emailVerified" #icon><i class="fas fa-check" style="color: var(--success);"></i></template>
{{ $i.email || $ts.notSet }}
</FormLink>
</FormGroup>
<FormLink to="/settings/email/notification">
<template #icon><Fa :icon="faBell"/></template>
<template #icon><i class="fas fa-bell"></i></template>
{{ $ts.emailNotification }}
</FormLink>
@ -22,8 +22,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faCog, faExclamationTriangle, faCheck } from '@fortawesome/free-solid-svg-icons';
import { faBell, faEnvelope } from '@fortawesome/free-regular-svg-icons';
import FormButton from '@client/components/form/button.vue';
import FormLink from '@client/components/form/link.vue';
import FormBase from '@client/components/form/base.vue';
@ -47,9 +45,8 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.email,
icon: faEnvelope
icon: 'fas fa-envelope'
},
faCog, faExclamationTriangle, faCheck, faBell
}
},

3
src/client/pages/settings/experimental-features.vue
View file

@ -6,7 +6,6 @@
<script lang="ts">
import { defineAsyncComponent, defineComponent } from 'vue';
import { faFlask } from '@fortawesome/free-solid-svg-icons';
import FormSwitch from '@client/components/form/switch.vue';
import FormSelect from '@client/components/form/select.vue';
import FormLink from '@client/components/form/link.vue';
@ -34,7 +33,7 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.experimentalFeatures,
icon: faFlask
icon: 'fas fa-flask'
},
stats: null
}

4
src/client/pages/settings/general.vue
View file

@ -83,7 +83,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faImage, faCog, faColumns, faCogs } from '@fortawesome/free-solid-svg-icons';
import FormSwitch from '@client/components/form/switch.vue';
import FormSelect from '@client/components/form/select.vue';
import FormRadios from '@client/components/form/radios.vue';
@ -117,13 +116,12 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.general,
icon: faCogs
icon: 'fas fa-cogs'
},
langs,
lang: localStorage.getItem('lang'),
fontSize: localStorage.getItem('fontSize'),
useSystemFont: localStorage.getItem('useSystemFont') != null,
faImage, faCog, faColumns
}
},

18
src/client/pages/settings/import-export.vue
View file

@ -2,32 +2,31 @@
<FormBase>
<FormGroup>
<template #label>{{ $ts._exportOrImport.allNotes }}</template>
<FormButton @click="doExport('notes')"><Fa :icon="faDownload"/> {{ $ts.export }}</FormButton>
<FormButton @click="doExport('notes')"><i class="fas fa-download"></i> {{ $ts.export }}</FormButton>
</FormGroup>
<FormGroup>
<template #label>{{ $ts._exportOrImport.followingList }}</template>
<FormButton @click="doExport('following')"><Fa :icon="faDownload"/> {{ $ts.export }}</FormButton>
<FormButton @click="doImport('following', $event)"><Fa :icon="faUpload"/> {{ $ts.import }}</FormButton>
<FormButton @click="doExport('following')"><i class="fas fa-download"></i> {{ $ts.export }}</FormButton>
<FormButton @click="doImport('following', $event)"><i class="fas fa-upload"></i> {{ $ts.import }}</FormButton>
</FormGroup>
<FormGroup>
<template #label>{{ $ts._exportOrImport.userLists }}</template>
<FormButton @click="doExport('user-lists')"><Fa :icon="faDownload"/> {{ $ts.export }}</FormButton>
<FormButton @click="doImport('user-lists', $event)"><Fa :icon="faUpload"/> {{ $ts.import }}</FormButton>
<FormButton @click="doExport('user-lists')"><i class="fas fa-download"></i> {{ $ts.export }}</FormButton>
<FormButton @click="doImport('user-lists', $event)"><i class="fas fa-upload"></i> {{ $ts.import }}</FormButton>
</FormGroup>
<FormGroup>
<template #label>{{ $ts._exportOrImport.muteList }}</template>
<FormButton @click="doExport('mute')"><Fa :icon="faDownload"/> {{ $ts.export }}</FormButton>
<FormButton @click="doExport('mute')"><i class="fas fa-download"></i> {{ $ts.export }}</FormButton>
</FormGroup>
<FormGroup>
<template #label>{{ $ts._exportOrImport.blockingList }}</template>
<FormButton @click="doExport('blocking')"><Fa :icon="faDownload"/> {{ $ts.export }}</FormButton>
<FormButton @click="doExport('blocking')"><i class="fas fa-download"></i> {{ $ts.export }}</FormButton>
</FormGroup>
</FormBase>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { faDownload, faUpload, faBoxes } from '@fortawesome/free-solid-svg-icons';
import FormSelect from '@client/components/form/select.vue';
import FormButton from '@client/components/form/button.vue';
import FormBase from '@client/components/form/base.vue';
@ -49,9 +48,8 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.importAndExport,
icon: faBoxes
icon: 'fas fa-boxes'
},
faDownload, faUpload, faBoxes
}
},

41
src/client/pages/settings/index.vue
View file

@ -4,30 +4,30 @@
<FormBase>
<FormGroup>
<template #label>{{ $ts.basicSettings }}</template>
<FormLink :active="page === 'profile'" replace to="/settings/profile"><template #icon><Fa :icon="faUser"/></template>{{ $ts.profile }}</FormLink>
<FormLink :active="page === 'privacy'" replace to="/settings/privacy"><template #icon><Fa :icon="faLockOpen"/></template>{{ $ts.privacy }}</FormLink>
<FormLink :active="page === 'reaction'" replace to="/settings/reaction"><template #icon><Fa :icon="faLaugh"/></template>{{ $ts.reaction }}</FormLink>
<FormLink :active="page === 'drive'" replace to="/settings/drive"><template #icon><Fa :icon="faCloud"/></template>{{ $ts.drive }}</FormLink>
<FormLink :active="page === 'notifications'" replace to="/settings/notifications"><template #icon><Fa :icon="faBell"/></template>{{ $ts.notifications }}</FormLink>
<FormLink :active="page === 'email'" replace to="/settings/email"><template #icon><Fa :icon="faEnvelope"/></template>{{ $ts.email }}</FormLink>
<FormLink :active="page === 'integration'" replace to="/settings/integration"><template #icon><Fa :icon="faShareAlt"/></template>{{ $ts.integration }}</FormLink>
<FormLink :active="page === 'security'" replace to="/settings/security"><template #icon><Fa :icon="faLock"/></template>{{ $ts.security }}</FormLink>
<FormLink :active="page === 'profile'" replace to="/settings/profile"><template #icon><i class="fas fa-user"></i></template>{{ $ts.profile }}</FormLink>
<FormLink :active="page === 'privacy'" replace to="/settings/privacy"><template #icon><i class="fas fa-lock-open"></i></template>{{ $ts.privacy }}</FormLink>
<FormLink :active="page === 'reaction'" replace to="/settings/reaction"><template #icon><i class="fas fa-laugh"></i></template>{{ $ts.reaction }}</FormLink>
<FormLink :active="page === 'drive'" replace to="/settings/drive"><template #icon><i class="fas fa-cloud"></i></template>{{ $ts.drive }}</FormLink>
<FormLink :active="page === 'notifications'" replace to="/settings/notifications"><template #icon><i class="fas fa-bell"></i></template>{{ $ts.notifications }}</FormLink>
<FormLink :active="page === 'email'" replace to="/settings/email"><template #icon><i class="fas fa-envelope"></i></template>{{ $ts.email }}</FormLink>
<FormLink :active="page === 'integration'" replace to="/settings/integration"><template #icon><i class="fas fa-share-alt"></i></template>{{ $ts.integration }}</FormLink>
<FormLink :active="page === 'security'" replace to="/settings/security"><template #icon><i class="fas fa-lock"></i></template>{{ $ts.security }}</FormLink>
</FormGroup>
<FormGroup>
<template #label>{{ $ts.clientSettings }}</template>
<FormLink :active="page === 'general'" replace to="/settings/general"><template #icon><Fa :icon="faCogs"/></template>{{ $ts.general }}</FormLink>
<FormLink :active="page === 'theme'" replace to="/settings/theme"><template #icon><Fa :icon="faPalette"/></template>{{ $ts.theme }}</FormLink>
<FormLink :active="page === 'sidebar'" replace to="/settings/sidebar"><template #icon><Fa :icon="faListUl"/></template>{{ $ts.sidebar }}</FormLink>
<FormLink :active="page === 'sounds'" replace to="/settings/sounds"><template #icon><Fa :icon="faMusic"/></template>{{ $ts.sounds }}</FormLink>
<FormLink :active="page === 'plugin'" replace to="/settings/plugin"><template #icon><Fa :icon="faPlug"/></template>{{ $ts.plugins }}</FormLink>
<FormLink :active="page === 'general'" replace to="/settings/general"><template #icon><i class="fas fa-cogs"></i></template>{{ $ts.general }}</FormLink>
<FormLink :active="page === 'theme'" replace to="/settings/theme"><template #icon><i class="fas fa-palette"></i></template>{{ $ts.theme }}</FormLink>
<FormLink :active="page === 'sidebar'" replace to="/settings/sidebar"><template #icon><i class="fas fa-list-ul"></i></template>{{ $ts.sidebar }}</FormLink>
<FormLink :active="page === 'sounds'" replace to="/settings/sounds"><template #icon><i class="fas fa-music"></i></template>{{ $ts.sounds }}</FormLink>
<FormLink :active="page === 'plugin'" replace to="/settings/plugin"><template #icon><i class="fas fa-plug"></i></template>{{ $ts.plugins }}</FormLink>
</FormGroup>
<FormGroup>
<template #label>{{ $ts.otherSettings }}</template>
<FormLink :active="page === 'import-export'" replace to="/settings/import-export"><template #icon><Fa :icon="faBoxes"/></template>{{ $ts.importAndExport }}</FormLink>
<FormLink :active="page === 'mute-block'" replace to="/settings/mute-block"><template #icon><Fa :icon="faBan"/></template>{{ $ts.muteAndBlock }}</FormLink>
<FormLink :active="page === 'word-mute'" replace to="/settings/word-mute"><template #icon><Fa :icon="faCommentSlash"/></template>{{ $ts.wordMute }}</FormLink>
<FormLink :active="page === 'api'" replace to="/settings/api"><template #icon><Fa :icon="faKey"/></template>API</FormLink>
<FormLink :active="page === 'other'" replace to="/settings/other"><template #icon><Fa :icon="faEllipsisH"/></template>{{ $ts.other }}</FormLink>
<FormLink :active="page === 'import-export'" replace to="/settings/import-export"><template #icon><i class="fas fa-boxes"></i></template>{{ $ts.importAndExport }}</FormLink>
<FormLink :active="page === 'mute-block'" replace to="/settings/mute-block"><template #icon><i class="fas fa-ban"></i></template>{{ $ts.muteAndBlock }}</FormLink>
<FormLink :active="page === 'word-mute'" replace to="/settings/word-mute"><template #icon><i class="fas fa-comment-slash"></i></template>{{ $ts.wordMute }}</FormLink>
<FormLink :active="page === 'api'" replace to="/settings/api"><template #icon><i class="fas fa-key"></i></template>API</FormLink>
<FormLink :active="page === 'other'" replace to="/settings/other"><template #icon><i class="fas fa-ellipsis-h"></i></template>{{ $ts.other }}</FormLink>
</FormGroup>
<FormGroup>
<FormButton @click="clear">{{ $ts.clearCache }}</FormButton>
@ -45,8 +45,6 @@
<script lang="ts">
import { computed, defineAsyncComponent, defineComponent, nextTick, onMounted, reactive, ref, watch } from 'vue';
import { faCog, faPalette, faPlug, faUser, faListUl, faLock, faCommentSlash, faMusic, faCogs, faEllipsisH, faBan, faShareAlt, faLockOpen, faKey, faBoxes, faCloud } from '@fortawesome/free-solid-svg-icons';
import { faLaugh, faBell, faEnvelope } from '@fortawesome/free-regular-svg-icons';
import { i18n } from '@client/i18n';
import FormLink from '@client/components/form/link.vue';
import FormGroup from '@client/components/form/group.vue';
@ -75,7 +73,7 @@ export default defineComponent({
setup(props, context) {
const indexInfo = {
title: i18n.locale.settings,
icon: faCog
icon: 'fas fa-cog'
};
const INFO = ref(indexInfo);
const page = ref(props.initialPage);
@ -183,7 +181,6 @@ export default defineComponent({
localStorage.removeItem('theme');
unisonReload();
},
faPalette, faPlug, faUser, faListUl, faLock, faLaugh, faCommentSlash, faMusic, faBell, faCogs, faEllipsisH, faBan, faShareAlt, faLockOpen, faKey, faBoxes, faEnvelope, faCloud,
};
},
});

11
src/client/pages/settings/integration.vue
View file

@ -1,7 +1,7 @@
<template>
<FormBase>
<div class="_formItem" v-if="enableTwitterIntegration">
<div class="_formLabel"><Fa :icon="faTwitter"/> Twitter</div>
<div class="_formLabel"><i class="fab fa-twitter"></i> Twitter</div>
<div class="_formPanel" style="padding: 16px;">
<p v-if="integrations.twitter">{{ $ts.connectedTo }}: <a :href="`https://twitter.com/${integrations.twitter.screenName}`" rel="nofollow noopener" target="_blank">@{{ integrations.twitter.screenName }}</a></p>
<MkButton v-if="integrations.twitter" @click="disconnectTwitter" danger>{{ $ts.disconnectSerice }}</MkButton>
@ -10,7 +10,7 @@
</div>
<div class="_formItem" v-if="enableDiscordIntegration">
<div class="_formLabel"><Fa :icon="faDiscord"/> Discord</div>
<div class="_formLabel"><i class="fab fa-discord"></i> Discord</div>
<div class="_formPanel" style="padding: 16px;">
<p v-if="integrations.discord">{{ $ts.connectedTo }}: <a :href="`https://discord.com/users/${integrations.discord.id}`" rel="nofollow noopener" target="_blank">@{{ integrations.discord.username }}#{{ integrations.discord.discriminator }}</a></p>
<MkButton v-if="integrations.discord" @click="disconnectDiscord" danger>{{ $ts.disconnectSerice }}</MkButton>
@ -19,7 +19,7 @@
</div>
<div class="_formItem" v-if="enableGithubIntegration">
<div class="_formLabel"><Fa :icon="faGithub"/> GitHub</div>
<div class="_formLabel"><i class="fab fa-github"></i> GitHub</div>
<div class="_formPanel" style="padding: 16px;">
<p v-if="integrations.github">{{ $ts.connectedTo }}: <a :href="`https://github.com/${integrations.github.login}`" rel="nofollow noopener" target="_blank">@{{ integrations.github.login }}</a></p>
<MkButton v-if="integrations.github" @click="disconnectGithub" danger>{{ $ts.disconnectSerice }}</MkButton>
@ -31,8 +31,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faShareAlt } from '@fortawesome/free-solid-svg-icons';
import { faTwitter, faDiscord, faGithub } from '@fortawesome/free-brands-svg-icons';
import { apiUrl } from '@client/config';
import FormBase from '@client/components/form/base.vue';
import MkButton from '@client/components/ui/button.vue';
@ -51,7 +49,7 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.integration,
icon: faShareAlt
icon: 'fas fa-share-alt'
},
apiUrl,
twitterForm: null,
@ -60,7 +58,6 @@ export default defineComponent({
enableTwitterIntegration: false,
enableDiscordIntegration: false,
enableGithubIntegration: false,
faShareAlt, faTwitter, faDiscord, faGithub
};
},

3
src/client/pages/settings/mute-block.vue
View file

@ -33,7 +33,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faBan } from '@fortawesome/free-solid-svg-icons';
import MkPagination from '@client/components/ui/pagination.vue';
import MkTab from '@client/components/tab.vue';
import FormInfo from '@client/components/form/info.vue';
@ -60,7 +59,7 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.muteAndBlock,
icon: faBan
icon: 'fas fa-ban'
},
tab: 'mute',
mutingPagination: {

5
src/client/pages/settings/notifications.vue
View file

@ -11,8 +11,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faCog } from '@fortawesome/free-solid-svg-icons';
import { faBell } from '@fortawesome/free-regular-svg-icons';
import FormButton from '@client/components/form/button.vue';
import FormLink from '@client/components/form/link.vue';
import FormBase from '@client/components/form/base.vue';
@ -35,9 +33,8 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.notifications,
icon: faBell
icon: 'fas fa-bell'
},
faCog
}
},

10
src/client/pages/settings/other.vue
View file

@ -21,10 +21,10 @@
</template>
</FormGroup>
<FormLink to="/settings/registry"><template #icon><Fa :icon="faCogs"/></template>{{ $ts.registry }}</FormLink>
<FormLink to="/settings/registry"><template #icon><i class="fas fa-cogs"></i></template>{{ $ts.registry }}</FormLink>
<FormLink to="/bios" behavior="browser"><template #icon><Fa :icon="faDoorOpen"/></template>BIOS</FormLink>
<FormLink to="/cli" behavior="browser"><template #icon><Fa :icon="faDoorOpen"/></template>CLI</FormLink>
<FormLink to="/bios" behavior="browser"><template #icon><i class="fas fa-door-open"></i></template>BIOS</FormLink>
<FormLink to="/cli" behavior="browser"><template #icon><i class="fas fa-door-open"></i></template>CLI</FormLink>
<FormButton @click="closeAccount" danger>{{ $ts.closeAccount }}</FormButton>
</FormBase>
@ -32,7 +32,6 @@
<script lang="ts">
import { defineAsyncComponent, defineComponent } from 'vue';
import { faEllipsisH, faCogs, faDoorOpen } from '@fortawesome/free-solid-svg-icons';
import FormSwitch from '@client/components/form/switch.vue';
import FormSelect from '@client/components/form/select.vue';
import FormLink from '@client/components/form/link.vue';
@ -62,10 +61,9 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.other,
icon: faEllipsisH
icon: 'fas fa-ellipsis'H
},
debug,
faCogs, faDoorOpen,
}
},

6
src/client/pages/settings/plugin.install.vue
View file

@ -8,13 +8,12 @@
</FormTextarea>
</FormGroup>
<FormButton @click="install" :disabled="code == null" primary inline><Fa :icon="faCheck"/> {{ $ts.install }}</FormButton>
<FormButton @click="install" :disabled="code == null" primary inline><i class="fas fa-check"></i> {{ $ts.install }}</FormButton>
</FormBase>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { faPalette, faDownload, faFolderOpen, faCheck, faTrashAlt, faEye } from '@fortawesome/free-solid-svg-icons';
import { AiScript, parse } from '@syuilo/aiscript';
import { serialize } from '@syuilo/aiscript/built/serializer';
import { v4 as uuid } from 'uuid';
@ -49,10 +48,9 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts._plugin.install,
icon: faDownload
icon: 'fas fa-download'
},
code: null,
faPalette, faDownload, faFolderOpen, faCheck, faTrashAlt, faEye
}
},

8
src/client/pages/settings/plugin.manage.vue
View file

@ -22,8 +22,8 @@
</div>
<div class="_formItem">
<div class="_formPanel" style="padding: 16px;">
<MkButton @click="config(plugin)" inline v-if="plugin.config"><Fa :icon="faCog"/> {{ $ts.settings }}</MkButton>
<MkButton @click="uninstall(plugin)" inline danger><Fa :icon="faTrashAlt"/> {{ $ts.uninstall }}</MkButton>
<MkButton @click="config(plugin)" inline v-if="plugin.config"><i class="fas fa-cog"></i> {{ $ts.settings }}</MkButton>
<MkButton @click="uninstall(plugin)" inline danger><i class="fas fa-trash-alt"></i> {{ $ts.uninstall }}</MkButton>
</div>
</div>
</FormGroup>
@ -32,7 +32,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faPlug, faSave, faTrashAlt, faFolderOpen, faDownload, faCog } from '@fortawesome/free-solid-svg-icons';
import MkButton from '@client/components/ui/button.vue';
import MkTextarea from '@client/components/ui/textarea.vue';
import MkSelect from '@client/components/ui/select.vue';
@ -59,10 +58,9 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts._plugin.manage,
icon: faPlug
icon: 'fas fa-plug'
},
plugins: ColdDeviceStorage.get('plugins'),
faPlug, faSave, faTrashAlt, faFolderOpen, faDownload, faCog
}
},

8
src/client/pages/settings/plugin.vue
View file

@ -1,13 +1,12 @@
<template>
<FormBase>
<FormLink to="/settings/plugin/install"><template #icon><Fa :icon="faDownload"/></template>{{ $ts._plugin.install }}</FormLink>
<FormLink to="/settings/plugin/manage"><template #icon><Fa :icon="faFolderOpen"/></template>{{ $ts._plugin.manage }}<template #suffix>{{ plugins }}</template></FormLink>
<FormLink to="/settings/plugin/install"><template #icon><i class="fas fa-download"></i></template>{{ $ts._plugin.install }}</FormLink>
<FormLink to="/settings/plugin/manage"><template #icon><i class="fas fa-folder-open"></i></template>{{ $ts._plugin.manage }}<template #suffix>{{ plugins }}</template></FormLink>
</FormBase>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { faPlug, faSave, faTrashAlt, faFolderOpen, faDownload, faCog } from '@fortawesome/free-solid-svg-icons';
import FormBase from '@client/components/form/base.vue';
import FormGroup from '@client/components/form/group.vue';
import FormLink from '@client/components/form/link.vue';
@ -27,10 +26,9 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.plugins,
icon: faPlug
icon: 'fas fa-plug'
},
plugins: ColdDeviceStorage.get('plugins').length,
faPlug, faSave, faTrashAlt, faFolderOpen, faDownload, faCog
}
},

3
src/client/pages/settings/privacy.vue
View file

@ -33,7 +33,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faLockOpen } from '@fortawesome/free-solid-svg-icons';
import FormSwitch from '@client/components/form/switch.vue';
import FormSelect from '@client/components/form/select.vue';
import FormBase from '@client/components/form/base.vue';
@ -56,7 +55,7 @@ export default defineComponent({
return {
[symbols.PAGE_INFO]: {
title: this.$ts.privacy,
icon: faLockOpen
icon: 'fas fa-lock-open'
},
isLocked: false,
autoAcceptFollowed: false,

Some files were not shown because too many files have changed in this diff Show more