DOC: Proposal - make the doc landing page cards more similar to scipy/pandas (#21491)

* DOC: Add panel elements to index matching scipy/pandas.

* DOC: Update card styling in css to match scipy/pandas.

* DOC: Add release notes to nav bar.

* DOC: replace css in layout with html_css_files conf val.

* DOC: Fix page layout.

Co-authored-by: Stefan van der Walt <stefanv@berkeley.edu>

Co-authored-by: Stefan van der Walt <stefanv@berkeley.edu>

4 files changed, 47 insertions, 24 deletions

diff --git a/doc/source/_static/numpy.css b/doc/source/_static/numpy.css
index 09f6db3e2..fc296e8ab 100644
--- a/doc/source/_static/numpy.css
+++ b/doc/source/_static/numpy.css
@@ -32,13 +32,17 @@ h3 {
   letter-spacing: -.03em;
 }
 
+/* Main page overview cards */
+
 .intro-card {
-  padding: 20px 10px 20px 10px;
-  margin: 10px;
+  background: #fff;
+  border-radius: 0;
+  padding: 30px 10px 20px 10px;
+  margin: 10px 0px;
 }
 
 .intro-card p.card-text {
-  margin: 0;
+  margin: 0px;
 }
 
 .intro-card .card-img-top {
@@ -49,6 +53,21 @@ h3 {
 }
 
 .intro-card .card-header {
-  margin-top: 20px;
+  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;
+}
+
+.intro-card .card-footer {
+  border: none;
+  background-color: white;
+}
+
+.intro-card .card-footer p.card-text {
+  max-width: 220px;
+  margin-left: auto;
+  margin-right: auto;
 }
diff --git a/doc/source/_templates/layout.html b/doc/source/_templates/layout.html
deleted file mode 100644
index e2812fdd5..000000000
--- a/doc/source/_templates/layout.html
+++ /dev/null
@@ -1,10 +0,0 @@
-{% extends "!layout.html" %}
-
-{%- block extrahead %}
-{{ super() }}
-<link rel="stylesheet" href="{{ pathto('_static/numpy.css', 1) }}" type="text/css" />
-
-    <!-- PR #17220: This is added via javascript in versionwarning.js  -->
-    <!-- link rel="canonical" href="http://numpy.org/doc/stable/{{ pagename }}{{ file_suffix }}" / -->
-
-{% endblock %}
diff --git a/doc/source/conf.py b/doc/source/conf.py
index 1a201a3c5..5c056b201 100644
--- a/doc/source/conf.py
+++ b/doc/source/conf.py
@@ -196,6 +196,11 @@ html_theme_options = {
 html_title = "%s v%s Manual" % (project, version)
 html_static_path = ['_static']
 html_last_updated_fmt = '%b %d, %Y'
+html_css_files = ["numpy.css"]
+
+# Prevent sphinx-panels from loading bootstrap css, the pydata-sphinx-theme
+# already loads it
+panels_add_bootstrap_css = False
 
 html_use_modindex = True
 html_copy_source = False
diff --git a/doc/source/index.rst b/doc/source/index.rst
index a753a21f1..1576d0672 100644
--- a/doc/source/index.rst
+++ b/doc/source/index.rst
@@ -11,6 +11,7 @@ NumPy documentation
    User Guide <user/index>
    API reference <reference/index>
    Development <dev/index>
+   release
 
 
 **Version**: |version|
@@ -35,7 +36,7 @@ basic statistical operations, random simulation and much more.
 
 .. panels::
     :card: + intro-card text-center
-    :column: col-lg-6 col-md-6 col-sm-6 col-xs-12 p-2
+    :column: col-lg-6 col-md-6 col-sm-6 col-xs-12 d-flex
 
     ---
     :img-top: ../source/_static/index-images/getting_started.svg
@@ -46,10 +47,12 @@ basic statistical operations, random simulation and much more.
     New to NumPy? Check out the Absolute Beginner's Guide. It contains an
     introduction to NumPy's main concepts and links to additional tutorials.
 
+    +++
+
     .. link-button:: user/absolute_beginners
         :type: ref
-        :text: 
-        :classes: stretched-link
+        :text: To the absolute beginner's guide
+        :classes: btn-block btn-secondary stretched-link
     
     ---
     :img-top: ../source/_static/index-images/user_guide.svg
@@ -60,10 +63,12 @@ basic statistical operations, random simulation and much more.
     The user guide provides in-depth information on the
     key concepts of NumPy with useful background information and explanation.
 
+    +++
+
     .. link-button:: user
         :type: ref
-        :text: 
-        :classes: stretched-link
+        :text: To the user guide
+        :classes: btn-block btn-secondary stretched-link
 
     ---
     :img-top: ../source/_static/index-images/api.svg
@@ -76,25 +81,29 @@ basic statistical operations, random simulation and much more.
     methods work and which parameters can be used. It assumes that you have an
     understanding of the key concepts.
 
+    +++
+
     .. link-button:: reference
         :type: ref
-        :text: 
-        :classes: stretched-link 
+        :text: To the reference guide
+        :classes: btn-block btn-secondary stretched-link
 
     ---
     :img-top: ../source/_static/index-images/contributor.svg
 
     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
     process of improving NumPy.
 
+    +++
+
     .. link-button:: devindex
         :type: ref
-        :text: 
-        :classes: stretched-link
+        :text: To the contributor's guide
+        :classes: btn-block btn-secondary stretched-link
 
 .. This is not really the index page, that is found in
    _templates/indexcontent.html The toctree content here will be added to the