Update extra.css

extra.css

@@ -2,36 +2,87 @@
   --md-primary-fg-color: #122837;
   --md-primary-fg-color--light: hsla(0,0%, 100%, 0.7);
   --md-primary-fg-color--dark: hsla(0, 0%, 0%, 0.07);
-  --md-primary-bg-color: hsla(341, 85%, 89%, 1.0);
+  --md-primary-bg-color: #FDF1F5;
   --md-typeset-a-color: #0550b3;
-  --md-code-hl-number-color: hsla(196, 86%, 29%, 1);
+  --md-code-hl-number-color: hsla(196, 86%, 29%, 1); /* Make code block magic numbers less bright in light theme */
+
 }
 [data-md-color-primary=hello-robot-dark]{
   --md-primary-fg-color: #122837;
   --md-primary-fg-color--light: hsla(0,0%, 100%, 0.7);
   --md-primary-fg-color--dark: hsla(0, 0%, 0%, 0.07);
-  --md-primary-bg-color: hsla(341, 85%, 89%, 1.0);
-  --md-typeset-a-color: hsla(341, 85%, 89%, 1.0);
-  --md-code-hl-number-color: hsla(196, 86%, 29%, 1);
+  --md-primary-bg-color: #FDF1F5;
+  --md-typeset-a-color: hsla(341, 85%, 89%, 1.0); /* Make links more visible in dark theme */
+}
+
+[data-md-color-primary=hello-robot-light] .md-typeset h1,
+.md-typeset h2 {
+  color: hsla(237, 100%, 28%, 1);
 }
 
+[data-md-color-primary=hello-robot-dark] .md-typeset h1,
+.md-typeset h2 {
+  color: hsla(213, 100%, 68%, 1);
+}
 
 [data-md-color-scheme="slate"] {
   --md-hue: 210; /* [0, 360] */
 }
 
+
+th, td {
+    border: 1px solid var(--md-typeset-table-color);
+    border-spacing: 0;
+    border-bottom: none;
+    border-left: none;
+    border-top: none;
+}
+
+.md-typeset__table {
+    line-height: 1;
+}
+
+.md-typeset__table table:not([class]) {
+    font-size: .74rem;
+    border-right: none;
+}
+
+.md-typeset__table table:not([class]) td,
+.md-typeset__table table:not([class]) th {
+    padding: 9px;
+}
+
+/* light mode alternating table bg colors */
+.md-typeset__table tr:nth-child(2n) {
+    background-color: #f8f8f8;
+}
+
+/* dark mode alternating table bg colors */
+[data-md-color-scheme="slate"] .md-typeset__table tr:nth-child(2n) {
+    background-color: hsla(var(--md-hue),25%,25%,1)
+}
+
+
 /*
-Tables set to 100% width
-*/
+.md-header__topic:first-child {
+  font-weight: normal;
+}
+
+/* Indentation.
+div.doc-contents {
+  padding-left: 25px;
+  border-left: 4px solid rgba(230, 230, 230);
+  margin-bottom: 20px;
+}
 
 .md-typeset__table {
-    min-width: 100%;
+  min-width: 100%;
 }
 
 .md-typeset table:not([class]) {
-    display: table;
+  display: table;
 }
-
+*/
 .shell-prompt code::before {
   content: "$ ";
   color: grey;