Untitled

<template>
  <main>
    <div
      class="mx-auto container flex flex-col justify-center items-center mt-4"
    >
      <img
        src="../components/icons/emblem.png"
        alt="emblem"
        width="50px"
        height="50px"
      />
      <h1 class="font-heading text-md tracking-wider text-center mt-2">
        Baa Goidhoo Health Center
      </h1>
      <h1 class="font-heading text-sm tracking-wider text-center mt-2">
        Baa Goidhoo, Republic of Maldives
      </h1>
      <div class="mx-auto container lg:px-4">
        <p
          class="font-heading tracking-wider text-[16px] border-gray-700 border-2 p-2 md:w-full lg:w-full text-center w-96 mt-4"
        >
          Medical Laboratory Report
        </p>
      </div>
    </div>
    <PatientInfo />
    <div class="mx-auto container lg:px-4 md:px-3 mt-1">
      <!-- <div class="flex justify-evenly space-x-48 border border-gray-700 p-2">
        <h1 class="font-heading tracking-wider text-[15px] text-gray-600">
          Test
        </h1>
        <h1 class="font-heading tracking-wider text-[15px] text-gray-600">
          Result
        </h1>
      </div> -->
    </div>
    <div class="mx-auto container grid grid-rows-2 gap-1">
      <hb class="row-start-1" />
      <bio-chem class="row-start-1" />
      <lipid class="row-start-2" />
      <liver class="row-start-2" />
    </div>
    <!-- <renal />
    <electrolytes />
    <thyroid />
    <cardiac />
    <iron />
    <serology />
    <coagulation />
    <urine />
    <stool />
    <others />
    <SaveIcon /> -->
  </main>
</template>