From 8e7c6d3a9b980184f977874b2bd7524059833aa8 Mon Sep 17 00:00:00 2001
From: ThatOneCalculator <kainoa@t1c.dev>
Date: Tue, 6 Dec 2022 20:12:44 -0800
Subject: [PATCH] Fix icons + formatting

fix more icons
---
 package.json                                  |  2 +-
 packages/client/src/components/MkInfo.vue     |  2 +-
 packages/client/src/components/MkMoved.vue    | 15 ++++++++----
 .../client/src/pages/admin/proxy-account.vue  | 24 ++++++++++---------
 packages/client/src/pages/explore.users.vue   | 18 +++++++-------
 packages/client/src/pages/messaging/index.vue |  4 ++--
 .../client/src/pages/settings/integration.vue |  6 ++---
 packages/client/src/pages/user/index.vue      |  2 +-
 8 files changed, 40 insertions(+), 33 deletions(-)

diff --git a/package.json b/package.json
index 1212633b22..635d3614a7 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "calckey",
-	"version": "13.0.0-b4",
+	"version": "13.0.0-b5",
 	"codename": "aqua",
 	"repository": {
 		"type": "git",
diff --git a/packages/client/src/components/MkInfo.vue b/packages/client/src/components/MkInfo.vue
index 98dfef9677..0790e58e3b 100644
--- a/packages/client/src/components/MkInfo.vue
+++ b/packages/client/src/components/MkInfo.vue
@@ -9,7 +9,7 @@
 <script lang="ts" setup>
 import { } from 'vue';
 
-const props = defineProps<{
+defineProps<{
 	warn?: boolean;
 }>();
 </script>
diff --git a/packages/client/src/components/MkMoved.vue b/packages/client/src/components/MkMoved.vue
index 103853c4d0..6251d93a8c 100644
--- a/packages/client/src/components/MkMoved.vue
+++ b/packages/client/src/components/MkMoved.vue
@@ -1,23 +1,28 @@
 <template>
-<div class="_block" :class="$style.mkmoved"><i class="fas fa-info-circle" style="margin-right: 8px;"></i>{{ i18n.ts.accountMoved }}<MkMention :class="$style.link" class="link" :username="acct" :host="host"/></div>
+<div class="_block msjugskdqo">
+	<i class="ph-airplane-takeoff-bold ph-lg" style="margin-right: 8px;"/>
+	{{ i18n.ts.accountMoved }}
+	<MkMention :class="$style.link" class="link" :username="acct" :host="host"/>
+</div>
 </template>
 
 <script lang="ts" setup>
-import { i18n } from '@/i18n';
 import MkMention from './MkMention.vue';
-const props = defineProps<{
+import { i18n } from '@/i18n';
+
+defineProps<{
 	acct: string;
 	host: string;
 }>();
-const href = $computed(() => `/${props.acct}`);
 </script>
 
 <style lang="scss" module>
-.mkmoved {
+.msjugskdqo {
 	font-size: 0.8em;
 	padding: 16px;
 	background: var(--infoBg);
 	color: var(--infoFg);
+
 	> .link {
 		margin-left: 4px;
 		color: var(--accent);
diff --git a/packages/client/src/pages/admin/proxy-account.vue b/packages/client/src/pages/admin/proxy-account.vue
index faa89cb5e4..a141d4a317 100644
--- a/packages/client/src/pages/admin/proxy-account.vue
+++ b/packages/client/src/pages/admin/proxy-account.vue
@@ -1,16 +1,18 @@
-<template><MkStickyContainer>
+<template>
+<MkStickyContainer>
 	<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
-		<MkSpacer :content-max="700" :margin-min="16" :margin-max="32">
-	<FormSuspense :p="init">
-		<MkInfo class="_formBlock">{{ i18n.ts.proxyAccountDescription }}</MkInfo>
-		<MkKeyValue class="_formBlock">
-			<template #key>{{ i18n.ts.proxyAccount }}</template>
-			<template #value>{{ proxyAccount ? `@${proxyAccount.username}` : i18n.ts.none }}</template>
-		</MkKeyValue>
+	<MkSpacer :content-max="700" :margin-min="16" :margin-max="32">
+		<FormSuspense :p="init">
+			<MkInfo class="_formBlock">{{ i18n.ts.proxyAccountDescription }}</MkInfo>
+			<MkKeyValue class="_formBlock">
+				<template #key>{{ i18n.ts.proxyAccount }}</template>
+				<template #value>{{ proxyAccount ? `@${proxyAccount.username}` : i18n.ts.none }}</template>
+			</MkKeyValue>
 
-		<FormButton primary class="_formBlock" @click="chooseProxyAccount">{{ i18n.ts.selectAccount }}</FormButton>
-	</FormSuspense>
-</MkSpacer></MkStickyContainer>
+			<FormButton primary class="_formBlock" @click="chooseProxyAccount">{{ i18n.ts.selectAccount }}</FormButton>
+		</FormSuspense>
+	</MkSpacer>
+</MkStickyContainer>
 </template>
 
 <script lang="ts" setup>
diff --git a/packages/client/src/pages/explore.users.vue b/packages/client/src/pages/explore.users.vue
index 8a636517d2..0c512a74f9 100644
--- a/packages/client/src/pages/explore.users.vue
+++ b/packages/client/src/pages/explore.users.vue
@@ -9,26 +9,26 @@
 	<div v-if="origin === 'local'">
 		<template v-if="tag == null">
 			<MkFolder class="_gap" persist-key="explore-pinned-users">
-				<template #header><i class="fas fa-bookmark fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.pinnedUsers }}</template>
+				<template #header><i class="ph-bookmark-bold ph-lg ph-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.pinnedUsers }}</template>
 				<XUserList :pagination="pinnedUsers"/>
 			</MkFolder>
 			<MkFolder v-if="$i != null" class="_gap" persist-key="explore-popular-users">
-				<template #header><i class="fas fa-chart-line fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.popularUsers }}</template>
+				<template #header><i class="ph-chart-line-up-bold ph-lg ph-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.popularUsers }}</template>
 				<XUserList :pagination="popularUsers"/>
 			</MkFolder>
 			<MkFolder v-if="$i != null" class="_gap" persist-key="explore-recently-updated-users">
-				<template #header><i class="fas fa-comment-alt fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.recentlyUpdatedUsers }}</template>
+				<template #header><i class="ph-activity-bold ph-lg ph-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.recentlyUpdatedUsers }}</template>
 				<XUserList :pagination="recentlyUpdatedUsers"/>
 			</MkFolder>
 			<MkFolder v-if="$i != null" class="_gap" persist-key="explore-recently-registered-users">
-				<template #header><i class="fas fa-plus fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.recentlyRegisteredUsers }}</template>
+				<template #header><i class="ph-butterfly-bold ph-lg ph-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.recentlyRegisteredUsers }}</template>
 				<XUserList :pagination="recentlyRegisteredUsers"/>
 			</MkFolder>
 		</template>
 	</div>
 	<div v-else>
 		<MkFolder ref="tagsEl" :foldable="true" :expanded="false" class="_gap">
-			<template #header><i class="fas fa-hashtag fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.popularTags }}</template>
+			<template #header><i class="ph-hash-bold ph-lg ph-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.popularTags }}</template>
 
 			<div class="vxjfqztj">
 				<MkA v-for="tag in tagsLocal" :key="'local:' + tag.tag" :to="`/explore/tags/${tag.tag}`" class="local">{{ tag.tag }}</MkA>
@@ -37,21 +37,21 @@
 		</MkFolder>
 
 		<MkFolder v-if="tag != null" :key="`${tag}`" class="_gap">
-			<template #header><i class="fas fa-hashtag fa-fw" style="margin-right: 0.5em;"></i>{{ tag }}</template>
+			<template #header><i class="ph-hash-bold ph-lg ph-fw" style="margin-right: 0.5em;"></i>{{ tag }}</template>
 			<XUserList :pagination="tagUsers"/>
 		</MkFolder>
 
 		<template v-if="tag == null && $i != null">
 			<MkFolder class="_gap">
-				<template #header><i class="fas fa-chart-line fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.popularUsers }}</template>
+				<template #header><i class="ph-chart-line-up-bold ph-lg ph-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.popularUsers }}</template>
 				<XUserList :pagination="popularUsersF"/>
 			</MkFolder>
 			<MkFolder class="_gap">
-				<template #header><i class="fas fa-comment-alt fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.recentlyUpdatedUsers }}</template>
+				<template #header><i class="ph-activity-bold ph-lg ph-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.recentlyUpdatedUsers }}</template>
 				<XUserList :pagination="recentlyUpdatedUsersF"/>
 			</MkFolder>
 			<MkFolder class="_gap">
-				<template #header><i class="fas fa-rocket fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.recentlyDiscoveredUsers }}</template>
+				<template #header><i class="ph-rocke-launch-bold ph-lg ph-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.recentlyDiscoveredUsers }}</template>
 				<XUserList :pagination="recentlyRegisteredUsersF"/>
 			</MkFolder>
 		</template>
diff --git a/packages/client/src/pages/messaging/index.vue b/packages/client/src/pages/messaging/index.vue
index fd0c022259..de4b6f90aa 100644
--- a/packages/client/src/pages/messaging/index.vue
+++ b/packages/client/src/pages/messaging/index.vue
@@ -130,11 +130,11 @@ function onRead(ids): void {
 function startMenu(ev) {
 	os.popupMenu([{
 		text: i18n.ts.messagingWithUser,
-		icon: 'fas fa-user',
+		icon: 'ph-user-bold ph-lg',
 		action: () => { startUser(); },
 	}, {
 		text: i18n.ts.messagingWithGroup,
-		icon: 'fas fa-users',
+		icon: 'ph-users-three-bold ph-lg',
 		action: () => { startGroup(); },
 	}], ev.currentTarget ?? ev.target);
 }
diff --git a/packages/client/src/pages/settings/integration.vue b/packages/client/src/pages/settings/integration.vue
index 2e872af31d..816ae40cd9 100644
--- a/packages/client/src/pages/settings/integration.vue
+++ b/packages/client/src/pages/settings/integration.vue
@@ -1,21 +1,21 @@
 <template>
 <div class="_formRoot">
 	<FormSection v-if="instance.enableTwitterIntegration">
-		<template #label><i class="fab fa-twitter"></i> Twitter</template>
+		<template #label><i class="ph-twitter-logo-bold ph-lg"></i> Twitter</template>
 		<p v-if="integrations.twitter">{{ i18n.ts.connectedTo }}: <a :href="`https://twitter.com/${integrations.twitter.screenName}`" rel="nofollow noopener" target="_blank">@{{ integrations.twitter.screenName }}</a></p>
 		<MkButton v-if="integrations.twitter" danger @click="disconnectTwitter">{{ i18n.ts.disconnectService }}</MkButton>
 		<MkButton v-else primary @click="connectTwitter">{{ i18n.ts.connectService }}</MkButton>
 	</FormSection>
 
 	<FormSection v-if="instance.enableDiscordIntegration">
-		<template #label><i class="fab fa-discord"></i> Discord</template>
+		<template #label><i class="ph-discord-logo-bold ph-lg"></i> Discord</template>
 		<p v-if="integrations.discord">{{ i18n.ts.connectedTo }}: <a :href="`https://discord.com/users/${integrations.discord.id}`" rel="nofollow noopener" target="_blank">@{{ integrations.discord.username }}#{{ integrations.discord.discriminator }}</a></p>
 		<MkButton v-if="integrations.discord" danger @click="disconnectDiscord">{{ i18n.ts.disconnectService }}</MkButton>
 		<MkButton v-else primary @click="connectDiscord">{{ i18n.ts.connectService }}</MkButton>
 	</FormSection>
 
 	<FormSection v-if="instance.enableGithubIntegration">
-		<template #label><i class="fab fa-github"></i> GitHub</template>
+		<template #label><i class="ph-github-logo-bold ph-lg"></i> GitHub</template>
 		<p v-if="integrations.github">{{ i18n.ts.connectedTo }}: <a :href="`https://github.com/${integrations.github.login}`" rel="nofollow noopener" target="_blank">@{{ integrations.github.login }}</a></p>
 		<MkButton v-if="integrations.github" danger @click="disconnectGithub">{{ i18n.ts.disconnectService }}</MkButton>
 		<MkButton v-else primary @click="connectGithub">{{ i18n.ts.connectService }}</MkButton>
diff --git a/packages/client/src/pages/user/index.vue b/packages/client/src/pages/user/index.vue
index 7de1bca3d9..5028df037e 100644
--- a/packages/client/src/pages/user/index.vue
+++ b/packages/client/src/pages/user/index.vue
@@ -112,7 +112,7 @@ definePageMetadata(
 	computed(() =>
 		user
 			? {
-				icon: 'fas fa-user',
+				icon: 'ph-user-bold ph-lg',
 				title: user.name
 					? `${user.name} (@${user.username})`
 					: `@${user.username}`,