---
import Layout from '../layouts/Layout.astro'
import BaseSection from '../layouts/baseSection.astro'

import ServantCard from '../components/servantCard.astro'
import servantdata from '../../static/assets/data/_servantdata.json'

import CeCard from '../components/ceCard.astro'
import cedata from '../../static/assets/data/_cedata.json'

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}
>
  <BaseSection title="Servants">
    {servantdata.map((item) => <ServantCard {...item} />)}
  </BaseSection>
  <div class="placeholder"></div>
  <BaseSection title="CEs">
    {cedata.map((item) => <CeCard {...item} />)}
  </BaseSection>
  <div class="placeholder"></div>
</Layout>

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