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

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