added hyperlink to name

rafiks7 · Aug 23, 2024 · 69b2097 · 69b2097
1 parent b7e91c4
commit 69b2097
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 6 deletions.
diff --git a/app/Components/profcard.js b/app/Components/profcard.js
@@ -1,12 +1,12 @@
-'use client'
+"use client";
 
-import { Box, Stack } from "@mui/material";
+import { Box, Stack, Link } from "@mui/material";
 
 const purple_light = "#B185A7";
 const purple_dark = "#8D6B94";
 
 export default function ProfCard(items) {
-  const {name, subject, rating, summary} = items
+  const { name, subject, rating, summary, link } = items;
   return (
     <Box
       width="700px"
@@ -33,7 +33,21 @@ export default function ProfCard(items) {
         fontWeight="bold"
         mb={2}
       >
-        {name}
+        <Link
+          href={link}
+          underline="none"
+          color="inherit"
+          target="_blank" // Open link in a new tab
+          rel="noopener noreferrer" // Security best practice
+          sx={{
+            textDecoration: 'none', // Remove default underline
+            '&:hover': {
+              textDecoration: 'underline', // Add underline on hover
+            },
+          }}
+        >
+          {name}
+        </Link>
       </Box>
       <Stack
         direction="row"
@@ -90,5 +104,5 @@ export default function ProfCard(items) {
         {summary}
       </Box>
     </Box>
-  )
-}
+  );
+}
diff --git a/app/page.js b/app/page.js
@@ -250,6 +250,7 @@ export default function Home() {
           )}
           {professorsJSON.map((professor) => (
             <ProfCard
+              link={professor.link}
               name={professor.professor}
               subject={professor.subject}
               rating={professor.rating}