almost ifnal

src/contents/human-practices/hpRefs.tsx

+const references = [
+  {
+    id: 1,
+    author: "Age Friendly Hamilton | City of Hamilton.",
+    year: "2024, September 23",
+    title: "Age Friendly Hamilton.",
+    source: "City of Hamilton",
+    link: "https://www.hamilton.ca/people-programs/adults-55-services/age-friendly-hamilton",
+    accessed: "Retrieved October 2, 2024"
+  },
+  {
+    id: 2,
+    author: "David Braley Centre for Antibiotic Discovery | Hamilton, Ontario.",
+    year: "(n.d.)",
+    title: "DBCAD.",
+    source: "DBCAD",
+    link: "https://www.mcmaster-dbcad.com",
+    accessed: "Retrieved October 2, 2024"
+  },
+  {
+    id: 3,
+    author: "Hamilton’s steel industry from birth, to boom and beyond.",
+    year: "2012, February 11",
+    title: "Hamilton’s steel industry from birth, to boom and beyond.",
+    source: "The Hamilton Spectator",
+    link: "https://www.thespec.com/news/hamilton-region/hamiltons-steel-industry-from-birth-to-boom-and-beyond/article_4decb079-39c2-50d5-b456-916ca473ec21.html"
+  },
+  {
+    id: 4,
+    author: "New Report: Informing African Energy Transitions.",
+    year: "2023, September",
+    title: "Hydrogen Decarbonisation Steel Production Canada.",
+    source: "Energy Transitions Commission",
+    link: "https://www.energy-transitions.org/publications/hydrogen-decarbonisation-steel-production-canada/",
+    accessed: "Retrieved October 2, 2024"
+  },
+  {
+    id: 5,
+    author: "Semester in Residence CityLAB (Director).",
+    year: "2024, January 6",
+    title: "CHCH Archives  Hamilton 125 1971 [Video recording].",
+    source: "YouTube",
+    link: "https://www.youtube.com/watch?v=hTY8Iit5Vzw"
+  },
+  {
+    id: 6,
+    author: "Wilson, M. W.",
+    year: "2023, September 22",
+    title: "The Rise of Homelessness in Hamilton.",
+    source: "Maureen Wilson",
+    link: "https://www.maureenwilson.ca/hhh",
+    accessed: "Retrieved October 2, 2024"
+  }
+];
+
+const hpRefs = () => {
+  return (
+    <div style={styles.container}>
+      <h3 style={styles.heading}>References</h3>
+      <ul style={styles.list}>
+        {references.map(ref => (
+          <li key={ref.id} style={styles.referenceItem}>
+            <a href={ref.link} target="_blank" rel="noopener noreferrer" style={styles.link}>
+              {ref.author} ({ref.year}). <i>{ref.title}</i>. {ref.source}. {ref.accessed ? `${ref.accessed}` : ""}
+            </a>
+          </li>
+        ))}
+      </ul>
+    </div>
+  );
+};
+
+const styles = {
+  container: {
+    border: '2px solid #f6e390',
+    padding: '20px',
+    borderRadius: '10px',
+    marginTop: '50px',
+    textAlign: 'left' as 'left',
+    marginLeft: '50px', marginRight: '50px'
+  },
+  heading: {
+    color: '#b5c62d',
+    fontSize: '18px',
+    marginBottom: '10px',
+    fontWeight: 'bold',
+  },
+  list: {
+    listStyleType: 'none',
+    padding: 0,
+  },
+  referenceItem: {
+    marginBottom: '10px',
+    fontSize: '14px',
+  },
+  link: {
+    color: '#fdfdfd',
+    textDecoration: 'none',
+  }
+};
+
+export default hpRefs;
\ No newline at end of file