Fixed checkboxes style

src/Ombi/ClientApp/app/usermanagement/usermanagement.component.html

@@ -7,9 +7,12 @@
 <table class="table table-striped table-hover table-responsive table-condensed table-usermanagement">
     <thead>
         <tr>
-            <th >
+            <th style="width:1%">
                 <a>
-                    <input type="checkbox" ng-checked="checkAll" (change)="checkAllBoxes()">
+                        <td class="checkbox" data-label="Select:">
+                                <input id="all" type="checkbox" ng-checked="checkAll" (change)="checkAllBoxes()">
+                                <label for="all"></label>
+                            </td>
                 </a>
             </th>
             <th (click)="setOrder('u.userName')">
@@ -57,8 +60,9 @@
     </thead>
     <tbody>
         <tr *ngFor="let u of users | orderBy: order : reverse : 'case-insensitive'">
-            <td class="td-labelled" data-label="Select:">
+            <td class="checkbox" data-label="Select:">
-                <input type="checkbox" [(ngModel)]="u.checked">
+                <input id="{{u.id}}" type="checkbox" [(ngModel)]="u.checked">
+                <label for="{{u.id}}"></label>
             </td>
             <td class="td-labelled" data-label="Username:">
                 {{u.userName}}
@@ -92,7 +96,3 @@
         </tr>
     </tbody>
 </table>
-
-
-
-

src/Ombi/ClientApp/styles/base.scss

@@ -411,15 +411,6 @@ $border-radius: 10px;
     line-height: 13px;
 }
 
-.small-checkbox label {
-    display: inline-block;
-    cursor: pointer;
-    position: relative;
-    padding-left: 25px;
-    margin-right: 15px;
-    font-size: 13px;
-    margin-bottom: 10px;
-}
 
 .radio label {
     display: inline-block;
@@ -456,6 +447,15 @@ $border-radius: 10px;
     line-height: 13px;
 }
 
+.small-checkbox label {
+    display: inline-block;
+    cursor: pointer;
+    position: relative;
+    padding-left: 25px;
+    margin-right: 15px;
+    font-size: 13px;
+    margin-bottom: 10px;
+}
 
 
 .small-checkbox label:before {