Use FontAwesome as web font instead of vue component (#7469)
* wip * wip * wip * wip * wip * wip * wip * wip * wip * Update yarn.lock * wip * wip
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<MkContainer :show-header="props.showHeader" :naked="props.transparent">
|
||||
<template #header><Fa :icon="faChartBar"/>{{ $ts._widgets.activity }}</template>
|
||||
<template #func><button @click="toggleView()" class="_button"><Fa :icon="faSort"/></button></template>
|
||||
<template #header><i class="fas fa-chart-bar"></i>{{ $ts._widgets.activity }}</template>
|
||||
<template #func><button @click="toggleView()" class="_button"><i class="fas fa-sort"></i></button></template>
|
||||
|
||||
<div>
|
||||
<MkLoading v-if="fetching"/>
|
||||
@@ -15,7 +15,6 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faChartBar, faSort } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkContainer from '@client/components/ui/container.vue';
|
||||
import define from './define';
|
||||
import XCalendar from './activity.calendar.vue';
|
||||
@@ -52,7 +51,6 @@ export default defineComponent({
|
||||
return {
|
||||
fetching: true,
|
||||
activity: null,
|
||||
faChartBar, faSort
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<MkContainer :show-header="props.showHeader">
|
||||
<template #header><Fa :icon="faTerminal"/>{{ $ts._widgets.aiscript }}</template>
|
||||
<template #header><i class="fas fa-terminal"></i>{{ $ts._widgets.aiscript }}</template>
|
||||
|
||||
<div class="uylguesu _monospace">
|
||||
<textarea v-model="props.script" placeholder="(1 + 1)"></textarea>
|
||||
@@ -14,7 +14,6 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faTerminal } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkContainer from '@client/components/ui/container.vue';
|
||||
import define from './define';
|
||||
import * as os from '@client/os';
|
||||
@@ -46,7 +45,6 @@ export default defineComponent({
|
||||
data() {
|
||||
return {
|
||||
logs: [],
|
||||
faTerminal
|
||||
};
|
||||
},
|
||||
|
||||
|
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<MkContainer :show-header="props.showHeader" :foldable="foldable" :scrollable="scrollable">
|
||||
<template #header><Fa :icon="faGlobe"/>{{ $ts._widgets.federation }}</template>
|
||||
<template #header><i class="fas fa-globe"></i>{{ $ts._widgets.federation }}</template>
|
||||
|
||||
<div class="wbrkwalb">
|
||||
<MkLoading v-if="fetching"/>
|
||||
@@ -20,7 +20,6 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faGlobe } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkContainer from '@client/components/ui/container.vue';
|
||||
import define from './define';
|
||||
import MkMiniChart from '@client/components/mini-chart.vue';
|
||||
@@ -58,7 +57,6 @@ export default defineComponent({
|
||||
instances: [],
|
||||
charts: [],
|
||||
fetching: true,
|
||||
faGlobe
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="mkw-jobQueue _monospace" :class="{ _panel: !props.transparent }">
|
||||
<div class="inbox">
|
||||
<div class="label">Inbox queue<Fa :icon="faExclamationTriangle" v-if="inbox.waiting > 0" class="icon"/></div>
|
||||
<div class="label">Inbox queue<i v-if="inbox.waiting > 0" class="fas fa-exclamation-triangle icon"></i></div>
|
||||
<div class="values">
|
||||
<div>
|
||||
<div>Process</div>
|
||||
@@ -22,7 +22,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="deliver">
|
||||
<div class="label">Deliver queue<Fa :icon="faExclamationTriangle" v-if="deliver.waiting > 0" class="icon"/></div>
|
||||
<div class="label">Deliver queue<i v-if="deliver.waiting > 0" class="fas fa-exclamation-triangle icon"></i></div>
|
||||
<div class="values">
|
||||
<div>
|
||||
<div>Process</div>
|
||||
@@ -47,7 +47,6 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faExclamationTriangle } from '@fortawesome/free-solid-svg-icons';
|
||||
import define from './define';
|
||||
import * as os from '@client/os';
|
||||
import number from '@client/filters/number';
|
||||
@@ -80,7 +79,6 @@ export default defineComponent({
|
||||
delayed: 0,
|
||||
},
|
||||
prev: {},
|
||||
faExclamationTriangle,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
|
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<MkContainer :show-header="props.showHeader">
|
||||
<template #header><Fa :icon="faStickyNote"/>{{ $ts._widgets.memo }}</template>
|
||||
<template #header><i class="fas fa-sticky-note"></i>{{ $ts._widgets.memo }}</template>
|
||||
|
||||
<div class="otgbylcu">
|
||||
<textarea v-model="text" :placeholder="$ts.placeholder" @input="onChange"></textarea>
|
||||
@@ -11,7 +11,6 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faStickyNote } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkContainer from '@client/components/ui/container.vue';
|
||||
import define from './define';
|
||||
import * as os from '@client/os';
|
||||
@@ -37,7 +36,6 @@ export default defineComponent({
|
||||
text: null,
|
||||
changed: false,
|
||||
timeoutId: null,
|
||||
faStickyNote
|
||||
};
|
||||
},
|
||||
|
||||
|
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<MkContainer :style="`height: ${props.height}px;`" :show-header="props.showHeader" :scrollable="true">
|
||||
<template #header><Fa :icon="faBell"/>{{ $ts.notifications }}</template>
|
||||
<template #func><button @click="configure()" class="_button"><Fa :icon="faCog"/></button></template>
|
||||
<template #header><i class="fas fa-bell"></i>{{ $ts.notifications }}</template>
|
||||
<template #func><button @click="configure()" class="_button"><i class="fas fa-cog"></i></button></template>
|
||||
|
||||
<div class="_flat_">
|
||||
<XNotifications :include-types="props.includingTypes"/>
|
||||
@@ -11,7 +11,6 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faBell, faCog } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkContainer from '@client/components/ui/container.vue';
|
||||
import XNotifications from '@client/components/notifications.vue';
|
||||
import define from './define';
|
||||
@@ -46,7 +45,6 @@ export default defineComponent({
|
||||
|
||||
data() {
|
||||
return {
|
||||
faBell, faCog
|
||||
};
|
||||
},
|
||||
|
||||
|
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<MkContainer :show-header="props.showHeader" :naked="props.transparent" :class="$style.root" :data-transparent="props.transparent ? true : null">
|
||||
<template #header><Fa :icon="faCamera"/>{{ $ts._widgets.photos }}</template>
|
||||
<template #header><i class="fas fa-camera"></i>{{ $ts._widgets.photos }}</template>
|
||||
|
||||
<div class="">
|
||||
<MkLoading v-if="fetching"/>
|
||||
@@ -16,7 +16,6 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faCamera } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkContainer from '@client/components/ui/container.vue';
|
||||
import define from './define';
|
||||
import { getStaticImageUrl } from '@client/scripts/get-static-image-url';
|
||||
@@ -46,7 +45,6 @@ export default defineComponent({
|
||||
images: [],
|
||||
fetching: true,
|
||||
connection: null,
|
||||
faCamera
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<MkContainer :show-header="props.showHeader">
|
||||
<template #header><Fa :icon="faRssSquare"/>RSS</template>
|
||||
<template #func><button class="_button" @click="setting"><Fa :icon="faCog"/></button></template>
|
||||
<template #header><i class="fas fa-rss-square"></i>RSS</template>
|
||||
<template #func><button class="_button" @click="setting"><i class="fas fa-cog"></i></button></template>
|
||||
|
||||
<div class="ekmkgxbj">
|
||||
<MkLoading v-if="fetching"/>
|
||||
@@ -14,7 +14,6 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faRssSquare, faCog } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkContainer from '@client/components/ui/container.vue';
|
||||
import define from './define';
|
||||
import * as os from '@client/os';
|
||||
@@ -43,7 +42,6 @@ export default defineComponent({
|
||||
items: [],
|
||||
fetching: true,
|
||||
clock: null,
|
||||
faRssSquare, faCog
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
@@ -2,7 +2,7 @@
|
||||
<div class="vrvdvrys">
|
||||
<XPie class="pie" :value="usage"/>
|
||||
<div>
|
||||
<p><fa :icon="faMicrochip"/>CPU</p>
|
||||
<p><i class="fas fa-microchip"></i>CPU</p>
|
||||
<p>{{ meta.cpu.cores }} Logical cores</p>
|
||||
<p>{{ meta.cpu.model }}</p>
|
||||
</div>
|
||||
@@ -11,7 +11,6 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faMicrochip } from '@fortawesome/free-solid-svg-icons';
|
||||
import XPie from './pie.vue';
|
||||
|
||||
export default defineComponent({
|
||||
@@ -29,7 +28,6 @@ export default defineComponent({
|
||||
data() {
|
||||
return {
|
||||
usage: 0,
|
||||
faMicrochip,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
@@ -68,7 +66,7 @@ export default defineComponent({
|
||||
font-weight: bold;
|
||||
margin-bottom: 4px;
|
||||
|
||||
> [data-icon] {
|
||||
> i {
|
||||
margin-right: 4px;
|
||||
}
|
||||
}
|
||||
|
@@ -2,7 +2,7 @@
|
||||
<div class="zbwaqsat">
|
||||
<XPie class="pie" :value="usage"/>
|
||||
<div>
|
||||
<p><fa :icon="faHdd"/>Disk</p>
|
||||
<p><i class="fas fa-hdd"></i>Disk</p>
|
||||
<p>Total: {{ bytes(total, 1) }}</p>
|
||||
<p>Free: {{ bytes(available, 1) }}</p>
|
||||
<p>Used: {{ bytes(used, 1) }}</p>
|
||||
@@ -12,7 +12,6 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faHdd } from '@fortawesome/free-solid-svg-icons';
|
||||
import XPie from './pie.vue';
|
||||
import bytes from '@client/filters/bytes';
|
||||
|
||||
@@ -31,7 +30,6 @@ export default defineComponent({
|
||||
total: this.meta.fs.total,
|
||||
used: this.meta.fs.used,
|
||||
available: this.meta.fs.total - this.meta.fs.used,
|
||||
faHdd,
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
@@ -62,7 +60,7 @@ export default defineComponent({
|
||||
font-weight: bold;
|
||||
margin-bottom: 4px;
|
||||
|
||||
> [data-icon] {
|
||||
> i {
|
||||
margin-right: 4px;
|
||||
}
|
||||
}
|
||||
|
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<MkContainer :show-header="props.showHeader" :naked="props.transparent">
|
||||
<template #header><Fa :icon="faServer"/>{{ $ts._widgets.serverMetric }}</template>
|
||||
<template #func><button @click="toggleView()" class="_button"><Fa :icon="faSort"/></button></template>
|
||||
<template #header><i class="fas fa-server"></i>{{ $ts._widgets.serverMetric }}</template>
|
||||
<template #func><button @click="toggleView()" class="_button"><i class="fas fa-sort"></i></button></template>
|
||||
|
||||
<div class="mkw-serverMetric" v-if="meta">
|
||||
<XCpuMemory v-if="props.view === 0" :connection="connection" :meta="meta"/>
|
||||
@@ -15,7 +15,6 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faServer, faSort } from '@fortawesome/free-solid-svg-icons';
|
||||
import define from '../define';
|
||||
import MkContainer from '@client/components/ui/container.vue';
|
||||
import XCpuMemory from './cpu-mem.vue';
|
||||
@@ -58,7 +57,6 @@ export default defineComponent({
|
||||
return {
|
||||
meta: null,
|
||||
connection: null,
|
||||
faServer, faSort,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
|
@@ -2,7 +2,7 @@
|
||||
<div class="zlxnikvl">
|
||||
<XPie class="pie" :value="usage"/>
|
||||
<div>
|
||||
<p><fa :icon="faMemory"/>RAM</p>
|
||||
<p><i class="fas fa-memory"></i>RAM</p>
|
||||
<p>Total: {{ bytes(total, 1) }}</p>
|
||||
<p>Used: {{ bytes(used, 1) }}</p>
|
||||
<p>Free: {{ bytes(free, 1) }}</p>
|
||||
@@ -12,7 +12,6 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faMemory } from '@fortawesome/free-solid-svg-icons';
|
||||
import XPie from './pie.vue';
|
||||
import bytes from '@client/filters/bytes';
|
||||
|
||||
@@ -34,7 +33,6 @@ export default defineComponent({
|
||||
total: 0,
|
||||
used: 0,
|
||||
free: 0,
|
||||
faMemory,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
@@ -77,7 +75,7 @@ export default defineComponent({
|
||||
font-weight: bold;
|
||||
margin-bottom: 4px;
|
||||
|
||||
> [data-icon] {
|
||||
> i {
|
||||
margin-right: 4px;
|
||||
}
|
||||
}
|
||||
|
@@ -14,7 +14,6 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { } from '@fortawesome/free-solid-svg-icons';
|
||||
import define from './define';
|
||||
import * as os from '@client/os';
|
||||
|
||||
|
@@ -2,14 +2,14 @@
|
||||
<MkContainer :show-header="props.showHeader" :style="`height: ${props.height}px;`" :scrollable="true">
|
||||
<template #header>
|
||||
<button @click="choose" class="_button">
|
||||
<Fa v-if="props.src === 'home'" :icon="faHome"/>
|
||||
<Fa v-if="props.src === 'local'" :icon="faComments"/>
|
||||
<Fa v-if="props.src === 'social'" :icon="faShareAlt"/>
|
||||
<Fa v-if="props.src === 'global'" :icon="faGlobe"/>
|
||||
<Fa v-if="props.src === 'list'" :icon="faListUl"/>
|
||||
<Fa v-if="props.src === 'antenna'" :icon="faSatellite"/>
|
||||
<i v-if="props.src === 'home'" class="fas fa-home"></i>
|
||||
<i v-else-if="props.src === 'local'" class="fas fa-comments"></i>
|
||||
<i v-else-if="props.src === 'social'" class="fas fa-share-alt"></i>
|
||||
<i v-else-if="props.src === 'global'" class="fas fa-globe"></i>
|
||||
<i v-else-if="props.src === 'list'" class="fas fa-list-ul"></i>
|
||||
<i v-else-if="props.src === 'antenna'" class="fas fa-satellite"></i>
|
||||
<span style="margin-left: 8px;">{{ props.src === 'list' ? props.list.name : props.src === 'antenna' ? props.antenna.name : $t('_timelines.' + props.src) }}</span>
|
||||
<Fa :icon="menuOpened ? faAngleUp : faAngleDown" style="margin-left: 8px;"/>
|
||||
<i :class="menuOpened ? 'fas fa-angle-up' : 'fas fa-angle-down'" style="margin-left: 8px;"></i>
|
||||
</button>
|
||||
</template>
|
||||
|
||||
@@ -21,8 +21,6 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faAngleDown, faAngleUp, faHome, faShareAlt, faGlobe, faListUl, faSatellite } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faComments } from '@fortawesome/free-regular-svg-icons';
|
||||
import MkContainer from '@client/components/ui/container.vue';
|
||||
import XTimeline from '@client/components/timeline.vue';
|
||||
import define from './define';
|
||||
@@ -62,7 +60,6 @@ export default defineComponent({
|
||||
data() {
|
||||
return {
|
||||
menuOpened: false,
|
||||
faAngleDown, faAngleUp, faHome, faShareAlt, faGlobe, faComments, faListUl, faSatellite
|
||||
};
|
||||
},
|
||||
|
||||
@@ -75,7 +72,7 @@ export default defineComponent({
|
||||
]);
|
||||
const antennaItems = antennas.map(antenna => ({
|
||||
text: antenna.name,
|
||||
icon: faSatellite,
|
||||
icon: 'fas fa-satellite',
|
||||
action: () => {
|
||||
this.props.antenna = antenna;
|
||||
this.setSrc('antenna');
|
||||
@@ -83,7 +80,7 @@ export default defineComponent({
|
||||
}));
|
||||
const listItems = lists.map(list => ({
|
||||
text: list.name,
|
||||
icon: faListUl,
|
||||
icon: 'fas fa-list-ul',
|
||||
action: () => {
|
||||
this.props.list = list;
|
||||
this.setSrc('list');
|
||||
@@ -91,19 +88,19 @@ export default defineComponent({
|
||||
}));
|
||||
os.modalMenu([{
|
||||
text: this.$ts._timelines.home,
|
||||
icon: faHome,
|
||||
icon: 'fas fa-home',
|
||||
action: () => { this.setSrc('home') }
|
||||
}, {
|
||||
text: this.$ts._timelines.local,
|
||||
icon: faComments,
|
||||
icon: 'fas fa-comments',
|
||||
action: () => { this.setSrc('local') }
|
||||
}, {
|
||||
text: this.$ts._timelines.social,
|
||||
icon: faShareAlt,
|
||||
icon: 'fas fa-share-alt',
|
||||
action: () => { this.setSrc('social') }
|
||||
}, {
|
||||
text: this.$ts._timelines.global,
|
||||
icon: faGlobe,
|
||||
icon: 'fas fa-globe',
|
||||
action: () => { this.setSrc('global') }
|
||||
}, antennaItems.length > 0 ? null : undefined, ...antennaItems, listItems.length > 0 ? null : undefined, ...listItems], ev.currentTarget || ev.target).then(() => {
|
||||
this.menuOpened = false;
|
||||
|
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<MkContainer :show-header="props.showHeader">
|
||||
<template #header><Fa :icon="faHashtag"/>{{ $ts._widgets.trends }}</template>
|
||||
<template #header><i class="fas fa-hashtag"></i>{{ $ts._widgets.trends }}</template>
|
||||
|
||||
<div class="wbrkwala">
|
||||
<MkLoading v-if="fetching"/>
|
||||
@@ -19,7 +19,6 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { faHashtag } from '@fortawesome/free-solid-svg-icons';
|
||||
import MkContainer from '@client/components/ui/container.vue';
|
||||
import define from './define';
|
||||
import MkMiniChart from '@client/components/mini-chart.vue';
|
||||
@@ -44,7 +43,6 @@ export default defineComponent({
|
||||
return {
|
||||
stats: [],
|
||||
fetching: true,
|
||||
faHashtag
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
Reference in New Issue
Block a user