feather icons and inter (#3366)

apps/web/components/SettingsShell.tsx

@@ -1,13 +1,7 @@
-import {
-  CreditCardIcon,
-  KeyIcon,
-  LockClosedIcon,
-  UserGroupIcon,
-  UserIcon,
-  CodeIcon,
-} from "@heroicons/react/solid";
 import React, { ComponentProps } from "react";
 
+import { Icon } from "@calcom/ui/Icon";
+
 import ErrorBoundary from "@lib/ErrorBoundary";
 
 import NavTabs from "./NavTabs";
@@ -17,32 +11,32 @@ const tabs = [
   {
     name: "profile",
     href: "/settings/profile",
-    icon: UserIcon,
+    icon: Icon.User,
   },
   {
     name: "teams",
     href: "/settings/teams",
-    icon: UserGroupIcon,
+    icon: Icon.Users,
   },
   {
     name: "security",
     href: "/settings/security",
-    icon: KeyIcon,
+    icon: Icon.Key,
   },
   {
     name: "developer",
     href: "/settings/developer",
-    icon: CodeIcon,
+    icon: Icon.Terminal,
   },
   {
     name: "billing",
     href: "/settings/billing",
-    icon: CreditCardIcon,
+    icon: Icon.CreditCard,
   },
   {
     name: "admin",
     href: "/settings/admin",
-    icon: LockClosedIcon,
+    icon: Icon.Lock,
     adminRequired: true,
   },
 ];