mirror of
https://github.com/Myzel394/kleckrelay-website.git
synced 2025-06-19 15:55:26 +02:00
improvements
This commit is contained in:
parent
8ae24aec8e
commit
964ee90d50
@ -17,6 +17,7 @@ export interface SimpleFormProps {
|
||||
titleVariant?: TypographyProps["variant"]
|
||||
titleComponent?: OverrideProps<any, any>["component"]
|
||||
nonFieldError?: string
|
||||
onCancel?: () => void
|
||||
}
|
||||
|
||||
export default function SimpleForm({
|
||||
@ -26,6 +27,7 @@ export default function SimpleForm({
|
||||
continueActionLabel,
|
||||
cancelActionLabel,
|
||||
nonFieldError,
|
||||
onCancel,
|
||||
titleVariant = "h4",
|
||||
titleComponent = "h1",
|
||||
isSubmitting = false,
|
||||
@ -80,12 +82,13 @@ export default function SimpleForm({
|
||||
)}
|
||||
<Grid item>
|
||||
<Grid container justifyContent={cancelActionLabel ? "space-between" : "center"}>
|
||||
{cancelActionLabel && (
|
||||
{cancelActionLabel && onCancel && (
|
||||
<Grid item>
|
||||
<Button
|
||||
disabled={isSubmitting}
|
||||
startIcon={<TiCancel />}
|
||||
color="secondary"
|
||||
onClick={onCancel}
|
||||
>
|
||||
{cancelActionLabel}
|
||||
</Button>
|
||||
|
@ -2,34 +2,36 @@ import {ReactElement} from "react"
|
||||
import {useTranslation} from "react-i18next"
|
||||
import {FaMask} from "react-icons/fa"
|
||||
|
||||
import {Grid, Typography} from "@mui/material"
|
||||
import {Container, Grid, Typography} from "@mui/material"
|
||||
|
||||
export default function EmptyStateScreen(): ReactElement {
|
||||
const {t} = useTranslation()
|
||||
|
||||
return (
|
||||
<Grid
|
||||
container
|
||||
spacing={4}
|
||||
direction="column"
|
||||
alignItems="center"
|
||||
maxWidth="60%"
|
||||
alignSelf="center"
|
||||
marginX="auto"
|
||||
>
|
||||
<Grid item>
|
||||
<Typography variant="h6" component="h2">
|
||||
{t("routes.AliasesRoute.emptyState.title")}
|
||||
</Typography>
|
||||
<Container maxWidth="xs">
|
||||
<Grid
|
||||
container
|
||||
spacing={4}
|
||||
direction="column"
|
||||
alignItems="center"
|
||||
maxWidth="60%"
|
||||
alignSelf="center"
|
||||
marginX="auto"
|
||||
>
|
||||
<Grid item>
|
||||
<Typography variant="h6" component="h2">
|
||||
{t("routes.AliasesRoute.emptyState.title")}
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid item>
|
||||
<FaMask size={40} />
|
||||
</Grid>
|
||||
<Grid item>
|
||||
<Typography variant="body1">
|
||||
{t("routes.AliasesRoute.emptyState.description")}
|
||||
</Typography>
|
||||
</Grid>
|
||||
</Grid>
|
||||
<Grid item>
|
||||
<FaMask size={40} />
|
||||
</Grid>
|
||||
<Grid item>
|
||||
<Typography variant="body1">
|
||||
{t("routes.AliasesRoute.emptyState.description")}
|
||||
</Typography>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Container>
|
||||
)
|
||||
}
|
||||
|
@ -1,7 +1,7 @@
|
||||
import {ReactElement} from "react"
|
||||
import {useTranslation} from "react-i18next"
|
||||
|
||||
import {Grid, Typography} from "@mui/material"
|
||||
import {Container, Grid, Typography} from "@mui/material"
|
||||
import {mdiTextBoxMultiple} from "@mdi/js/commonjs/mdi"
|
||||
import Icon from "@mdi/react"
|
||||
|
||||
@ -9,28 +9,22 @@ export default function EmptyStateScreen(): ReactElement {
|
||||
const {t} = useTranslation()
|
||||
|
||||
return (
|
||||
<Grid
|
||||
container
|
||||
spacing={4}
|
||||
direction="column"
|
||||
alignItems="center"
|
||||
maxWidth="60%"
|
||||
alignSelf="center"
|
||||
marginX="auto"
|
||||
>
|
||||
<Grid item>
|
||||
<Typography variant="h6" component="h2">
|
||||
{t("routes.ReportsRoute.emptyState.title")}
|
||||
</Typography>
|
||||
<Container maxWidth="xs">
|
||||
<Grid container spacing={4} direction="column" alignItems="center" alignSelf="center">
|
||||
<Grid item>
|
||||
<Typography variant="h6" component="h2">
|
||||
{t("routes.ReportsRoute.emptyState.title")}
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid item>
|
||||
<Icon path={mdiTextBoxMultiple} size={2.5} />
|
||||
</Grid>
|
||||
<Grid item>
|
||||
<Typography variant="body1">
|
||||
{t("routes.ReportsRoute.emptyState.description")}
|
||||
</Typography>
|
||||
</Grid>
|
||||
</Grid>
|
||||
<Grid item>
|
||||
<Icon path={mdiTextBoxMultiple} size={2.5} />
|
||||
</Grid>
|
||||
<Grid item>
|
||||
<Typography variant="body1">
|
||||
{t("routes.ReportsRoute.emptyState.description")}
|
||||
</Typography>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Container>
|
||||
)
|
||||
}
|
||||
|
@ -56,6 +56,7 @@ export default function EnterDecryptionPassword(): ReactElement {
|
||||
cancelActionLabel={t("components.EnterDecryptionPassword.cancelAction")}
|
||||
continueActionLabel={t("components.EnterDecryptionPassword.continueAction")}
|
||||
isSubmitting={formik.isSubmitting}
|
||||
onCancel={navigateToNext}
|
||||
>
|
||||
{[
|
||||
<PasswordField
|
||||
|
Loading…
x
Reference in New Issue
Block a user