From 5b40c79ea3a08bd6ba1feaf8a8804763fcd6b86e Mon Sep 17 00:00:00 2001
From: congs <mcpacino@gmail.com>
Date: Wed, 3 Aug 2022 17:16:49 +1200
Subject: [PATCH] feat(ui): EE-3801 css portainer groups new (#7362)

---
 app/portainer/components/forms/group-form/groupForm.html | 9 ++++++---
 .../group-association-table/groupAssociationTable.html   | 6 +++---
 2 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/app/portainer/components/forms/group-form/groupForm.html b/app/portainer/components/forms/group-form/groupForm.html
index 72024899a..68c67df31 100644
--- a/app/portainer/components/forms/group-form/groupForm.html
+++ b/app/portainer/components/forms/group-form/groupForm.html
@@ -1,7 +1,7 @@
 <form class="form-horizontal" name="endpointGroupForm">
   <!-- name-input -->
-  <div class="form-group" ng-class="{ 'has-error': endpointGroupForm.group_name.$invalid }">
-    <label for="group_name" class="col-sm-3 col-lg-2 control-label text-left">Name</label>
+  <div class="form-group">
+    <label for="group_name" class="col-sm-3 col-lg-2 control-label text-left required">Name</label>
     <div class="col-sm-9 col-lg-10">
       <input type="text" class="form-control" name="group_name" ng-model="$ctrl.model.Name" placeholder="e.g. my-group" required auto-focus />
     </div>
@@ -9,7 +9,10 @@
   <div class="form-group" ng-show="endpointGroupForm.group_name.$invalid">
     <div class="col-sm-12 small text-warning">
       <div ng-messages="endpointGroupForm.group_name.$error">
-        <p ng-message="required"><i class="fa fa-exclamation-triangle" aria-hidden="true"></i> This field is required.</p>
+        <p ng-message="required" class="vertical-center">
+          <pr-icon icon="'alert-triangle'" mode="'warning'" feather="true"></pr-icon>
+          This field is required.
+        </p>
       </div>
     </div>
   </div>
diff --git a/app/portainer/components/group-association-table/groupAssociationTable.html b/app/portainer/components/group-association-table/groupAssociationTable.html
index 9bc50be9c..03f0dd47a 100644
--- a/app/portainer/components/group-association-table/groupAssociationTable.html
+++ b/app/portainer/components/group-association-table/groupAssociationTable.html
@@ -1,7 +1,7 @@
 <div class="datatable">
   <table class="table table-hover" data-cy="{{ $ctrl.cyValue }}">
-    <div class="col-sm-12 vertical-center">
-      <pr-icon icon="'search'" feather="true" class-name="'searchIcon'"></pr-icon>
+    <div class="col-sm-12 vertical-center mb-1">
+      <pr-icon icon="'search'" feather="true"></pr-icon>
       <input
         type="text"
         class="searchInput"
@@ -67,7 +67,7 @@
     <div class="paginationControls">
       <form class="form-inline">
         <span class="limitSelector">
-          <span class="mr-1"> Items per page </span>
+          <span class="space-right"> Items per page </span>
           <select ng-model="$ctrl.paginationState.limit" ng-change="$ctrl.onPaginationLimitChanged()">
             <option value="10">10</option>
             <option value="25">25</option>