Add icons 🎨
This commit is contained in:
		
							parent
							
								
									550517bbf3
								
							
						
					
					
						commit
						4157ea8bc3
					
				|  | @ -5,6 +5,7 @@ | |||
| 		<section class="fit-top"> | ||||
| 			<ui-input class="target" v-model="target" type="text" @enter="showInstance()"> | ||||
| 				<span>{{ $t('host') }}</span> | ||||
| 				<template #prefix><fa :icon="faServer"/></template> | ||||
| 			</ui-input> | ||||
| 			<ui-button @click="showInstance()"><fa :icon="faSearch"/> {{ $t('lookup') }}</ui-button> | ||||
| 
 | ||||
|  | @ -12,37 +13,46 @@ | |||
| 				<ui-horizon-group inputs> | ||||
| 					<ui-input :value="instance.host" type="text" readonly> | ||||
| 						<span>{{ $t('host') }}</span> | ||||
| 						<template #prefix><fa :icon="faServer"/></template> | ||||
| 					</ui-input> | ||||
| 					<ui-input :value="instance.caughtAt | date" type="text" readonly> | ||||
| 						<span>{{ $t('caught-at') }}</span> | ||||
| 						<template #prefix><fa :icon="faCrosshairs"/></template> | ||||
| 					</ui-input> | ||||
| 				</ui-horizon-group> | ||||
| 				<ui-horizon-group inputs> | ||||
| 					<ui-input :value="instance.notesCount | number" type="text" readonly> | ||||
| 						<span>{{ $t('notes') }}</span> | ||||
| 						<template #prefix><fa :icon="faEnvelopeOpenText"/></template> | ||||
| 					</ui-input> | ||||
| 					<ui-input :value="instance.usersCount | number" type="text" readonly> | ||||
| 						<span>{{ $t('users') }}</span> | ||||
| 						<template #prefix><fa :icon="faUsers"/></template> | ||||
| 					</ui-input> | ||||
| 				</ui-horizon-group> | ||||
| 				<ui-horizon-group inputs> | ||||
| 					<ui-input :value="instance.followingCount | number" type="text" readonly> | ||||
| 						<span>{{ $t('following') }}</span> | ||||
| 						<template #prefix><fa :icon="faCaretDown"/></template> | ||||
| 					</ui-input> | ||||
| 					<ui-input :value="instance.followersCount | number" type="text" readonly> | ||||
| 						<span>{{ $t('followers') }}</span> | ||||
| 						<template #prefix><fa :icon="faCaretUp"/></template> | ||||
| 					</ui-input> | ||||
| 				</ui-horizon-group> | ||||
| 				<ui-horizon-group inputs> | ||||
| 					<ui-input :value="instance.latestRequestSentAt | date" type="text" readonly> | ||||
| 						<span>{{ $t('latest-request-sent-at') }}</span> | ||||
| 						<template #prefix><fa :icon="faPaperPlane"/></template> | ||||
| 					</ui-input> | ||||
| 					<ui-input :value="instance.latestStatus" type="text" readonly> | ||||
| 						<span>{{ $t('status') }}</span> | ||||
| 						<template #prefix><fa :icon="faTrafficLight"/></template> | ||||
| 					</ui-input> | ||||
| 				</ui-horizon-group> | ||||
| 				<ui-input :value="instance.latestRequestReceivedAt | date" type="text" readonly> | ||||
| 					<span>{{ $t('latest-request-received-at') }}</span> | ||||
| 					<template #prefix><fa :icon="faInbox"/></template> | ||||
| 				</ui-input> | ||||
| 				<ui-switch v-model="instance.isBlocked" @change="updateInstance()">{{ $t('block') }}</ui-switch> | ||||
| 				<ui-switch v-model="instance.isMarkedAsClosed" @change="updateInstance()">{{ $t('marked-as-closed') }}</ui-switch> | ||||
|  | @ -138,7 +148,8 @@ | |||
| <script lang="ts"> | ||||
| import Vue from 'vue'; | ||||
| import i18n from '../../i18n'; | ||||
| import { faGlobe, faTerminal, faSearch, faMinusCircle, faServer } from '@fortawesome/free-solid-svg-icons'; | ||||
| import { faPaperPlane } from '@fortawesome/free-regular-svg-icons'; | ||||
| import { faGlobe, faTerminal, faSearch, faMinusCircle, faServer, faCrosshairs, faEnvelopeOpenText, faUsers, faCaretDown, faCaretUp, faTrafficLight, faInbox } from '@fortawesome/free-solid-svg-icons'; | ||||
| import ApexCharts from 'apexcharts'; | ||||
| import * as tinycolor from 'tinycolor2'; | ||||
| 
 | ||||
|  | @ -165,7 +176,7 @@ export default Vue.extend({ | |||
| 			chartSrc: 'requests', | ||||
| 			chartSpan: 'hour', | ||||
| 			chartInstance: null, | ||||
| 			faGlobe, faTerminal, faSearch, faMinusCircle, faServer | ||||
| 			faGlobe, faTerminal, faSearch, faMinusCircle, faServer, faCrosshairs, faEnvelopeOpenText, faUsers, faCaretDown, faCaretUp, faPaperPlane, faTrafficLight, faInbox | ||||
| 		}; | ||||
| 	}, | ||||
| 
 | ||||
|  |  | |||
		Loading…
	
		Reference in New Issue