From b398a75e79592bea2d734370c4be7855374aea84 Mon Sep 17 00:00:00 2001 From: stijnvanhoey Date: Tue, 21 Mar 2023 00:20:38 +0100 Subject: [PATCH 1/4] DOC use pydata-sphinx-theme css variables for card backgrounds #51860 --- doc/source/_static/css/getting_started.css | 37 +++++++++++++------ doc/source/_static/css/pandas.css | 2 +- doc/source/getting_started/index.rst | 1 + .../intro_tutorials/02_read_write.rst | 6 +-- .../intro_tutorials/03_subset_data.rst | 4 +- .../intro_tutorials/04_plotting.rst | 4 +- .../intro_tutorials/05_add_columns.rst | 4 +- .../06_calculate_statistics.rst | 4 +- .../07_reshape_table_layout.rst | 4 +- .../intro_tutorials/08_combine_dataframes.rst | 4 +- .../intro_tutorials/09_timeseries.rst | 4 +- .../intro_tutorials/10_text_data.rst | 4 +- 12 files changed, 47 insertions(+), 31 deletions(-) diff --git a/doc/source/_static/css/getting_started.css b/doc/source/_static/css/getting_started.css index 2eb69beb05cb5..5c5a3f86c8e89 100644 --- a/doc/source/_static/css/getting_started.css +++ b/doc/source/_static/css/getting_started.css @@ -10,6 +10,14 @@ font-size: 0.9rem; } +.gs-data-header { + background-color: var(--pst-color-on-surface); +} + +.gs-data-list { + background-color: var(--pst-color-on-background); +} + .gs-data-title .badge { margin: 10px; padding: 5px; @@ -57,23 +65,26 @@ margin-top: -5px; } .gs-callout-remember { - border-left-color: #f0ad4e; + border-left-color: var(--pst-color-secondary); align-items: center; font-size: 1.2rem; } .gs-callout-remember h4 { - color: #f0ad4e; + color: var(--pst-color-secondary); } /* reference to user guide */ .gs-torefguide { align-items: center; font-size: 0.9rem; + background-color: var(--pst-color-on-background); + border-radius: .25rem; + padding: 2px; } .gs-torefguide .badge { - background-color: #130654; - margin: 10px 10px 10px 0px; + background-color: var(--pst-color-primary); + margin: 10px 10px 10px 10px; padding: 5px; } @@ -113,14 +124,14 @@ ul.task-bullet > li:before { margin-left:-2em; background-position:center; background-repeat:no-repeat; - background-color: #130654; + background-color: var(--pst-color-primary); border-radius: 50%; background-size:100%; background-image:url('../question_mark_noback.svg'); } ul.task-bullet > li { - border-left: 1px solid #130654; + border-left: 1px solid var(--pst-color-primary); padding-left:1em; } @@ -132,7 +143,7 @@ ul.task-bullet > li > p:first-child { /* Getting started index page */ .comparison-card { - background:#FFF; + background-color: var(--pst-color-background); border-radius:0; padding: 30px 10px 10px 10px; margin: 10px 0px; @@ -146,6 +157,7 @@ ul.task-bullet > li > p:first-child { margin: 10px; margin-bottom: 20px; height: 72px; + background: none !important; } .comparison-card-excel .card-img-top, .comparison-card-stata .card-img-top, .comparison-card-sas .card-img-top { @@ -154,7 +166,7 @@ ul.task-bullet > li > p:first-child { .comparison-card .card-footer { border: none; - background-color: transparent; + background-color: var(--pst-color-background); } .install-block { @@ -236,15 +248,16 @@ ul.task-bullet > li > p:first-child { .tutorial-card .card-header { cursor: pointer; - background-color: transparent; + background-color: var(--pst-color-surface); + border: 1px solid var(--pst-color-border) } .tutorial-card .card-body { - background-color: transparent; + background-color: var(--pst-color-on-background); } .tutorial-card .badge { - background-color: #130654; + background-color: var(--pst-color-primary); margin: 10px 10px 10px 10px; padding: 5px; } @@ -253,6 +266,7 @@ ul.task-bullet > li > p:first-child { margin: 0px; } +/* .tutorial-card .gs-badge-link a { color: white; text-decoration: none; @@ -261,3 +275,4 @@ ul.task-bullet > li > p:first-child { .tutorial-card .badge:hover { background-color: grey; } +*/ diff --git a/doc/source/_static/css/pandas.css b/doc/source/_static/css/pandas.css index a08be3301edda..063727ed8c1dc 100644 --- a/doc/source/_static/css/pandas.css +++ b/doc/source/_static/css/pandas.css @@ -48,5 +48,5 @@ table { } .card, .card img { - background-color: transparent !important; + background-color: var(--pst-color-background); } diff --git a/doc/source/getting_started/index.rst b/doc/source/getting_started/index.rst index 4792d26d021d6..3bfd2c3b0219a 100644 --- a/doc/source/getting_started/index.rst +++ b/doc/source/getting_started/index.rst @@ -537,6 +537,7 @@ Are you familiar with other software for manipulating tablular data? Learn the pandas-equivalent operations compared to software you already know: .. panels:: + :img-top-cls: dark-light :card: + comparison-card text-center shadow :column: col-lg-6 col-md-6 col-sm-6 col-xs-12 d-flex diff --git a/doc/source/getting_started/intro_tutorials/02_read_write.rst b/doc/source/getting_started/intro_tutorials/02_read_write.rst index d69a48def0287..dbb1be8c4d875 100644 --- a/doc/source/getting_started/intro_tutorials/02_read_write.rst +++ b/doc/source/getting_started/intro_tutorials/02_read_write.rst @@ -9,13 +9,13 @@ .. raw:: html
-
+
Data used for this tutorial:
    -
  • +
  • .. include:: includes/titanic.rst @@ -198,7 +198,7 @@ The method :meth:`~DataFrame.info` provides technical information about a .. raw:: html -
    +
    To user guide For a complete overview of the input and output possibilities from and to pandas, see the user guide section about :ref:`reader and writer functions `. diff --git a/doc/source/getting_started/intro_tutorials/03_subset_data.rst b/doc/source/getting_started/intro_tutorials/03_subset_data.rst index 291cbddff58eb..483e122ec4d42 100644 --- a/doc/source/getting_started/intro_tutorials/03_subset_data.rst +++ b/doc/source/getting_started/intro_tutorials/03_subset_data.rst @@ -9,13 +9,13 @@ .. raw:: html
    -
    +
    Data used for this tutorial:
      -
    • +
    • .. include:: includes/titanic.rst diff --git a/doc/source/getting_started/intro_tutorials/04_plotting.rst b/doc/source/getting_started/intro_tutorials/04_plotting.rst index b6f1ac212f821..ddc8a37911c98 100644 --- a/doc/source/getting_started/intro_tutorials/04_plotting.rst +++ b/doc/source/getting_started/intro_tutorials/04_plotting.rst @@ -16,13 +16,13 @@ How do I create plots in pandas? .. raw:: html
      -
      +
      Data used for this tutorial:
        -
      • +
      • .. include:: includes/air_quality_no2.rst diff --git a/doc/source/getting_started/intro_tutorials/05_add_columns.rst b/doc/source/getting_started/intro_tutorials/05_add_columns.rst index 293e3fd38f578..d59a70cc2818e 100644 --- a/doc/source/getting_started/intro_tutorials/05_add_columns.rst +++ b/doc/source/getting_started/intro_tutorials/05_add_columns.rst @@ -9,13 +9,13 @@ .. raw:: html
        -
        +
        Data used for this tutorial:
          -
        • +
        • .. include:: includes/air_quality_no2.rst diff --git a/doc/source/getting_started/intro_tutorials/06_calculate_statistics.rst b/doc/source/getting_started/intro_tutorials/06_calculate_statistics.rst index 032a6add522e0..fe3ae820e7085 100644 --- a/doc/source/getting_started/intro_tutorials/06_calculate_statistics.rst +++ b/doc/source/getting_started/intro_tutorials/06_calculate_statistics.rst @@ -9,13 +9,13 @@ .. raw:: html
          -
          +
          Data used for this tutorial:
            -
          • +
          • .. include:: includes/titanic.rst diff --git a/doc/source/getting_started/intro_tutorials/07_reshape_table_layout.rst b/doc/source/getting_started/intro_tutorials/07_reshape_table_layout.rst index 14b33022376ec..3bed251258d15 100644 --- a/doc/source/getting_started/intro_tutorials/07_reshape_table_layout.rst +++ b/doc/source/getting_started/intro_tutorials/07_reshape_table_layout.rst @@ -9,13 +9,13 @@ .. raw:: html
            -
            +
            Data used for this tutorial:
              -
            • +
            • .. include:: includes/titanic.rst diff --git a/doc/source/getting_started/intro_tutorials/08_combine_dataframes.rst b/doc/source/getting_started/intro_tutorials/08_combine_dataframes.rst index 23d7627df73dd..a452cdaa55513 100644 --- a/doc/source/getting_started/intro_tutorials/08_combine_dataframes.rst +++ b/doc/source/getting_started/intro_tutorials/08_combine_dataframes.rst @@ -9,13 +9,13 @@ .. raw:: html
              -
              +
              Data used for this tutorial:
                -
              • +
              • diff --git a/doc/source/getting_started/intro_tutorials/09_timeseries.rst b/doc/source/getting_started/intro_tutorials/09_timeseries.rst index 373470913c293..76dd836098f58 100644 --- a/doc/source/getting_started/intro_tutorials/09_timeseries.rst +++ b/doc/source/getting_started/intro_tutorials/09_timeseries.rst @@ -10,13 +10,13 @@ .. raw:: html
                -
                +
                Data used for this tutorial:
                  -
                • +
                • diff --git a/doc/source/getting_started/intro_tutorials/10_text_data.rst b/doc/source/getting_started/intro_tutorials/10_text_data.rst index 49c281bdb8e60..5b1885791d8fb 100644 --- a/doc/source/getting_started/intro_tutorials/10_text_data.rst +++ b/doc/source/getting_started/intro_tutorials/10_text_data.rst @@ -9,13 +9,13 @@ .. raw:: html
                  -
                  +
                  Data used for this tutorial:
                    -
                  • +
                  • .. include:: includes/titanic.rst .. ipython:: python From 4ab6c7d99a262307a3871aa20b8be6fce7de75c0 Mon Sep 17 00:00:00 2001 From: stijnvanhoey Date: Tue, 21 Mar 2023 00:58:41 +0100 Subject: [PATCH 2/4] Update missing card item background --- .../getting_started/intro_tutorials/07_reshape_table_layout.rst | 2 +- .../getting_started/intro_tutorials/08_combine_dataframes.rst | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/doc/source/getting_started/intro_tutorials/07_reshape_table_layout.rst b/doc/source/getting_started/intro_tutorials/07_reshape_table_layout.rst index 3bed251258d15..6c920c92e4d05 100644 --- a/doc/source/getting_started/intro_tutorials/07_reshape_table_layout.rst +++ b/doc/source/getting_started/intro_tutorials/07_reshape_table_layout.rst @@ -27,7 +27,7 @@ .. raw:: html
                    • -
                  • +
                  • diff --git a/doc/source/getting_started/intro_tutorials/08_combine_dataframes.rst b/doc/source/getting_started/intro_tutorials/08_combine_dataframes.rst index a452cdaa55513..f369feb3e03a5 100644 --- a/doc/source/getting_started/intro_tutorials/08_combine_dataframes.rst +++ b/doc/source/getting_started/intro_tutorials/08_combine_dataframes.rst @@ -49,7 +49,7 @@ Westminster* in respectively Paris, Antwerp and London. .. raw:: html
                    • -
                  • +
                  • From e173d2efb7c6ae44345cf537005e02758172298f Mon Sep 17 00:00:00 2001 From: stijnvanhoey Date: Tue, 21 Mar 2023 01:18:32 +0100 Subject: [PATCH 3/4] DOC: remove box shadow to use regular links in getting started --- doc/source/_static/css/getting_started.css | 20 ++------------------ 1 file changed, 2 insertions(+), 18 deletions(-) diff --git a/doc/source/_static/css/getting_started.css b/doc/source/_static/css/getting_started.css index 5c5a3f86c8e89..e4c5964259349 100644 --- a/doc/source/_static/css/getting_started.css +++ b/doc/source/_static/css/getting_started.css @@ -88,25 +88,10 @@ padding: 5px; } -.gs-torefguide a { - margin-left: 5px; - color: #130654; - border-bottom: 1px solid #FFCA00f3; - box-shadow: 0px -10px 0px #FFCA00f3 inset; -} - .gs-torefguide p { margin-top: 1rem; } -.gs-torefguide a:hover { - margin-left: 5px; - color: grey; - text-decoration: none; - border-bottom: 1px solid #b2ff80f3; - box-shadow: 0px -10px 0px #b2ff80f3 inset; -} - /* question-task environment */ ul.task-bullet, ol.custom-bullet{ @@ -266,13 +251,12 @@ ul.task-bullet > li > p:first-child { margin: 0px; } -/* + .tutorial-card .gs-badge-link a { - color: white; + color: var(--pst-color-text-base); text-decoration: none; } .tutorial-card .badge:hover { background-color: grey; } -*/ From 9593aa35de40457e096bdd2e12ff22a5193d4082 Mon Sep 17 00:00:00 2001 From: stijnvanhoey Date: Mon, 27 Mar 2023 14:11:55 +0200 Subject: [PATCH 4/4] DOC: fix img background in black theme on frontpage docs --- doc/source/_static/css/pandas.css | 1 + 1 file changed, 1 insertion(+) diff --git a/doc/source/_static/css/pandas.css b/doc/source/_static/css/pandas.css index 063727ed8c1dc..c32a9c8f40ff5 100644 --- a/doc/source/_static/css/pandas.css +++ b/doc/source/_static/css/pandas.css @@ -25,6 +25,7 @@ table { .intro-card .card-img-top { margin: 10px; height: 52px; + background: none !important; } .intro-card .card-header {