Sphinx Design Components#
On this page, you will find user interface components such as badges, buttons, cards, and tabs.
The components on this page are not provided by PyData Theme. They are provided by Sphinx Design (a Sphinx extension). This means that if you wish to use the components on this page, you must install Sphinx Design separately and add it to your conf.py.
See also
To add the Sphinx Design extension to your Sphinx project, refer to Sphinx Design - Getting Started.
Contributors to both projects have worked to ensure compatible styling so that Sphinx Design components look and feel consistent with the PyData Theme.
This page shows you how the Sphinx Design components would look on your site if you were to use them in combination with the PyData Theme. Sphinx Design also provides a PyData-themed version of the Sphinx Design site; however, their site use an older version of this theme.
Any customizations you make to the theme could affect how these components appear on your site. So what you see on this page might not match exactly what you see on your site even if your site uses this theme.
Cards#
Only body.
But with multiple text paragraphs.
Content of the third card.
Sample badge
Click to expand dropdown
Hidden content
Don’t forget to add the alternative text with link-alt
!
panel 1 header
panel 1 content more content
panel 2 header
panel 2 content
Tabs#
int main(const int argc, const char **argv) {
return 0;
}
def main():
return
class Main {
public static void main(String[] args) {
}
}
function main()
end
PROGRAM main
END PROGRAM main
Dropdowns#
Dropdowns look similar to admonitions, but they are clickable interactive elements that can be used to hide content. See the Sphinx Design Dropdown documentation for more information.
An admonition for reference.
And some admonition content.
And with no title and some content!
With a title
And some content!
With a title and icon
And some content and an icon!
A primary color dropdown
And some content!
A secondary color dropdown
And some content!