farmitry_hvac/app/views/schedules/index.html.erb

<div class="flex-1 grid grid-cols-2 lg:grid-cols-4 gap-4 p-4">
  <!-- 실내온도 -->
  <div class="dashboard-group">
    <div class="flex flex-col justify-between h-full">
      <div class="text-xl">실내온도</div>
      <div class="flex flex-row justify-between items-baseline w-full">
        <i class="fa-solid fa-temperature-quarter text-base-text/80 text-4xl text-left w-full"></i>
        <div class="items-baseline text-right w-full">
          <span class="text-4xl font-['GongGothicMedium'] font-light">15.5</span>
          <span class="text-2xl">°C</span>
        </div>
      </div>
    </div>
  </div>

  <!-- 실내습도 -->
  <div class="dashboard-group">
    <div class="flex flex-col justify-between h-full">
      <div class="text-xl">실내습도</div>
      <div class="flex flex-row justify-between items-baseline w-full">
        <i class="fa-solid fa-droplet text-base-text/80 text-4xl text-left w-full"></i>
        <div class="items-baseline text-right w-full"><span class="text-4xl font-['GongGothicMedium']">60</span> <span class="text-2xl">%</span>
        </div>
      </div>
    </div>
  </div>

  <!-- CO2 -->
  <div class="dashboard-group">
    <div class="flex flex-col justify-between h-full">
      <div><span class="text-xl">CO</span><span class="text-sm">2</span></div>
      <div class="flex flex-row justify-between items-baseline w-full">
        <div class="size-10 bg-base-text/80 rounded-full text-base-background flex flex-col justify-center">
          <div class="flex flex-row justify-center items-baseline">
            <span class="text-xl">CO</span><span class="text-sm">2</span>
          </div>
        </div>
        <div class="items-baseline text-right"><span class="text-4xl font-['GongGothicMedium']">60</span> <span class="text-2xl">%</span></div>
      </div>
    </div>
  </div>

  <!-- none -->
  <div class="dashboard-group">1</div>

  <!-- Fan -->
  <div class="dashboard-group">
    <div class="flex flex-col justify-between h-full">
      <div class="text-xl">FAN</div>
      <div class="flex flex-row justify-between items-baseline w-full">
        <i class="fa-solid fa-fan text-base-text/80 text-4xl text-left w-full"></i>
        <div class="items-baseline text-right w-full"><span class="text-4xl font-['GongGothicMedium']">60</span> <span class="text-2xl">%</span>
        </div>
      </div>
    </div>
  </div>

  <!-- 공조기 -->
  <div class="dashboard-group">
    <div class="flex flex-col justify-between h-full">
      <div class="text-xl">공조기</div>
      <div class="flex flex-row justify-between items-baseline w-full">
        <i class="fa-solid fa-temperature-quarter text-base-text/80 text-4xl text-left w-full"></i>
        <div class="items-baseline text-right w-full"><span class="text-4xl font-['GongGothicMedium']">15.5</span>
          <span class="text-2xl">°C</span></div>
      </div>
    </div>
  </div>

  <!-- LED -->
  <div class="dashboard-group">
    <div class="flex flex-col justify-between h-full">
      <div class="text-xl">LED</div>
      <div class="flex flex-row justify-between items-baseline w-full">
        <i class="fa-solid fa-lightbulb text-base-text/80 text-4xl text-left w-full"></i>
        <div class="items-baseline text-right w-full"><span class="text-4xl font-['GongGothicMedium']">60</span> <span class="text-2xl">%</span>
        </div>
      </div>
    </div>
  </div>

  <!-- none -->
  <div class="dashboard-group">1</div>

  <!-- pH -->
  <div class="dashboard-group">
    <div class="flex justify-between items-baseline">
      <div class="text-4xl font-['GongGothicMedium']">pH</div>
      <div class="text-3xl">7.1</div>
    </div>
    <div class="flex justify-between items-baseline">
      <div class="text-2xl">
        6.0 ~ 6.0
      </div>
      <div><i class="fa-solid fa-gear text-base-text/30 text-2xl"></i></div>
    </div>
  </div>

  <!-- EC -->
  <div class="dashboard-group">
    <div class="flex justify-between items-baseline">
      <div class="text-4xl font-['GongGothicMedium']">EC</div>
      <div class="text-3xl">0.1</div>
    </div>
    <div class="flex justify-between items-baseline">
      <div class="text-2xl">
        0 ~ 1
      </div>
      <div><i class="fa-solid fa-gear text-base-text/30 text-2xl"></i></div>
    </div>
  </div>

  <!-- 양액온도 -->
  <div class="dashboard-group">
    <div class="flex flex-col justify-between h-full">
      <div class="text-xl">양액온도</div>
      <div class="flex flex-row justify-between items-baseline w-full">
        <!--        <i class="fa-solid fa-temperature-quarter text-base-text/80 text-4xl text-left w-full"></i>-->
        <div class="items-baseline text-right w-full"><span class="text-4xl font-['GongGothicMedium']">20.96</span>
          <span class="text-2xl">°C</span></div>
      </div>
    </div>
  </div>

  <!-- none -->
  <div class="dashboard-group">1</div>

  <!-- none -->
  <div class="dashboard-group">
    <div class="flex flex-col justify-center space-y-4 h-full">
      <i class="fa-solid fa-recycle text-base-text/80 text-5xl text-center w-full"></i>
      <div class="text-xl text-center">자동화</div>
    </div>
  </div>

  <!-- none -->
  <div class="dashboard-group">
    <div class="flex flex-col justify-center space-y-4 h-full">
      <i class="fa-solid fa-rotate-right text-base-text/80 text-5xl text-center w-full"></i>
      <div class="text-xl text-center">초기화</div>
    </div>
  </div>

  <!-- none -->
  <div class="dashboard-group">
    <div class="flex flex-col justify-center space-y-4 h-full">
      <i class="fa-solid fa-circle-pause text-base-text/80 text-5xl text-center w-full"></i>
      <div class="text-xl text-center">긴급 정지</div>
    </div>
  </div>

  <!-- none -->
  <div class="dashboard-group">
    <div class="flex flex-col justify-center space-y-4 h-full">
      <i class="fa-solid fa-faucet-drip text-base-text/80 text-5xl text-center w-full"></i>
      <div class="text-xl text-center">1회 급수 설정</div>
    </div>
  </div>
</div>