✨ (App.css): add CSS rules to remove border for cells with 'no-border' class

✨ (editNodeModal): add 'no-border' class to specific table columns to remove borders

src/frontend/src/App.css

@@ -164,3 +164,13 @@ body {
 .ag-body-vertical-scroll-viewport::-webkit-scrollbar-thumb:hover {
   background-color: #bbb;
 }
+
+/* This CSS is to not apply the border for the column having 'no-border' class */
+.no-border.ag-cell:focus {
+  border: none !important;
+  outline: none;
+}
+.no-border.ag-cell {
+  border: none !important;
+  outline: none;
+}

src/frontend/src/modals/editNodeModal/index.tsx

@@ -92,6 +92,7 @@ const EditNodeModal = forwardRef(
         cellRenderer: TableAutoCellRender,
         flex: 1,
         resizable: false,
+        cellClass: "no-border",
       },
       {
         headerName: "Description",
@@ -102,6 +103,7 @@ const EditNodeModal = forwardRef(
         autoHeight: true,
         flex: 2,
         resizable: false,
+        cellClass: "no-border",
       },
       {
         headerName: "Value",
@@ -120,6 +122,7 @@ const EditNodeModal = forwardRef(
         minWidth: 330,
         flex: 1,
         resizable: false,
+        cellClass: "no-border",
       },
       {
         headerName: "Show",
@@ -140,10 +143,10 @@ const EditNodeModal = forwardRef(
             </>
           );
         },
-
         editable: false,
         maxWidth: 80,
         resizable: false,
+        cellClass: "no-border",
       },
     ];