Skip to content

DOC: Getting started tutorial headings and buttons are not readable #57912

Closed
@SilvestriStefano

Description

@SilvestriStefano

Pandas version checks

  • I have checked that the issue still exists on the latest versions of the docs on main here

Location of the documentation

https://pandas.pydata.org/docs/getting_started/index.html

Documentation problem

Hello,
I have found that the headings to the various Getting Started Tutorials are not readable in dark mode.
image
Also the text in the button is not readable in light mode
image

Suggested fix for documentation

I believe the issue with the heading is due to the fact that the CSS variable --bs-card-cap-color is not initialized
image

I suggest to fix it as follows

/* line 250 of the file pandas/doc/source/_static/css/getting_started.css */

.tutorial-card .card-header {
+ --bs-card-cap-color: var(--pst-color-text-base); 
  cursor: pointer;
  background-color: var(--pst-color-surface);
  border: 1px solid var(--pst-color-border)
}

It adjusts for either choice of theme
image
image

For the button instead I suggest the following change :

/* line 271 of the file pandas/doc/source/_static/css/getting_started.css */

.tutorial-card .gs-badge-link a {
- color: var(--pst-color-text-base); 
+ color: var(--pst-color-primary-text);
  text-decoration: none;
}

It adjust for either choice of theme
image
image

Metadata

Metadata

Assignees

No one assigned

    Labels

    DocsNeeds TriageIssue that has not been reviewed by a pandas team member

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions