2022-12-22 07:19:07 +13:00
|
|
|
import * as React from "react";
|
2023-06-27 09:34:22 +12:00
|
|
|
import { Avatar, Box, styled } from "@mui/material";
|
2023-02-12 08:13:10 +13:00
|
|
|
import logo from "../img/ntfy-filled.svg";
|
2022-12-22 07:19:07 +13:00
|
|
|
|
2023-06-27 09:34:22 +12:00
|
|
|
const AvatarBoxContainer = styled(Box)`
|
|
|
|
display: flex;
|
|
|
|
flex-grow: 1;
|
|
|
|
justify-content: center;
|
|
|
|
flex-direction: column;
|
|
|
|
align-content: center;
|
|
|
|
align-items: center;
|
|
|
|
height: 100dvh;
|
|
|
|
max-width: min(400px, 90dvw);
|
|
|
|
margin: auto;
|
|
|
|
`;
|
2022-12-22 07:19:07 +13:00
|
|
|
const AvatarBox = (props) => (
|
2023-06-27 09:34:22 +12:00
|
|
|
<AvatarBoxContainer>
|
2022-12-22 07:19:07 +13:00
|
|
|
<Avatar sx={{ m: 2, width: 64, height: 64, borderRadius: 3 }} src={logo} variant="rounded" />
|
|
|
|
{props.children}
|
2023-06-27 09:34:22 +12:00
|
|
|
</AvatarBoxContainer>
|
2022-12-22 07:19:07 +13:00
|
|
|
);
|
|
|
|
|
|
|
|
export default AvatarBox;
|