Hero with reference to fgo-ta.com

src/components/fgotaHero.astro

@@ -0,0 +1,27 @@
+---
+---
+
+<div>
+  <span>
+    I am currently working on a site to catalogue past and future TAs.<br/>
+    Check it out at <a href="https://fgo-ta.com">fgo-ta.com</a>
+  </span>
+</div>
+
+<style>
+  div {
+    display: flex;
+    width: 100%;
+    height: 5em;
+    background-color: var(--c-gray);
+    text-align: center;
+    align-items: center;
+    justify-content: center;
+    color: white;
+    font-size: 1.5em;
+  }
+  a {
+    color: var(--c-darkpurple);
+    text-decoration: none;
+  }
+</style>

src/pages/ta-collection.astro

@@ -11,6 +11,7 @@ import TaSection from '../layouts/taSection.astro'
 import TaCard from '../components/taCard.astro'
 import tadata from '../../static/data/_tadata.json'
 import featured_data from '../../static/data/_featureddata.json'
+import FgotaHero from '../components/fgotaHero.astro'
 
 const important_data = tadata.filter(function (el) {
   return [
@@ -36,6 +37,7 @@ const description = 'A collection of TAs previously completed be Firq.'
   currentpage="ta-collection"
   descriptionOverride={description}
 >
+  <FgotaHero />
   <TaSection title="Notable TAs" abovetext="My most notable TAs">
     {important_data.map((item) => <TaCard {...item} />)}
   </TaSection>