DOC: Clean up CSS and adapt to new PyData Sphinx Theme version

[skip azp] [skip cirrus]

Author: melissawm

doc/release/upcoming_changes/25908.improvement.rst

@@ -9,132 +9,42 @@
 
 body {
   font-family: 'Open Sans', sans-serif;
+  font-size: medium;
 }
 
-pre, code {
-  font-size: 100%;
-  line-height: 155%;
-}
-
-h1 {
-  font-family: "Lato", sans-serif;
-  color: #013243; /* warm black */
-}
-
-h2 {
-  color: #4d77cf; /* han blue */
-  letter-spacing: -.03em;
-}
-
-h3 {
-  color: #013243; /* warm black */
-  letter-spacing: -.03em;
-}
-
-/* Style the active version button.
-
-- dev: orange
-- stable: green
-- old, PR: red
-
-Colors from:
-
-Wong, B. Points of view: Color blindness.
-Nat Methods 8, 441 (2011). https://doi.org/10.1038/nmeth.1618
-*/
+/* Version switcher colors from PyData Sphinx Theme */
 
-/* If the active version has the name "dev", style it orange */
-#version_switcher_button[data-active-version-name*="dev"] {
-  background-color: #E69F00;
-  border-color: #E69F00;
-  color:#000000;
-}
-
-/* green for `stable` */
-#version_switcher_button[data-active-version-name*="stable"] {
-  background-color: #009E73;
-  border-color: #009E73;
-}
-
-/* red for `old` */
-#version_switcher_button:not([data-active-version-name*="stable"], [data-active-version-name*="dev"], [data-active-version-name=""]) {
-  background-color: #980F0F;
-  border-color: #980F0F;
+.version-switcher__button[data-active-version-name*="dev"] {
+  background-color: var(--pst-color-warning);
+  border-color: var(--pst-color-warning);
+  opacity: 0.9;
 }
 
-/* Main page overview cards */
-
-.sd-card {
-  background: #fff;
-  border-radius: 0;
-  padding: 30px 10px 20px 10px;
-  margin: 10px 0px;
+.version-switcher__button:not([data-active-version-name*="stable"]):not([data-active-version-name*="dev"]):not([data-active-version-name*="pull"]) {
+  background-color: var(--pst-color-danger);
+  border-color: var(--pst-color-danger);
+  opacity: 0.9;
 }
 
-.sd-card .sd-card-header {
-  text-align: center;
+button.btn.version-switcher__button,
+button.btn.version-switcher__button:hover {
+  color: black;
 }
 
-.sd-card .sd-card-header .sd-card-text {
-  margin: 0px;
-}
+/* Main index page overview cards */
 
 .sd-card .sd-card-img-top {
-  height: 52px;
-  width: 52px;
+  height: 60px;
+  width: 60px;
   margin-left: auto;
   margin-right: auto;
+  margin-top: 10px;
 }
 
-.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;
-}
+/* Main index page overview images */
 
-/* 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;
+  filter: invert(0.82) brightness(0.8) contrast(1.2);
 }
 
 /* Legacy admonition */
@@ -143,13 +53,12 @@ div.admonition-legacy {
   border-color: var(--pst-color-warning);
 }
 
-.admonition-legacy.admonition>.admonition-title::before {
+.admonition>.admonition-title::after,
+div.admonition>.admonition-title::after {
   color: var(--pst-color-warning);
-  content: var(--pst-icon-admonition-attention);
-  background-color: var(--pst-color-warning);
 }
 
-.admonition-legacy.admonition>.admonition-title::after {
-  color: var(--pst-color-warning);
-  content: var(--pst-icon-admonition-default);
+.admonition>.admonition-title,
+div.admonition>.admonition-title {
+  background-color: var(--pst-color-warning-bg);
 }

doc/source/_static/numpy.css

@@ -239,23 +239,29 @@ def setup(app):
     switcher_version = f"{version}"
 
 html_theme_options = {
-  "logo": {
-      "image_light": "_static/numpylogo.svg",
-      "image_dark": "_static/numpylogo_dark.svg",
-  },
-  "github_url": "https://github.com/numpy/numpy",
-  "collapse_navigation": True,
-  "external_links": [
-      {"name": "Learn", "url": "https://numpy.org/numpy-tutorials/"},
-      {"name": "NEPs", "url": "https://numpy.org/neps"}
-      ],
-  "header_links_before_dropdown": 6,
-  # Add light/dark mode and documentation version switcher:
-  "navbar_end": ["theme-switcher", "version-switcher", "navbar-icon-links"],
-  "switcher": {
-      "version_match": switcher_version,
-      "json_url": "https://numpy.org/doc/_static/versions.json",
-  },
+    "logo": {
+        "image_light": "_static/numpylogo.svg",
+        "image_dark": "_static/numpylogo_dark.svg",
+    },
+    "github_url": "https://github.com/numpy/numpy",
+    "collapse_navigation": True,
+    "external_links": [
+        {"name": "Learn", "url": "https://numpy.org/numpy-tutorials/"},
+        {"name": "NEPs", "url": "https://numpy.org/neps"},
+    ],
+    "header_links_before_dropdown": 6,
+    # Add light/dark mode and documentation version switcher:
+    "navbar_end": ["theme-switcher", "version-switcher", "navbar-icon-links"],
+    "navbar_persistent": [],
+    "switcher": {
+        "version_match": switcher_version,
+        "json_url": "https://numpy.org/doc/_static/versions.json",
+    },
+}
+
+html_sidebars = {
+    "index": "search-button-field",
+    "**": ["search-button-field", "sidebar-nav-bs"],
 }
 
 html_title = "%s v%s Manual" % (project, version)

doc/source/conf.py

@@ -21,10 +21,10 @@ NumPy documentation
 `Historical versions of documentation <https://numpy.org/doc/>`_
 
 **Useful links**:
-`Installation <https://numpy.org/install/>`_ |
-`Source Repository <https://github.com/numpy/numpy>`_ |
-`Issue Tracker <https://github.com/numpy/numpy/issues>`_ |
-`Q&A Support <https://numpy.org/gethelp/>`_ |
+`Installation <https://numpy.org/install/>`_ |
+`Source Repository <https://github.com/numpy/numpy>`_ |
+`Issue Tracker <https://github.com/numpy/numpy/issues>`_ |
+`Q&A Support <https://numpy.org/gethelp/>`_ |
 `Mailing List <https://mail.python.org/mailman/listinfo/numpy-discussion>`_
 
 NumPy is the fundamental package for scientific computing in Python. It is a
@@ -36,13 +36,15 @@ basic statistical operations, random simulation and much more.
 
 
 
-.. grid:: 2
+.. grid:: 1 1 2 2
+    :gutter: 2 3 4 4
 
     .. grid-item-card::
         :img-top: ../source/_static/index-images/getting_started.svg
+        :text-align: center
 
         Getting started
-        ^^^^^^^^^^^^^^^
+        ^^^
 
         New to NumPy? Check out the Absolute Beginner's Guide. It contains an
         introduction to NumPy's main concepts and links to additional tutorials.
@@ -58,9 +60,10 @@ basic statistical operations, random simulation and much more.
 
     .. grid-item-card::
         :img-top: ../source/_static/index-images/user_guide.svg
+        :text-align: center
 
         User guide
-        ^^^^^^^^^^
+        ^^^
 
         The user guide provides in-depth information on the
         key concepts of NumPy with useful background information and explanation.
@@ -76,9 +79,10 @@ basic statistical operations, random simulation and much more.
 
     .. grid-item-card::
         :img-top: ../source/_static/index-images/api.svg
+        :text-align: center
 
         API reference
-        ^^^^^^^^^^^^^
+        ^^^
 
         The reference guide contains a detailed description of the functions,
         modules, and objects included in NumPy. The reference describes how the
@@ -96,9 +100,10 @@ basic statistical operations, random simulation and much more.
 
     .. grid-item-card::
         :img-top: ../source/_static/index-images/contributor.svg
+        :text-align: center
 
         Contributor's guide
-        ^^^^^^^^^^^^^^^^^^^
+        ^^^
 
         Want to add to the codebase? Can help add translation or a flowchart to the
         documentation? The contributing guidelines will guide you through the