Skip to content
This repository was archived by the owner on Feb 5, 2024. It is now read-only.

Commit 1134956

Browse files
syuilosyuilo
authored
Use FontAwesome as web font instead of vue component (misskey-dev#7469)
* wip * wip * wip * wip * wip * wip * wip * wip * wip * Update yarn.lock * wip * wip
1 parent 8bb6ed6 commit 1134956

File tree

245 files changed

+1156
-1775
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

245 files changed

+1156
-1775
lines changed

‎package.json

+1-6
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "misskey",
33
"author": "syuilo <[email protected]>",
4-
"version": "12.77.1",
4+
"version": "12.78.0-beta.1",
55
"codename": "indigo",
66
"repository": {
77
"type": "git",
@@ -39,11 +39,6 @@
3939
"dependencies": {
4040
"@babel/plugin-transform-runtime": "7.13.15",
4141
"@elastic/elasticsearch": "7.11.0",
42-
"@fortawesome/fontawesome-svg-core": "1.2.35",
43-
"@fortawesome/free-brands-svg-icons": "5.15.3",
44-
"@fortawesome/free-regular-svg-icons": "5.15.3",
45-
"@fortawesome/free-solid-svg-icons": "5.15.3",
46-
"@fortawesome/vue-fontawesome": "3.0.0-3",
4742
"@koa/cors": "3.1.0",
4843
"@koa/multer": "3.0.0",
4944
"@koa/router": "9.0.1",

‎src/client/components/abuse-report-window.vue

+1-3
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<template>
22
<XWindow ref="window" :initial-width="400" :initial-height="500" :can-resize="true" @closed="$emit('closed')">
33
<template #header>
4-
<Fa :icon="faExclamationCircle" style="margin-right: 0.5em;"/>
4+
<i class="fas fa-exclamation-circle" style="margin-right: 0.5em;"></i>
55
<I18n :src="$ts.reportAbuseOf" tag="span">
66
<template #name>
77
<b><MkAcct :user="user"/></b>
@@ -24,7 +24,6 @@
2424

2525
<script lang="ts">
2626
import { defineComponent, markRaw } from 'vue';
27-
import { faExclamationCircle } from '@fortawesome/free-solid-svg-icons';
2827
import XWindow from '@client/components/ui/window.vue';
2928
import MkTextarea from '@client/components/ui/textarea.vue';
3029
import MkButton from '@client/components/ui/button.vue';
@@ -53,7 +52,6 @@ export default defineComponent({
5352
data() {
5453
return {
5554
comment: this.initialComment || '',
56-
faExclamationCircle,
5755
};
5856
},
5957

‎src/client/components/channel-follow-button.vue

+3-5
Original file line numberDiff line numberDiff line change
@@ -6,21 +6,20 @@
66
>
77
<template v-if="!wait">
88
<template v-if="isFollowing">
9-
<span v-if="full">{{ $ts.unfollow }}</span><Fa :icon="faMinus"/>
9+
<span v-if="full">{{ $ts.unfollow }}</span><i class="fas fa-minus"></i>
1010
</template>
1111
<template v-else>
12-
<span v-if="full">{{ $ts.follow }}</span><Fa :icon="faPlus"/>
12+
<span v-if="full">{{ $ts.follow }}</span><i class="fas fa-plus"></i>
1313
</template>
1414
</template>
1515
<template v-else>
16-
<span v-if="full">{{ $ts.processing }}</span><Fa :icon="faSpinner" pulse fixed-width/>
16+
<span v-if="full">{{ $ts.processing }}</span><i class="fas fa-spinner fa-pulse fa-fw"></i>
1717
</template>
1818
</button>
1919
</template>
2020

2121
<script lang="ts">
2222
import { defineComponent } from 'vue';
23-
import { faSpinner, faPlus, faMinus, } from '@fortawesome/free-solid-svg-icons';
2423
import * as os from '@client/os';
2524
2625
export default defineComponent({
@@ -40,7 +39,6 @@ export default defineComponent({
4039
return {
4140
isFollowing: this.channel.isFollowing,
4241
wait: false,
43-
faSpinner, faPlus, faMinus,
4442
};
4543
},
4644

‎src/client/components/channel-preview.vue

+3-5
Original file line numberDiff line numberDiff line change
@@ -2,18 +2,18 @@
22
<MkA :to="`/channels/${channel.id}`" class="eftoefju _panel" tabindex="-1">
33
<div class="banner" :style="bannerStyle">
44
<div class="fade"></div>
5-
<div class="name"><Fa :icon="faSatelliteDish"/> {{ channel.name }}</div>
5+
<div class="name"><i class="fas fa-satellite-dish"></i> {{ channel.name }}</div>
66
<div class="status">
77
<div>
8-
<Fa :icon="faUsers" fixed-width/>
8+
<i class="fas fa-users fa-fw"></i>
99
<I18n :src="$ts._channel.usersCount" tag="span" style="margin-left: 4px;">
1010
<template #n>
1111
<b>{{ channel.usersCount }}</b>
1212
</template>
1313
</I18n>
1414
</div>
1515
<div>
16-
<Fa :icon="faPencilAlt" fixed-width/>
16+
<i class="fas fa-pencil-alt fa-fw"></i>
1717
<I18n :src="$ts._channel.notesCount" tag="span" style="margin-left: 4px;">
1818
<template #n>
1919
<b>{{ channel.notesCount }}</b>
@@ -35,7 +35,6 @@
3535

3636
<script lang="ts">
3737
import { defineComponent } from 'vue';
38-
import { faSatelliteDish, faUsers, faPencilAlt } from '@fortawesome/free-solid-svg-icons';
3938
4039
export default defineComponent({
4140
props: {
@@ -57,7 +56,6 @@ export default defineComponent({
5756
5857
data() {
5958
return {
60-
faSatelliteDish, faUsers, faPencilAlt,
6159
};
6260
},
6361
});

‎src/client/components/date-separated-list.vue

+4-8
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
11
<script lang="ts">
22
import { defineComponent, h, TransitionGroup } from 'vue';
3-
import { faAngleUp, faAngleDown } from '@fortawesome/free-solid-svg-icons';
4-
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
53
64
export default defineComponent({
75
props: {
@@ -73,17 +71,15 @@ export default defineComponent({
7371
class: 'date'
7472
}, [
7573
h('span', [
76-
h(FontAwesomeIcon, {
77-
class: 'icon',
78-
icon: faAngleUp,
74+
h('i', {
75+
class: 'fas fa-angle-up icon',
7976
}),
8077
this.getDateText(item.createdAt)
8178
]),
8279
h('span', [
8380
this.getDateText(this.items[i + 1].createdAt),
84-
h(FontAwesomeIcon, {
85-
class: 'icon',
86-
icon: faAngleDown,
81+
h('i', {
82+
class: 'fas fa-angle-down icon',
8783
})
8884
])
8985
]));

‎src/client/components/dialog.vue

+7-10
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,15 @@
22
<MkModal ref="modal" @click="done(true)" @closed="$emit('closed')">
33
<div class="mk-dialog">
44
<div class="icon" v-if="icon">
5-
<Fa :icon="icon"/>
5+
<i :class="icon"></i>
66
</div>
77
<div class="icon" v-else-if="!input && !select" :class="type">
8-
<Fa :icon="faCheck" v-if="type === 'success'"/>
9-
<Fa :icon="faTimesCircle" v-if="type === 'error'"/>
10-
<Fa :icon="faExclamationTriangle" v-if="type === 'warning'"/>
11-
<Fa :icon="faInfoCircle" v-if="type === 'info'"/>
12-
<Fa :icon="faQuestionCircle" v-if="type === 'question'"/>
13-
<Fa :icon="faSpinner" pulse v-if="type === 'waiting'"/>
8+
<i v-if="type === 'success'" class="fas fa-check"></i>
9+
<i v-else-if="type === 'error'" class="fas fa-times-circle"></i>
10+
<i v-else-if="type === 'warning'" class="fas fa-exclamation-triangle"></i>
11+
<i v-else-if="type === 'info'" class="fas fa-information-circle"></i>
12+
<i v-else-if="type === 'question'" class="fas fa-question-circle"></i>
13+
<i v-else-if="type === 'waiting'" class="fas fa-spinner fa-pulse"></i>
1414
</div>
1515
<header v-if="title"><Mfm :text="title"/></header>
1616
<div class="body" v-if="text"><Mfm :text="text"/></div>
@@ -38,8 +38,6 @@
3838

3939
<script lang="ts">
4040
import { defineComponent } from 'vue';
41-
import { faSpinner, faInfoCircle, faExclamationTriangle, faCheck } from '@fortawesome/free-solid-svg-icons';
42-
import { faTimesCircle, faQuestionCircle } from '@fortawesome/free-regular-svg-icons';
4341
import MkModal from '@client/components/ui/modal.vue';
4442
import MkButton from '@client/components/ui/button.vue';
4543
import MkInput from '@client/components/ui/input.vue';
@@ -99,7 +97,6 @@ export default defineComponent({
9997
return {
10098
inputValue: this.input && this.input.default ? this.input.default : null,
10199
selectedValue: this.select ? this.select.default ? this.select.default : this.select.items ? this.select.items[0].value : this.select.groupedItems[0].items[0].value : null,
102-
faTimesCircle, faQuestionCircle, faSpinner, faInfoCircle, faExclamationTriangle, faCheck
103100
};
104101
},
105102

‎src/client/components/drive-file-thumbnail.vue

+10-29
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,21 @@
11
<template>
22
<div class="zdjebgpv" ref="thumbnail">
33
<ImgWithBlurhash v-if="isThumbnailAvailable" :hash="file.blurhash" :src="file.thumbnailUrl" :alt="file.name" :title="file.name" :style="`object-fit: ${ fit }`"/>
4-
<Fa :icon="faFileImage" class="icon" v-else-if="is === 'image'"/>
5-
<Fa :icon="faFileVideo" class="icon" v-else-if="is === 'video'"/>
6-
<Fa :icon="faMusic" class="icon" v-else-if="is === 'audio' || is === 'midi'"/>
7-
<Fa :icon="faFileCsv" class="icon" v-else-if="is === 'csv'"/>
8-
<Fa :icon="faFilePdf" class="icon" v-else-if="is === 'pdf'"/>
9-
<Fa :icon="faFileAlt" class="icon" v-else-if="is === 'textfile'"/>
10-
<Fa :icon="faFileArchive" class="icon" v-else-if="is === 'archive'"/>
11-
<Fa :icon="faFile" class="icon" v-else/>
12-
<Fa :icon="faFilm" class="icon-sub" v-if="isThumbnailAvailable && is === 'video'"/>
4+
<i v-else-if="is === 'image'" class="fas fa-file-image icon"></i>
5+
<i v-else-if="is === 'video'" class="fas fa-file-video icon"></i>
6+
<i v-else-if="is === 'audio' || is === 'midi'" class="fas fa-music icon"></i>
7+
<i v-else-if="is === 'csv'" class="fas fa-file-csv icon"></i>
8+
<i v-else-if="is === 'pdf'" class="fas fa-file-pdf icon"></i>
9+
<i v-else-if="is === 'textfile'" class="fas fa-file-alt icon"></i>
10+
<i v-else-if="is === 'archive'" class="fas fa-file-archive icon"></i>
11+
<i v-else class="fas fa-file icon"></i>
12+
13+
<i v-if="isThumbnailAvailable && is === 'video'" class="fas fa-film icon-sub"></i>
1314
</div>
1415
</template>
1516

1617
<script lang="ts">
1718
import { defineComponent } from 'vue';
18-
import {
19-
faFile,
20-
faFileAlt,
21-
faFileImage,
22-
faMusic,
23-
faFileVideo,
24-
faFileCsv,
25-
faFilePdf,
26-
faFileArchive,
27-
faFilm
28-
} from '@fortawesome/free-solid-svg-icons';
2919
import ImgWithBlurhash from '@client/components/img-with-blurhash.vue';
3020
import { ColdDeviceStorage } from '@client/store';
3121
@@ -49,15 +39,6 @@ export default defineComponent({
4939
isContextmenuShowing: false,
5040
isDragging: false,
5141
52-
faFile,
53-
faFileAlt,
54-
faFileImage,
55-
faMusic,
56-
faFileVideo,
57-
faFileCsv,
58-
faFilePdf,
59-
faFileArchive,
60-
faFilm
6142
};
6243
},
6344
computed: {

‎src/client/components/drive.file.vue

+4-6
Original file line numberDiff line numberDiff line change
@@ -32,8 +32,6 @@
3232

3333
<script lang="ts">
3434
import { defineComponent } from 'vue';
35-
import { faEye, faEyeSlash } from '@fortawesome/free-regular-svg-icons';
36-
import { faDownload, faLink, faICursor, faTrashAlt } from '@fortawesome/free-solid-svg-icons';
3735
import copyToClipboard from '@client/scripts/copy-to-clipboard';
3836
import MkDriveFileThumbnail from './drive-file-thumbnail.vue';
3937
import bytes from '@client/filters/bytes';
@@ -87,22 +85,22 @@ export default defineComponent({
8785
action: this.rename
8886
}, {
8987
text: this.file.isSensitive ? this.$ts.unmarkAsSensitive : this.$ts.markAsSensitive,
90-
icon: this.file.isSensitive ? faEye : faEyeSlash,
88+
icon: this.file.isSensitive ? 'fas fa-eye' : 'fas fa-eye-slash',
9189
action: this.toggleSensitive
9290
}, null, {
9391
text: this.$ts.copyUrl,
94-
icon: faLink,
92+
icon: 'fas fa-link',
9593
action: this.copyUrl
9694
}, {
9795
type: 'a',
9896
href: this.file.url,
9997
target: '_blank',
10098
text: this.$ts.download,
101-
icon: faDownload,
99+
icon: 'fas fa-download',
102100
download: this.file.name
103101
}, null, {
104102
text: this.$ts.delete,
105-
icon: faTrashAlt,
103+
icon: 'fas fa-trash-alt',
106104
danger: true,
107105
action: this.deleteFile
108106
}];

‎src/client/components/drive.folder.vue

+5-8
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,8 @@
1515
:title="title"
1616
>
1717
<p class="name">
18-
<template v-if="hover"><Fa :icon="faFolderOpen" fixed-width/></template>
19-
<template v-if="!hover"><Fa :icon="faFolder" fixed-width/></template>
18+
<template v-if="hover"><i class="fas fa-folder-open fa-fw"></i></template>
19+
<template v-if="!hover"><i class="fas fa-folder fa-fw"></i></template>
2020
{{ folder.name }}
2121
</p>
2222
<p class="upload" v-if="$store.state.uploadFolder == folder.id">
@@ -28,9 +28,7 @@
2828

2929
<script lang="ts">
3030
import { defineComponent } from 'vue';
31-
import { faFolder, faFolderOpen, faTrashAlt, faWindowRestore } from '@fortawesome/free-regular-svg-icons';
3231
import * as os from '@client/os';
33-
import { faICursor } from '@fortawesome/free-solid-svg-icons';
3432
3533
export default defineComponent({
3634
props: {
@@ -57,7 +55,6 @@ export default defineComponent({
5755
hover: false,
5856
draghover: false,
5957
isDragging: false,
60-
faFolder, faFolderOpen
6158
};
6259
},
6360
@@ -241,7 +238,7 @@ export default defineComponent({
241238
onContextmenu(e) {
242239
os.contextMenu([{
243240
text: this.$ts.openInWindow,
244-
icon: faWindowRestore,
241+
icon: 'fas fa-window-restore',
245242
action: () => {
246243
os.popup(import('./drive-window.vue'), {
247244
initialFolder: this.folder
@@ -254,7 +251,7 @@ export default defineComponent({
254251
action: this.rename
255252
}, null, {
256253
text: this.$ts.delete,
257-
icon: faTrashAlt,
254+
icon: 'fas fa-trash-alt',
258255
danger: true,
259256
action: this.deleteFolder
260257
}], e);
@@ -312,7 +309,7 @@ export default defineComponent({
312309
font-size: 0.9em;
313310
color: var(--desktopDriveFolderFg);
314311
315-
> [data-icon] {
312+
> i {
316313
margin-right: 4px;
317314
margin-left: 2px;
318315
text-align: left;

‎src/client/components/drive.nav-folder.vue

+1-3
Original file line numberDiff line numberDiff line change
@@ -7,14 +7,13 @@
77
@dragleave="onDragleave"
88
@drop.stop="onDrop"
99
>
10-
<i v-if="folder == null"><Fa :icon="faCloud"/></i>
10+
<i v-if="folder == null" class="fas fa-cloud"></i>
1111
<span>{{ folder == null ? $ts.drive : folder.name }}</span>
1212
</div>
1313
</template>
1414

1515
<script lang="ts">
1616
import { defineComponent } from 'vue';
17-
import { faCloud } from '@fortawesome/free-solid-svg-icons';
1817
import * as os from '@client/os';
1918
2019
export default defineComponent({
@@ -29,7 +28,6 @@ export default defineComponent({
2928
return {
3029
hover: false,
3130
draghover: false,
32-
faCloud
3331
};
3432
},
3533

0 commit comments

Comments
 (0)