linux/Documentation/sphinx-static/theme_overrides.css
Mauro Carvalho Chehab a6fb8b5acf docs: add support for RTD dark mode
This is actually an overlay on the top of the RTD theme, which
requires to include first the RTD theme.

It should be noticed that, when the dark theme is used, the
DOCS_CSS files won't be the last CSS themes. So, it won't
override the dark.css style by default. So, it is needed
to force the them override with "!important".

This small script, for instance, produces a nice output with
the RTD dark theme:

	DOCS_THEME=sphinx_rtd_dark_mode
	cat << EOF > dark_override.css
	  html body {
	    font-family: arial,helvetica,sans-serif;
	  }
	  html[data-theme='dark'] body {
	    color: white !important;
	  }
	  html[data-theme='dark'] .sig-name {
	    color: green !important;
	  }
	  html[data-theme='dark'] .wy-menu-vertical a {
	    color: #ffcc00 !important;
	  }
	  html[data-theme="dark"] h1, html[data-theme="dark"] h2, html[data-theme="dark"] h3 {
	    color: #ffcc00 !important;
	  }
	  html[data-theme="dark"] h4, html[data-theme="dark"] h5, html[data-theme="dark"] h6 {
	    color: #ffcc00 !important;
	  }
	  html[data-theme="dark"] h7, html[data-theme="dark"] h8, html[data-theme="dark"] h9 {
	    color: #ffcc00 !important;
	  }
	  html[data-theme="dark"] .wy-nav-content a, html[data-theme="dark"] .wy-nav-content a:visited {
	    color: #ffcc00 !important;
	  }
	EOF

	make DOCS_CSS=dark_override.css DOCS_THEME=sphinx_rtd_dark_mode htmldocs

Signed-off-by: Mauro Carvalho Chehab <mchehab+huawei@kernel.org>
Link: https://lore.kernel.org/r/90d316e055ef7f4c9021b9eada8f8d3b2e750a66.1638870323.git.mchehab+huawei@kernel.org
Signed-off-by: Jonathan Corbet <corbet@lwn.net>
2021-12-10 14:05:55 -07:00

126 lines
2.9 KiB
CSS

/* -*- coding: utf-8; mode: css -*-
*
* Sphinx HTML theme customization: read the doc
* Please don't add any color definition here, as the theme should
* work for both normal and dark modes.
*/
/* Improve contrast and increase size for easier reading. */
body {
font-family: serif;
font-size: 100%;
}
h1, h2, .rst-content .toctree-wrapper p.caption, h3, h4, h5, h6, legend {
font-family: sans-serif;
}
div[class^="highlight"] pre {
font-family: monospace;
font-size: 100%;
}
.wy-menu-vertical {
font-family: sans-serif;
}
.c {
font-style: normal;
}
p {
font-size: 100%;
}
/* Interim: Code-blocks with line nos - lines and line numbers don't line up.
* see: https://github.com/rtfd/sphinx_rtd_theme/issues/419
*/
div[class^="highlight"] pre {
line-height: normal;
}
.rst-content .highlight > pre {
line-height: normal;
}
/* Keep fields from being strangely far apart due to inheirited table CSS. */
.rst-content table.field-list th.field-name {
padding-top: 1px;
padding-bottom: 1px;
}
.rst-content table.field-list td.field-body {
padding-top: 1px;
padding-bottom: 1px;
}
@media screen {
/* content column
*
* RTD theme's default is 800px as max width for the content, but we have
* tables with tons of columns, which need the full width of the view-port.
*/
.wy-nav-content{max-width: none; }
/* table:
*
* - Sequences of whitespace should collapse into a single whitespace.
* - make the overflow auto (scrollbar if needed)
* - align caption "left" ("center" is unsuitable on vast tables)
*/
.wy-table-responsive table td { white-space: normal; }
.wy-table-responsive { overflow: auto; }
.rst-content table.docutils caption { text-align: left; font-size: 100%; }
/* captions:
*
* - captions should have 100% (not 85%) font size
* - hide the permalink symbol as long as link is not hovered
*/
.toc-title {
font-size: 150%;
font-weight: bold;
}
caption, .wy-table caption, .rst-content table.field-list caption {
font-size: 100%;
}
caption a.headerlink { opacity: 0; }
caption a.headerlink:hover { opacity: 1; }
/* Menu selection and keystrokes */
span.menuselection {
font-family: "Courier New", Courier, monospace
}
code.kbd, code.kbd span {
font-weight: bold;
font-family: "Courier New", Courier, monospace
}
/* fix bottom margin of lists items */
.rst-content .section ul li:last-child, .rst-content .section ul li p:last-child {
margin-bottom: 12px;
}
/* inline literal: drop the borderbox, padding and red color */
code, .rst-content tt, .rst-content code {
color: inherit;
border: none;
padding: unset;
background: inherit;
font-size: 85%;
}
.rst-content tt.literal,.rst-content tt.literal,.rst-content code.literal {
color: inherit;
}
}