Improve styling of table borders. (#20187)

Graylog2 · Aug 20, 2024 · 6692a9c · 6692a9c
1 parent ea1ef2f
commit 6692a9c
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 3 deletions.
diff --git a/graylog2-web-interface/src/components/bootstrap/Table.jsx b/graylog2-web-interface/src/components/bootstrap/Table.jsx
@@ -85,13 +85,15 @@ const tableCss = css(({ theme }) => css`
       > th,
       > td {
         border-top-color: ${theme.colors.table.row.divider};
+        border-width: 1px;
       }
     }
 
     > thead > tr > th {
       background: ${theme.colors.table.head.background};
       white-space: nowrap;
       border-bottom-color: ${theme.colors.table.row.divider};
+      border-width: 1px;
     }
 
     > tbody > tr {
@@ -101,6 +103,7 @@ const tableCss = css(({ theme }) => css`
 
     > tbody + tbody {
       border-top-color: ${theme.colors.table.row.divider};
+      border-width: 1px;
     }
 
     .table {

diff --git a/graylog2-web-interface/src/components/common/EntityDataTable/EntityDataTable.tsx b/graylog2-web-interface/src/components/common/EntityDataTable/EntityDataTable.tsx
@@ -147,7 +147,7 @@ type Props<Entity extends EntityBase> = {
   /**
    * Needs to be defined when not all action cells in every row have the same width.
    * When they have the same width, the column width will be calculated automatically.
-   * Should not include the actions col padding. Should be teh max width an action cell can have.
+   * Should not include the actions col padding. Should be the max width an action cell can have.
    */
   actionsCellWidth?: number
   /** Currently active sort */

diff --git a/graylog2-web-interface/src/components/common/EntityDataTable/TableRow.tsx b/graylog2-web-interface/src/components/common/EntityDataTable/TableRow.tsx
@@ -26,7 +26,6 @@ import type { ColumnRenderersByAttribute, Column, EntityBase } from './types';
 import RowCheckbox from './RowCheckbox';
 
 const ActionsCell = styled.td`
-  float: right;
   text-align: right;
 
   .btn-toolbar {
@@ -93,7 +92,7 @@ const TableRow = <Entity extends EntityBase>({
       })}
       {displayActions ? (
         <ActionsCell>
-          {index === 0 ? <ActionsRef ref={actionsRef}>{actionButtons}</ActionsRef> : actionButtons}
+          <ActionsRef ref={index === 0 ? actionsRef : undefined}>{actionButtons}</ActionsRef>
         </ActionsCell>
       ) : null}
     </tr>