JSFiddle - React, Tailwind, and code Playground

by Fu-Ching Hsiao

HTML

<table border="1">
  <tr style="background-color:#DAA520">
    <td>10月14日</td>
    <td width="70px">上銘家</td>
    <td width="70px">上銘同事</td>
    <td width="70px">黃佩琳</td>
    <td width="70px">小康</td>
  </tr>
  <tr style="background-color:#98FB98">
    <td width="70px">10月21日</td>
    <td width="70px" colspan="5" align="center">自行用餐</td>
  </tr>
   <tr style="background-color:#DAA520">
    <td width="70px">10月28日</td>
    <td width="70px" colspan="5" align="center">福音聚會</td>
  </tr>
  <tr style="background-color:#98FB98">
    <td width="70px">11月04日</td>
    <td width="70px">輔慶家</td>
    <td width="70px">子玲</td>
    <td width="70px">啟光家</td>
  </tr>
  <tr style="background-color:#DAA520">
    <td width="70px">11月11日</td>
    <td width="70px">晟庭家</td>
    <td width="70px">人豪家</td>
    <td width="70px">旭辰</td>
    <td width="70px">霈妮</td>
  </tr>
  <tr style="background-color:#98FB98">
    <td width="70px">11月18日</td>
    <td width="70px">復國家</td>
    <td width="70px">王佐家</td>
    <td width="70px">庭妤</td>
  </tr>
  <tr style="background-color:#DAA520">
    <td width="70px">11月25日</td>
    <td width="70px" colspan="5" align="center">微相調</td>
  </tr>
  <tr style="background-color:#98FB98">
    <td width="70px">12月02日</td>
    <td width="70px">彥勳家</td>
    <td width="70px">昇叡</td>
    <td width="70px">維貞</td>
    <td width="70px">艾青</td>
    <td width="70px">怡瑋</td>
  </tr>
  <tr style="background-color:#DAA520">
    <td width="70px">12月09日</td>
  </tr>
  <tr style="background-color:#98FB98">
    <td width="70px">12月16日</td>
  </tr>
  <tr style="background-color:#DAA520">
    <td width="70px">12月23日</td>
  </tr>
  <tr style="background-color:#98FB98">
    <td width="70px">12月30日</td>
  </tr>
</table>