diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-15 17:56:50 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-15 17:56:50 +0000 |
commit | 6637322c8ab1c5ff80a2b6ca59c9ba1d40aeba2c (patch) | |
tree | 04e41667e9eae835f5d88bda4f6d3f5c2664de01 /src/sass/_theme_rst.sass | |
parent | Initial commit. (diff) | |
download | sphinx-rtd-theme-6637322c8ab1c5ff80a2b6ca59c9ba1d40aeba2c.tar.xz sphinx-rtd-theme-6637322c8ab1c5ff80a2b6ca59c9ba1d40aeba2c.zip |
Adding upstream version 2.0.0+dfsg.upstream/2.0.0+dfsgupstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to '')
-rw-r--r-- | src/sass/_theme_rst.sass | 617 |
1 files changed, 617 insertions, 0 deletions
diff --git a/src/sass/_theme_rst.sass b/src/sass/_theme_rst.sass new file mode 100644 index 0000000..e8cebf3 --- /dev/null +++ b/src/sass/_theme_rst.sass @@ -0,0 +1,617 @@ +// ------------------------------------------------------------------------------------------------------------------- +// CONTRIBUTORS, PLEASE READ THIS! +// ------------------------------------------------------------------------------------------------------------------- +// Couple things... +// 1. Lots of this @extends from wyrm_core/_type.sass (http://www.github.com/snide/wyrm/. +// * Try not to replace any @extends code. It's pretty generic stuff meant to work together. +// * That said, know that I'm very unlikely to accept PRs from wyrm just to change style here. +// 2. I plan to remove the !importants in here. Part of it is due to laziness, part to sphinx's fondness for nesting. +// 3. Try to use variables from wyrm_core/wy_variables.sass. Notable are... +// * $base-line-height // All margins, padding and line-height should use this in .25 increments. +// * $text-color, $text-light, $text-dark...etc +// * $base-font-family, $custom-font-family, $code-font-family +// 4. If you have changes for mobile/tablet, put them at the bottom of the sass file. +// -------------------------------------------------------------------------------------------------------------------- + +.rst-content + // Some browsers like to give arbitrary margins :( make them all consistent. + h1, h2, h3, h4, h5, h6 + margin-bottom: $base-line-height + + // Sphinx by default applies HxW style attributes to images. This fixes that oversite. + img + max-width: 100% + height: auto + + div.figure, figure + margin-bottom: $base-line-height + .caption-text + font-style: italic + p:last-child.caption + margin-bottom: 0px + &.align-center + text-align: center + + // Usually it's a good idea to give images some space. + .section >, section > + img, a > img + margin-bottom: $base-line-height + + // normalize browser styling + abbr[title] + text-decoration: none + + // Style external links + &.style-external-links a.reference.external:after + font-family: FontAwesome + content: "\f08e" + color: $text-light + vertical-align: super + font-size: 60% + margin: 0 0.2em + + // For the most part, its safe to assume that sphinx wants you to use a blockquote as an indent. It gets + // used in many different ways, so don't assume you can apply some fancy style, just leave it be. + blockquote + margin-left: $base-line-height + line-height: $base-line-height + margin-bottom: $base-line-height + + pre.literal-block + white-space: pre + margin: 0 + padding: ($base-line-height / 2) ($base-line-height / 2) + font-family: $code-font-family + display: block + overflow: auto + pre.literal-block, div[class^='highlight'] + border: 1px solid $table-border-color + overflow-x: auto + // 1px hack otherwise border won't show. lame + margin: 1px 0 $base-line-height 0 + div[class^='highlight'] + padding: 0px + border: none + margin: 0 + // Needs 100% width for line highlighting to work properly + div[class^='highlight'] td.code + width: 100% + .linenodiv pre + border-right: solid 1px lighten($table-border-color, 2%) + margin: 0 + padding: ($base-line-height / 2) ($base-line-height / 2) + font-family: $code-font-family + user-select: none + pointer-events: none + div[class^='highlight'] pre + white-space: pre + margin: 0 + padding: ($base-line-height / 2) ($base-line-height / 2) + display: block + overflow: auto + & .hll + // Line emphasis spans full width + display: block + margin: 0 (-1 * $base-line-height / 2) + padding: 0 ($base-line-height / 2) + pre.literal-block, div[class^='highlight'] pre, .linenodiv pre + font-family: $code-font-family + font-size: 12px + line-height: 1.4 + + // Do not allow selection of code block prompts and line numbers + div.highlight + span.linenos, .gp + user-select: none + pointer-events: none + + span.linenos + display: inline-block + padding-left: 0px + padding-right: ($base-line-height / 2) + margin-right: ($base-line-height / 2) + border-right: 1px solid lighten($table-border-color, 2%) + + .code-block-caption + font-style: italic + font-size: 85% + line-height: 1 + padding: 1em 0 + text-align: center + + @media print + .codeblock, div[class^='highlight'], div[class^='highlight'] pre + white-space: pre-wrap + + // These are the various note pullouts that sphinx applies + .note, .attention, .caution, .danger, .error, .hint, .important, .tip, .warning, .seealso, .admonition-todo, .admonition + @extend .wy-alert + // These block elements are unsuitable for having floating objects next + // to them + clear: both + .last, > *:last-child + margin-bottom: 0 + .admonition-title + @extend .wy-alert-title + @extend .fa + @extend .fa-exclamation-circle + &:before + margin-right: 4px + .note, .seealso + @extend .wy-alert.wy-alert-info + .hint, .tip, .important + @extend .wy-alert.wy-alert-success + .error, .danger + @extend .wy-alert.wy-alert-danger + .warning, .caution, .attention, .admonition-todo + @extend .wy-alert.wy-alert-warning + // Some people put tables in notes. Let's give them very basic support. + .admonition table + border-color: rgba(0, 0, 0, 0.1) + td, th + background: transparent !important + border-color: rgba(0, 0, 0, 0.1) !important + + .section, section, .toctree-wrapper + ul + @extend .wy-plain-list-disc + ol.loweralpha, ol.loweralpha > li + list-style: lower-alpha + ol.upperalpha, ol.upperalpha > li + list-style: upper-alpha + ol, ol.arabic + @extend .wy-plain-list-decimal + // Complex bullet lists, they have more item margins than simple lists + ol li, ul li + > * + margin-top: $base-line-height / 2 + margin-bottom: $base-line-height / 2 + &:first-child + margin-top: 0rem + > p + &, &:last-child + margin-bottom: $base-line-height / 2 + &:only-child, &:only-child:last-child + margin-bottom: 0rem + > ul, > ol + margin-bottom: $base-line-height / 2 + // Simple lists, no item margins + ol.simple li, ul.simple li + > * + margin-top: 0rem + margin-bottom: 0rem + ul, ol + margin-top: 0rem + margin-bottom: 0rem + + .line-block + margin-left: 0px + margin-bottom: $base-line-height + line-height: $base-line-height + .line-block .line-block + margin-left: $base-line-height + margin-bottom: 0px + + // Generics handling of headings and toc stuff. + .topic-title + font-weight: bold + margin-bottom: $base-line-height / 2 + .toc-backref + color: $text-color + .align-right + float: right + margin: 0px 0px $base-line-height $base-line-height + .align-left + float: left + margin: 0px $base-line-height $base-line-height 0px + .align-center + margin: auto + // Do not override display:table for tables + &:not(table) + display: block + .toctree-wrapper > p.caption + @extend h2 + + // This is the #href that shows up on hover. Sphinx's is terrible so I hack it away. + h1, h2, h3, h4, h5, h6, dl dt, p, p.caption, table > caption, .code-block-caption, .eqno + .headerlink + opacity: 0 + font-size: 14px + font-family: FontAwesome + margin-left: 0.5em + @extend .fa + &:focus + opacity: 1 + &:hover .headerlink + opacity: 1 + + // Make links inside paragraphs wrap when they are too long + p a + overflow-wrap: anywhere + // Consistent font sizing for table typography + .wy-table + th, td + p, ul + font-size: inherit + + // override the Wyrm accessibility anti-pattern of hiding button focus + .btn:focus + outline: 2px solid + + table > caption .headerlink:after + font-size: 12px + + .centered + text-align: center + + // Sidebar content. You'll see at the bottom of this file I change it in mobile. + .sidebar + float: right + width: 40% + display: block + margin: 0 0 $base-line-height $base-line-height + padding: $base-line-height + background: $sidebar-background-color + border: solid 1px $sidebar-border-color + // Sidebar content is usually less relevant, so adjust the margins and sizes. + p, ul, dl + font-size: 90% + .last, > *:last-child + margin-bottom: 0 + .sidebar-title + display: block + font-family: $custom-font-family + font-weight: bold + background: $table-border-color + padding: ($base-line-height / 4) ($base-line-height / 2) + margin: -$base-line-height + margin-bottom: $base-line-height + font-size: 100% + // Sphinx can highlight searched text with ?highlighted=searchterm + .highlighted + background: $highlight-color + box-shadow: 0 0 0 ($base-line-height / 12) $highlight-color + display: inline + font-weight: bold + + // These are the little citation links [1] that show up within paragraphs. + .footnote-reference, .citation-reference + vertical-align: baseline + position: relative + top: -0.4em + line-height: 0 + font-size: 90% + > span.fn-bracket + display: none + + // Horizontal lists have multiple columns; use full width + .hlist + width: 100% + + // Definition lists term/classifier separator + // Adds a separator for Sphinx > 1.x as a pseudo-element + // and hides the hardcoded separator from Sphinx 1.x + dl dt span.classifier + &:before + content: " : " + dl dt span.classifier-delimiter + display: none !important + + // The html4 writer outputs the citation and footnotes as a table, and the + // html5 writer outputs these as a definition list (docutils < 0.18) or an + // aside/div (docutils 0.18+). We will use the fairly well supported css + // `grid` attributes to make these back into a table + // HTML4 writer + html.writer-html4 & + table.docutils.citation, table.docutils.footnote + background: none + border: none + td, tr + border: none + background-color: transparent !important + white-space: normal + td.label + padding-left: 0 + padding-right: 0 + vertical-align: top + // HTML5 writer + html.writer-html5 & + // docutils < 0.18 grid layout. Some spacing is the dl/dt/dd margins + dl.footnote, dl.citation, dl.field-list + display: grid + grid-template-columns: auto minmax(80%, 95%) + > dt + display: inline-grid + grid-template-columns: max-content auto + // docutils => 0.18 grid layout + aside.footnote, aside.citation, div.citation + display: grid + // Two any width columns for label and backrefs, a noop column to expand + // to fill the width allocated to the first two columns, and then the + // content column for the paragraphs. + grid-template-columns: auto auto minmax(0.65rem, auto) minmax(40%, 95%) + & > span.label + grid-column-start: 1 + grid-column-end: 2 + & > span.backrefs + grid-column-start: 2 + grid-column-end: 3 + grid-row-start: 1 + grid-row-end: 3 + & > p + grid-column-start: 4 + grid-column-end: 5 + + // Shared backrefs styling for docutils versions + @mixin footnote-backrefs + text-align: left + font-style: italic + margin-left: .65rem + word-break: break-word + word-spacing: -0.1rem + max-width: 5rem + + > a + &:not(:first-child)::before + content: " " + word-break: keep-all + + // docutils < 0.18 html5 writer styling + dl.footnote, dl.citation, dl.field-list, + margin-bottom: $base-line-height + > dt + padding-left: 1rem + > dt, > dd + margin-bottom: 0rem + dl.footnote, dl.citation + font-size: .9rem + > dt + margin: 0rem 0.5rem 0.5rem 0rem + line-height: 1.2rem + word-break: break-all + font-weight: normal + > span.brackets + &:before + content: "[" + &:after + content: "]" + > span.fn-backref + @include footnote-backrefs + > dd + margin: 0rem 0rem 0.5rem 0rem + line-height: 1.2rem + p + font-size: 0.9rem + + // docutils => 0.18 html5 writer styling + aside.footnote, aside.citation, div.citation + padding-left: 1rem + padding-right: 1rem + font-size: 0.9rem + line-height: 1.2rem + p + font-size: 0.9rem + line-height: 1.2rem + margin-bottom: $base-line-height / 2 + span.backrefs + @include footnote-backrefs + span.label + line-height: 1.2rem + aside.footnote-list, aside.citation-list, div.citation-list + margin-bottom: $base-line-height + + dl.option-list + kbd + font-size: 0.9rem + // Both + html.writer-html4 & table.docutils.citation, table.docutils.footnote, + html.writer-html5 & dl.footnote, + html.writer-html5 & dl.citation, + html.writer-html5 & aside.footnote, + html.writer-html5 & aside.footnote-list aside.footnote, + html.writer-html5 & div.citation-list > div.citation + color: $text-medium + code + color: $gray + + // Remove the large vertical space between citations and footnotes + .wy-table-responsive.citation, .wy-table-responsive.footnote + margin-bottom: 0 + // Re-add vertical space to element directly following citation and footnotes, + // if the following element is of a different type + .wy-table-responsive.citation + :not(.citation), + .wy-table-responsive.footnote + :not(.footnote) + margin-top: $base-line-height + // Re-add vertical space after citation and footnotes if it is the last child of a parent + .wy-table-responsive.citation:last-child, .wy-table-responsive.footnote:last-child + margin-bottom: $base-line-height + table.docutils + @extend .wy-table + @extend .wy-table-bordered-all + th + border-color: $table-border-color + html.writer-html5 & + border: 1px solid $table-border-color + html.writer-html5 & + th > p, td > p + line-height: 1rem + margin-bottom: 0rem + font-size: 0.9rem + &:not(.field-list) + @extend .wy-table-striped + // Remove bottom margin for the last element (and it's last child) + td .last, td .last > *:last-child + margin-bottom: 0 + // This table is what gets spit out for auto-generated API stuff. I style it smaller bits of padding. + table.field-list + @extend .wy-table + border: none + td + border: none + p + line-height: inherit + td > strong + display: inline-block + .field-name + padding-right: 10px + text-align: left + white-space: nowrap + .field-body + text-align: left + + // These are the "literals" that get spit out when you mark stuff as ``code`` as your write. + tt, code + @extend code + color: $black + font-family: $code-font-family + padding: 2px 5px + big, em + font-size: 100% !important + line-height: normal + + &.literal + color: $text-code-color + white-space: normal + &.xref, a & + font-weight: bold + color: $text-codexref-color + // https://github.com/readthedocs/sphinx_rtd_theme/issues/1368 + overflow-wrap: normal + pre, kbd, samp + font-family: $code-font-family + // If the literal is inside an a tag, let's color it like a link + a tt, a code + color: $link-color + dl + margin-bottom: $base-line-height + dt + font-weight: bold + margin-bottom: $base-line-height / 2 + // Most of the content within these dls are one liners, so I halve the normal margins. + p, table, ul, ol + margin-bottom: $base-line-height / 2 + // rST seems to want dds to be treated as the browser would, indented. + dd + margin: 0 0 ($base-line-height / 2) $base-line-height + line-height: $base-line-height + > p:last-child, + > ol:last-child, + > ul:last-child, + > table:last-child + margin-bottom: 0 + html.writer-html4 & dl:not(.docutils), + html.writer-html5 & dl[class]:not(.option-list):not(.field-list):not(.footnote):not(.citation):not(.glossary):not(.simple) + margin-bottom: $base-line-height + > dt + display: table + margin: ($base-line-height / 4) 0 + font-size: 90% + line-height: normal + background: lighten($class-color, 50%) + color: $class-color + border-top: solid 3px lighten($class-color, 20%) + padding: $base-line-height / 4 + position: relative + &:before + color: lighten($class-color, 20%) + .headerlink + color: $text-color + font-size: 100% !important + // In the html4 writer, parameters is a table. In html5 writer, parameters + // is a nested dl.field-list + dl:not(.option-list):not(.field-list):not(.footnote):not(.citation):not(.glossary):not(.simple) > dt + margin-bottom: $base-line-height / 4 + border: none + border-left: solid 3px hsl(0, 0%, 80%) + background: hsl(0, 0%, 94%) + color: $method-color + .headerlink + color: $headerlink-color + font-size: 100% !important + > dt:first-child + margin-top: 0 + // Since dts get the callout style, we treat this less as callouts. + tt, code + &.descname, &.descclassname + background-color: transparent + border: none + padding: 0 + font-size: 100% !important + &.descname + font-weight: bold + // This is for more advanced parameter control + .optional + display: inline-block + padding: 0 4px + color: $black + font-weight: bold + .property + display: inline-block + padding-right: 8px + max-width: 100% + // This is keywords such as "const" + .k + font-style: italic + .sig-name, .descname, .descclassname + font-family: $code-font-family + color: $black + // Doc links to sourcecode + .viewcode-link, .viewcode-back + display: inline-block + color: $text-viewcode-color + font-size: 80% + padding-left: $base-line-height + .viewcode-back + display: block + float: right + p.rubric + margin-bottom: 12px + font-weight: bold + //Download link + code.download + background: inherit + padding: inherit + font-weight: normal + font-family: inherit + font-size: inherit + color: inherit + border: inherit + white-space: inherit + span:first-child + -webkit-font-smoothing: subpixel-antialiased + @extend .fa + @extend .fa-download + &:before + margin-right: 4px + .guilabel, + .menuselection + font-size: 80% + font-weight: 700 + border-radius: $base-line-height / 6 + padding: ($base-line-height / 10) ($base-line-height / 4) + margin: auto ($base-line-height / 12) + .guilabel, + border: 1px solid lighten($guilabel-color, 25%) + background: lighten($guilabel-color, 50%) + .menuselection + border: 1px solid lighten($menuselection-color, 25%) + background: lighten($menuselection-color, 50%) + *:not(dl.option-list) > :not(dt):not(kbd):not(.kbd) > kbd, + *:not(dl.option-list) > :not(dt):not(kbd):not(.kbd) > .kbd + color: inherit + font-size: 80% + background-color: lighten($text-light, 30%) + border: 1px solid darken($text-light, 5%) + border-radius: $base-line-height / 6 + box-shadow: grey 0px $base-line-height / 12 + padding: $base-line-height / 10 $base-line-height / 4 + margin: auto 0 + .versionmodified + font-style: italic + + +// Mobile specific ++media($mobile) + .rst-content + .sidebar + width: 100% |