override.css
High-level description
This CSS file overrides default styles in the Furo Sphinx theme to customize the appearance of Streamlink’s documentation. It specifically targets elements like code blocks, citations, headings, and buttons to enhance readability and visual appeal.
The file also includes styles for elements specific to the “Getting Started” page, such as intro cards and custom buttons, and it adjusts the display of Jupyter Notebook elements for better integration within the documentation.
Code Structure
This CSS file is structured as a series of style rules. Each rule targets specific HTML elements or classes and applies styles to modify their appearance. There’s no complex interrelation between the rules, they primarily function independently to style different aspects of the documentation.
Symbols
dt:target, span.highlighted
Description
This rule styles the definition term (<dt>) of a definition list when it’s the target of a hyperlink and any element with the class “highlighted”. It gives them a light gray background color.
Internal Logic
The rule uses the :target pseudo-class to select the dt element that is currently being linked to. It also selects any element with the class highlighted. Both are styled with a light gray background.
code.docutils.literal.notranslate.xref, a code
Description
This rule styles inline code snippets within links (<a>) and cross-references (xref). It removes any background color, sets the font weight to bold, and inherits the text color from the parent element.
Internal Logic
The rule targets <code> elements with specific classes (docutils, literal, notranslate, xref) that are either direct children of <a> elements or standalone within an <a> element. It then applies the defined styles.
a > code
Description
This rule ensures that inline code snippets within links inherit the link’s text color.
Internal Logic
It targets <code> elements that are direct children of <a> elements and sets the color property to inherit.
code.docutils.literal.notranslate
Description
This rule styles standard inline code snippets. It applies a light gray background, reduces font size slightly, rounds the corners, sets text color to black, allows line breaks within the code, and adds padding.
Internal Logic
The rule targets <code> elements with specific classes (docutils, literal, notranslate) and applies the defined styles to create a visually distinct code block.
dl.citation > dt
Description
This rule styles the definition term in a citation list. It floats the term to the left, adds a right margin, and sets the font weight to bold.
Internal Logic
The rule targets dt elements that are direct children of dl elements with the class citation. It then applies the float, margin, and font weight styles.
dl.c .field-list dt, dl.cpp .field-list dt, dl.js .field-list dt, dl.py .field-list dt
Description
This rule normalizes the font size and removes text transformation for parameter lists in code blocks for various programming languages (C, C++, JavaScript, Python).
Internal Logic
The rule targets dt elements within nested dl and .field-list elements that are descendants of dl elements with specific language classes (c, cpp, js, py). It then sets the font size and removes any text transformation.
p.rubric
Description
This rule styles paragraphs with the class “rubric” (often used for examples and headings within classes). It sets the font size, removes text transformation, and sets a medium font weight.
Internal Logic
The rule targets <p> elements with the class rubric and applies the defined font size, text transformation, and font weight styles.
.intro-card
Description
This rule styles elements with the class “intro-card”, likely used on the “Getting Started” page. It sets a white background, removes border radius, adds padding, and sets top and bottom margins.
Internal Logic
The rule targets elements with the class intro-card and applies the background, border radius, padding, and margin styles.
.intro-card .card-text
Description
This rule styles elements with the class “card-text” that are descendants of elements with the class “intro-card”. It sets top and bottom margins.
Internal Logic
The rule targets elements with the class card-text that are nested within elements with the class intro-card and applies the margin styles.
.custom-button
Description
This rule styles elements with the class “custom-button”. It sets a light gray background, removes default border, sets text color to dark gray, centers text, removes underlines from links, styles it as an inline-block element, sets font size, rounds corners, sets maximum width, and adds padding.
Internal Logic
The rule targets elements with the class custom-button and applies the defined styles to create a custom button appearance.
.custom-button a
Description
This rule styles links within elements with the class “custom-button”. It sets the link color to dark gray and makes it a block-level element.
Internal Logic
The rule targets <a> elements that are descendants of elements with the class custom-button and applies the color and display styles.
.custom-button p
Description
This rule styles paragraphs within elements with the class “custom-button”. It removes top and bottom margins and sets the text color to dark gray.
Internal Logic
The rule targets <p> elements that are descendants of elements with the class custom-button and applies the margin and color styles.
.nbinput .prompt, .nboutput .prompt
Description
This rule hides the prompt elements within Jupyter Notebook input and output cells.
Internal Logic
The rule targets elements with the class prompt that are descendants of elements with the classes nbinput and nboutput and sets their display to none.
.nboutput .stderr
Description
This rule hides the standard error output within Jupyter Notebook output cells.
Internal Logic
The rule targets elements with the class stderr that are descendants of elements with the class nboutput and sets their display to none.
div.nblast.container
Description
This rule styles the container for the last cell in a Jupyter Notebook. It adds padding to the bottom, removes padding from the sides, and adds a bottom margin.
Internal Logic
The rule targets div elements with the classes nblast and container and applies the padding and margin styles.
div.nbinput.container, div.nboutput.container
Description
This rule styles the containers for input and output cells in a Jupyter Notebook. It uses flexbox for layout, aligns items to the start, sets margins, removes padding, and sets the width to 100%.
Internal Logic
The rule targets div elements with the class combinations nbinput and container, and nboutput and container. It then applies the flexbox properties, alignment, margins, padding, and width.