From 5c307ae8d53425138c3abec4a138bb58d4b22178 Mon Sep 17 00:00:00 2001
From: Sidney Alcantara <sidney@sidney.me>
Date: Thu, 9 Sep 2021 10:49:49 +1000
Subject: [PATCH] update auth styles

---
 src/components/Auth/AuthLayout.tsx |  1 +
 src/components/Auth/FirebaseUi.tsx | 10 +++++++++-
 2 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/src/components/Auth/AuthLayout.tsx b/src/components/Auth/AuthLayout.tsx
index 57b208f4..981502cb 100644
--- a/src/components/Auth/AuthLayout.tsx
+++ b/src/components/Auth/AuthLayout.tsx
@@ -88,6 +88,7 @@ export default function AuthLayout({ children, loading }: IAuthLayoutProps) {
             maxWidth: 400,
             width: "100%",
             p: 4,
+            boxShadow: 4,
 
             "--spacing-contents": (theme) => theme.spacing(4),
             "& > * + *": { marginTop: "var(--spacing-contents)" },
diff --git a/src/components/Auth/FirebaseUi.tsx b/src/components/Auth/FirebaseUi.tsx
index 312c3bbd..2782fd7b 100644
--- a/src/components/Auth/FirebaseUi.tsx
+++ b/src/components/Auth/FirebaseUi.tsx
@@ -60,7 +60,15 @@ const useStyles = makeStyles((theme) =>
           borderRadius: (theme.shape.borderRadius as number) * (48 / 32),
           ...theme.typography.button,
         },
-        "& .mdl-button--raised": { boxShadow: "none" },
+        "& .mdl-button--raised": {
+          boxShadow: `0 -1px 0 0 rgba(0, 0, 0, 0.12) inset, ${theme.shadows[2]}`,
+          "&:hover": {
+            boxShadow: `0 -1px 0 0 rgba(0, 0, 0, 0.12) inset, ${theme.shadows[4]}`,
+          },
+          "&:active, &:focus": {
+            boxShadow: `0 -1px 0 0 rgba(0, 0, 0, 0.12) inset, ${theme.shadows[8]}`,
+          },
+        },
         "& .mdl-card": {
           boxShadow: "none",
           minHeight: 0,