Merge branch 'develop' into s24-remove-redundancy-transcript

Author: amos-cha

src/components/Header/index.jsx

@@ -57,12 +57,28 @@ const useTabHighlight = () => {
   return tabIndex;
 };
 
+const useAltText = () => {
+  const location = useLocation();
+  const [altText, setAltText] = useState('');
+
+  useEffect(() => {
+    if (location.pathname === '/') {
+      setAltText('Gordon 360 Logo - Home page');
+    } else {
+      setAltText('Gordon 360 Logo - Go to home');
+    }
+  }, [location]);
+
+  return altText;
+};
+
 const GordonHeader = ({ onDrawerToggle }) => {
   const navigate = useNavigate();
   const [dialog, setDialog] = useState('');
   const isOnline = useNetworkStatus();
   const isAuthenticated = useIsAuthenticated();
   const tabIndex = useTabHighlight();
+  const altText = useAltText();
 
   const handleOpenProfile = () => {
     navigate('/myprofile');
@@ -148,7 +164,7 @@ const GordonHeader = ({ onDrawerToggle }) => {
               <source srcSet={headerLogo72dpi} media="(min-width: 900px)" />
               <source srcSet={headerLogo64dpi} media="(min-width: 600px)" />
               <source srcSet={headerLogo56dpiNoText} media="(max-width: 375px)" />
-              <img src={headerLogo56dpi} alt="Gordon 360 Logo"></img>
+              <img src={headerLogo56dpi} alt={altText}></img>
             </picture>
           </Link>
         </div>

src/components/Profile/components/PersonalInfoList/index.jsx

@@ -599,7 +599,10 @@ const PersonalInfoList = ({ myProf, profile, isOnline, createSnackbar }) => {
     (isFacStaff ? (
       <Typography align="left" className={styles.note}>
         NOTE: To update your personal info, please go to{' '}
-        <a href="https://gordon.criterionhcm.com/">Criterion</a> and look under "Personal Info" tab.
+        <a href="https://gordon.criterionhcm.com/" className={`gc360_text_link`}>
+          Criterion
+        </a>{' '}
+        and look under "Personal Info" tab.
       </Typography>
     ) : isStudent ? (
       <div align="left" className={styles.note}>

src/views/Home/components/GuestWelcome/index.jsx

@@ -74,7 +74,11 @@ const GuestWelcome = () => {
           <Grid container style={{ textAlign: 'center' }}>
             <Card raised className={styles.gw_card}>
               <CardHeader title="Welcome to Gordon 360!" />
-              <CardMedia image={GordonLogoVerticalWhite} component="img" />
+              <CardMedia
+                image={GordonLogoVerticalWhite}
+                component="img"
+                alt="Welcome to Gordon 360"
+              />
               <CardContent>
                 <Typography>
                   As a guest, you have access to a limited view of the site. Login for full access.

src/views/InvolvementProfile/components/ContactListItem/index.jsx

@@ -42,15 +42,15 @@ const ContactListItem = ({ contact }) => {
           {!avatar && <PlaceHolderAvatar />}
         </Avatar>
       </ListItemAvatar>
-      <Link href={`/profile/${contact.Email.split('@')[0]}`} underline="hover">
+      <Link href={`/profile/${contact.Email.split('@')[0]}`} className={`gc360_text_link`}>
         <ListItemText
           primary={`${contact.FirstName} ${contact.LastName}`}
           secondary={contact?.Description}
         />
       </Link>
       <ListItemSecondaryAction>
-        <IconButton color="primary" href={`mailto:${contact.Email}`} size="large">
-          <Email color="primary" />
+        <IconButton href={`mailto:${contact.Email}`} size="large">
+          <Email className={`gc360_text_link`} />
         </IconButton>
       </ListItemSecondaryAction>
     </ListItem>

src/views/InvolvementProfile/components/Membership/components/MemberList/MemberList.module.scss

@@ -247,7 +247,7 @@ const MemberListItem = ({
                 {member.FirstName} {member.LastName}
               </Typography>
             ) : (
-              <Link href={`/profile/${member.Username}`} underline="hover">
+              <Link href={`/profile/${member.Username}`} className={`gc360_text_link`}>
                 <Typography>
                   {member.FirstName} {member.LastName}
                 </Typography>
@@ -307,7 +307,7 @@ const MemberListItem = ({
                         {member.FirstName} {member.LastName}
                       </Typography>
                     ) : (
-                      <Link href={`/profile/${member.Username}`} underline="hover">
+                      <Link href={`/profile/${member.Username}`} className={`gc360_text_link`}>
                         <Typography>
                           {member.FirstName} {member.LastName}
                         </Typography>
@@ -359,7 +359,7 @@ const MemberListItem = ({
                 {member.FirstName} {member.LastName}
               </Typography>
             ) : (
-              <Link href={`/profile/${member.Username}`} underline="hover">
+              <Link href={`/profile/${member.Username}`} className={`gc360_text_link`}>
                 <Typography>
                   {member.FirstName} {member.LastName}
                 </Typography>

src/views/InvolvementProfile/components/Membership/components/MemberList/components/MemberListItem/index.jsx

@@ -1,7 +1,6 @@
 import { Card, CardContent, CardHeader, Grid } from '@mui/material';
 import { useWindowSize } from 'hooks';
 import MemberListItem from './components/MemberListItem';
-import styles from './MemberList.module.css';
 
 const breakpointWidth = 810;
 
@@ -52,7 +51,7 @@ const MemberList = ({
   };
 
   const header = isMobileView ? (
-    <CardHeader title="Members" className={styles.headerStyle} />
+    <CardHeader title="Members" className="gc360_header" />
   ) : isAdmin || isSiteAdmin ? (
     <CardHeader
       title={
@@ -71,7 +70,7 @@ const MemberList = ({
         </Grid>
       }
       titleTypographyProps={{ variant: 'h6' }}
-      className={styles.headerStyle}
+      className="gc360_header"
     />
   ) : (
     <CardHeader
@@ -86,7 +85,7 @@ const MemberList = ({
           </Grid>
         </Grid>
       }
-      className={styles.headerStyle}
+      className="gc360_header"
     />
   );
   return (