remove text decoration

This commit is contained in:
Aria Moradi
2021-10-30 16:56:33 +03:30
parent a30ddcf811
commit a2081a4552

View File

@@ -10,7 +10,7 @@ import {
Box, ListItem, Box, ListItem,
} from '@mui/material'; } from '@mui/material';
import { styled } from '@mui/system'; import { styled } from '@mui/system';
import { Link, useLocation } from 'react-router-dom'; import { Link as RRDLink, useLocation } from 'react-router-dom';
const BottomNavContainer = styled('div')(({ theme }) => ({ const BottomNavContainer = styled('div')(({ theme }) => ({
bottom: 0, bottom: 0,
@@ -28,6 +28,11 @@ const BottomNavContainer = styled('div')(({ theme }) => ({
zIndex: 1100, zIndex: 1100,
})); }));
const Link = styled(RRDLink)({
textDecoration: 'none',
flex: 1,
});
interface IProps { interface IProps {
navBarItems: Array<NavbarItem> navBarItems: Array<NavbarItem>
} }
@@ -38,8 +43,8 @@ export default function MobileBottomBar({ navBarItems }: IProps) {
<BottomNavContainer> <BottomNavContainer>
{ {
navBarItems.map(({ path, title, IconComponent }: NavbarItem) => ( navBarItems.map(({ path, title, IconComponent }: NavbarItem) => (
<Link to={path} style={{ flex: 1 }} key={path}> <Link to={path} key={path}>
<ListItem disableRipple button style={{ justifyContent: 'center', padding: '8px' }} key={title}> <ListItem disableRipple button sx={{ justifyContent: 'center', padding: '8px' }} key={title}>
<Box sx={{ <Box sx={{
display: 'flex', display: 'flex',
flexDirection: 'column', flexDirection: 'column',