1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
import { Link as RouterLink } from "@umijs/max";
import PropTypes from "prop-types";
import { forwardRef } from "react";
// @mui
import { Box, Link } from "@mui/material";
import { useTheme } from "@mui/material/styles";
// ----------------------------------------------------------------------
const Logo = forwardRef(({ disabledLink = false, sx, link, ...other }, ref) => {
const theme = useTheme();
const PRIMARY_LIGHT = theme.palette.primary.light;
const PRIMARY_MAIN = theme.palette.primary.main;
const PRIMARY_DARK = theme.palette.primary.dark;
// OR using local (public folder)
// -------------------------------------------------------
// const logo = (
// <Box
// component="img"
// src="/logo/logo_single.svg" => your path
// sx={{ width: 40, height: 40, cursor: 'pointer', ...sx }}
// />
// );
const logo = (
<Box
ref={ref}
component="div"
sx={{
width: 80,
height: 50,
display: "inline-flex",
...sx,
}}
{...other}
>
<img src="./logo.png" alt="" />
</Box>
);
if (disabledLink) {
return <>{logo}</>;
}
return (
<Link to={"/"} component={RouterLink} sx={{ display: "contents" }}>
{logo}
</Link>
);
});
Logo.propTypes = {
sx: PropTypes.object,
disabledLink: PropTypes.bool,
};
export default Logo;