resolve existing merge conflict and fix icon styles e.g. in info panel

src/app/components/analysis-panel/analysis-panel.component.html

@@ -203,7 +203,7 @@
                         classString="has-text-success"
                       ></app-fa-solid-icon>
                       <app-fa-solid-icon
-                        *ngIf="task.info.parameters.includeNonApprovedDrugs"
+                        *ngIf="!task.info.parameters.includeNonApprovedDrugs"
                         icon="times"
                         classString="has-text-danger"
                         title="non-approved drugs excluded"
@@ -220,7 +220,7 @@
                         classString="has-text-success"
                       ></app-fa-solid-icon>
                       <app-fa-solid-icon
-                        *ngIf="task.info.parameters.customEdges"
+                        *ngIf="!task.info.parameters.customEdges"
                         icon="times"
                         classString="has-text-danger"
                         title="custom edges drugs excluded"
@@ -281,7 +281,6 @@
               </h4>
               <table class="table is-narrow">
                 <tbody>
-<<<<<<< HEAD
                   <tr>
                     <td>Include indirect drugs</td>
                     <td>
@@ -310,28 +309,6 @@
                     <td>Result Size</td>
                     <td>10</td>
                   </tr>
-=======
-                <tr>
-                  <td>Include indirect drugs</td>
-                  <td>
-                    <i class="fa fa-times"></i>
-                  </td>
-                </tr>
-                <tr>
-                  <td>Include non-approved drugs</td>
-                  <td>
-                    <i class="fa fa-check"></i>
-                  </td>
-                </tr>
-                <tr>
-                  <td>Hub Penality</td>
-                  <td>1</td>
-                </tr>
-                <tr>
-                  <td>Result Size</td>
-                  <td>10</td>
-                </tr>
->>>>>>> 8b2e992ecd618802800175c6b4e6cd18fca0c89c
                 </tbody>
               </table>
             </div>

src/app/components/task-list/task-list.component.html

@@ -12,11 +12,14 @@
         <div class="columns mb-0">
           <div class="column is-8">
             <span class="is-capitalized"
-              ><i
-                class="fa"
-                [class.fa-capsules]="task.info.target === 'drug'"
-                [class.fa-crosshairs]="task.info.target === 'drug-target'"
-              ></i>
+              ><app-fa-solid-icon
+                icon="crosshairs"
+                *ngIf="task.info.target === 'drug-target'"
+              ></app-fa-solid-icon>
+              <app-fa-solid-icon
+                icon="capsules"
+                *ngIf="task.info.target === 'drug'"
+              ></app-fa-solid-icon>
               {{ algorithmNames[task.info.algorithm] }}</span
             >
           </div>
@@ -63,11 +66,14 @@
         <div class="columns mb-0">
           <div class="column is-8">
             <span class="is-capitalized"
-              ><i
-                class="fa"
-                [class.fa-capsules]="task.info.target === 'drug'"
-                [class.fa-crosshairs]="task.info.target === 'drug-target'"
-              ></i>
+              ><app-fa-solid-icon
+                icon="crosshairs"
+                *ngIf="task.info.target === 'drug-target'"
+              ></app-fa-solid-icon>
+              <app-fa-solid-icon
+                icon="capsules"
+                *ngIf="task.info.target === 'drug'"
+              ></app-fa-solid-icon>
               {{ algorithmNames[task.info.algorithm] }}</span
             >
           </div>
@@ -107,11 +113,14 @@
         <div class="columns mb-0">
           <div class="column is-8">
             <span class="is-capitalized"
-              ><i
-                class="fa"
-                [class.fa-capsules]="task.info.target === 'drug'"
-                [class.fa-crosshairs]="task.info.target === 'drug-target'"
-              ></i>
+              ><app-fa-solid-icon
+                icon="crosshairs"
+                *ngIf="task.info.target === 'drug-target'"
+              ></app-fa-solid-icon>
+              <app-fa-solid-icon
+                icon="capsules"
+                *ngIf="task.info.target === 'drug'"
+              ></app-fa-solid-icon>
               {{ algorithmNames[task.info.algorithm] }}</span
             >
           </div>
@@ -140,11 +149,14 @@
         <div class="columns mb-0">
           <div class="column is-8">
             <span class="is-capitalized"
-              ><i
-                class="fa"
-                [class.fa-capsules]="task.info.target === 'drug'"
-                [class.fa-crosshairs]="task.info.target === 'drug-target'"
-              ></i>
+              ><app-fa-solid-icon
+                icon="crosshairs"
+                *ngIf="task.info.target === 'drug-target'"
+              ></app-fa-solid-icon>
+              <app-fa-solid-icon
+                icon="capsules"
+                *ngIf="task.info.target === 'drug'"
+              ></app-fa-solid-icon>
               {{ algorithmNames[task.info.algorithm] }}</span
             >
           </div>

src/app/components/toggle/toggle.component.html

@@ -11,7 +11,7 @@
       [ngClass]="{ 'is-small': drugstoneConfig.smallStyle }"
     >
       <app-fa-solid-icon
-        classString="is-small"
+        classString="is-small first-item-in-button has-text-success"
         [icon]="iconOn"
       ></app-fa-solid-icon>
       <span [ngClass]="{ 'text-small': drugstoneConfig.smallStyle }">{{
@@ -35,7 +35,7 @@
       }}</span>
       <app-fa-solid-icon
         *ngIf="iconOff"
-        classString="is-small"
+        classString="is-small last-item-in-button has-text-danger"
         [icon]="iconOff"
       ></app-fa-solid-icon>
     </button>

src/app/components/toggle/toggle.component.ts

@@ -8,8 +8,8 @@ import { DrugstoneConfigService } from 'src/app/services/drugstone-config/drugst
 })
 export class ToggleComponent implements OnInit {
 
-  @Input() iconOn = 'fa-check';
-  @Input() iconOff = 'fa-times';
+  @Input() iconOn = 'check';
+  @Input() iconOff = 'times';
 
   @Input() textOn = 'On';
   @Input() textOff = 'Off';