layout update

src/components/Logo/Logo.js

@@ -22,7 +22,7 @@ const Logo = () => {
      *
      */
     <>
-      <svg width="130" height="85" viewBox="20 0 10 35" fill="none" xmlns="http://www.w3.org/2000/svg">
+      <svg width="130" height="85" viewBox="20 -1 10 35" fill="none" xmlns="http://www.w3.org/2000/svg">
         <defs>
           <clipPath id="clipPath22">
           <path d="m0 256h213v-256h-213z"/>

src/layout/MainLayout/Header/index.js

@@ -366,6 +366,7 @@ function Header(props) {
                 justifyContent="flex-start"
                 alignItems="center"
                 spacing={0}
+                // sx={{width:{xs:'100%',md:'25%'}}}
               >
                 <Box sx={{ width: '260px', flexGrow: 1, display: { xs: 'none', sm: 'none', md: 'block' } }}>
                   <Stack direction="row" justifyContent="flex-start" alignItems="center">
@@ -411,12 +412,17 @@ function Header(props) {
                 </ul>
 
                 <Grid item>
-                  <Grid container direction="row" >
+                  <Grid container direction="column" 
+                    justifyContent="flex-end" 
+                    alignItems="center"
+                  >
                     {
                       isGLDLoggedIn() ?
                         <Grid item />
                         :
-                        <LocaleSelector />
+                        <Grid item>
+                          <LocaleSelector />
+                        </Grid>
                     }
                     {/*<Profile />*/}
                   </Grid>
@@ -451,9 +457,11 @@ function Header(props) {
               justifyContent="flex-start"
               alignItems="center"
               spacing={0}
+              // width="100%"
+              sx={{width:{xs:'100%',md:'25%'}}}
             >
               <Box sx={{ flexGrow: 1, display: { xs: 'none', sm: 'none', md: 'block' } }}>
-                <Stack direction="row" justifyContent="flex-start" alignItems="center">
+                <Stack direction="row" justifyContent="flex-start" alignItems="center" >
                   <Logo />
                   <Stack justifyContent="flex-start" alignItems="center">
                     <span id="systemTitle">
@@ -473,9 +481,9 @@ function Header(props) {
               </IconButton>
               <Box sx={{ flexGrow: 1, mr: 2, display: { sm: 'block', md: 'none' } }}>
 
-                <Stack direction="row" justifyContent="space-between" alignItems="center">
+                <Stack direction="row" justifyContent="space-between" alignItems="center" width="100%">
                   <MobileLogo />
-                  <Stack justifyContent="flex-start" alignItems="center">
+                  <Stack justifyContent="flex-start" alignItems="flex-start" width="100%" ml={2}>
                     <span id="mobileTitle">
                       <FormattedMessage id="PNSPS" />
                     </span>

src/pages/authentication/ForgotPassword/AfterForgotPasswordPage.js

@@ -10,7 +10,7 @@ import {
 import * as React from "react";
 
 import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
-import ForwardIcon from '@mui/icons-material/Forward';
+// import ForwardIcon from '@mui/icons-material/Forward';
 import MainCard from 'components/MainCard';
 
 
@@ -51,7 +51,7 @@ const AfterForgotPasswordPage = () => {
                     </Stack>
                 </div>
             </Grid>
-            <Grid item xs={12} width={{xs:"90%", sm:"90%", md:"60%", lg:"60%"}}>
+            {/* <Grid item xs={12} width={{xs:"90%", sm:"90%", md:"60%", lg:"60%"}}>
                 <Button
                     aria-label={intl.formatMessage({id: 'back'})}
                     title={intl.formatMessage({id: 'back'})}
@@ -59,7 +59,7 @@ const AfterForgotPasswordPage = () => {
                 >
                     <ForwardIcon style={{ height: 30, width: 50, transform: "rotate(180deg)" }} />
                 </Button>
-            </Grid>
+            </Grid> */}
             {/* <Grid item xs={12}>
                     <Typography variant="pnspsFormParagraphBold">申請公共啟事</Typography>
                 </Grid> */}
@@ -77,7 +77,7 @@ const AfterForgotPasswordPage = () => {
                     border={false}
                     boxShadow
                 >
-                    <Grid container spacing={4} sx={{ minHeight: {xs:"80vh", sm:"70vh", md: "70vh", lg:"70vh", xl:"50vh"} }} direction="column" justifyContent="flex-start" alignItems="center">
+                    <Grid container spacing={4} sx={{ minHeight: {xs:"80vh", sm:"70vh", md: "70vh", lg:"70vh", xl:"50vh"} }} direction="column" justifyContent="center" alignItems="center">
                         <Grid item xs={12} md={12} lg={12} sx={{ mb: 1, mt:5, display: { xs: 'none', sm: 'none', md: 'block' } }}>
                             <Grid container direction="column" alignItems="center">
                                 <Grid item xs={12} md={12} lg={12} >
@@ -138,12 +138,12 @@ const AfterForgotPasswordPage = () => {
                         <Grid item xs={12} md={12} lg={12} mt={1} sx={{mb:3}}>
                             <ThemeProvider theme={PNSPS_LONG_BUTTON_THEME}>
                                 <Button
-                                    aria-label={intl.formatMessage({id: 'continue'})}
+                                    aria-label={intl.formatMessage({id: 'confirm'})}
                                     variant="contained"
                                     // type="submit"
                                     onClick={()=>handleContinue()}
                                 >
-                                    <FormattedMessage id="continue"/>
+                                    <FormattedMessage id="confirm"/>
                                 </Button>
                             </ThemeProvider>
                         </Grid>