UI: imporve tables in projects readme

kitspace · Oct 3, 2022 · fc6764c · fc6764c
1 parent f44548e
commit fc6764c
Showing 1 changed file with 25 additions and 0 deletions.
diff --git a/frontend/src/components/Board/Readme.js b/frontend/src/components/Board/Readme.js
@@ -38,6 +38,31 @@ const Readme = ({ renderedReadme }) => (
       #readme input[type='checkbox'] {
         margin-right: 5px;
       }
+
+      #readme table {
+        border-collapse: collapse;
+        border-spacing: 0;
+        display: block;
+        max-width: 100%;
+        overflow: auto;
+        width: 100%;
+        width: max-content;
+      }
+
+      #readme table tr {
+        background-color: #ffffff;
+        border-top: 1px solid hsla(210, 18%, 91%, 1);
+      }
+
+      #readme table th,
+      #readme table td {
+        padding: 6px 13px;
+        border: 1px solid #d0d7de;
+      }
+
+      #readme table tr:nth-child(2n) {
+        background-color: #f6f8fa;
+      }
     `}</style>
   </div>
 )