Mizah/Sharkey
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

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

4
src/client/ui/deck/antenna-column.vue
View file

@ -1,7 +1,7 @@
<template>
<XColumn :func="{ handler: setAntenna, title: $ts.selectAntenna }" :column="column" :is-stacked="isStacked">
<template #header>
<Fa :icon="faSatellite"/><span style="margin-left: 8px;">{{ column.name }}</span>
<i class="fas fa-satellite"></i><span style="margin-left: 8px;">{{ column.name }}</span>
</template>
<XTimeline v-if="column.antennaId" ref="timeline" src="antenna" :antenna="column.antennaId" @after="() => $emit('loaded')"/>
@ -10,7 +10,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faSatellite, faCog } from '@fortawesome/free-solid-svg-icons';
import XColumn from './column.vue';
import XTimeline from '@client/components/timeline.vue';
import * as os from '@client/os';
@ -35,7 +34,6 @@ export default defineComponent({
data() {
return {
faSatellite
};
},

25
src/client/ui/deck/column.vue
View file

@ -15,14 +15,14 @@
@contextmenu.prevent.stop="onContextmenu"
>
<button class="toggleActive _button" @click="toggleActive" v-if="isStacked && !isMainColumn">
<template v-if="active"><Fa :icon="faAngleUp"/></template>
<template v-else><Fa :icon="faAngleDown"/></template>
<template v-if="active"><i class="fas fa-angle-up"></i></template>
<template v-else><i class="fas fa-angle-down"></i></template>
</button>
<div class="action">
<slot name="action"></slot>
</div>
<span class="header"><slot name="header"></slot></span>
<button v-if="func" class="menu _button" v-tooltip="func.title" @click.stop="func.handler"><Fa :icon="func.icon || faCog"/></button>
<button v-if="func" class="menu _button" v-tooltip="func.title" @click.stop="func.handler"><i :class="func.icon || 'fas fa-cog'"></i></button>
</header>
<div ref="body" v-show="active">
<slot></slot>
@ -32,8 +32,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faArrowUp, faArrowDown, faAngleUp, faAngleDown, faCaretDown, faArrowRight, faArrowLeft, faPencilAlt, faCog } from '@fortawesome/free-solid-svg-icons';
import { faWindowMaximize, faTrashAlt, faWindowRestore } from '@fortawesome/free-regular-svg-icons';
import * as os from '@client/os';
import { updateColumn, swapLeftColumn, swapRightColumn, swapUpColumn, swapDownColumn, stackLeftColumn, popRightColumn, removeColumn, swapColumn } from './deck-store';
import { deckStore } from './deck-store';
@ -73,7 +71,6 @@ export default defineComponent({
dragging: false,
draghover: false,
dropready: false,
faArrowUp, faArrowDown, faAngleUp, faAngleDown, faCaretDown, faCog,
};
},
@ -134,7 +131,7 @@ export default defineComponent({
getMenu() {
const items = [{
icon: faPencilAlt,
icon: 'fas fa-pencil-alt',
text: this.$ts.edit,
action: async () => {
const { canceled, result } = await os.form(this.column.name, {
@ -158,43 +155,43 @@ export default defineComponent({
updateColumn(this.column.id, result);
}
}, null, {
icon: faArrowLeft,
icon: 'fas fa-arrow-left',
text: this.$ts._deck.swapLeft,
action: () => {
swapLeftColumn(this.column.id);
}
}, {
icon: faArrowRight,
icon: 'fas fa-arrow-right',
text: this.$ts._deck.swapRight,
action: () => {
swapRightColumn(this.column.id);
}
}, this.isStacked ? {
icon: faArrowUp,
icon: 'fas fa-arrow-up',
text: this.$ts._deck.swapUp,
action: () => {
swapUpColumn(this.column.id);
}
} : undefined, this.isStacked ? {
icon: faArrowDown,
icon: 'fas fa-arrow-down',
text: this.$ts._deck.swapDown,
action: () => {
swapDownColumn(this.column.id);
}
} : undefined, null, {
icon: faWindowRestore,
icon: 'fas fa-window-restore',
text: this.$ts._deck.stackLeft,
action: () => {
stackLeftColumn(this.column.id);
}
}, this.isStacked ? {
icon: faWindowMaximize,
icon: 'fas fa-window-maximize',
text: this.$ts._deck.popRight,
action: () => {
popRightColumn(this.column.id);
}
} : undefined, null, {
icon: faTrashAlt,
icon: 'fas fa-trash-alt',
text: this.$ts.remove,
danger: true,
action: () => {

4
src/client/ui/deck/direct-column.vue
View file

@ -1,6 +1,6 @@
<template>
<XColumn :column="column" :is-stacked="isStacked">
<template #header><Fa :icon="faEnvelope" style="margin-right: 8px;"/>{{ column.name }}</template>
<template #header><i class="fas fa-envelope" style="margin-right: 8px;"></i>{{ column.name }}</template>
<XNotes :pagination="pagination" @before="before()" @after="after()"/>
</XColumn>
@ -8,7 +8,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faEnvelope } from '@fortawesome/free-solid-svg-icons';
import Progress from '@client/scripts/loading';
import XColumn from './column.vue';
import XNotes from '@client/components/notes.vue';
@ -40,7 +39,6 @@ export default defineComponent({
visibility: 'specified'
})
},
faEnvelope
}
},

4
src/client/ui/deck/list-column.vue
View file

@ -1,7 +1,7 @@
<template>
<XColumn :func="{ handler: setList, title: $ts.selectList }" :column="column" :is-stacked="isStacked">
<template #header>
<Fa :icon="faListUl"/><span style="margin-left: 8px;">{{ column.name }}</span>
<i class="fas fa-list-ul"></i><span style="margin-left: 8px;">{{ column.name }}</span>
</template>
<XTimeline v-if="column.listId" ref="timeline" src="list" :list="column.listId" @after="() => $emit('loaded')"/>
@ -10,7 +10,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faListUl, faCog } from '@fortawesome/free-solid-svg-icons';
import XColumn from './column.vue';
import XTimeline from '@client/components/timeline.vue';
import * as os from '@client/os';
@ -35,7 +34,6 @@ export default defineComponent({
data() {
return {
faListUl
};
},

3
src/client/ui/deck/main-column.vue
View file

@ -16,7 +16,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faWindowMaximize } from '@fortawesome/free-solid-svg-icons';
import XColumn from './column.vue';
import XNotes from '@client/components/notes.vue';
import XHeader from '@client/ui/_common_/header.vue';
@ -72,7 +71,7 @@ export default defineComponent({
type: 'label',
text: path,
}, {
icon: faWindowMaximize,
icon: 'fas fa-window-maximize',
text: this.$ts.openInWindow,
action: () => {
os.pageWindow(path);

3
src/client/ui/deck/mentions-column.vue
View file

@ -1,6 +1,6 @@
<template>
<XColumn :column="column" :is-stacked="isStacked">
<template #header><Fa :icon="faAt" style="margin-right: 8px;"/>{{ column.name }}</template>
<template #header><i class="fas fa-at" style="margin-right: 8px;"></i>{{ column.name }}</template>
<XNotes :pagination="pagination" @before="before()" @after="after()"/>
</XColumn>
@ -8,7 +8,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faAt } from '@fortawesome/free-solid-svg-icons';
import Progress from '@client/scripts/loading';
import XColumn from './column.vue';
import XNotes from '@client/components/notes.vue';

5
src/client/ui/deck/notifications-column.vue
View file

@ -1,6 +1,6 @@
<template>
<XColumn :column="column" :is-stacked="isStacked" :func="{ handler: func, title: $ts.notificationSetting }">
<template #header><Fa :icon="faBell" style="margin-right: 8px;"/>{{ column.name }}</template>
<template #header><i class="fas fa-bell" style="margin-right: 8px;"></i>{{ column.name }}</template>
<XNotifications :include-types="column.includingTypes"/>
</XColumn>
@ -8,8 +8,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 XColumn from './column.vue';
import XNotifications from '@client/components/notifications.vue';
import * as os from '@client/os';
@ -34,7 +32,6 @@ export default defineComponent({
data() {
return {
faBell
}
},

12
src/client/ui/deck/tl-column.vue
View file

@ -1,16 +1,16 @@
<template>
<XColumn :func="{ handler: setType, title: $ts.timeline }" :column="column" :is-stacked="isStacked" :indicated="indicated" @change-active-state="onChangeActiveState">
<template #header>
<Fa v-if="column.tl === 'home'" :icon="faHome"/>
<Fa v-else-if="column.tl === 'local'" :icon="faComments"/>
<Fa v-else-if="column.tl === 'social'" :icon="faShareAlt"/>
<Fa v-else-if="column.tl === 'global'" :icon="faGlobe"/>
<i v-if="column.tl === 'home'" class="fas fa-home"></i>
<i v-else-if="column.tl === 'local'" class="fas fa-comments"></i>
<i v-else-if="column.tl === 'social'" class="fas fa-share-alt"></i>
<i v-else-if="column.tl === 'global'" class="fas fa-globe"></i>
<span style="margin-left: 8px;">{{ column.name }}</span>
</template>
<div class="iwaalbte" v-if="disabled">
<p>
<Fa :icon="faMinusCircle"/>
<i class="fas fa-minus-circle"></i>
{{ $t('disabled-timeline.title') }}
</p>
<p class="desc">{{ $t('disabled-timeline.description') }}</p>
@ -21,7 +21,6 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { faMinusCircle, faHome, faComments, faShareAlt, faGlobe, faCog } from '@fortawesome/free-solid-svg-icons';
import XColumn from './column.vue';
import XTimeline from '@client/components/timeline.vue';
import * as os from '@client/os';
@ -49,7 +48,6 @@ export default defineComponent({
disabled: false,
indicated: false,
columnActive: true,
faMinusCircle, faHome, faComments, faShareAlt, faGlobe,
};
},

4
src/client/ui/deck/widgets-column.vue
View file

@ -1,6 +1,6 @@
<template>
<XColumn :func="{ handler: func, title: $ts.editWidgets }" :naked="true" :column="column" :is-stacked="isStacked">
<template #header><Fa :icon="faWindowMaximize" style="margin-right: 8px;"/>{{ column.name }}</template>
<template #header><i class="fas fa-window-maximize" style="margin-right: 8px;"></i>{{ column.name }}</template>
<div class="wtdtxvec">
<XWidgets :edit="edit" :widgets="column.widgets" @add-widget="addWidget" @remove-widget="removeWidget" @update-widget="updateWidget" @update-widgets="updateWidgets" @exit="edit = false"/>
@ -10,7 +10,6 @@
<script lang="ts">
import { defineComponent, defineAsyncComponent } from 'vue';
import { faWindowMaximize, faTimes, faCog, faPlus } from '@fortawesome/free-solid-svg-icons';
import XWidgets from '@client/components/widgets.vue';
import XColumn from './column.vue';
import { addColumnWidget, removeColumnWidget, setColumnWidgets, updateColumnWidget } from './deck-store';
@ -35,7 +34,6 @@ export default defineComponent({
data() {
return {
edit: false,
faWindowMaximize, faTimes, faPlus
};
},