<script setup lang="ts"></script>
<template>
  <div class="col-12 row justify-center text-h6 text-dark">ติดต่อเรา</div>
  <div class="col-12 q-pt-md"></div>
  <div class="col-12"><q-separator color="grey-4" /></div>

  <!-- <q-card class="row col-12 q-mt-md">
    <div
      class="col-12 q-px-md q-py-sm text-subtitle2 text-blue bg-light-blue-1 text-weight-medium"
    >
      ระบบหลัก , บรรจุ แต่งตั้ง ย้าย โอน , พ้นราชการ
    </div>
    <div class="col-12 row q-pa-md">
      <div class="col-6 row q-pa-sm icon_cer q-col-gutter-md">
        <q-icon class="iconcontat" name="mdi-account-tie" />
        <div class="txt text-weight-regular">
          ผู้ดูแล
          <br />
          <div class="txt1 text-weight-regular">นางสาวกัณฐิมา กาฬสินธุ์</div>
        </div>
      </div>

      <div class="col-6 row q-pa-sm icon_cer q-col-gutter-md">
        <q-icon class="iconcontat" name="mdi-briefcase" />
        <div class="txt text-weight-regular">
          หน่วยงาน
          <br />
          <div class="txt1 text-weight-regular">
            สำนักงานคณะกรรมการข้าราชการกรุงเทพมหานคร
          </div>
        </div>
      </div>

      <div class="col-6 row q-pa-sm icon_cer q-col-gutter-md">
        <q-icon class="iconcontat" name="mdi-phone" />
        <div class="txt text-weight-regular">
          เบอร์โทร
          <br />
          <div class="txt1 text-weight-regular">063-511-9047</div>
        </div>
      </div>

      <div class="col-6 row q-pa-sm icon_cer q-col-gutter-md">
        <q-icon class="iconcontat" name="mdi-email" />
        <div class="txt text-weight-regular">
          อีเมล
          <br />
          <div class="txt1 text-weight-regular">Kantima_Kalsin@gmail.com</div>
        </div>
      </div>
    </div>
  </q-card>

  <q-card class="row col-12 q-mt-md">
    <div
      class="col-12 q-px-md q-py-sm text-subtitle2 text-blue bg-blue-1 text-weight-medium"
    >
      โครงสร้างอัตรากำลัง , ออกคำสั่ง , สรรหา
    </div>
    <div class="col-12 row q-pa-md">
      <div class="col-6 row q-pa-sm icon_cer q-col-gutter-md">
        <q-icon class="iconcontat" name="mdi-account-tie" />
        <div class="txt text-weight-regular">
          ผู้ดูแล
          <br />
          <div class="txt1 text-weight-regular">นางสาวรัชภรณ์ ภักดี</div>
        </div>
      </div>

      <div class="col-6 row q-pa-sm icon_cer q-col-gutter-md">
        <q-icon class="iconcontat" name="mdi-briefcase" />
        <div class="txt text-weight-regular">
          หน่วยงาน
          <br />
          <div class="txt1 text-weight-regular">
            สำนักงานโครงสร้างอัตรากำลังกรุงเทพมหานคร
          </div>
        </div>
      </div>

      <div class="col-6 row q-pa-sm icon_cer q-col-gutter-md">
        <q-icon class="iconcontat" name="mdi-phone" />
        <div class="txt text-weight-regular">
          เบอร์โทร
          <br />
          <div class="txt1 text-weight-regular">092-112-3427</div>
        </div>
      </div>

      <div class="col-6 row q-pa-sm icon_cer q-col-gutter-md">
        <q-icon class="iconcontat" name="mdi-email" />
        <div class="txt text-weight-regular">
          อีเมล
          <br />
          <div class="txt1 text-weight-regular">Ratchaphon.Pa@gmail.com</div>
        </div>
      </div>
    </div>
  </q-card>

  <q-card class="row col-12 q-mt-md">
    <div
      class="col-12 q-px-md q-py-sm text-subtitle2 text-blue bg-blue-1 text-weight-medium"
    >
      ทะเบียนประวัติ , ทะเบียนประวัติลูกจ้าง , เครื่องราชอิสริยาภรณ์
    </div>
    <div class="col-12 row q-pa-md">
      <div class="col-6 row q-pa-sm icon_cer q-col-gutter-md">
        <q-icon class="iconcontat" name="mdi-account-tie" />
        <div class="txt text-weight-regular">
          ผู้ดูแล
          <br />
          <div class="txt1 text-weight-regular">นายณัฐพงศ์ ดิษยบุตร</div>
        </div>
      </div>

      <div class="col-6 row q-pa-sm icon_cer q-col-gutter-md">
        <q-icon class="iconcontat" name="mdi-briefcase" />
        <div class="txt text-weight-regular">
          หน่วยงาน
          <br />
          <div class="txt1 text-weight-regular">สำนักงานทะเบียนประวัติ</div>
        </div>
      </div>

      <div class="col-6 row q-pa-sm icon_cer q-col-gutter-md">
        <q-icon class="iconcontat" name="mdi-phone" />
        <div class="txt text-weight-regular">
          เบอร์โทร
          <br />
          <div class="txt1 text-weight-regular">081-233-0892</div>
        </div>
      </div>

      <div class="col-6 row q-pa-sm icon_cer q-col-gutter-md">
        <q-icon class="iconcontat" name="mdi-email" />
        <div class="txt text-weight-regular">
          อีเมล
          <br />
          <div class="txt1 text-weight-regular">Nuttapong@gmail.com</div>
        </div>
      </div>
    </div>
  </q-card> -->
</template>

<style>
.iconcontat {
  color: #74747468;
  font-size: 25px;
  margin-right: 1%;
}

.icon_cer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.txt {
  color: #747474df;
  font-size: 12px;
}

.txt1 {
  color: black;
  font-size: 14px;
}
</style>
