Boxes in dark mode

docs/source/_static/css/custom.css

@@ -1,28 +1,14 @@
-/* Remove execution count for notebook cells. */
-div.prompt {
-  display: none;
-}
-
-/* Getting started index page */
-
-
-.intro-card .card-text {
-  margin: 20px 0px;
-}
-
+/* Override some aspects of the pydata-sphinx-theme */
 
-.card-title {
-  margin-top: 0.25rem;
+:root {
+  /* Use softer blue from bootstrap's default info color */
+  --pst-color-info: 23, 162, 184;
 }
 
-div#index-container {
-  padding-bottom: 20px;
+table {
+  width: auto; /* Override fit-content which breaks Styler user guide ipynb */
 }
 
-a#index-link {
-  color: #333;
-  text-decoration: none;
-}
 
 /* reference to user guide */
 .gs-torefguide {
@@ -43,6 +29,7 @@ a#index-link {
   box-shadow: 0px -10px 0px #FFCA00f3 inset;
 }
 
+
 .gs-torefguide p {
   margin-top: 1rem;
 }
@@ -66,121 +53,46 @@ a#index-link {
 
 
 
-.intro-card .card-text {
-  margin: 20px 0px;
-  /*min-height: 150px; */
-}
-
-.intro-card .card-img-top {
-  margin: 0px;
-}
-
-.install-block {
-  padding-bottom: 30px;
-}
-
-.install-card .card-header {
-  border: none;
-  background-color: white;
-  color: #150458;
-  font-size: 1.1rem;
-  font-weight: bold;
-  padding: 1rem 1rem 0rem 1rem;
-}
-
-.install-card .card-footer {
-  border: none;
-  background-color: white;
-}
-
-.install-card pre {
-  margin: 0 1em 1em 1em;
-}
+/* Main index page overview cards */
 
-.custom-button {
-  background-color: #DCDCDC;
-  border: none;
-  color: #484848;
-  text-align: center;
-  text-decoration: none;
-  display: inline-block;
-  font-size: 0.9rem;
-  border-radius: 0.5rem;
-  max-width: 120px;
-  padding: 0.5rem 0rem;
-}
-
-.custom-button a {
-  color: #484848;
-}
-
-.custom-button p {
-  margin-top: 0;
-  margin-bottom: 0rem;
-  color: #484848;
-}
-
-/* selecting constraints guide collapsed cards */
-
-.tutorial-accordion {
-  margin-top: 20px;
-  margin-bottom: 20px;
-}
-
-.tutorial-card .card-header.card-link .btn {
-  margin-right: 12px;
-}
-
-.tutorial-card .card-header.card-link .btn:after {
-  content: "-";
-}
-
-.tutorial-card .card-header.card-link.collapsed .btn:after {
-  content: "+";
-}
-
-.tutorial-card-header-1 {
-  justify-content: space-between;
-  align-items: center;
+.intro-card {
+  padding: 30px 10px 20px 10px;
 }
 
-.tutorial-card-header-2 {
-  justify-content: flex-start;
-  align-items: center;
-  font-size: 1.3rem;
+.intro-card .sd-card-img-top {
+  margin: 10px;
+  height: 52px;
+  background: none !important;
 }
 
-.tutorial-card .card-header {
-  cursor: pointer;
-  background-color: white;
+.intro-card .sd-card-title {
+  color: var(--pst-color-primary);
+  font-size: var(--pst-font-size-h5);
+  padding: 1rem 0rem 0.5rem 0rem;
 }
 
-.tutorial-card .card-body {
-  background-color: #F0F0F0;
+.intro-card .sd-card-footer {
+  border: none !important;
 }
 
-.tutorial-card .badge:hover {
-  background-color: grey;
+.intro-card .sd-card-footer p.sd-card-text {
+  max-width: 220px;
+  margin-left: auto;
+  margin-right: auto;
 }
 
-/* tables in selecting constraints guide */
-
-table.rows th {
-  background-color: #F0F0F0;
-  border-style: solid solid solid solid;
-  border-width: 0px 0px 0px 0px;
-  border-color: #F0F0F0;
-  text-align: center;
+.intro-card .sd-btn-secondary {
+  background-color: #6c757d !important;
+  border-color: #6c757d !important;
 }
 
-table.rows tr:nth-child(even) {
-  background-color: #F0F0F0;
-  text-align: right;
+.intro-card .sd-btn-secondary:hover {
+  background-color: #5a6268 !important;
+  border-color: #545b62 !important;
 }
 
-table.rows tr:nth-child(odd) {
-  background-color: #FFFFFF;
-  text-align: right;
+.card, .card img {
+  background-color: var(--pst-color-background);
 }
 
 
@@ -208,13 +120,3 @@ details.dropdown .summary-down {
 .my-3 {
   margin-bottom: 0.2rem !important;
 }
-
-/* Background color of dropdown boxes */
-.card {
-  background-color: white !important;
-}
-
-/* Color of inline code */
-:root {
-  --pst-color-inline-code: 160, 4, 4 !important;
-}