Add and use CSS styling from astropy

docs/_static/astropy.css

@@ -0,0 +1,86 @@
+/* Copied from astropy repo */
+/* Main page overview cards */
+
+.sd-card {
+  background: #fff;
+  border-radius: 0;
+  padding: 30px 10px 20px 10px;
+  margin: 10px 0px;
+}
+
+.sd-card .sd-card-header {
+  text-align: center;
+}
+
+.sd-card .sd-card-header .sd-card-text {
+  margin: 0px;
+}
+
+.sd-card .sd-card-img-top {
+  height: 52px;
+  width: 52px;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.sd-card .sd-card-header {
+  border: none;
+  background-color: white;
+  color: #150458 !important;
+  font-size: var(--pst-font-size-h5);
+  font-weight: bold;
+  padding: 2.5rem 0rem 0.5rem 0rem;
+}
+
+.sd-card .sd-card-footer {
+  border: none;
+  background-color: white;
+}
+
+.sd-card .sd-card-footer .sd-card-text {
+  max-width: 220px;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+/* Dark theme tweaking */
+html[data-theme=dark] .sd-card img[src*='.svg'] {
+    filter: invert(0.82) brightness(0.8) contrast(1.2);
+}
+
+/* Main index page overview cards */
+html[data-theme=dark] .sd-card {
+  background-color:var(--pst-color-background);
+}
+
+html[data-theme=dark] .sd-shadow-sm {
+    box-shadow: 0 .1rem 1rem rgba(250, 250, 250, .6) !important
+}
+
+html[data-theme=dark] .sd-card .sd-card-header {
+  background-color:var(--pst-color-background);
+  color: #150458 !important;
+}
+
+html[data-theme=dark] .sd-card .sd-card-footer {
+  background-color:var(--pst-color-background);
+}
+
+html[data-theme=dark] h1 {
+  color: var(--pst-color-primary);
+}
+
+html[data-theme=dark] h3 {
+  color: #0a6774;
+}
+
+/* Flip the colours on graphviz graphs on dark mode */
+html[data-theme="dark"] div.graphviz > object.inheritance {
+  filter: invert(0.82) brightness(0.8) contrast(1.2);
+}
+html[data-theme="dark"] div.graphviz > object.graphviz {
+  filter: invert(0.82) brightness(0.8) contrast(1.2);
+}
+html[data-theme="dark"] ul.cooframelegend {
+  filter: invert(0.82) brightness(0.8) contrast(1.2);
+}

docs/conf.py

@@ -135,8 +135,7 @@
     "doc_path": "docs",
 }
 
-# Custom sidebar templates, maps document names to template names.
-# html_sidebars = {}
+html_css_files = ["astropy.css"]
 
 # The name of an image file (relative to this directory) to place at the top
 # of the sidebar.