Skip to content

Commit

Permalink
Fix Furo styling for API pages with methods on class page
Browse files Browse the repository at this point in the history
  • Loading branch information
Eric-Arellano committed Jul 7, 2023
1 parent 2fe9646 commit 1b10dd3
Show file tree
Hide file tree
Showing 3 changed files with 15 additions and 9 deletions.
24 changes: 15 additions & 9 deletions src/qiskit_sphinx_theme/assets/styles/_api.scss
Original file line number Diff line number Diff line change
Expand Up @@ -23,20 +23,26 @@ dl.py:not(.docutils) dt {
// This causes the definition-term and its border-top to only take up as much space as the
// content, plus padding and margins.
display: inline-block;
border-top: 2px solid var(--qiskit-color-purple);
border-top: 1px solid var(--qiskit-color-purple);
background-color: var(--color-background-secondary);
}

// Rules that impact the top-level entry for the code object, which e.g. has the `[source]` button.
// We normally want to use inline-block for definition terms so that the purple border we add on
// top does not stretch across the whole screen. But, these all have a
// `[source]` button that floats to the right. The spacing of that is non-trivial and was the
// source of issues in Pytorch, so we revert back to stretching across the whole screen.
//
// Note that `dl.attribute` is not included.
dl.py:not(.docutils).class > dt,
dl.py:not(.docutils).method > dt,
dl.py:not(.docutils).function > dt {
display: block;
}

// Rules that impact the top-level entry for the code object at the top of the file. These add
// spacing between the page header and the top entry.
section > dl.py:not(.docutils) {
> dt {
// We normally want to use inline-block for definition terms so that the purple border we add on
// top does not stretch across the whole screen. But, we make an exception here it will have a
// `[source]` button that floats to the right. The spacing of that is non-trivial and was the
// source of issues in Pytorch, so we stick with Furo's spacing.
display: block;
// Make the border less thick so its clear the top-level page header corresponds to this line.
border-top-width: 1px;
margin-bottom: 1rem;
}

Expand Down
Binary file modified tests/js/qiskit.test.js-snapshots/api-docs-class-page-1-linux.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit 1b10dd3

Please sign in to comment.