From 0288215fbbb6e54b9ac7df8dd28ae0f1349888a9 Mon Sep 17 00:00:00 2001
From: Alex <33497058+bexsoft@users.noreply.github.com>
Date: Fri, 11 Dec 2020 20:30:42 -0600
Subject: [PATCH] Added padding to error message in login screen (#506)

Co-authored-by: Benjamin Perez <benjamin@bexsoft.net>
Co-authored-by: Cesar N <ces.nietor@gmail.com>
---
 portal-ui/src/screens/LoginPage/LoginPage.tsx | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/portal-ui/src/screens/LoginPage/LoginPage.tsx b/portal-ui/src/screens/LoginPage/LoginPage.tsx
index 9802d8a31..77080411f 100644
--- a/portal-ui/src/screens/LoginPage/LoginPage.tsx
+++ b/portal-ui/src/screens/LoginPage/LoginPage.tsx
@@ -94,6 +94,8 @@ const styles = (theme: Theme) =>
       fontWeight: 700,
       fontSize: 14,
       borderRadius: 8,
+      padding: 10,
+      boxSizing: "border-box",
     },
     mainContainer: {
       position: "relative",
@@ -134,6 +136,9 @@ const styles = (theme: Theme) =>
     linearPredef: {
       height: 10,
     },
+    errorIconStyle: {
+      marginRight: 3,
+    },
   });
 
 const inputStyles = makeStyles((theme: Theme) =>
@@ -404,8 +409,8 @@ const Login = ({ classes, userLoggedIn }: ILoginProps) => {
     <React.Fragment>
       {error !== "" && (
         <div className={classes.errorBlock}>
-          <ErrorIcon fontSize="small" />
-          &nbsp;{error}
+          <ErrorIcon fontSize="small" className={classes.errorIconStyle} />{" "}
+          {error}
         </div>
       )}
       <Paper className={classes.paper}>