UBC/Alley-HSBC-Frontend
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

small design change

Browse Source
This commit is contained in:
Taehee Choi 2022-03-08 12:42:07 -08:00
parent 28abd08255
commit 792d254ff7
2 changed files with 22 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/contacts/contacts-components/body-components/LowerBody.tsx
View File

@ -46,7 +46,7 @@ const LowerBody: React.FC<Props> = (props) => {
> >
<Button <Button
variant="text" variant="text"
color="secondary" color="info"
onClick={() => props.setMeetingInfoOpen(true)} onClick={() => props.setMeetingInfoOpen(true)}
> >
{meeting.name} {meeting.name}

33
src/components/contacts/contacts-components/body-components/UpperBody.tsx
View File

@ -4,6 +4,8 @@ import PhoneIcon from "@mui/icons-material/Phone";
import VideocamIcon from "@mui/icons-material/Videocam"; import VideocamIcon from "@mui/icons-material/Videocam";
import GroupsIcon from "@mui/icons-material/Groups"; import GroupsIcon from "@mui/icons-material/Groups";
import ContactInfo from "../../ContactInfo"; import ContactInfo from "../../ContactInfo";
import AddIcon from "@mui/icons-material/Add";
import { textAlign } from "@mui/system";
interface Props { interface Props {
contactInfo: ContactInfo; contactInfo: ContactInfo;
@ -26,40 +28,45 @@ const UpperBody: React.FC<Props> = (props) => {
sx={{ sx={{
display: "flex", display: "flex",
flexDirection: "row", flexDirection: "row",
justifyContent: "space-evenly", justifyContent: "space-between",
alignItems: "center", alignItems: "center",
mx: 4,
}} }}
> >
<Typography variant="h3">{props.contactInfo.name}</Typography> <Typography variant="h3">{props.contactInfo.name}</Typography>
<Button variant="outlined" color="success" startIcon={<AddIcon />}>
favorites
</Button>
</Box> </Box>
<Box <Box
sx={{ sx={{
display: "flex", display: "flex",
flexDirection: "row", flexDirection: "row",
alignItems: "center", alignItems: "center",
justifyContent: "space-between",
my: 2, my: 2,
mx: 4,
}} }}
> >
<Box <Box>
sx={{ <IconButton
ml: "5%", sx={{ border: 1, mr: 1, backgroundColor: "secondary" }}
}} size="large"
color="secondary"
> >
<IconButton sx={{ border: 1, mr: 1 }} size="large">
<PhoneIcon fontSize="large" /> <PhoneIcon fontSize="large" />
</IconButton> </IconButton>
<IconButton sx={{ border: 1, mr: 1 }} size="large"> <IconButton sx={{ border: 1, mr: 1 }} size="large" color="secondary">
<VideocamIcon fontSize="large" /> <VideocamIcon fontSize="large" />
</IconButton> </IconButton>
<IconButton sx={{ border: 1, mr: 1 }} size="large"> <IconButton sx={{ border: 1, mr: 1 }} size="large" color="secondary">
<GroupsIcon fontSize="large" /> <GroupsIcon fontSize="large" />
</IconButton> </IconButton>
<Button variant="outlined" color="success">
Add to favorites
</Button>
</Box> </Box>
<Box sx={{ display: "flex", flexDirection: "column", ml: "10%" }}> <Box sx={{ display: "flex", flexDirection: "column" }}>
<Typography>{props.contactInfo.status}</Typography> <Typography sx={{ textAlign: "right" }}>
{props.contactInfo.status}
</Typography>
<Typography>MeetingName-1372</Typography> <Typography>MeetingName-1372</Typography>
</Box> </Box>
</Box> </Box>