Only-screen & Only-print updates

public/css/style.css

@@ -1502,7 +1502,7 @@ tr.sep td {
     font-size: 90%;
 }
 .only-print {
-    display: nonex;
+    display: none;
 }
 @media print {
     .only-print {

resources/views/app/practice-management/shipment.blade.php

@@ -17,15 +17,19 @@
                 <span class="text-sm text-secondary ml-2">
                     (Created: {{friendlier_date_time($shipment->created_at)}})
                 </span>
+                @if($shipment->status === 'CANCELLED')
+                    <div class="mx-auto font-weight-bold text-danger on-hover-opaque">-- CANCELLED --</div>
+                @endif
                 <div class="ml-auto d-inline-flex align-items-center only-screen">
                     <button id="print-shipment" class="btn btn-sm btn-info">Generate PDF</button>
                     <div moe relative class="d-block ml-3">
                         <a start show class="btn btn-default border btn-sm text-secondary">Cancel Shipment</a>
-                        <form url="/api/shipment/cancel" right>
+                        <form url="/api/shipment/setStatus" right>
                             <input type="hidden" name="uid" value="{{ $shipment->uid }}">
+                            <input type="hidden" name="status" value="CANCELLED">
                             <p>Cancel this shipment?</p>
                             <div class="d-flex align-items-center">
-                                <button class="btn btn-sm btn-primary mr-2" submit>Save</button>
+                                <button class="btn btn-sm btn-primary mr-2" submit>Submit</button>
                                 <button class="btn btn-sm btn-default mr-2 border" cancel>Cancel
                                 </button>
                             </div>
@@ -34,7 +38,7 @@
                 </div>
             </div>
             <div class="only-screen">
-                <div class="card-header px-3 py-2 d-flex align-items-center bg-light">
+                <div class="card-header px-3 py-3 d-flex align-items-center bg-light">
                     <span class="mr-3">Status:</span>
                     <?php $statuses = ['CREATED', 'PRINTED', 'BEING_PICKED', 'PICKED', 'READY_FOR_FULFILMENT', 'READY_FOR_DISPATCH', 'DISPATCHED']; ?>
                     @foreach($statuses as $status)
@@ -49,7 +53,7 @@
                 </div>
             </div>
 
-            <div class="card-header px-3 py-2 only-print bg-white">
+            <div class="card-header p-3 only-print bg-white">
                 <div class="d-flex justify-content-center">
                     <div>
                         <?php