@elacity-js/uikit/dist/layouts/Footer/Footer.js

React / Material UI Design kit for Elacity project

import { jsx, jsxs } from 'react/jsx-runtime';
import Stack from '@mui/material/Stack';
import Link from '@mui/material/Link';
import Box from '@mui/material/Box';
import useMediaQuery from '@mui/material/useMediaQuery';
import { styled } from '@mui/material/styles';
import { RouterLink } from '../../components/Link.js';
import { FullLogo } from '../../assets/Logo.js';
import 'react';
import useAppSettings from '../../hooks/useAppSettings.js';
import '../../contexts/AuthenticationContext.js';
import '@elacity-js/lib';
import 'lodash';
import ElastosMark from './ElastosMark.js';

const Item = styled('div', {
    name: 'FooterItem',
    slot: 'Root',
    shouldForwardProp: (prop) => !['hideFrom'].includes(prop),
})(({ theme, hideFrom }) => (Object.assign(Object.assign({}, theme.typography.body2), { textAlign: 'center', color: theme.palette.text.secondary, minWidth: 130, [theme.breakpoints.down(hideFrom)]: {
        display: 'none',
    } })));
const FooterContainer = styled(Box, {
    name: 'Footer',
    slot: 'Root',
    shouldForwardProp: (prop) => !['adjustWith', 'position'].includes(prop),
    overridesResolver: (props, styles) => [
        styles.root,
    ],
})(({ theme }) => ({
    bottom: 0,
    margin: theme.spacing(2, 'auto', 1),
    [theme.breakpoints.down('lg')]: {
        width: '100%',
    },
}));
function FooterLayout({ sx, hideLeftFrom, position }) {
    const isNotLarge = useMediaQuery((t) => t.breakpoints.down('lg'));
    const { appName } = useAppSettings();
    return (jsx(FooterContainer, Object.assign({ className: "Footer-container", position: position, sx: sx }, { children: jsxs(Stack, Object.assign({ className: "Footer-stack", direction: isNotLarge ? 'column' : 'row', spacing: 0, justifyContent: "space-between", alignItems: "center", px: 0 }, { children: [jsx(Item, Object.assign({ hideFrom: hideLeftFrom || 'sm' }, { children: jsx(ElastosMark, { position: "relative" }) })), jsx(Item, { children: jsx(Link, Object.assign({ component: RouterLink, to: "/" }, { children: jsx(FullLogo, { size: 100 }) })) }), jsxs(Item, { children: [jsx(Box, { children: jsxs(Link, Object.assign({ href: "/", underline: "hover", color: "inherit" }, { children: ["\u00A9", ' ', new Date().getFullYear(), ' ', appName] })) }), jsx(Box, Object.assign({ sx: { fontSize: '85%' } }, { children: `version ${process.env.REACT_APP_VERSION}` }))] })] })) })));
}
FooterLayout.defaultProps = {
    position: 'relative'
};

export { FooterLayout as default };
//# sourceMappingURL=Footer.js.map