Myzel394/kleckrelay
1
0
Fork 0
mirror of https://github.com/Myzel394/kleckrelay-website.git synced 2025-06-20 08:15:26 +02:00
Code Issues Packages Projects Releases Wiki Activity

improvements

Browse Source
This commit is contained in:
Myzel394 2022-11-05 10:53:08 +01:00
parent 8ae24aec8e
commit 964ee90d50
4 changed files with 47 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/SimpleForm.tsx
View File

@ -17,6 +17,7 @@ export interface SimpleFormProps {
titleVariant?: TypographyProps["variant"] titleVariant?: TypographyProps["variant"]
titleComponent?: OverrideProps<any, any>["component"] titleComponent?: OverrideProps<any, any>["component"]
nonFieldError?: string nonFieldError?: string
onCancel?: () => void
} }
export default function SimpleForm({ export default function SimpleForm({
@ -26,6 +27,7 @@ export default function SimpleForm({
continueActionLabel, continueActionLabel,
cancelActionLabel, cancelActionLabel,
nonFieldError, nonFieldError,
onCancel,
titleVariant = "h4", titleVariant = "h4",
titleComponent = "h1", titleComponent = "h1",
isSubmitting = false, isSubmitting = false,
@ -80,12 +82,13 @@ export default function SimpleForm({
)} )}
<Grid item> <Grid item>
<Grid container justifyContent={cancelActionLabel ? "space-between" : "center"}> <Grid container justifyContent={cancelActionLabel ? "space-between" : "center"}>
{cancelActionLabel && ( {cancelActionLabel && onCancel && (
<Grid item> <Grid item>
<Button <Button
disabled={isSubmitting} disabled={isSubmitting}
startIcon={<TiCancel />} startIcon={<TiCancel />}
color="secondary" color="secondary"
onClick={onCancel}
> >
{cancelActionLabel} {cancelActionLabel}
</Button> </Button>

48
src/route-widgets/AliasesRoute/EmptyStateScreen.tsx
View File

@ -2,34 +2,36 @@ import {ReactElement} from "react"
import {useTranslation} from "react-i18next" import {useTranslation} from "react-i18next"
import {FaMask} from "react-icons/fa" import {FaMask} from "react-icons/fa"
import {Grid, Typography} from "@mui/material" import {Container, Grid, Typography} from "@mui/material"
export default function EmptyStateScreen(): ReactElement { export default function EmptyStateScreen(): ReactElement {
const {t} = useTranslation() const {t} = useTranslation()
return ( return (
<Grid <Container maxWidth="xs">
container <Grid
spacing={4} container
direction="column" spacing={4}
alignItems="center" direction="column"
maxWidth="60%" alignItems="center"
alignSelf="center" maxWidth="60%"
marginX="auto" alignSelf="center"
> marginX="auto"
<Grid item> >
<Typography variant="h6" component="h2"> <Grid item>
{t("routes.AliasesRoute.emptyState.title")} <Typography variant="h6" component="h2">
</Typography> {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>
<Grid item> </Container>
<FaMask size={40} />
</Grid>
<Grid item>
<Typography variant="body1">
{t("routes.AliasesRoute.emptyState.description")}
</Typography>
</Grid>
</Grid>
) )
} }

40
src/route-widgets/ReportsRoute/EmptyStateScreen.tsx
View File

@ -1,7 +1,7 @@
import {ReactElement} from "react" import {ReactElement} from "react"
import {useTranslation} from "react-i18next" 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 {mdiTextBoxMultiple} from "@mdi/js/commonjs/mdi"
import Icon from "@mdi/react" import Icon from "@mdi/react"
@ -9,28 +9,22 @@ export default function EmptyStateScreen(): ReactElement {
const {t} = useTranslation() const {t} = useTranslation()
return ( return (
<Grid <Container maxWidth="xs">
container <Grid container spacing={4} direction="column" alignItems="center" alignSelf="center">
spacing={4} <Grid item>
direction="column" <Typography variant="h6" component="h2">
alignItems="center" {t("routes.ReportsRoute.emptyState.title")}
maxWidth="60%" </Typography>
alignSelf="center" </Grid>
marginX="auto" <Grid item>
> <Icon path={mdiTextBoxMultiple} size={2.5} />
<Grid item> </Grid>
<Typography variant="h6" component="h2"> <Grid item>
{t("routes.ReportsRoute.emptyState.title")} <Typography variant="body1">
</Typography> {t("routes.ReportsRoute.emptyState.description")}
</Typography>
</Grid>
</Grid> </Grid>
<Grid item> </Container>
<Icon path={mdiTextBoxMultiple} size={2.5} />
</Grid>
<Grid item>
<Typography variant="body1">
{t("routes.ReportsRoute.emptyState.description")}
</Typography>
</Grid>
</Grid>
) )
} }

1
src/routes/EnterDecryptionPassword.tsx
View File

@ -56,6 +56,7 @@ export default function EnterDecryptionPassword(): ReactElement {
cancelActionLabel={t("components.EnterDecryptionPassword.cancelAction")} cancelActionLabel={t("components.EnterDecryptionPassword.cancelAction")}
continueActionLabel={t("components.EnterDecryptionPassword.continueAction")} continueActionLabel={t("components.EnterDecryptionPassword.continueAction")}
isSubmitting={formik.isSubmitting} isSubmitting={formik.isSubmitting}
onCancel={navigateToNext}
> >
{[ {[
<PasswordField <PasswordField