From 9228041dbe5c4a3eda9aeecad68e77bbc1bc1b1d Mon Sep 17 00:00:00 2001
From: Jaco Greeff <jacogr@gmail.com>
Date: Tue, 8 Sep 2020 13:41:37 +0200
Subject: [PATCH] Table border adjustments (#3639)

---
 packages/page-calendar/src/index.tsx         |  2 +-
 packages/react-components/src/Table/Body.tsx | 22 +++++++++---
 packages/react-components/src/Table/Head.tsx | 35 +++++++++++++++-----
 packages/react-components/src/Tabs/index.tsx |  2 +-
 4 files changed, 45 insertions(+), 16 deletions(-)

diff --git a/packages/page-calendar/src/index.tsx b/packages/page-calendar/src/index.tsx
index 16d0a306b0..184b89ced5 100644
--- a/packages/page-calendar/src/index.tsx
+++ b/packages/page-calendar/src/index.tsx
@@ -152,7 +152,7 @@ export default React.memo(styled(CalendarApp)`
 
       > div {
         background-color: #fff;
-        border: 1px solid #ddd;
+        border: 1px solid #eeecea;
         border-radius: 0.25rem;
       }
 
diff --git a/packages/react-components/src/Table/Body.tsx b/packages/react-components/src/Table/Body.tsx
index 38fbbb332c..c3d3c60a2c 100644
--- a/packages/react-components/src/Table/Body.tsx
+++ b/packages/react-components/src/Table/Body.tsx
@@ -35,6 +35,14 @@ export default React.memo(styled(Body)`
     text-align: left;
     vertical-align: middle;
 
+    &:first-child {
+      border-left: 1px solid #eeecea;
+    }
+
+    &:last-child {
+      border-right: 1px solid #eeecea;
+    }
+
     label {
       display: block !important;
       white-space: nowrap;
@@ -161,12 +169,16 @@ export default React.memo(styled(Body)`
     }
 
     &:last-child {
-      td:first-child {
-        border-bottom-left-radius: 0.25rem;
-      }
+      td {
+        border-bottom: 1px solid #eeecea;
 
-      td:last-child {
-        border-bottom-right-radius: 0.25rem;
+        &:first-child {
+          border-bottom-left-radius: 0.25rem;
+        }
+
+        :last-child {
+          border-bottom-right-radius: 0.25rem;
+        }
       }
     }
 
diff --git a/packages/react-components/src/Table/Head.tsx b/packages/react-components/src/Table/Head.tsx
index be814ac344..e5ff549ec9 100644
--- a/packages/react-components/src/Table/Head.tsx
+++ b/packages/react-components/src/Table/Head.tsx
@@ -59,14 +59,6 @@ export default React.memo(styled(Head)`
     vertical-align: baseline;
     white-space: nowrap;
 
-    &:first-child {
-      border-top-left-radius: 0.25rem;
-    }
-
-    &:last-child {
-      border-top-rights-radius: 0.25rem;
-    }
-
     h1, h2 {
       font-size: 1.75rem;
     }
@@ -95,13 +87,38 @@ export default React.memo(styled(Head)`
   }
 
   tr {
-    background: rgba(255, 254, 253, 1);
+    background: white; // rgba(255, 254, 253, 1);
     text-transform: lowercase;
 
+    &:first-child {
+      th {
+        &:first-child {
+          border-top-left-radius: 0.25rem;
+        }
+
+        &:last-child {
+          border-top-rights-radius: 0.25rem;
+        }
+      }
+    }
 
     &:not(.filter) {
       th {
         color: rgba(78, 78, 78, 0.66);
+
+        &:first-child {
+          border-left: 1px solid #eeecea;
+        }
+
+        &:last-child {
+          border-right: 1px solid #eeecea;
+        }
+      }
+
+      &:first-child {
+        th {
+          border-top: 1px solid #eeecea;
+        }
       }
     }
 
diff --git a/packages/react-components/src/Tabs/index.tsx b/packages/react-components/src/Tabs/index.tsx
index 76d9a420fa..df28600b78 100644
--- a/packages/react-components/src/Tabs/index.tsx
+++ b/packages/react-components/src/Tabs/index.tsx
@@ -61,7 +61,7 @@ function Tabs ({ basePath, className = '', hidden, isSequence, items }: Props):
 export default React.memo(styled(Tabs)`
   align-items: flex-end;
   background: #fff;
-  // border-bottom: 1px solid #ddd;
+  border-bottom: 1px solid #eeecea;
   display: flex;
   margin: 0 -3rem;
   overflow-x: scroll;