MT-work-fronted/src/app/modules/human-resource/components/vacation-days/vacation-days.component.html

<div class="vacation-days">
  <p fxLayout="row" fxLayoutAlign="space-between center">
    Spent <span class="spent">5</span>
  </p>
  <p fxLayout="row" fxLayoutAlign="space-between center">
    Remaining <span class="remaining">16</span>
  </p>

  <h3>History for spent days</h3>

  <ul>
    <li fxLayout="row" fxLayoutAlign="space-between center">
      <span>15/1/2022</span>
      <span>Saturday</span>
    </li>
    <li fxLayout="row" fxLayoutAlign="space-between center">
      <span>15/1/2022</span>
      <span>Saturday</span>
    </li>
    <li fxLayout="row" fxLayoutAlign="space-between center">
      <span>15/1/2022</span>
      <span>Saturday</span>
    </li>
    <li fxLayout="row" fxLayoutAlign="space-between center">
      <span>15/1/2022</span>
      <span>Saturday</span>
    </li>
    <li fxLayout="row" fxLayoutAlign="space-between center">
      <span>15/1/2022</span>
      <span>Saturday</span>
    </li>
  </ul>
</div>