fix: put checkbox style in global style + small fixes

src/app/structure-list/components/modal-filter/modal-filter.component.scss

@@ -99,58 +99,3 @@
     }
   }
 }
-.checkbox {
-  list-style-type: none;
-  input {
-    opacity: 0;
-    display: none;
-    &:checked ~ .customCheck {
-      background-color: $orange-light;
-      border-color: transparent;
-    }
-    &:checked ~ .customCheck:after {
-      display: block;
-    }
-  }
-  label {
-    align-items: center;
-    grid-template-columns: min-content auto;
-    display: inline-grid;
-    cursor: pointer;
-  }
-  .label {
-    padding-left: 8px;
-    @include cn-regular-14;
-  }
-  .customCheck {
-    display: inline-grid;
-    width: 18px;
-    height: 18px;
-    background-color: $white;
-    border: 1px solid $grey;
-    cursor: pointer;
-    position: relative;
-
-    top: 0;
-    left: 0;
-    &:hover {
-      background-color: $grey-5;
-    }
-    &:after {
-      content: '';
-      position: absolute;
-      display: none;
-    }
-    &:after {
-      left: 7px;
-      top: 3px;
-      width: 4px;
-      height: 8px;
-      border: solid $white;
-      border-width: 0 2px 2px 0;
-      transform: rotate(45deg);
-      -webkit-transform: rotate(45deg);
-      -ms-transform: rotate(45deg);
-    }
-  }
-}

src/app/structure-list/components/search/search.component.scss

@@ -49,6 +49,7 @@
       @include background-hash;
       padding: 0 0 4px 5px;
       button {
+        border-radius: 6px;
         @include btn-search;
         @include cn-bold-14;
       }
@@ -87,59 +88,6 @@
   }
 }
 
-.checkbox {
-  list-style-type: none;
-  input {
-    opacity: 0;
-    display: none;
-    &:checked ~ .customCheck {
-      background-color: $orange-light;
-      border-color: transparent;
-    }
-    &:checked ~ .customCheck:after {
-      display: block;
-    }
-  }
-  label {
-    align-items: center;
-    grid-template-columns: min-content auto;
-    display: inline-grid;
-    cursor: pointer;
-  }
-  .label {
-    padding-left: 8px;
-    @include cn-regular-14;
-  }
-  .customCheck {
-    display: inline-grid;
-    width: 18px;
-    height: 18px;
-    background-color: $white;
-    border: 1px solid $grey;
-    cursor: pointer;
-    position: relative;
-
-    top: 0;
-    left: 0;
-    &:hover {
-      background-color: $grey-5;
-    }
-    &:after {
-      content: '';
-      position: absolute;
-      display: none;
-      left: 7px;
-      top: 3px;
-      width: 4px;
-      height: 8px;
-      border: solid $white;
-      border-width: 0 2px 2px 0;
-      transform: rotate(45deg);
-      -webkit-transform: rotate(45deg);
-      -ms-transform: rotate(45deg);
-    }
-  }
-}
 .footerSearchSection {
   margin: 17px 0px 17px 0px;
 

src/app/structure-list/components/search/search.component.ts

@@ -51,7 +51,7 @@ export class SearchComponent implements OnInit {
   // Sends an array containing all filters
   public applyFilter(term: string): void {
     // Add search input filter
-    let filters: Filter[] = [];
+    const filters: Filter[] = [];
     if (term) {
       filters.push(new Filter('nomDeVotreStructure', term, false));
     }
@@ -69,7 +69,7 @@ export class SearchComponent implements OnInit {
   }
 
   public fetchResults(checkedModules: Module[]): void {
-    let inputTerm = this.searchForm.get('searchTerm').value;
+    const inputTerm = this.searchForm.get('searchTerm').value;
 
     // Store checked modules
     this.checkedModulesFilter = checkedModules;
@@ -91,7 +91,7 @@ export class SearchComponent implements OnInit {
   }
 
   private fromStringToIdExcel(categ: string): string {
-    let splitStr = categ.toLowerCase().split(' ');
+    const splitStr = categ.toLowerCase().split(' ');
     for (let i = 1; i < splitStr.length; i++) {
       splitStr[i] = splitStr[i].charAt(0).toUpperCase() + splitStr[i].substring(1);
     }
@@ -105,9 +105,7 @@ export class SearchComponent implements OnInit {
 
   // Fake service api
   private mockService(module: Category[], titre: string, categ: any, nbCateg: number): void {
-    const category = new Category();
-    category.name = titre;
-    category.modules = [];
+    const category = new Category({ name: titre, modules: [] });
     for (let i = 0; i < nbCateg; i++) {
       category.modules.push(new Module(categ.id + i, categ.name + i));
     }

src/styles.scss

@@ -68,3 +68,59 @@ a {
     width: unset;
   }
 }
+
+/** Checkboxes **/
+
+.checkbox {
+  list-style-type: none;
+  input {
+    opacity: 0;
+    display: none;
+    &:checked ~ .customCheck {
+      background-color: $primary-color;
+      border-color: transparent;
+    }
+    &:checked ~ .customCheck:after {
+      display: block;
+    }
+  }
+  label {
+    align-items: center;
+    grid-template-columns: min-content auto;
+    display: inline-grid;
+    cursor: pointer;
+  }
+  .label {
+    padding-left: 8px;
+    @include cn-regular-14;
+  }
+  .customCheck {
+    display: inline-grid;
+    width: 18px;
+    height: 18px;
+    background-color: $white;
+    border: 1px solid $grey;
+    cursor: pointer;
+    position: relative;
+
+    top: 0;
+    left: 0;
+    &:hover {
+      background-color: $grey-5;
+    }
+    &:after {
+      content: '';
+      position: absolute;
+      display: none;
+      left: 7px;
+      top: 3px;
+      width: 4px;
+      height: 8px;
+      border: solid $white;
+      border-width: 0 2px 2px 0;
+      transform: rotate(45deg);
+      -webkit-transform: rotate(45deg);
+      -ms-transform: rotate(45deg);
+    }
+  }
+}