Removes avatars

.vscode/settings.json

@@ -2,6 +2,6 @@
     "licenser.license": "AGPLv3",
     "sarif-viewer.connectToGithubCodeScanning": "off",
     "editor.codeActionsOnSave": {
-        "source.fixAll.eslint": true
+        "source.fixAll.eslint": "explicit"
     },
 }

src/components/Sidebar.tsx

@@ -22,7 +22,7 @@ export default function Sidebar({ title, children }: Props) {
   return (
     <>
       <header className="flex w-full items-center justify-between px-6 py-7">
-        <h2 className="w-full text-base font-semibold leading-7 text-white">
+        <h2 className="w-full text-base font-semibold leading-7 text-black dark:text-white">
           {title}
         </h2>
       </header>

src/components/navigation/Sidenav.tsx

@@ -15,7 +15,7 @@
 
 import { useOrg } from "@/hooks/useOrg";
 import { UserGroupIcon } from "@heroicons/react/20/solid";
-import { PlusIcon } from "@heroicons/react/24/outline";
+import { PlusIcon, UserIcon } from "@heroicons/react/24/solid";
 import Image from "next/image";
 import Link from "next/link";
 import { useRouter } from "next/router";
@@ -86,13 +86,14 @@ export default function Sidenav() {
         </div>
         <div className="flex flex-row justify-center">
           {user && (
-            <Link href="/user-settings">
-              <Image
-                className="rounded-lg bg-gray-800"
-                src="/examples/tim.jpg"
-                alt=""
-                width={40}
-                height={40}
+            <Link
+              className="rounded-lg bg-gray-200 p-1.5 text-black dark:bg-slate-700"
+              href="/user-settings"
+            >
+              <UserIcon
+                className="text-gray-600 dark:text-slate-400"
+                width={25}
+                height={25}
               />
             </Link>
           )}

src/pages/user-settings.tsx

@@ -41,6 +41,7 @@ import { PersonalAccessTokenDTO } from "../types/api/api";
 import { createPat } from "../services/patService";
 import DateString from "@/components/common/DateString";
 import { middleware } from "@/decorators/middleware";
+import { UserIcon } from "@heroicons/react/24/solid";
 
 interface Props {
   flow?: SettingsFlow;
@@ -230,15 +231,11 @@ const Settings: FunctionComponent<{
         >
           <div className="grid grid-cols-3 gap-x-6 gap-y-8 sm:grid-cols-6">
             <div className="col-span-full flex items-center gap-x-8">
-              <Image
-                src="/examples/tim.jpg"
-                alt=""
-                width={96}
-                height={96}
-                className="h-24 w-24 flex-none rounded-lg bg-gray-800 object-cover"
-              />
+              <div className="rounded-lg bg-gray-300 p-2 dark:bg-slate-700 dark:text-slate-400">
+                <UserIcon width={60} height={60} />
+              </div>
               <div>
-                <Button>Change avatar</Button>
+                <Button disabled>Change avatar</Button>
                 <p className="mt-2 text-xs leading-5 text-black/80">
                   JPG, GIF or PNG. 1MB max.
                 </p>