firq-dev-website/src/pages/servants.astro

---
import Layout from '@layouts/Layout.astro'
import ServantSection from '@layouts/servantSection.astro'

import ServantCard from '@components/cards/servantCard.astro'
import servantdata from '@datafiles/servantdata.json'

import CeCard from '@components/cards/ceCard.astro'
import cedata from '@datafiles/cedata.json'
import SmallTitle from '@components/titles/smallTitle.astro'

const description =
  'A list of all the servants and ces that Firq can offer up on support for TA.'
---

<Layout
  title="Servants - Firq FGO Site"
  currentpage="servants"
  descriptionOverride={description}
>
  <SmallTitle maintext='TA Offering' subtext='Servants and CEs I can offer for your TAs' fadeout={true}/>
  <ServantSection title="Servants">
    {servantdata.map((item, index) => <ServantCard {...item} index={index} />)}
  </ServantSection>
  <div class="placeholder"></div>
  <ServantSection title="CEs">
    {cedata.map((item) => <CeCard {...item} />)}
  </ServantSection>
  <div class="placeholder"></div>
</Layout>

<style>
  .placeholder {
    visibility: hidden;
    width: 100%;
    height: 2.5rem;
  }
</style>