diff --git a/client/src/components/UnconnectedUserLayout.tsx b/client/src/components/UnconnectedUserLayout.tsx
index d6007cebf4e015c2635340bffe7432d989037114..6a91a8cf3ab960286e06b0007f926fff81a02a3d 100644
--- a/client/src/components/UnconnectedUserLayout.tsx
+++ b/client/src/components/UnconnectedUserLayout.tsx
@@ -18,6 +18,8 @@
import { Box, Card, CardContent, CardHeader, Container, Typography, useMediaQuery, useTheme } from '@mui/material'
import { motion } from 'framer-motion'
+import SettingLanguage from './GeneralSettings/SettingLanguage'
+
interface UnconnectedUserLayoutProps {
pageName?: string
children: React.ReactNode
@@ -58,47 +60,58 @@ export default function UnconnectedUserLayout({ pageName, children, message }: U
}
return (
- <Box sx={backgroundStyle}>
- <Container className="message-list" sx={mainContainerStyle}>
- <motion.div
- initial={{ y: isMobile ? 0 : -15, opacity: isMobile ? 1 : 0.5 }}
- animate={{ y: 0, opacity: 1 }}
- transition={{ duration: 0.5 }}
- >
- <Card sx={cardStyle}>
- <CardHeader title={pageName} />
- <CardContent
- sx={
- isMobile
- ? { width: '100%', height: '90%', display: 'flex', flexDirection: 'column', justifyContent: 'center' }
- : {}
- }
- component="form"
- >
- <Box sx={{ height: '80px', width: '100%', display: 'flex', justifyContent: 'center' }}>
- <Typography width="400px" variant="body2" style={{ textAlign: 'start' }}>
- {message}
- </Typography>
- </Box>
- <Box
+ <>
+ <Box sx={{ position: 'absolute', right: '0', padding: '1px' }}>
+ <SettingLanguage doNotDisplayLabel={true}></SettingLanguage>
+ </Box>
+ <Box sx={backgroundStyle}>
+ <Container className="message-list" sx={mainContainerStyle}>
+ <motion.div
+ initial={{ y: isMobile ? 0 : -15, opacity: isMobile ? 1 : 0.5 }}
+ animate={{ y: 0, opacity: 1 }}
+ transition={{ duration: 0.5 }}
+ >
+ <Card sx={cardStyle}>
+ <CardHeader title={pageName} />
+ <CardContent
sx={
isMobile
? {
- height: '80%',
width: '100%',
+ height: '90%',
display: 'flex',
flexDirection: 'column',
- justifyContent: 'space-between',
+ justifyContent: 'center',
}
- : { marginTop: '18%' }
+ : {}
}
+ component="form"
>
- {children}
- </Box>
- </CardContent>
- </Card>
- </motion.div>
- </Container>
- </Box>
+ <Box sx={{ height: '80px', width: '100%', display: 'flex', justifyContent: 'center' }}>
+ <Typography width="400px" variant="body2" style={{ textAlign: 'start' }}>
+ {message}
+ </Typography>
+ </Box>
+ <Box
+ sx={
+ isMobile
+ ? {
+ height: '80%',
+ width: '100%',
+ display: 'flex',
+ flexDirection: 'column',
+ justifyContent: 'space-between',
+ }
+ : { marginTop: '18%' }
+ }
+ >
+ {children}
+ </Box>
+ </CardContent>
+ </Card>
+ </motion.div>
+ </Container>
+ </Box>
+ </>
)
}
diff --git a/client/src/components/WelcomeAnimation.jsx b/client/src/components/WelcomeAnimation.jsx
index cdc8d2e40aa7f25ce05ca4b47cbc937d87b45f2c..87028a6c06b20904fc420791941f4ecdf93dca82 100644
--- a/client/src/components/WelcomeAnimation.jsx
+++ b/client/src/components/WelcomeAnimation.jsx
@@ -20,7 +20,7 @@ import { AnimatePresence, motion } from 'framer-motion'
import { useState } from 'react'
import { useTranslation } from 'react-i18next'
-import JamiLogo from '../icons/jamiLogoIcon.svg?react'
+import Logo from '../icons/jamiLogoIcon.svg?react'
const list = {
hidden: { opacity: 0 },
@@ -80,7 +80,7 @@ export default function WelcomeAnimation(props) {
}}
>
<motion.div style={{ width: '100%', display: 'flex', justifyContent: 'center' }} variants={item}>
- <JamiLogo width="60%" />
+ <Logo width="60%" />
</motion.div>
</motion.div>
)}
diff --git a/client/src/pages/AdminLogin.tsx b/client/src/pages/AdminLogin.tsx
index b9316936135a1da67ac01660633ae97348f196f4..13e71b3fc4cbc224db12025ae980f3c27cec258f 100644
--- a/client/src/pages/AdminLogin.tsx
+++ b/client/src/pages/AdminLogin.tsx
@@ -24,7 +24,7 @@ import { useTranslation } from 'react-i18next'
import { Link, Navigate } from 'react-router-dom'
import UnconnectedUserLayout from '../components/UnconnectedUserLayout'
-import jamiLogoIcon from '../icons/jamiLogoIcon.svg'
+import logoIcon from '../icons/jamiLogoIcon.svg'
import { useLoginAdminMutation } from '../services/adminQueries'
export default function AdminLogin() {
@@ -56,41 +56,43 @@ export default function AdminLogin() {
}
return (
- <UnconnectedUserLayout>
- <Box sx={isMobile ? { ...titleStyle, marginTop: '-20%' } : { ...titleStyle, marginTop: '-40%' }}>
- <img
- src={jamiLogoIcon}
- alt="Jami logo"
- style={{ width: '20%', height: 'auto', borderRadius: borderRadius, marginRight: '15px' }}
- />
- <Typography variant="h4" style={{ marginTop: 10, marginRight: '15px' }}>
- {t('admin_page_login_title')}
- </Typography>
- </Box>
- <Box sx={{ width: '100%', display: 'flex', justifyContent: 'center', marginTop: '10%' }}>
- <Typography>{t('admin_page_login_subtitle')}</Typography>
- </Box>
- <Box sx={isMobile ? { height: '60%' } : { marginTop: '20%' }}>
- <Box style={{ textAlign: 'center', marginTop: 10 }}>
- <div>
- <Input
- value={password}
- onChange={(e) => setPassword(e.target.value)}
- name="password"
- type="password"
- placeholder={t('password_placeholder')}
- autoComplete="new-password"
- required
- disabled={isPending}
- />
- </div>
+ <>
+ <UnconnectedUserLayout>
+ <Box sx={isMobile ? { ...titleStyle, marginTop: '-20%' } : { ...titleStyle, marginTop: '-40%' }}>
+ <img
+ src={logoIcon}
+ alt="Jami logo"
+ style={{ width: '20%', height: 'auto', borderRadius: borderRadius, marginRight: '15px' }}
+ />
+ <Typography variant="h4" style={{ marginTop: 10, marginRight: '15px' }}>
+ {t('admin_page_login_title')}
+ </Typography>
+ </Box>
+ <Box sx={{ width: '100%', display: 'flex', justifyContent: 'center', marginTop: '10%' }}>
+ <Typography>{t('admin_page_login_subtitle')}</Typography>
</Box>
- <Box style={{ textAlign: 'center', marginTop: 24 }} onClick={handleSubmit}>
- <Fab variant="extended" color="primary" type="submit" disabled={isPending}>
- {t('login_form_submit_button')}
-
- <GroupAddRounded />
- </Fab>
+ <Box sx={isMobile ? { height: '60%' } : { marginTop: '20%' }}>
+ <Box style={{ textAlign: 'center', marginTop: 10 }}>
+ <div>
+ <Input
+ value={password}
+ onChange={(e) => setPassword(e.target.value)}
+ name="password"
+ type="password"
+ placeholder={t('password_placeholder')}
+ autoComplete="new-password"
+ required
+ disabled={isPending}
+ />
+ </div>
+ </Box>
+ <Box style={{ textAlign: 'center', marginTop: 24 }} onClick={handleSubmit}>
+ <Fab variant="extended" color="primary" type="submit" disabled={isPending}>
+ {t('login_form_submit_button')}
+
+ <GroupAddRounded />
+ </Fab>
+ </Box>
</Box>
<Box
sx={{
@@ -106,7 +108,7 @@ export default function AdminLogin() {
</Link>
</Typography>
</Box>
- </Box>
- </UnconnectedUserLayout>
+ </UnconnectedUserLayout>
+ </>
)
}
diff --git a/client/src/pages/Login.tsx b/client/src/pages/Login.tsx
index d53f823cfdc561e5c0b01bd14fa72d4622738c54..8fd5ed7f51194795f7a43d30553ad2606bac1ec6 100644
--- a/client/src/pages/Login.tsx
+++ b/client/src/pages/Login.tsx
@@ -21,7 +21,6 @@ import { ChangeEvent, FormEvent, useContext, useState } from 'react'
import { useTranslation } from 'react-i18next'
import { Form, Link } from 'react-router-dom'
-import SettingLanguage from '../components/GeneralSettings/SettingLanguage'
import { PasswordInput, UsernameInput } from '../components/Input'
import JamiWelcomeLogo from '../components/JamiWelcomeLogo'
import ProcessingRequest from '../components/ProcessingRequest'
@@ -109,10 +108,6 @@ function LoginForm() {
return (
<>
- <Box sx={{ position: 'absolute', right: '0', padding: '1px' }}>
- <SettingLanguage doNotDisplayLabel={true}></SettingLanguage>
- </Box>
-
<ProcessingRequest open={isPending} />
<UnconnectedUserLayout>
<Box
diff --git a/client/src/pages/Registration.tsx b/client/src/pages/Registration.tsx
index cbe6ccc3fe60e6337072d78a9cce9e2f420fc30c..2b969193dc973b8bf447a2d6a9f1d9fb263586fc 100644
--- a/client/src/pages/Registration.tsx
+++ b/client/src/pages/Registration.tsx
@@ -22,7 +22,6 @@ import { ChangeEvent, FormEvent, useEffect, useState } from 'react'
import { useTranslation } from 'react-i18next'
import { Form, Link, useNavigate } from 'react-router-dom'
-import SettingLanguage from '../components/GeneralSettings/SettingLanguage'
import { NameStatus, PasswordInput, PasswordStatus, UsernameInput } from '../components/Input'
import JamiWelcomeLogo from '../components/JamiWelcomeLogo'
import ProcessingRequest from '../components/ProcessingRequest'
@@ -146,11 +145,7 @@ function RegistrationForm() {
return (
<>
- <Box sx={{ position: 'absolute', right: '0', padding: '1px' }}>
- <SettingLanguage doNotDisplayLabel={true}></SettingLanguage>
- </Box>
<ProcessingRequest open={isPending} />
-
<UnconnectedUserLayout>
<Box
sx={{