diff --git a/src/assets/Github button icon.svg b/src/assets/Github button icon.svg new file mode 100644 index 00000000..dce1c59d --- /dev/null +++ b/src/assets/Github button icon.svg @@ -0,0 +1,19 @@ + + + + + github [#142] + Created with Sketch. + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/assets/Google button icon.svg b/src/assets/Google button icon.svg new file mode 100644 index 00000000..56cb5e20 --- /dev/null +++ b/src/assets/Google button icon.svg @@ -0,0 +1,27 @@ + + + + Google-color + Created with Sketch. + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/pages/sign-in.tsx b/src/pages/sign-in.tsx index 3aecd91e..da2b0631 100644 --- a/src/pages/sign-in.tsx +++ b/src/pages/sign-in.tsx @@ -8,6 +8,9 @@ import { getProviders, signIn } from "next-auth/react"; import { getServerSession } from "next-auth"; import { authOptions } from "~/server/auth"; import Link from "next/link"; +import getIcon from "~/utils/getIcon"; +import Image from "next/image"; + const SignIn = ({ providers, @@ -25,14 +28,14 @@ const SignIn = ({
- + {/* Sign in with - -
+ */} +
{Object.values(providers).map((provider) => ( ))} diff --git a/src/utils/getIcon.ts b/src/utils/getIcon.ts new file mode 100644 index 00000000..259d50f5 --- /dev/null +++ b/src/utils/getIcon.ts @@ -0,0 +1,11 @@ +import googleButtonIcon from "../assets/Google button icon.svg"; +import githubButtonIcon from "../assets/Github button icon.svg"; + +const icons: { [key: string]: any } = { + Google: googleButtonIcon, + GitHub: githubButtonIcon, +}; + +export default function getIcon(iconName: string) { + return icons[iconName]; +}