From 0141e55936c51a86a31839ee28fa993296574cee Mon Sep 17 00:00:00 2001
From: Zhang Hao <hao.zhang@portainer.io>
Date: Thu, 4 Aug 2022 23:41:12 +0800
Subject: [PATCH] fix(style): UI task issues [EE-3839] (#7406)

---
 .../datatables/configs-datatable/configsDatatable.html |  2 +-
 .../containerProcessesDatatable.html                   |  2 +-
 .../datatables/events-datatable/eventsDatatable.html   |  2 +-
 .../datatables/images-datatable/imagesDatatable.html   |  2 +-
 .../networks-datatable/networksDatatable.html          |  2 +-
 .../datatables/nodes-datatable/nodesDatatable.html     |  2 +-
 .../datatables/secrets-datatable/secretsDatatable.html |  2 +-
 .../actions/servicesDatatableActions.html              |  2 +-
 .../services-datatable/servicesDatatable.html          |  2 +-
 .../datatables/volumes-datatable/volumesDatatable.html |  2 +-
 app/docker/views/containers/console/attach.html        |  2 +-
 app/docker/views/containers/console/exec.html          |  2 +-
 app/docker/views/containers/edit/container.html        |  2 +-
 .../applications-datatable/applicationsDatatable.html  |  2 +-
 .../datatables/nodes-datatable/nodesDatatable.html     |  2 +-
 .../resourcePoolsDatatable.html                        |  2 +-
 .../components/access-datatable/accessDatatable.html   |  2 +-
 .../custom-templates-list/customTemplatesList.html     |  2 +-
 .../registries-datatable/registriesDatatable.html      |  4 ++--
 .../datatables/stacks-datatable/stacksDatatable.html   |  2 +-
 .../environment-variables-simple-mode-item.html        | 10 +++++-----
 .../components/template-list/templateList.html         |  2 +-
 22 files changed, 27 insertions(+), 27 deletions(-)

diff --git a/app/docker/components/datatables/configs-datatable/configsDatatable.html b/app/docker/components/datatables/configs-datatable/configsDatatable.html
index c8ac0d43d..fdd1920b2 100644
--- a/app/docker/components/datatables/configs-datatable/configsDatatable.html
+++ b/app/docker/components/datatables/configs-datatable/configsDatatable.html
@@ -7,7 +7,7 @@
           {{ $ctrl.titleText }}
         </div>
         <div class="searchBar vertical-center">
-          <pr-icon icon="'search'" feather="true"></pr-icon>
+          <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
           <input
             type="text"
             class="searchInput"
diff --git a/app/docker/components/datatables/container-processes-datatable/containerProcessesDatatable.html b/app/docker/components/datatables/container-processes-datatable/containerProcessesDatatable.html
index d7fdc98a6..b3889dce9 100644
--- a/app/docker/components/datatables/container-processes-datatable/containerProcessesDatatable.html
+++ b/app/docker/components/datatables/container-processes-datatable/containerProcessesDatatable.html
@@ -7,7 +7,7 @@
           {{ $ctrl.titleText }}
         </div>
         <div class="searchBar vertical-center">
-          <pr-icon icon="'search'" feather="true"></pr-icon>
+          <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
           <input
             type="text"
             class="searchInput"
diff --git a/app/docker/components/datatables/events-datatable/eventsDatatable.html b/app/docker/components/datatables/events-datatable/eventsDatatable.html
index 33ecf72c0..1c0206500 100644
--- a/app/docker/components/datatables/events-datatable/eventsDatatable.html
+++ b/app/docker/components/datatables/events-datatable/eventsDatatable.html
@@ -7,7 +7,7 @@
           {{ $ctrl.titleText }}
         </div>
         <div class="searchBar vertical-center">
-          <pr-icon icon="'search'" feather="true"></pr-icon>
+          <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
           <input
             type="text"
             class="searchInput"
diff --git a/app/docker/components/datatables/images-datatable/imagesDatatable.html b/app/docker/components/datatables/images-datatable/imagesDatatable.html
index fecf91195..864a64037 100644
--- a/app/docker/components/datatables/images-datatable/imagesDatatable.html
+++ b/app/docker/components/datatables/images-datatable/imagesDatatable.html
@@ -7,7 +7,7 @@
           {{ $ctrl.titleText }}
         </div>
         <div class="searchBar vertical-center">
-          <pr-icon icon="'search'" feather="true"></pr-icon>
+          <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
           <input
             type="text"
             class="searchInput"
diff --git a/app/docker/components/datatables/networks-datatable/networksDatatable.html b/app/docker/components/datatables/networks-datatable/networksDatatable.html
index e6da1e9d0..3a532a9b2 100644
--- a/app/docker/components/datatables/networks-datatable/networksDatatable.html
+++ b/app/docker/components/datatables/networks-datatable/networksDatatable.html
@@ -7,7 +7,7 @@
           {{ $ctrl.titleText }}
         </div>
         <div class="searchBar vertical-center">
-          <pr-icon icon="'search'" feather="true"></pr-icon>
+          <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
           <input
             type="text"
             class="searchInput"
diff --git a/app/docker/components/datatables/nodes-datatable/nodesDatatable.html b/app/docker/components/datatables/nodes-datatable/nodesDatatable.html
index ab4086e42..411aca028 100644
--- a/app/docker/components/datatables/nodes-datatable/nodesDatatable.html
+++ b/app/docker/components/datatables/nodes-datatable/nodesDatatable.html
@@ -7,7 +7,7 @@
           {{ $ctrl.titleText }}
         </div>
         <div class="searchBar vertical-center">
-          <pr-icon icon="'search'" feather="true"></pr-icon>
+          <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
           <input
             type="text"
             class="searchInput"
diff --git a/app/docker/components/datatables/secrets-datatable/secretsDatatable.html b/app/docker/components/datatables/secrets-datatable/secretsDatatable.html
index dc5f09935..5499ceda6 100644
--- a/app/docker/components/datatables/secrets-datatable/secretsDatatable.html
+++ b/app/docker/components/datatables/secrets-datatable/secretsDatatable.html
@@ -7,7 +7,7 @@
           {{ $ctrl.titleText }}
         </div>
         <div class="searchBar vertical-center">
-          <pr-icon icon="'search'" feather="true"></pr-icon>
+          <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
           <input
             type="text"
             class="searchInput"
diff --git a/app/docker/components/datatables/services-datatable/actions/servicesDatatableActions.html b/app/docker/components/datatables/services-datatable/actions/servicesDatatableActions.html
index 78c238955..59daa8254 100644
--- a/app/docker/components/datatables/services-datatable/actions/servicesDatatableActions.html
+++ b/app/docker/components/datatables/services-datatable/actions/servicesDatatableActions.html
@@ -3,7 +3,7 @@
     <button
       ng-if="$ctrl.showUpdateAction"
       type="button"
-      class="btn btn-sm btn-primary h-fit"
+      class="btn btn-sm btn-light h-fit"
       authorization="DockerServiceUpdate"
       ng-disabled="$ctrl.selectedItemCount === 0"
       ng-click="$ctrl.updateAction($ctrl.selectedItems)"
diff --git a/app/docker/components/datatables/services-datatable/servicesDatatable.html b/app/docker/components/datatables/services-datatable/servicesDatatable.html
index 8f45f6219..5a3b5936e 100644
--- a/app/docker/components/datatables/services-datatable/servicesDatatable.html
+++ b/app/docker/components/datatables/services-datatable/servicesDatatable.html
@@ -7,7 +7,7 @@
           {{ $ctrl.titleText }}
         </div>
         <div class="searchBar vertical-center">
-          <pr-icon icon="'search'" feather="true"></pr-icon>
+          <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
           <input
             type="text"
             class="searchInput"
diff --git a/app/docker/components/datatables/volumes-datatable/volumesDatatable.html b/app/docker/components/datatables/volumes-datatable/volumesDatatable.html
index 7995e0033..07d1793d4 100644
--- a/app/docker/components/datatables/volumes-datatable/volumesDatatable.html
+++ b/app/docker/components/datatables/volumes-datatable/volumesDatatable.html
@@ -7,7 +7,7 @@
           {{ $ctrl.titleText }}
         </div>
         <div class="searchBar vertical-center">
-          <pr-icon icon="'search'" feather="true" class="leading-none"></pr-icon>
+          <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
           <input
             type="text"
             class="searchInput"
diff --git a/app/docker/views/containers/console/attach.html b/app/docker/views/containers/console/attach.html
index 38ac09cb7..f927f32d1 100644
--- a/app/docker/views/containers/console/attach.html
+++ b/app/docker/views/containers/console/attach.html
@@ -31,7 +31,7 @@
 
         <div class="small text-danger" ng-hide="container.State.Running">
           <p>
-            <i class="fa fa-exclamation-triangle" aria-hidden="true"></i>
+            <pr-icon icon="'alert-triangle'" mode="'warning'" feather="true"></pr-icon>
             The container is not running.
           </p>
         </div>
diff --git a/app/docker/views/containers/console/exec.html b/app/docker/views/containers/console/exec.html
index d6578e2e3..04675baa3 100644
--- a/app/docker/views/containers/console/exec.html
+++ b/app/docker/views/containers/console/exec.html
@@ -41,7 +41,7 @@
             <!-- !command-list -->
             <div class="form-group col-lg-12">
               <por-switch-field
-                label-class="'col-sm-2'"
+                label-class="'col-sm-1'"
                 checked="formValues.isCustomCommand"
                 label="'Use custom command'"
                 on-change="(handleIsCustomCommandChange)"
diff --git a/app/docker/views/containers/edit/container.html b/app/docker/views/containers/edit/container.html
index a7e4b5b49..5a3872b87 100644
--- a/app/docker/views/containers/edit/container.html
+++ b/app/docker/views/containers/edit/container.html
@@ -40,7 +40,7 @@
         <div class="btn-group" role="group" aria-label="..." ng-if="displayRecreateButton" authorization="DockerContainerCreate">
           <button
             type="button"
-            class="btn btn-danger btn-sm"
+            class="btn btn-light btn-sm"
             ng-disabled="state.recreateContainerInProgress || container.IsPortainer"
             ng-click="recreate()"
             button-spinner="state.recreateContainerInProgress"
diff --git a/app/kubernetes/components/datatables/applications-datatable/applicationsDatatable.html b/app/kubernetes/components/datatables/applications-datatable/applicationsDatatable.html
index 5adb96a6c..f12e8a05a 100644
--- a/app/kubernetes/components/datatables/applications-datatable/applicationsDatatable.html
+++ b/app/kubernetes/components/datatables/applications-datatable/applicationsDatatable.html
@@ -7,7 +7,7 @@
         Applications
       </div>
       <div class="searchBar vertical-center">
-        <pr-icon icon="'search'" feather="true"></pr-icon>
+        <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
         <input
           type="text"
           class="searchInput"
diff --git a/app/kubernetes/components/datatables/nodes-datatable/nodesDatatable.html b/app/kubernetes/components/datatables/nodes-datatable/nodesDatatable.html
index 1f171d1da..c08dc8a81 100644
--- a/app/kubernetes/components/datatables/nodes-datatable/nodesDatatable.html
+++ b/app/kubernetes/components/datatables/nodes-datatable/nodesDatatable.html
@@ -12,7 +12,7 @@
         </div>
         <div class="settings">
           <div class="searchBar vertical-center">
-            <pr-icon icon="'search'" feather="true"></pr-icon>
+            <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
             <input
               type="text"
               class="searchInput"
diff --git a/app/kubernetes/components/datatables/resource-pools-datatable/resourcePoolsDatatable.html b/app/kubernetes/components/datatables/resource-pools-datatable/resourcePoolsDatatable.html
index 242519a45..acb0bec34 100644
--- a/app/kubernetes/components/datatables/resource-pools-datatable/resourcePoolsDatatable.html
+++ b/app/kubernetes/components/datatables/resource-pools-datatable/resourcePoolsDatatable.html
@@ -9,7 +9,7 @@
             Namespaces
           </div>
           <div class="searchBar vertical-center">
-            <pr-icon icon="'search'" feather="true"></pr-icon>
+            <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
             <input
               type="text"
               class="searchInput"
diff --git a/app/portainer/components/access-datatable/accessDatatable.html b/app/portainer/components/access-datatable/accessDatatable.html
index eefa9697f..8debacb37 100644
--- a/app/portainer/components/access-datatable/accessDatatable.html
+++ b/app/portainer/components/access-datatable/accessDatatable.html
@@ -7,7 +7,7 @@
           {{ $ctrl.titleText }}
         </div>
         <div class="searchBar vertical-center">
-          <pr-icon icon="'search'" feather="true"></pr-icon>
+          <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
           <input
             type="text"
             class="searchInput"
diff --git a/app/portainer/components/custom-templates-list/customTemplatesList.html b/app/portainer/components/custom-templates-list/customTemplatesList.html
index b797d32d9..e667b67cc 100644
--- a/app/portainer/components/custom-templates-list/customTemplatesList.html
+++ b/app/portainer/components/custom-templates-list/customTemplatesList.html
@@ -4,7 +4,7 @@
       <div class="toolBar vertical-center !gap-x-5 !gap-y-1 flex-wrap">
         <rd-widget-header icon="{{ $ctrl.titleIcon }}" feather-icon="true" title-text="Custom Templates" class="!flex-auto !mr-0" parent-classes="!p-0"></rd-widget-header>
         <div class="searchBar vertical-center !mr-0">
-          <pr-icon icon="'search'" feather="true"></pr-icon>
+          <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
           <input
             type="text"
             class="searchInput"
diff --git a/app/portainer/components/datatables/registries-datatable/registriesDatatable.html b/app/portainer/components/datatables/registries-datatable/registriesDatatable.html
index 3eb83c846..2a83a1122 100644
--- a/app/portainer/components/datatables/registries-datatable/registriesDatatable.html
+++ b/app/portainer/components/datatables/registries-datatable/registriesDatatable.html
@@ -7,7 +7,7 @@
           {{ $ctrl.titleText }}
         </div>
         <div class="searchBar vertical-center">
-          <pr-icon icon="'search'" feather="true"></pr-icon>
+          <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
           <input
             type="text"
             class="searchInput"
@@ -99,7 +99,7 @@
               <td>
                 <a ng-if="$ctrl.canManageAccess(item)" ng-click="$ctrl.redirectToManageAccess(item)"> <pr-icon icon="'users'" feather="true"></pr-icon> Manage access </a>
                 <be-feature-indicator feature="$ctrl.limitedFeature" ng-if="$ctrl.canBrowse(item)">
-                  <span class="text-muted space-left" style="padding-right: 5px"> <pr-icon icon="'search'" feather="true"></pr-icon> Browse </span>
+                  <span class="text-muted space-left" style="padding-right: 5px"> <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon> Browse </span>
                 </be-feature-indicator>
 
                 <span ng-if="!$ctrl.canBrowse(item) && !$ctrl.canManageAccess(item)"> - </span>
diff --git a/app/portainer/components/datatables/stacks-datatable/stacksDatatable.html b/app/portainer/components/datatables/stacks-datatable/stacksDatatable.html
index 5908661c6..e00edf44a 100644
--- a/app/portainer/components/datatables/stacks-datatable/stacksDatatable.html
+++ b/app/portainer/components/datatables/stacks-datatable/stacksDatatable.html
@@ -7,7 +7,7 @@
           {{ $ctrl.titleText }}
         </div>
         <div class="searchBar vertical-center !mr-0">
-          <pr-icon icon="'search'" feather="true"></pr-icon>
+          <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
           <input
             type="text"
             class="searchInput"
diff --git a/app/portainer/components/environment-variables-panel/environment-variables-simple-mode/environment-variables-simple-mode-item/environment-variables-simple-mode-item.html b/app/portainer/components/environment-variables-panel/environment-variables-simple-mode/environment-variables-simple-mode-item/environment-variables-simple-mode-item.html
index 80765b402..3cc0710d0 100644
--- a/app/portainer/components/environment-variables-panel/environment-variables-simple-mode/environment-variables-simple-mode-item/environment-variables-simple-mode-item.html
+++ b/app/portainer/components/environment-variables-panel/environment-variables-simple-mode/environment-variables-simple-mode-item/environment-variables-simple-mode-item.html
@@ -39,7 +39,7 @@
           ng-change="$ctrl.onChangeValue($ctrl.variable.value)"
         />
       </div>
-      <button class="btn btn-sm btn-primary" type="button" ng-click="$ctrl.removeValue()"> <i class="fa fa-minus" aria-hidden="true"></i> Remove value </button>
+      <button class="btn btn-sm btn-light" type="button" ng-click="$ctrl.removeValue()"> <i class="fa fa-minus" aria-hidden="true"></i> Remove value </button>
     </div>
     <div class="form-group" ng-show="$ctrl[$ctrl.formName].value.$invalid">
       <div class="col-sm-12 small text-warning">
@@ -51,11 +51,11 @@
     </div>
   </div>
   <div>
-    <button class="btn btn-sm btn-primary" type="button" ng-if="!$ctrl.hasValue()" ng-click="$ctrl.onChangeValue('')">
-      <i class="fa fa-plus" aria-hidden="true"></i> Add value
+    <button class="btn btn-sm btn-light" type="button" ng-if="!$ctrl.hasValue()" ng-click="$ctrl.onChangeValue('')">
+      <pr-icon icon="'plus'" feather="true"></pr-icon>
     </button>
-    <button class="btn btn-sm btn-danger" type="button" ng-click="$ctrl.onRemove($ctrl.index)">
-      <i class="fa fa-trash" aria-hidden="true"></i>
+    <button class="btn btn-sm btn-light" type="button" ng-click="$ctrl.onRemove($ctrl.index)">
+      <pr-icon icon="'trash-2'" feather="true"></pr-icon>
     </button>
   </div>
 </ng-form>
diff --git a/app/portainer/components/template-list/templateList.html b/app/portainer/components/template-list/templateList.html
index 510538589..fd65eae0e 100644
--- a/app/portainer/components/template-list/templateList.html
+++ b/app/portainer/components/template-list/templateList.html
@@ -42,7 +42,7 @@
         <div class="row">
           <div class="col-sm-12">
             <div class="searchBar items-center flex gap-1">
-              <pr-icon icon="'search'" feather="true"></pr-icon>
+              <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
               <input
                 type="text"
                 class="searchInput"