ui/nodealertpage: Address the responsiveness

Refs: #3002
scality · Feb 5, 2021 · 5f95d92 · 5f95d92
1 parent 7c8554f
commit 5f95d92
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 3 deletions.
diff --git a/ui/src/components/NodePageAlertsTab.js b/ui/src/components/NodePageAlertsTab.js
@@ -213,7 +213,10 @@ const NodePageAlertsTab = (props) => {
       {
         Header: 'Name',
         accessor: 'name',
-        cellStyle: { width: '230px' },
+        cellStyle: {
+          paddingRight: '5px',
+          wordBreak: 'break-all',
+        },
       },
       {
         Header: 'Severity',

diff --git a/ui/src/components/VolumeAlertsTab.js b/ui/src/components/VolumeAlertsTab.js
@@ -239,7 +239,10 @@ const ActiveAlertsCard = (props) => {
       {
         Header: 'Name',
         accessor: 'name',
-        cellStyle: { width: '200px' },
+        cellStyle: {
+          paddingRight: '5px',
+          wordBreak: 'break-all',
+        },
       },
       {
         Header: 'Severity',
@@ -250,7 +253,7 @@ const ActiveAlertsCard = (props) => {
       {
         Header: 'Active since',
         accessor: 'active_since',
-        cellStyle: { textAlign: 'center', width: '150px' },
+        cellStyle: { textAlign: 'center', width: '120px' },
       },
     ],
     [],