refactor(docs): add rounded corners for table and fix typo

acrodata · Apr 15, 2024 · 83d6c67 · 83d6c67
1 parent 2af22df
commit 83d6c67
Show file tree

Hide file tree

Showing 3 changed files with 44 additions and 11 deletions.
diff --git a/projects/docs/src/app/pages/conditions/conditions.component.html b/projects/docs/src/app/pages/conditions/conditions.component.html
@@ -37,7 +37,7 @@ <h2 id="rule">
         </li>
         <li>
           <code>$ne</code> -
-          <span>not eaqual</span>
+          <span>not equal</span>
         </li>
         <li>
           <code>$gt</code> -

diff --git a/projects/docs/src/app/pages/conditions/conditions.component.ts b/projects/docs/src/app/pages/conditions/conditions.component.ts
@@ -14,11 +14,10 @@ import { ExampleViewerComponent, PageHeaderComponent } from '../../shared';
 })
 export class ConditionsComponent {
   ruleJson = `{
-  "type": "...",
-  "name": "...",
+  ...
   "showIf": {
     "conditions": [
-      [ "path", "operator", "value" ],
+      ["path", "operator", "value"],
       ...
     ],
     "logicalType": "$or"

diff --git a/projects/docs/src/styles/_reboot.scss b/projects/docs/src/styles/_reboot.scss
@@ -91,13 +91,47 @@ code {
 
 table {
   width: 100%;
-  caption-side: bottom;
-  border-collapse: collapse;
-
-  th,
-  td {
-    padding: 8px;
-    border: 1px solid var(--border-color);
+  border-spacing: 0;
+
+  tr {
+    th {
+      border-top: 1px solid var(--border-color);
+    }
+
+    th,
+    td {
+      padding: 8px;
+      border-right: 1px solid var(--border-color);
+      border-bottom: 1px solid var(--border-color);
+
+      &:first-child {
+        border-left: 1px solid var(--border-color);
+      }
+    }
+
+    &:first-child {
+      th {
+        &:first-child {
+          border-top-left-radius: 8px;
+        }
+
+        &:last-child {
+          border-top-right-radius: 8px;
+        }
+      }
+    }
+
+    &:last-child {
+      td {
+        &:first-child {
+          border-bottom-left-radius: 8px;
+        }
+
+        &:last-child {
+          border-bottom-right-radius: 8px;
+        }
+      }
+    }
   }
 }