Forráskód Böngészése

Exercise Rx table UI compact

Vijayakrishnan 3 éve
szülő
commit
06fee76e78

+ 107 - 113
resources/views/app/patient/segment-templates/_child_plan/exercise/AEROBIC_ACTIVITY/edit-plan.php

@@ -5,60 +5,24 @@
     <span class="ml-2">Prescribe aerobic activities?</span>
 </label>
 
-<table if-active class="table table-sm table-bordered" style="table-layout: fixed">
+<table if-active class="table table-sm table-bordered">
     <tbody>
-    <tr>
-        <td class="align-middle">Activity</td>
-        <td class="text-left">
-            <div class="d-flex align-items-center">
-                <input type="checkbox" class="d-none" data-name="walk->active" <?= @($currentValue->walk->active) ? 'checked' : '' ?>>
-                <img src="/img/exercise-rx/walk.png" class="icon-nutrition-rx-row mx-1 <?= @($currentValue->walk->active) ? '' : 'opacity-35' ?>">
-                <button data-type="walk" class="btn-toggle-activity flex-grow-1 shadow-none btn btn-sm <?= @($currentValue->walk->active) ? 'btn-info' : 'btn-default border' ?>">
-                    Walk
-                </button>
-            </div>
-        </td>
-        <td class="text-left">
-            <div class="d-flex align-items-center">
-                <input type="checkbox" class="d-none" data-name="jog->active" <?= @($currentValue->jog->active) ? 'checked' : '' ?>>
-                <img src="/img/exercise-rx/jog.png" class="icon-nutrition-rx-row mx-1 <?= @($currentValue->jog->active) ? '' : 'opacity-35' ?>">
-                <button data-type="jog" class="btn-toggle-activity flex-grow-1 shadow-none btn btn-sm <?= @($currentValue->jog->active) ? 'btn-info' : 'btn-default border' ?>">
-                    Jog
-                </button>
-            </div>
-        </td>
-        <td class="text-left">
-            <div class="d-flex align-items-center">
-                <input type="checkbox" class="d-none" data-name="elliptical->active" <?= @($currentValue->elliptical->active) ? 'checked' : '' ?>>
-                <img src="/img/exercise-rx/elliptical.png" class="icon-nutrition-rx-row mx-1 <?= @($currentValue->elliptical->active) ? '' : 'opacity-35' ?>">
-                <button data-type="elliptical" class="btn-toggle-activity flex-grow-1 shadow-none btn btn-sm <?= @($currentValue->elliptical->active) ? 'btn-info' : 'btn-default border' ?>">
-                    Elliptical
-                </button>
-            </div>
-        </td>
-        <td class="text-left">
-            <div class="d-flex align-items-center">
-                <input type="checkbox" class="d-none" data-name="swim->active" <?= @($currentValue->swim->active) ? 'checked' : '' ?>>
-                <img src="/img/exercise-rx/swim.png" class="icon-nutrition-rx-row mx-1 <?= @($currentValue->swim->active) ? '' : 'opacity-35' ?>">
-                <button data-type="swim" class="btn-toggle-activity flex-grow-1 shadow-none btn btn-sm <?= @($currentValue->swim->active) ? 'btn-info' : 'btn-default border' ?>">
-                    Swim
-                </button>
-            </div>
-        </td>
-        <td class="text-left">
-            <div class="d-flex align-items-center">
-                <input type="checkbox" class="d-none" data-name="bike->active" <?= @($currentValue->bike->active) ? 'checked' : '' ?>>
-                <img src="/img/exercise-rx/bike.png" class="icon-nutrition-rx-row mx-1 <?= @($currentValue->bike->active) ? '' : 'opacity-35' ?>">
-                <button data-type="bike" class="btn-toggle-activity flex-grow-1 shadow-none btn btn-sm <?= @($currentValue->bike->active) ? 'btn-info' : 'btn-default border' ?>">
-                    Bike
-                </button>
-            </div>
-        </td>
+    <tr class="bg-light">
+        <td class="align-bottom">Activity</td>
+        <td class="align-bottom">Frequency<br>(days/wk)</td>
+        <td class="align-bottom">Intensity</td>
+        <td class="align-bottom">Time<br>(mins/day)</td>
     </tr>
     <tr>
-        <td>Frequency (days/wk)</td>
-        <td>
-            <select if-walk-active class="form-control form-control-sm min-width-unset px-0" data-name="walk->frequency">
+        <td class="text-left align-middle">
+            <label class="d-flex align-items-center m-0">
+                <input type="checkbox" data-name="walk->active" <?= @($currentValue->walk->active) ? 'checked' : '' ?>>
+                <span class="ml-2">Walk</span>
+                <img src="/img/exercise-rx/walk.png" class="icon-nutrition-rx-row-sm ml-2">
+            </label>
+        </td>
+        <td class="p-0">
+            <select if-walk-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="walk->frequency">
                 <option value="">-- select --</option>
                 <option value="1" <?= @($currentValue->walk->frequency) == 1 ? 'selected' : ''?>>1 day</option>
                 <option value="2" <?= @($currentValue->walk->frequency) == 2 ? 'selected' : ''?>>2 days</option>
@@ -69,8 +33,28 @@
                 <option value="7" <?= @($currentValue->walk->frequency) == 7 ? 'selected' : ''?>>7 days</option>
             </select>
         </td>
-        <td>
-            <select if-jog-active class="form-control form-control-sm min-width-unset px-0" data-name="jog->frequency">
+        <td class="p-0">
+            <select if-walk-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="walk->intensity">
+                <option value="">-- select --</option>
+                <option value="Light" <?= @($currentValue->walk->intensity) == 'Light' ? 'selected' : ''?>>Light</option>
+                <option value="Moderate" <?= @($currentValue->walk->intensity) == 'Moderate' ? 'selected' : ''?>>Moderate</option>
+                <option value="Vigorous" <?= @($currentValue->walk->intensity) == 'Vigorous' ? 'selected' : ''?>>Vigorous</option>
+            </select>
+        </td>
+        <td class="p-0">
+            <input if-walk-active class="form-control form-control-sm min-width-unset px-1 border-0" type="text" data-name="walk->time" value="<?= @($currentValue->walk->time) ?>">
+        </td>
+    </tr>
+    <tr>
+        <td class="text-left align-middle">
+            <label class="d-flex align-items-center m-0">
+                <input type="checkbox" data-name="jog->active" <?= @($currentValue->jog->active) ? 'checked' : '' ?>>
+                <span class="ml-2">Jog</span>
+                <img src="/img/exercise-rx/jog.png" class="icon-nutrition-rx-row-sm ml-2">
+            </label>
+        </td>
+        <td class="p-0">
+            <select if-jog-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="jog->frequency">
                 <option value="">-- select --</option>
                 <option value="1" <?= @($currentValue->jog->frequency) == 1 ? 'selected' : ''?>>1 day</option>
                 <option value="2" <?= @($currentValue->jog->frequency) == 2 ? 'selected' : ''?>>2 days</option>
@@ -81,8 +65,28 @@
                 <option value="7" <?= @($currentValue->jog->frequency) == 7 ? 'selected' : ''?>>7 days</option>
             </select>
         </td>
-        <td>
-            <select if-elliptical-active class="form-control form-control-sm min-width-unset px-0" data-name="elliptical->frequency">
+        <td class="p-0">
+            <select if-jog-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="jog->intensity">
+                <option value="">-- select --</option>
+                <option value="Light" <?= @($currentValue->jog->intensity) == 'Light' ? 'selected' : ''?>>Light</option>
+                <option value="Moderate" <?= @($currentValue->jog->intensity) == 'Moderate' ? 'selected' : ''?>>Moderate</option>
+                <option value="Vigorous" <?= @($currentValue->jog->intensity) == 'Vigorous' ? 'selected' : ''?>>Vigorous</option>
+            </select>
+        </td>
+        <td class="p-0">
+            <input if-jog-active class="form-control form-control-sm min-width-unset px-1 border-0" type="text" data-name="jog->time" value="<?= @($currentValue->jog->time) ?>">
+        </td>
+    </tr>
+    <tr>
+        <td class="text-left align-middle">
+            <label class="d-flex align-items-center m-0">
+                <input type="checkbox" data-name="elliptical->active" <?= @($currentValue->elliptical->active) ? 'checked' : '' ?>>
+                <span class="ml-2">Elliptical</span>
+                <img src="/img/exercise-rx/elliptical.png" class="icon-nutrition-rx-row-sm ml-2">
+            </label>
+        </td>
+        <td class="p-0">
+            <select if-elliptical-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="elliptical->frequency">
                 <option value="">-- select --</option>
                 <option value="1" <?= @($currentValue->elliptical->frequency) == 1 ? 'selected' : ''?>>1 day</option>
                 <option value="2" <?= @($currentValue->elliptical->frequency) == 2 ? 'selected' : ''?>>2 days</option>
@@ -93,8 +97,28 @@
                 <option value="7" <?= @($currentValue->elliptical->frequency) == 7 ? 'selected' : ''?>>7 days</option>
             </select>
         </td>
-        <td>
-            <select if-swim-active class="form-control form-control-sm min-width-unset px-0" data-name="swim->frequency">
+        <td class="p-0">
+            <select if-elliptical-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="elliptical->intensity">
+                <option value="">-- select --</option>
+                <option value="Light" <?= @($currentValue->elliptical->intensity) == 'Light' ? 'selected' : ''?>>Light</option>
+                <option value="Moderate" <?= @($currentValue->elliptical->intensity) == 'Moderate' ? 'selected' : ''?>>Moderate</option>
+                <option value="Vigorous" <?= @($currentValue->elliptical->intensity) == 'Vigorous' ? 'selected' : ''?>>Vigorous</option>
+            </select>
+        </td>
+        <td class="p-0">
+            <input if-elliptical-active class="form-control form-control-sm min-width-unset px-1 border-0" type="text" data-name="elliptical->time" value="<?= @($currentValue->elliptical->time) ?>">
+        </td>
+    </tr>
+    <tr>
+        <td class="text-left align-middle">
+            <label class="d-flex align-items-center m-0">
+                <input type="checkbox" data-name="swim->active" <?= @($currentValue->swim->active) ? 'checked' : '' ?>>
+                <span class="ml-2">Swim</span>
+                <img src="/img/exercise-rx/swim.png" class="icon-nutrition-rx-row-sm ml-2">
+            </label>
+        </td>
+        <td class="p-0">
+            <select if-swim-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="swim->frequency">
                 <option value="">-- select --</option>
                 <option value="1" <?= @($currentValue->swim->frequency) == 1 ? 'selected' : ''?>>1 day</option>
                 <option value="2" <?= @($currentValue->swim->frequency) == 2 ? 'selected' : ''?>>2 days</option>
@@ -105,8 +129,28 @@
                 <option value="7" <?= @($currentValue->swim->frequency) == 7 ? 'selected' : ''?>>7 days</option>
             </select>
         </td>
-        <td>
-            <select if-bike-active class="form-control form-control-sm min-width-unset px-0" data-name="bike->frequency">
+        <td class="p-0">
+            <select if-swim-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="swim->intensity">
+                <option value="">-- select --</option>
+                <option value="Light" <?= @($currentValue->swim->intensity) == 'Light' ? 'selected' : ''?>>Light</option>
+                <option value="Moderate" <?= @($currentValue->swim->intensity) == 'Moderate' ? 'selected' : ''?>>Moderate</option>
+                <option value="Vigorous" <?= @($currentValue->swim->intensity) == 'Vigorous' ? 'selected' : ''?>>Vigorous</option>
+            </select>
+        </td>
+        <td class="p-0">
+            <input if-swim-active class="form-control form-control-sm min-width-unset px-1 border-0" type="text" data-name="swim->time" value="<?= @($currentValue->swim->time) ?>">
+        </td>
+    </tr>
+    <tr>
+        <td class="text-left align-middle">
+            <label class="d-flex align-items-center m-0">
+                <input type="checkbox" data-name="bike->active" <?= @($currentValue->bike->active) ? 'checked' : '' ?>>
+                <span class="ml-2">Bike</span>
+                <img src="/img/exercise-rx/bike.png" class="icon-nutrition-rx-row-sm ml-2">
+            </label>
+        </td>
+        <td class="p-0">
+            <select if-bike-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="bike->frequency">
                 <option value="">-- select --</option>
                 <option value="1" <?= @($currentValue->bike->frequency) == 1 ? 'selected' : ''?>>1 day</option>
                 <option value="2" <?= @($currentValue->bike->frequency) == 2 ? 'selected' : ''?>>2 days</option>
@@ -117,66 +161,16 @@
                 <option value="7" <?= @($currentValue->bike->frequency) == 7 ? 'selected' : ''?>>7 days</option>
             </select>
         </td>
-    </tr>
-    <tr>
-        <td>Intensity</td>
-        <td>
-            <select if-walk-active class="form-control form-control-sm min-width-unset px-0" data-name="walk->intensity">
-                <option value="">-- select --</option>
-                <option value="Light" <?= @($currentValue->walk->intensity) == 'Light' ? 'selected' : ''?>>Light</option>
-                <option value="Moderate" <?= @($currentValue->walk->intensity) == 'Moderate' ? 'selected' : ''?>>Moderate</option>
-                <option value="Vigorous" <?= @($currentValue->walk->intensity) == 'Vigorous' ? 'selected' : ''?>>Vigorous</option>
-            </select>
-        </td>
-        <td>
-            <select if-jog-active class="form-control form-control-sm min-width-unset px-0" data-name="jog->intensity">
-                <option value="">-- select --</option>
-                <option value="Light" <?= @($currentValue->jog->intensity) == 'Light' ? 'selected' : ''?>>Light</option>
-                <option value="Moderate" <?= @($currentValue->jog->intensity) == 'Moderate' ? 'selected' : ''?>>Moderate</option>
-                <option value="Vigorous" <?= @($currentValue->jog->intensity) == 'Vigorous' ? 'selected' : ''?>>Vigorous</option>
-            </select>
-        </td>
-        <td>
-            <select if-elliptical-active class="form-control form-control-sm min-width-unset px-0" data-name="elliptical->intensity">
-                <option value="">-- select --</option>
-                <option value="Light" <?= @($currentValue->elliptical->intensity) == 'Light' ? 'selected' : ''?>>Light</option>
-                <option value="Moderate" <?= @($currentValue->elliptical->intensity) == 'Moderate' ? 'selected' : ''?>>Moderate</option>
-                <option value="Vigorous" <?= @($currentValue->elliptical->intensity) == 'Vigorous' ? 'selected' : ''?>>Vigorous</option>
-            </select>
-        </td>
-        <td>
-            <select if-swim-active class="form-control form-control-sm min-width-unset px-0" data-name="swim->intensity">
-                <option value="">-- select --</option>
-                <option value="Light" <?= @($currentValue->swim->intensity) == 'Light' ? 'selected' : ''?>>Light</option>
-                <option value="Moderate" <?= @($currentValue->swim->intensity) == 'Moderate' ? 'selected' : ''?>>Moderate</option>
-                <option value="Vigorous" <?= @($currentValue->swim->intensity) == 'Vigorous' ? 'selected' : ''?>>Vigorous</option>
-            </select>
-        </td>
-        <td>
-            <select if-bike-active class="form-control form-control-sm min-width-unset px-0" data-name="bike->intensity">
+        <td class="p-0">
+            <select if-bike-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="bike->intensity">
                 <option value="">-- select --</option>
                 <option value="Light" <?= @($currentValue->bike->intensity) == 'Light' ? 'selected' : ''?>>Light</option>
                 <option value="Moderate" <?= @($currentValue->bike->intensity) == 'Moderate' ? 'selected' : ''?>>Moderate</option>
                 <option value="Vigorous" <?= @($currentValue->bike->intensity) == 'Vigorous' ? 'selected' : ''?>>Vigorous</option>
             </select>
         </td>
-    </tr>
-    <tr>
-        <td>Time (mins/day)</td>
-        <td>
-            <input if-walk-active class="form-control form-control-sm min-width-unset px-1" type="text" data-name="walk->time" value="<?= @($currentValue->walk->time) ?>">
-        </td>
-        <td>
-            <input if-jog-active class="form-control form-control-sm min-width-unset px-1" type="text" data-name="jog->time" value="<?= @($currentValue->jog->time) ?>">
-        </td>
-        <td>
-            <input if-elliptical-active class="form-control form-control-sm min-width-unset px-1" type="text" data-name="elliptical->time" value="<?= @($currentValue->elliptical->time) ?>">
-        </td>
-        <td>
-            <input if-swim-active class="form-control form-control-sm min-width-unset px-1" type="text" data-name="swim->time" value="<?= @($currentValue->swim->time) ?>">
-        </td>
-        <td>
-            <input if-bike-active class="form-control form-control-sm min-width-unset px-1" type="text" data-name="bike->time" value="<?= @($currentValue->bike->time) ?>">
+        <td class="p-0">
+            <input if-bike-active class="form-control form-control-sm min-width-unset px-1 border-0" type="text" data-name="bike->time" value="<?= @($currentValue->bike->time) ?>">
         </td>
     </tr>
     </tbody>

+ 107 - 113
resources/views/app/patient/segment-templates/_child_review/exercise/AEROBIC_ACTIVITY/edit-review.php

@@ -5,60 +5,24 @@
     <span class="ml-2">Any current aerobic activities?</span>
 </label>
 
-<table if-active class="table table-sm table-bordered" style="table-layout: fixed">
+<table if-active class="table table-sm table-bordered">
     <tbody>
-    <tr>
-        <td class="align-middle">Activity</td>
-        <td class="text-left">
-            <div class="d-flex align-items-center">
-                <input type="checkbox" class="d-none" data-name="walk->active" <?= @($currentValue->walk->active) ? 'checked' : '' ?>>
-                <img src="/img/exercise-rx/walk.png" class="icon-nutrition-rx-row mx-1 <?= @($currentValue->walk->active) ? '' : 'opacity-35' ?>">
-                <button data-type="walk" class="btn-toggle-activity flex-grow-1 shadow-none btn btn-sm <?= @($currentValue->walk->active) ? 'btn-info' : 'btn-default border' ?>">
-                    Walk
-                </button>
-            </div>
-        </td>
-        <td class="text-left">
-            <div class="d-flex align-items-center">
-                <input type="checkbox" class="d-none" data-name="jog->active" <?= @($currentValue->jog->active) ? 'checked' : '' ?>>
-                <img src="/img/exercise-rx/jog.png" class="icon-nutrition-rx-row mx-1 <?= @($currentValue->jog->active) ? '' : 'opacity-35' ?>">
-                <button data-type="jog" class="btn-toggle-activity flex-grow-1 shadow-none btn btn-sm <?= @($currentValue->jog->active) ? 'btn-info' : 'btn-default border' ?>">
-                    Jog
-                </button>
-            </div>
-        </td>
-        <td class="text-left">
-            <div class="d-flex align-items-center">
-                <input type="checkbox" class="d-none" data-name="elliptical->active" <?= @($currentValue->elliptical->active) ? 'checked' : '' ?>>
-                <img src="/img/exercise-rx/elliptical.png" class="icon-nutrition-rx-row mx-1 <?= @($currentValue->elliptical->active) ? '' : 'opacity-35' ?>">
-                <button data-type="elliptical" class="btn-toggle-activity flex-grow-1 shadow-none btn btn-sm <?= @($currentValue->elliptical->active) ? 'btn-info' : 'btn-default border' ?>">
-                    Elliptical
-                </button>
-            </div>
-        </td>
-        <td class="text-left">
-            <div class="d-flex align-items-center">
-                <input type="checkbox" class="d-none" data-name="swim->active" <?= @($currentValue->swim->active) ? 'checked' : '' ?>>
-                <img src="/img/exercise-rx/swim.png" class="icon-nutrition-rx-row mx-1 <?= @($currentValue->swim->active) ? '' : 'opacity-35' ?>">
-                <button data-type="swim" class="btn-toggle-activity flex-grow-1 shadow-none btn btn-sm <?= @($currentValue->swim->active) ? 'btn-info' : 'btn-default border' ?>">
-                    Swim
-                </button>
-            </div>
-        </td>
-        <td class="text-left">
-            <div class="d-flex align-items-center">
-                <input type="checkbox" class="d-none" data-name="bike->active" <?= @($currentValue->bike->active) ? 'checked' : '' ?>>
-                <img src="/img/exercise-rx/bike.png" class="icon-nutrition-rx-row mx-1 <?= @($currentValue->bike->active) ? '' : 'opacity-35' ?>">
-                <button data-type="bike" class="btn-toggle-activity flex-grow-1 shadow-none btn btn-sm <?= @($currentValue->bike->active) ? 'btn-info' : 'btn-default border' ?>">
-                    Bike
-                </button>
-            </div>
-        </td>
+    <tr class="bg-light">
+        <td class="align-bottom">Activity</td>
+        <td class="align-bottom">Frequency<br>(days/wk)</td>
+        <td class="align-bottom">Intensity</td>
+        <td class="align-bottom">Time<br>(mins/day)</td>
     </tr>
     <tr>
-        <td>Frequency (days/wk)</td>
-        <td>
-            <select if-walk-active class="form-control form-control-sm min-width-unset px-0" data-name="walk->frequency">
+        <td class="text-left align-middle">
+            <label class="d-flex align-items-center m-0">
+                <input type="checkbox" data-name="walk->active" <?= @($currentValue->walk->active) ? 'checked' : '' ?>>
+                <span class="ml-2">Walk</span>
+                <img src="/img/exercise-rx/walk.png" class="icon-nutrition-rx-row-sm ml-2">
+            </label>
+        </td>
+        <td class="p-0">
+            <select if-walk-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="walk->frequency">
                 <option value="">-- select --</option>
                 <option value="1" <?= @($currentValue->walk->frequency) == 1 ? 'selected' : ''?>>1 day</option>
                 <option value="2" <?= @($currentValue->walk->frequency) == 2 ? 'selected' : ''?>>2 days</option>
@@ -69,8 +33,28 @@
                 <option value="7" <?= @($currentValue->walk->frequency) == 7 ? 'selected' : ''?>>7 days</option>
             </select>
         </td>
-        <td>
-            <select if-jog-active class="form-control form-control-sm min-width-unset px-0" data-name="jog->frequency">
+        <td class="p-0">
+            <select if-walk-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="walk->intensity">
+                <option value="">-- select --</option>
+                <option value="Light" <?= @($currentValue->walk->intensity) == 'Light' ? 'selected' : ''?>>Light</option>
+                <option value="Moderate" <?= @($currentValue->walk->intensity) == 'Moderate' ? 'selected' : ''?>>Moderate</option>
+                <option value="Vigorous" <?= @($currentValue->walk->intensity) == 'Vigorous' ? 'selected' : ''?>>Vigorous</option>
+            </select>
+        </td>
+        <td class="p-0">
+            <input if-walk-active class="form-control form-control-sm min-width-unset px-1 border-0" type="text" data-name="walk->time" value="<?= @($currentValue->walk->time) ?>">
+        </td>
+    </tr>
+    <tr>
+        <td class="text-left align-middle">
+            <label class="d-flex align-items-center m-0">
+                <input type="checkbox" data-name="jog->active" <?= @($currentValue->jog->active) ? 'checked' : '' ?>>
+                <span class="ml-2">Jog</span>
+                <img src="/img/exercise-rx/jog.png" class="icon-nutrition-rx-row-sm ml-2">
+            </label>
+        </td>
+        <td class="p-0">
+            <select if-jog-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="jog->frequency">
                 <option value="">-- select --</option>
                 <option value="1" <?= @($currentValue->jog->frequency) == 1 ? 'selected' : ''?>>1 day</option>
                 <option value="2" <?= @($currentValue->jog->frequency) == 2 ? 'selected' : ''?>>2 days</option>
@@ -81,8 +65,28 @@
                 <option value="7" <?= @($currentValue->jog->frequency) == 7 ? 'selected' : ''?>>7 days</option>
             </select>
         </td>
-        <td>
-            <select if-elliptical-active class="form-control form-control-sm min-width-unset px-0" data-name="elliptical->frequency">
+        <td class="p-0">
+            <select if-jog-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="jog->intensity">
+                <option value="">-- select --</option>
+                <option value="Light" <?= @($currentValue->jog->intensity) == 'Light' ? 'selected' : ''?>>Light</option>
+                <option value="Moderate" <?= @($currentValue->jog->intensity) == 'Moderate' ? 'selected' : ''?>>Moderate</option>
+                <option value="Vigorous" <?= @($currentValue->jog->intensity) == 'Vigorous' ? 'selected' : ''?>>Vigorous</option>
+            </select>
+        </td>
+        <td class="p-0">
+            <input if-jog-active class="form-control form-control-sm min-width-unset px-1 border-0" type="text" data-name="jog->time" value="<?= @($currentValue->jog->time) ?>">
+        </td>
+    </tr>
+    <tr>
+        <td class="text-left align-middle">
+            <label class="d-flex align-items-center m-0">
+                <input type="checkbox" data-name="elliptical->active" <?= @($currentValue->elliptical->active) ? 'checked' : '' ?>>
+                <span class="ml-2">Elliptical</span>
+                <img src="/img/exercise-rx/elliptical.png" class="icon-nutrition-rx-row-sm ml-2">
+            </label>
+        </td>
+        <td class="p-0">
+            <select if-elliptical-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="elliptical->frequency">
                 <option value="">-- select --</option>
                 <option value="1" <?= @($currentValue->elliptical->frequency) == 1 ? 'selected' : ''?>>1 day</option>
                 <option value="2" <?= @($currentValue->elliptical->frequency) == 2 ? 'selected' : ''?>>2 days</option>
@@ -93,8 +97,28 @@
                 <option value="7" <?= @($currentValue->elliptical->frequency) == 7 ? 'selected' : ''?>>7 days</option>
             </select>
         </td>
-        <td>
-            <select if-swim-active class="form-control form-control-sm min-width-unset px-0" data-name="swim->frequency">
+        <td class="p-0">
+            <select if-elliptical-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="elliptical->intensity">
+                <option value="">-- select --</option>
+                <option value="Light" <?= @($currentValue->elliptical->intensity) == 'Light' ? 'selected' : ''?>>Light</option>
+                <option value="Moderate" <?= @($currentValue->elliptical->intensity) == 'Moderate' ? 'selected' : ''?>>Moderate</option>
+                <option value="Vigorous" <?= @($currentValue->elliptical->intensity) == 'Vigorous' ? 'selected' : ''?>>Vigorous</option>
+            </select>
+        </td>
+        <td class="p-0">
+            <input if-elliptical-active class="form-control form-control-sm min-width-unset px-1 border-0" type="text" data-name="elliptical->time" value="<?= @($currentValue->elliptical->time) ?>">
+        </td>
+    </tr>
+    <tr>
+        <td class="text-left align-middle">
+            <label class="d-flex align-items-center m-0">
+                <input type="checkbox" data-name="swim->active" <?= @($currentValue->swim->active) ? 'checked' : '' ?>>
+                <span class="ml-2">Swim</span>
+                <img src="/img/exercise-rx/swim.png" class="icon-nutrition-rx-row-sm ml-2">
+            </label>
+        </td>
+        <td class="p-0">
+            <select if-swim-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="swim->frequency">
                 <option value="">-- select --</option>
                 <option value="1" <?= @($currentValue->swim->frequency) == 1 ? 'selected' : ''?>>1 day</option>
                 <option value="2" <?= @($currentValue->swim->frequency) == 2 ? 'selected' : ''?>>2 days</option>
@@ -105,8 +129,28 @@
                 <option value="7" <?= @($currentValue->swim->frequency) == 7 ? 'selected' : ''?>>7 days</option>
             </select>
         </td>
-        <td>
-            <select if-bike-active class="form-control form-control-sm min-width-unset px-0" data-name="bike->frequency">
+        <td class="p-0">
+            <select if-swim-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="swim->intensity">
+                <option value="">-- select --</option>
+                <option value="Light" <?= @($currentValue->swim->intensity) == 'Light' ? 'selected' : ''?>>Light</option>
+                <option value="Moderate" <?= @($currentValue->swim->intensity) == 'Moderate' ? 'selected' : ''?>>Moderate</option>
+                <option value="Vigorous" <?= @($currentValue->swim->intensity) == 'Vigorous' ? 'selected' : ''?>>Vigorous</option>
+            </select>
+        </td>
+        <td class="p-0">
+            <input if-swim-active class="form-control form-control-sm min-width-unset px-1 border-0" type="text" data-name="swim->time" value="<?= @($currentValue->swim->time) ?>">
+        </td>
+    </tr>
+    <tr>
+        <td class="text-left align-middle">
+            <label class="d-flex align-items-center m-0">
+                <input type="checkbox" data-name="bike->active" <?= @($currentValue->bike->active) ? 'checked' : '' ?>>
+                <span class="ml-2">Bike</span>
+                <img src="/img/exercise-rx/bike.png" class="icon-nutrition-rx-row-sm ml-2">
+            </label>
+        </td>
+        <td class="p-0">
+            <select if-bike-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="bike->frequency">
                 <option value="">-- select --</option>
                 <option value="1" <?= @($currentValue->bike->frequency) == 1 ? 'selected' : ''?>>1 day</option>
                 <option value="2" <?= @($currentValue->bike->frequency) == 2 ? 'selected' : ''?>>2 days</option>
@@ -117,66 +161,16 @@
                 <option value="7" <?= @($currentValue->bike->frequency) == 7 ? 'selected' : ''?>>7 days</option>
             </select>
         </td>
-    </tr>
-    <tr>
-        <td>Intensity</td>
-        <td>
-            <select if-walk-active class="form-control form-control-sm min-width-unset px-0" data-name="walk->intensity">
-                <option value="">-- select --</option>
-                <option value="Light" <?= @($currentValue->walk->intensity) == 'Light' ? 'selected' : ''?>>Light</option>
-                <option value="Moderate" <?= @($currentValue->walk->intensity) == 'Moderate' ? 'selected' : ''?>>Moderate</option>
-                <option value="Vigorous" <?= @($currentValue->walk->intensity) == 'Vigorous' ? 'selected' : ''?>>Vigorous</option>
-            </select>
-        </td>
-        <td>
-            <select if-jog-active class="form-control form-control-sm min-width-unset px-0" data-name="jog->intensity">
-                <option value="">-- select --</option>
-                <option value="Light" <?= @($currentValue->jog->intensity) == 'Light' ? 'selected' : ''?>>Light</option>
-                <option value="Moderate" <?= @($currentValue->jog->intensity) == 'Moderate' ? 'selected' : ''?>>Moderate</option>
-                <option value="Vigorous" <?= @($currentValue->jog->intensity) == 'Vigorous' ? 'selected' : ''?>>Vigorous</option>
-            </select>
-        </td>
-        <td>
-            <select if-elliptical-active class="form-control form-control-sm min-width-unset px-0" data-name="elliptical->intensity">
-                <option value="">-- select --</option>
-                <option value="Light" <?= @($currentValue->elliptical->intensity) == 'Light' ? 'selected' : ''?>>Light</option>
-                <option value="Moderate" <?= @($currentValue->elliptical->intensity) == 'Moderate' ? 'selected' : ''?>>Moderate</option>
-                <option value="Vigorous" <?= @($currentValue->elliptical->intensity) == 'Vigorous' ? 'selected' : ''?>>Vigorous</option>
-            </select>
-        </td>
-        <td>
-            <select if-swim-active class="form-control form-control-sm min-width-unset px-0" data-name="swim->intensity">
-                <option value="">-- select --</option>
-                <option value="Light" <?= @($currentValue->swim->intensity) == 'Light' ? 'selected' : ''?>>Light</option>
-                <option value="Moderate" <?= @($currentValue->swim->intensity) == 'Moderate' ? 'selected' : ''?>>Moderate</option>
-                <option value="Vigorous" <?= @($currentValue->swim->intensity) == 'Vigorous' ? 'selected' : ''?>>Vigorous</option>
-            </select>
-        </td>
-        <td>
-            <select if-bike-active class="form-control form-control-sm min-width-unset px-0" data-name="bike->intensity">
+        <td class="p-0">
+            <select if-bike-active class="form-control form-control-sm min-width-unset px-0 border-0" data-name="bike->intensity">
                 <option value="">-- select --</option>
                 <option value="Light" <?= @($currentValue->bike->intensity) == 'Light' ? 'selected' : ''?>>Light</option>
                 <option value="Moderate" <?= @($currentValue->bike->intensity) == 'Moderate' ? 'selected' : ''?>>Moderate</option>
                 <option value="Vigorous" <?= @($currentValue->bike->intensity) == 'Vigorous' ? 'selected' : ''?>>Vigorous</option>
             </select>
         </td>
-    </tr>
-    <tr>
-        <td>Time (mins/day)</td>
-        <td>
-            <input if-walk-active class="form-control form-control-sm min-width-unset px-1" type="text" data-name="walk->time" value="<?= @($currentValue->walk->time) ?>">
-        </td>
-        <td>
-            <input if-jog-active class="form-control form-control-sm min-width-unset px-1" type="text" data-name="jog->time" value="<?= @($currentValue->jog->time) ?>">
-        </td>
-        <td>
-            <input if-elliptical-active class="form-control form-control-sm min-width-unset px-1" type="text" data-name="elliptical->time" value="<?= @($currentValue->elliptical->time) ?>">
-        </td>
-        <td>
-            <input if-swim-active class="form-control form-control-sm min-width-unset px-1" type="text" data-name="swim->time" value="<?= @($currentValue->swim->time) ?>">
-        </td>
-        <td>
-            <input if-bike-active class="form-control form-control-sm min-width-unset px-1" type="text" data-name="bike->time" value="<?= @($currentValue->bike->time) ?>">
+        <td class="p-0">
+            <input if-bike-active class="form-control form-control-sm min-width-unset px-1 border-0" type="text" data-name="bike->time" value="<?= @($currentValue->bike->time) ?>">
         </td>
     </tr>
     </tbody>