From 237a1088b0416f23a92ec044672ec48ae18dda51 Mon Sep 17 00:00:00 2001
From: Mike Sawka <mike.sawka@gmail.com>
Date: Thu, 7 Mar 2024 11:08:02 -0800
Subject: [PATCH] fix mainview border/padding (#398)

---
 src/app/clientsettings/clientsettings.less | 1 -
 src/app/common/elements/mainview.less      | 5 +++++
 src/app/common/elements/mainview.tsx       | 2 +-
 src/app/connections/connections.less       | 4 +---
 4 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/app/clientsettings/clientsettings.less b/src/app/clientsettings/clientsettings.less
index d0dc658b..c5bdd86d 100644
--- a/src/app/clientsettings/clientsettings.less
+++ b/src/app/clientsettings/clientsettings.less
@@ -1,7 +1,6 @@
 .clientsettings-view {
     .content {
         padding: 14px 18px 0 30px;
-        border-top: 1px solid var(--app-border-color);
     }
 
     .wave-dropdown {
diff --git a/src/app/common/elements/mainview.less b/src/app/common/elements/mainview.less
index 928a17ef..8433234d 100644
--- a/src/app/common/elements/mainview.less
+++ b/src/app/common/elements/mainview.less
@@ -18,6 +18,7 @@
         vertical-align: middle;
         padding: 0 10px 0 10px;
         margin: 0;
+        border-bottom: 1px solid var(--app-border-color);
 
         .title {
             font-size: var(--title-font-size);
@@ -33,6 +34,10 @@
             font-size: var(--title-font-size);
         }
     }
+
+    .mainview-content {
+        padding-top: 14px;
+    }
 }
 
 // This ensures the tab bar does not collide with the floating logo. The floating logo sits above the sidebar when it is not collapsed, so no additional margin is needed in that case.
diff --git a/src/app/common/elements/mainview.tsx b/src/app/common/elements/mainview.tsx
index 75c13f03..b3d5cd59 100644
--- a/src/app/common/elements/mainview.tsx
+++ b/src/app/common/elements/mainview.tsx
@@ -31,7 +31,7 @@ class MainView extends React.Component<{
                         </div>
                     </header>
                 </div>
-                {this.props.children}
+                <div className="mainview-content">{this.props.children}</div>
             </div>
         );
     }
diff --git a/src/app/connections/connections.less b/src/app/connections/connections.less
index 63c8db37..afa5f5a7 100644
--- a/src/app/connections/connections.less
+++ b/src/app/connections/connections.less
@@ -28,9 +28,7 @@
 
         thead {
             border-radius: var(--sizing-2-xs, 4px);
-            border-top: 1px solid var(--table-thead-border-top-color);
-            border-bottom: 1px solid var(--table-thead-border-bottom-color);
-            background: var(--table-thead-bg-color);
+            border-bottom: 2px solid var(--table-thead-border-bottom-color);
 
             th {
                 height: 32px;