Fine-tuning in policy details page (#2969)

src/clients/authorization/policy/ClientScope.tsx

@@ -114,7 +114,7 @@ export const ClientScope = () => {
         )}
       />
       {selectedScopes.length > 0 && (
-        <TableComposable>
+        <TableComposable variant="compact">
           <Thead>
             <Tr>
               <Th>{t("clientScope")}</Th>

src/clients/authorization/policy/Group.tsx

@@ -135,7 +135,7 @@ export const Group = () => {
           )}
         />
         {selectedGroups.length > 0 && (
-          <TableComposable>
+          <TableComposable variant="compact">
             <Thead>
               <Tr>
                 <Th>{t("groups")}</Th>

src/clients/authorization/policy/PolicyDetails.tsx

@@ -203,6 +203,7 @@ export default function PolicyDetails() {
             <div className="pf-u-mt-md">
               <Button
                 variant={ButtonVariant.primary}
+                className="pf-u-mr-md"
                 type="submit"
                 data-testid="save"
               >

src/clients/authorization/policy/Role.tsx

@@ -113,7 +113,7 @@ export const Role = () => {
         )}
       />
       {selectedRoles.length > 0 && (
-        <TableComposable>
+        <TableComposable variant="compact">
           <Thead>
             <Tr>
               <Th>{t("roles")}</Th>

src/clients/authorization/policy/policy-details.css

@@ -1,4 +1,4 @@
 
 .pf-c-button.keycloak__client-authorization__policy-row-remove {
   color: var(--pf-c-button--m-plain--Color);
-}
+}