Better styling: tables with borders, line breaks

quartz.config.ts

@@ -69,7 +69,6 @@ const config: QuartzConfig = {
       Plugin.TableOfContents(),
       Plugin.CrawlLinks({ markdownLinkResolution: "shortest" }),
       Plugin.Description(),
-      Plugin.HardLineBreaks(),
     ],
     filters: [Plugin.RemoveDrafts()],
     emitters: [

quartz/styles/custom.scss

@@ -27,8 +27,23 @@
     --color: #a672c0;
 }
 
-.callout.note {
+table {
+    border: 2px solid var(--gray);
 
+    & thead > tr {
+        border-bottom: 2px solid var(--lightgray);
+
+        & th {
+            border: 1px solid var(--lightgray);
+        }
+    }
+
+    & td {
+        border: 1px solid var(--lightgray);
+    }
+}
+
+.callout.note {
     & table {
         margin: 0;
         margin-bottom: 0.5rem;
@@ -65,6 +80,12 @@ ul.overflow::after, ol.overflow::after {
         & .center {
             & p {
                 font-size: 1.15rem;
+                white-space: break-spaces;
+                hyphens: none;
+            }
+            
+            & li {
+                font-size: 1.15rem;
             }
 
             & h3 {