Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

optimize performance by Lighthouse report #24

Merged
merged 4 commits into from
Sep 14, 2024
Merged

optimize performance by Lighthouse report #24

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
0a30b3c
update mainlogo from png to webp
snowden-fu Oct 17, 2023
4819b89
update icon from img to svg component
snowden-fu Oct 17, 2023
293d89e
add alt for aligning best practise
snowden-fu Oct 17, 2023
df9443a
Merge branch 'master' into optimize-img-size
chamhayden Sep 14, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file added frontend/src/asset/mainlogo.webp
View file
Open in desktop
Binary file not shown.
27 changes: 8 additions & 19 deletions frontend/src/component/Navbar.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,39 +1,28 @@
import * as React from 'react';
import Box from '@mui/material/Box';
import Drawer from '@mui/material/Drawer';
import AppBar from '@mui/material/AppBar';
import CssBaseline from '@mui/material/CssBaseline';
import Toolbar from '@mui/material/Toolbar';
import List from '@mui/material/List';
import Typography from '@mui/material/Typography';
import Divider from '@mui/material/Divider';
import ListItem from '@mui/material/ListItem';
import ListItemIcon from '@mui/material/ListItemIcon';
import ListItemText from '@mui/material/ListItemText';
import InboxIcon from '@mui/icons-material/MoveToInbox';
import MailIcon from '@mui/icons-material/Mail';
import StarBorder from '@mui/icons-material/StarBorder';
import { useNavigate } from 'react-router-dom';
import {useLocation, useNavigate} from 'react-router-dom';
import ExpandLess from '@mui/icons-material/ExpandLess';
import ExpandMore from '@mui/icons-material/ExpandMore';
import ListItemButton from '@mui/material/ListItemButton';
import Collapse from '@mui/material/Collapse';
import { useLocation } from "react-router-dom"


import { makeStyles } from "@material-ui/core/styles";
import {makeStyles} from "@material-ui/core/styles";
import mainlogo from '../asset/mainlogo.webp';
import {Context, useContext} from '../context';

import External from '../asset/external.png';
import Logout from './Logout';
import Header from './Header';
import mainlogo from '../asset/mainlogo.png';
import { isMobileWidth } from '../util/screen';
import { Context, useContext } from '../context';

import { getPrimaryNavList, getSecondaryNavList } from './NavList';
import {getPrimaryNavList, getSecondaryNavList} from './NavList';
import OpenInNewIcon from '@mui/icons-material/OpenInNew';

const ExternalIcon = () => {
return <img style={{ width: '15px' }} src={External} />;
return <OpenInNewIcon/>;
}

const background = 'rgb(22,27,37)';
Expand Down Expand Up @@ -95,7 +84,7 @@ export default function ClippedDrawer({ children, drawerWidth, sidebarOpen, setS
>
<Box sx={{ overflow: 'auto', paddingTop: '60px' }}>
<Box sx={{ cursor: 'pointer', position: 'fixed', top: 0, height: '60px', width: drawerWidth, backgroundColor: background, zIndex: 999, borderBottom: '1px solid #333' }} onClick={() => navigate(`/${getters.term}`)}>
<img src={mainlogo} style={{ height: '59px', marginBottom: '10px', float: 'left' }} />
<img src={mainlogo} style={{ height: '59px', marginBottom: '10px', float: 'left' }} alt={'main-logo'}/>
<Typography sx={{ float: 'left ',fontSize: '1.3em', paddingTop: '15px', paddingLeft: '15px' }}>
COMP6080
</Typography>
Expand Down
Loading