From 482e3274542e5280339f8ab23561e120e0fadb3e Mon Sep 17 00:00:00 2001
From: DianaXWiki <139217939+DianaXWiki@users.noreply.github.com>
Date: Wed, 17 Jul 2024 12:34:41 +0300
Subject: [PATCH] Adjust general table styling to flex and make the performance
 one responsive #1099

---
 .eslintrc.js                                  |  2 +-
 .../src/less2/include/sidebar-layout.less     | 32 ++++++-------------
 www/admin/app-admin.less                      | 12 +++++++
 3 files changed, 22 insertions(+), 24 deletions(-)

diff --git a/.eslintrc.js b/.eslintrc.js
index 209a4718e..924eddfc3 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -35,7 +35,7 @@ module.exports = {
             4
         ],
         'linebreak-style': [
-            'error',
+            'off',  // git handles linebreak conversion for us
             'unix'
         ],
         'quotes': [
diff --git a/customize.dist/src/less2/include/sidebar-layout.less b/customize.dist/src/less2/include/sidebar-layout.less
index bb037d366..bafc9a77e 100644
--- a/customize.dist/src/less2/include/sidebar-layout.less
+++ b/customize.dist/src/less2/include/sidebar-layout.less
@@ -174,6 +174,9 @@
                     }
                     .cp-sidebar-table {
                         margin-top: @sidebar_base-margin;
+                        tr {
+                            display: flex;
+                        }
                         pre {
                             margin: 0;
                         }
@@ -189,34 +192,17 @@
                                 margin-right: @sidebar_base-margin;
                             }
                         }
+                        th, td {
+                            flex: 1;
+                            word-wrap: break-word;
+                            white-space: normal;
+                            min-width: 13rem;
+                        }
                         tbody {
                             tr:nth-child(odd) {
                                 background-color: @cp_sidebar-left-item-bg;
                             }
                         }
-
-                    }
-                    .cp-sidebar-table#performance-profiling-table {
-                        @media (max-width: 900px) {
-                            width: 100%;
-                            border: 1px solid @cp_drive-icon-border;
-
-                            tr {
-                                display: flex;
-                                flex-wrap: wrap;
-                                align-items: center;
-                            }
-
-                            th, td {
-                                border: none;
-                                flex: 1 1 auto;
-                                width: 5rem;
-                                margin-right: 0;
-                                font-size: 13px;
-                                word-wrap: break-word;
-                                white-space: normal;
-                            }
-                        }
                     }
                     .cp-sidebar-input-block {
                         display: inline-flex;
diff --git a/www/admin/app-admin.less b/www/admin/app-admin.less
index fbaaf4b5e..6d9edc132 100644
--- a/www/admin/app-admin.less
+++ b/www/admin/app-admin.less
@@ -28,6 +28,18 @@
             max-height: 250px;
         }
     }
+    #cp-sidebarlayout-container #cp-sidebarlayout-rightside .cp-sidebarlayout-element[data-item] .cp-sidebar-table#performance-profiling-table {
+        @media (max-width: @browser_media-not-small) {
+            width: 100%;
+            tr {
+                width: 100%;
+            }
+            th, td {
+                margin-right: 0;
+                min-width: 1rem;
+            }
+        }
+    }
     .cp-admin-color-current {
         width: 20px;
         height: 20px;