Replace with person icons

apps/app/src/components/User/UserInfo.tsx

@@ -28,7 +28,7 @@ export const UserInfo = (props: UserInfoProps): JSX.Element => {
         <div className="user-page-meta mt-3 mb-0">
           <span className="user-page-username me-4">
             {/* TODO:Replace with Material Symbols Outlined */}
-            <span className="user-page-username me-4"><i className="icon-user me-1"></i>{author.username}</span>
+            <span className="user-page-username me-4"><span className="material-symbols-outlined">person</span>{author.username}</span>
           </span>
           <span className="user-page-email me-2">
             <span className="material-symbols-outlined me-1">mail</span>

apps/app/src/pages/installer.page.tsx

@@ -42,7 +42,7 @@ const InstallerPage: NextPage<Props> = (props: Props) => {
   const navTabMapping = useMemo(() => {
     return {
       user_infomation: {
-        Icon: () => <i className="icon-fw icon-user"></i>,
+        Icon: () => <span className="material-symbols-outlined me-1">person</span>,
         Content: InstallerForm,
         i18n: t('installer.tab'),
       },