7e253ff937
Add UI to select preferred search engine when Google Programmable Search is enabled. The user's preference is saved using local storage. This also makes the search input field of type "search" for better UX (in particular on mobile). Signed-off-by: Benjamin Cabé <benjamin@zephyrproject.org>
953 lines
23 KiB
CSS
953 lines
23 KiB
CSS
/**
|
||
* Copyright (c) 2019-2020, Juan Linietsky, Ariel Manzur and the Godot community
|
||
* Copyright (c) 2021, Teslabs Engineering S.L.
|
||
* SPDX-License-Identifier: CC-BY-3.0
|
||
*
|
||
* Various tweaks to the Read the Docs theme to better conform with Zephyr's
|
||
* visual identity. Many colors are also overridden to use CSS variables.
|
||
*/
|
||
|
||
body,
|
||
h1,
|
||
h2,
|
||
h3,
|
||
h4,
|
||
h5,
|
||
h6,
|
||
input[type="text"],
|
||
input[type="button"],
|
||
input[type="reset"],
|
||
input[type="submit"],
|
||
textarea,
|
||
legend,
|
||
.btn,
|
||
.rst-content .toctree-wrapper p.caption,
|
||
.rst-versions {
|
||
/* Use a system font stack for better performance (no Web fonts required) */
|
||
font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
||
}
|
||
|
||
h1,
|
||
h2,
|
||
h3,
|
||
h4,
|
||
h5,
|
||
h6,
|
||
legend,
|
||
.rst-content .toctree-wrapper p.caption {
|
||
/* Use a lighter font for headers (Medium instead of Bold) */
|
||
font-weight: 500;
|
||
}
|
||
|
||
.rst-content div.figure p.caption {
|
||
/* Tweak caption styling to be closer to typical captions */
|
||
text-align: center;
|
||
margin-top: 8px;
|
||
opacity: 0.75;
|
||
}
|
||
|
||
.rst-content div.figure.figure-w480 {
|
||
max-width: 480px;
|
||
}
|
||
|
||
p,
|
||
article ul,
|
||
article ol,
|
||
.wy-plain-list-disc,
|
||
.wy-plain-list-decimal,
|
||
.rst-content ol.arabic,
|
||
.rst-content .section ul,
|
||
.rst-content .toctree-wrapper ul,
|
||
.rst-content .section ol {
|
||
/* Increase the line height slightly to account for the different font */
|
||
line-height: 25px;
|
||
}
|
||
|
||
body,
|
||
.rst-content table.docutils thead {
|
||
color: var(--body-color);
|
||
}
|
||
|
||
a {
|
||
color: var(--link-color);
|
||
}
|
||
|
||
a:hover {
|
||
color: var(--link-color-hover);
|
||
text-decoration: underline;
|
||
}
|
||
|
||
a:active {
|
||
/* Add visual feedback when clicking on a link */
|
||
color: var(--link-color-active);
|
||
}
|
||
|
||
a:visited {
|
||
color: var(--link-color-visited);
|
||
}
|
||
|
||
a.btn:hover {
|
||
text-decoration: none;
|
||
}
|
||
|
||
.sphinx-tabs .sphinx-menu a.item {
|
||
/* Original definition has `!important` */
|
||
color: var(--link-color) !important;
|
||
}
|
||
|
||
.rst-content .toc-backref {
|
||
color: var(--link-color);
|
||
}
|
||
|
||
/* Style external links differently to make them easier to distinguish from internal links. */
|
||
.reference.external {
|
||
background-position: center right;
|
||
background-repeat: no-repeat;
|
||
background-image: var(--external-reference-icon);
|
||
padding-right: 13px;
|
||
}
|
||
|
||
hr,
|
||
#search-results .search li:first-child,
|
||
#search-results .search li {
|
||
border-color: var(--hr-color);
|
||
}
|
||
|
||
/* JavaScript documentation directives */
|
||
.rst-content dl:not(.docutils) dt {
|
||
background-color: var(--admonition-note-background-color) !important;
|
||
border-color: var(--admonition-note-title-background-color) !important;
|
||
color: var(--admonition-note-color) !important;
|
||
}
|
||
.rst-content dl:not(.docutils) dl dt {
|
||
background-color: var(--admonition-attention-background-color) !important;
|
||
border-color: var(--admonition-attention-title-background-color) !important;
|
||
color: var(--admonition-attention-color) !important;
|
||
}
|
||
|
||
.rst-content dt.sig .k {
|
||
color: var(--highlight-keyword2-color) !important;
|
||
font-style: normal !important;
|
||
}
|
||
|
||
.rst-content dt.sig .kt {
|
||
color: var(--highlight-keyword-color) !important;
|
||
font-style: normal !important;
|
||
}
|
||
|
||
.rst-content dt.sig .sig-name .n {
|
||
color: var(--highlight-function-color) !important;
|
||
}
|
||
|
||
.rst-content dt.sig .k,
|
||
.rst-content dt.sig .kt,
|
||
.rst-content dt.sig .n {
|
||
font-weight: normal !important;
|
||
}
|
||
|
||
.rst-content dl:not(.docutils) dt a.headerlink {
|
||
color: var(--link-color) !important;
|
||
}
|
||
.rst-content dl:not(.docutils) dt a.headerlink:visited {
|
||
color: var(--link-color-visited) !important;
|
||
}
|
||
|
||
footer,
|
||
#search-results .context {
|
||
color: var(--footer-color);
|
||
}
|
||
|
||
/* Icon tweaks */
|
||
a.icon-home,
|
||
a.icon-home:visited {
|
||
color: var(--navbar-level-1-color);
|
||
}
|
||
|
||
/* Main sections */
|
||
|
||
.wy-nav-content-wrap {
|
||
background-color: var(--content-wrap-background-color);
|
||
}
|
||
|
||
.wy-nav-content {
|
||
background-color: var(--content-background-color);
|
||
}
|
||
|
||
.wy-body-for-nav {
|
||
background-color: var(--content-wrap-background-color);
|
||
}
|
||
|
||
@media only screen and (min-width: 769px) {
|
||
.wy-nav-content {
|
||
max-width: 915px;
|
||
}
|
||
}
|
||
|
||
/* Table display tweaks */
|
||
|
||
.rst-content table.docutils,
|
||
.wy-table-bordered-all td,
|
||
.rst-content table.docutils td,
|
||
.wy-table thead th,
|
||
.rst-content table.docutils thead th,
|
||
.rst-content table.field-list thead th {
|
||
border-color: var(--code-border-color);
|
||
}
|
||
|
||
.wy-table-odd td,
|
||
.wy-table-striped tr:nth-child(2n-1) td,
|
||
.rst-content table.docutils:not(.field-list) tr:nth-child(2n-1) td {
|
||
background-color: var(--table-row-odd-background-color);
|
||
}
|
||
|
||
/* Override table no-wrap */
|
||
/* The first column cells are not verbose, no need to wrap them */
|
||
.wy-table-responsive table td:not(:nth-child(1)),
|
||
.wy-table-responsive table th:not(:nth-child(1)) {
|
||
white-space: normal;
|
||
}
|
||
|
||
/* Allow to control wrapping behavior per table */
|
||
.wy-table-responsive table.wrap-normal td,
|
||
.wy-table-responsive table.wrap-normal th {
|
||
white-space: normal;
|
||
}
|
||
|
||
/* Make sure not to wrap keyboard shortcuts */
|
||
.wy-table-responsive table td kbd {
|
||
white-space: nowrap;
|
||
}
|
||
|
||
/* Force table content font-size in responsive tables to be 100%
|
||
* fixing larger font size for paragraphs in the kconfig tables */
|
||
.wy-table-responsive td p {
|
||
font-size: 100%;
|
||
}
|
||
|
||
/* Code display tweaks */
|
||
|
||
code,
|
||
.rst-content tt,
|
||
.rst-content code {
|
||
font-size: 14px;
|
||
background-color: var(--code-background-color);
|
||
border: 1px solid var(--code-border-color);
|
||
}
|
||
|
||
.rst-content tt.literal,
|
||
.rst-content code.literal {
|
||
color: var(--code-literal-color);
|
||
}
|
||
|
||
.rst-content div[class^="highlight"] {
|
||
border-color: none;
|
||
border: none;
|
||
}
|
||
|
||
.rst-content pre.literal-block,
|
||
.rst-content div[class^="highlight"] pre,
|
||
.rst-content .linenodiv pre {
|
||
/* Increase the font size and line height in code blocks */
|
||
font-size: 14px;
|
||
line-height: 1.5;
|
||
}
|
||
|
||
.rst-content pre.literal-block {
|
||
border: none;
|
||
border-radius: 0.25rem;
|
||
background-color: var(--code-background-color);
|
||
}
|
||
|
||
/* Code tab display tweaks */
|
||
|
||
.ui.tabular.menu .active.item,
|
||
.ui.segment,
|
||
.sphinx-tabs-panel {
|
||
background-color: var(--code-background-color) !important;
|
||
}
|
||
|
||
.sphinx-tabs-tab {
|
||
color: var(--link-color) !important;
|
||
}
|
||
|
||
.sphinx-tabs-tab[aria-selected="true"] {
|
||
background-color: var(--code-background-color) !important;
|
||
border-bottom: 1px solid var(--code-background-color) !important;
|
||
}
|
||
|
||
/* Code literals */
|
||
a.internal code.literal {
|
||
color: var(--link-color);
|
||
}
|
||
|
||
a.internal:visited code.literal {
|
||
color: var(--link-color-visited);
|
||
}
|
||
|
||
/* Syntax highlighting */
|
||
|
||
.tab div[class^='highlight']:last-child {
|
||
margin-bottom: 1em;
|
||
}
|
||
|
||
.rst-content tt.literal, .rst-content code.literal, .highlight {
|
||
border-radius: 0.25rem;
|
||
}
|
||
|
||
.highlight {
|
||
background-color: var(--highlight-background-color);
|
||
}
|
||
|
||
/* Emphasized lines */
|
||
.highlight .hll {
|
||
background-color: var(--highlight-background-emph-color);
|
||
}
|
||
|
||
.highlight .gh /* Generic.Heading */,
|
||
.highlight .gu /* Generic.Subheading */,
|
||
.highlight .go /* Generic.Output */,
|
||
.highlight .gt /* Generic.Traceback */ {
|
||
color: var(--highlight-default-color);
|
||
}
|
||
|
||
.highlight .c /* Comment */,
|
||
.highlight .c1 /* Comment.Single */,
|
||
.highlight .cm /* Comment.Multiline */,
|
||
.highlight .cs /* Comment.Special */ {
|
||
color: var(--highlight-comment-color);
|
||
}
|
||
|
||
.highlight .bp /* Name.Builtin.Pseudo */,
|
||
.highlight .k /* Keyword */,
|
||
.highlight .kc /* Keyword.Constant */,
|
||
.highlight .kd /* Keyword.Declaration */,
|
||
.highlight .kn /* Keyword.Namespace */,
|
||
.highlight .kp /* Keyword.Pseudo */,
|
||
.highlight .kr /* Keyword.Reserved */,
|
||
.highlight .kt /* Keyword.Type */,
|
||
.highlight .ow /* Operator.Word */ {
|
||
color: var(--highlight-keyword-color);
|
||
}
|
||
|
||
.highlight .ch /* Comment.Hashbang */,
|
||
.highlight .cp /* Comment.Preproc */ {
|
||
color: var(--highlight-keyword2-color);
|
||
}
|
||
|
||
.highlight .m /* Literal.Number */,
|
||
.highlight .mf /* Literal.Number.Float */,
|
||
.highlight .mi /* Literal.Number.Integer */,
|
||
.highlight .il /* Literal.Number.Integer.Long */,
|
||
.highlight .mb /* Literal.Number.Bin */,
|
||
.highlight .mh /* Literal.Number.Hex */,
|
||
.highlight .mo /* Literal.Number.Oct */ {
|
||
color: var(--highlight-number-color);
|
||
}
|
||
|
||
.highlight .na /* Name.Attribute */,
|
||
.highlight .nd /* Name.Decorator */,
|
||
.highlight .ni /* Name.Entity */,
|
||
.highlight .nl /* Name.Label */ {
|
||
color: var(--highlight-decorator-color);
|
||
}
|
||
|
||
.highlight .nb /* Name.Builtin */,
|
||
.highlight .ne /* Name.Exception */ {
|
||
color: var(--highlight-type-color);
|
||
}
|
||
|
||
.highlight .nc /* Name.Class */,
|
||
.highlight .nn /* Name.Namespace */,
|
||
.highlight .no /* Name.Constant */,
|
||
.highlight .nv /* Name.Variable */,
|
||
.highlight .vc /* Name.Variable.Class */,
|
||
.highlight .vg /* Name.Variable.Global */,
|
||
.highlight .vi /* Name.Variable.Instance */,
|
||
.highlight .vm /* Name.Variable.Magic */ {
|
||
color: var(--highlight-type2-color);
|
||
}
|
||
|
||
.highlight .nf /* Name.Function */,
|
||
.highlight .fm /* Name.Function.Magic */,
|
||
.highlight .nt /* Name.Tag */ {
|
||
color: var(--highlight-function-color);
|
||
}
|
||
|
||
.highlight .o /* Operator */,
|
||
.highlight .si /* Literal.String.Interpol */,
|
||
.highlight .sx /* Literal.String.Other */,
|
||
.highlight .sr /* Literal.String.Regex */,
|
||
.highlight .ss /* Literal.String.Symbol */ {
|
||
color: var(--highlight-operator-color);
|
||
}
|
||
|
||
.highlight .cpf/* Comment.PreprocFile */,
|
||
.highlight .s /* Literal.String */,
|
||
.highlight .s1 /* Literal.String.Single */,
|
||
.highlight .s2 /* Literal.String.Double */,
|
||
.highlight .sc /* Literal.String.Char */,
|
||
.highlight .se /* Literal.String.Escape */,
|
||
.highlight .sa /* Literal.String.Affix */,
|
||
.highlight .sb /* Literal.String.Backtick */,
|
||
.highlight .dl /* Literal.String.Delimiter */,
|
||
.highlight .sd /* Literal.String.Doc */,
|
||
.highlight .sh /* Literal.String.Heredoc */ {
|
||
color: var(--highlight-string-color);
|
||
}
|
||
|
||
/* Admonition tweaks */
|
||
|
||
.rst-content .admonition,
|
||
.rst-content .admonition.note,
|
||
.rst-content .admonition.seealso {
|
||
background-color: var(--admonition-note-background-color);
|
||
color: var(--admonition-note-color);
|
||
overflow: auto;
|
||
}
|
||
|
||
.rst-content .admonition .admonition-title,
|
||
.rst-content .admonition.note .admonition-title,
|
||
.rst-content .admonition.seealso .admonition-title {
|
||
background-color: var(--admonition-note-title-background-color);
|
||
color: var(--admonition-note-title-color);
|
||
}
|
||
|
||
.rst-content .admonition.attention,
|
||
.rst-content .admonition.caution,
|
||
.rst-content .admonition.warning {
|
||
background-color: var(--admonition-attention-background-color);
|
||
color: var(--admonition-attention-color);
|
||
overflow: auto;
|
||
}
|
||
|
||
.rst-content .admonition.attention .admonition-title,
|
||
.rst-content .admonition.caution .admonition-title,
|
||
.rst-content .admonition.warning .admonition-title {
|
||
background-color: var(--admonition-attention-title-background-color);
|
||
color: var(--admonition-attention-title-color);
|
||
}
|
||
|
||
.rst-content .admonition.danger {
|
||
background-color: var(--admonition-danger-background-color);
|
||
color: var(--admonition-danger-color);
|
||
overflow: auto;
|
||
}
|
||
|
||
.rst-content .admonition.danger .admonition-title {
|
||
background-color: var(--admonition-danger-title-background-color);
|
||
color: var(--admonition-danger-title-color);
|
||
}
|
||
|
||
.rst-content .admonition.tip,
|
||
.rst-content .admonition.important {
|
||
background-color: var(--admonition-tip-background-color);
|
||
color: var(--admonition-tip-color);
|
||
overflow: auto;
|
||
}
|
||
|
||
.rst-content .admonition.tip .admonition-title,
|
||
.rst-content .admonition.important .admonition-title {
|
||
background-color: var(--admonition-tip-title-background-color);
|
||
color: var(--admonition-tip-title-color);
|
||
}
|
||
|
||
/* Admonition tweaks - sphinx_togglebutton */
|
||
|
||
.rst-content .admonition.toggle {
|
||
overflow: visible;
|
||
}
|
||
|
||
.rst-content .admonition.toggle button {
|
||
display: inline-flex;
|
||
color: var(--admonition-note-title-color);
|
||
}
|
||
|
||
.rst-content .admonition.toggle .tb-icon {
|
||
height: 1em;
|
||
width: 1em;
|
||
}
|
||
|
||
/* Keyboard shortcuts tweaks */
|
||
kbd, .kbd,
|
||
.rst-content :not(dl.option-list) > :not(dt):not(kbd):not(.kbd) > kbd,
|
||
.rst-content :not(dl.option-list) > :not(dt):not(kbd):not(.kbd) > .kbd {
|
||
background-color: var(--kbd-background-color);
|
||
border: 1px solid var(--kbd-outline-color);
|
||
border-radius: 3px;
|
||
box-shadow: inset 0 -1px 0 var(--kbd-shadow-color);
|
||
color: var(--kbd-text-color);
|
||
display: inline-block;
|
||
font-size: 12px;
|
||
line-height: 11px;
|
||
padding: 4px 5px;
|
||
vertical-align: middle;
|
||
}
|
||
|
||
/* guilabel and menuselection tweaks */
|
||
.rst-content .guilabel,
|
||
.rst-content .menuselection {
|
||
color: var(--body-color);
|
||
background-color: var(--guiitems-background-color);
|
||
border-color: var(--guiitems-border-color);
|
||
}
|
||
|
||
/* Buttons */
|
||
|
||
.btn-neutral {
|
||
background-color: var(--btn-neutral-background-color) !important;
|
||
color: var(--body-color) !important;
|
||
}
|
||
|
||
.btn-neutral:hover {
|
||
background-color: var(--btn-neutral-hover-background-color) !important;
|
||
}
|
||
|
||
.btn-neutral:visited {
|
||
color: var(--body-color) !important;
|
||
}
|
||
|
||
/* Navigation bar logo and search */
|
||
|
||
.logo {
|
||
opacity: var(--logo-opacity);
|
||
}
|
||
|
||
.wy-side-nav-search > a img.logo {
|
||
/* Fixed size to prevent reflows and support hiDPI displays */
|
||
/* A 5 pixel margin is added on each side. The logo itself displays at 200×100 at 100% scaling. */
|
||
width: 210px;
|
||
height: 105px;
|
||
}
|
||
|
||
.wy-side-nav-search {
|
||
background-color: var(--navbar-background-color);
|
||
}
|
||
|
||
.wy-side-nav-search.fixed {
|
||
position: fixed;
|
||
}
|
||
|
||
@media only screen and (min-width: 769px) {
|
||
/* Simulate a drop shadow that only affects the bottom edge */
|
||
/* This is used to indicate the search bar is fixed */
|
||
.wy-side-nav-search.fixed-and-scrolled::after {
|
||
content: '';
|
||
position: absolute;
|
||
left: 0;
|
||
bottom: -8px;
|
||
width: 300px;
|
||
height: 8px;
|
||
pointer-events: none;
|
||
background: linear-gradient(hsla(0, 0%, 0%, 0.2), transparent);
|
||
}
|
||
}
|
||
|
||
.wy-side-nav-search > a:hover,
|
||
.wy-side-nav-search .wy-dropdown > a:hover {
|
||
background-color: var(--navbar-background-color-hover);
|
||
}
|
||
|
||
.wy-side-nav-search > a:active,
|
||
.wy-side-nav-search .wy-dropdown > a:active {
|
||
background-color: var(--navbar-background-color-active);
|
||
}
|
||
|
||
.wy-side-nav-search input[type=search] {
|
||
width: 100%;
|
||
border-radius: 50px;
|
||
padding: 6px 12px;
|
||
background-color: var(--input-background-color);
|
||
color: var(--body-color);
|
||
/* Avoid reflowing when toggling the focus state */
|
||
border: 2px solid transparent;
|
||
box-shadow: none;
|
||
/* Make visual feedback instant */
|
||
transition: none;
|
||
font-size: 14px;
|
||
}
|
||
|
||
.wy-side-nav-search input[type="search"]:focus {
|
||
border: 2px solid var(--input-focus-border-color);
|
||
}
|
||
|
||
.wy-side-nav-search input[type="search"]::placeholder {
|
||
color: var(--body-color);
|
||
opacity: 0.55;
|
||
}
|
||
|
||
/* Navigation bar */
|
||
|
||
.wy-nav-side {
|
||
background-color: var(--navbar-background-color);
|
||
}
|
||
|
||
.wy-menu-vertical header,
|
||
.wy-menu-vertical p.caption {
|
||
color: var(--navbar-heading-color);
|
||
|
||
/* Improves the appearance of uppercase text */
|
||
letter-spacing: 0.75px;
|
||
}
|
||
|
||
/* Mobile navigation */
|
||
|
||
.wy-nav-top,
|
||
.wy-nav-top a {
|
||
background-color: var(--navbar-background-color);
|
||
color: var(--navbar-level-1-color);
|
||
}
|
||
|
||
/* Version branch label below the logo */
|
||
.wy-side-nav-search > div.version {
|
||
color: var(--navbar-level-3-color);
|
||
opacity: 0.9;
|
||
}
|
||
|
||
/* First level of navigation items */
|
||
|
||
.wy-menu-vertical a {
|
||
color: var(--navbar-level-1-color);
|
||
}
|
||
|
||
.wy-menu-vertical a:hover {
|
||
background-color: var(--navbar-background-color-hover);
|
||
color: var(--navbar-level-1-color);
|
||
}
|
||
|
||
.wy-menu-vertical a:active {
|
||
background-color: var(--navbar-background-color-active);
|
||
}
|
||
|
||
.wy-menu-vertical li.toctree-l1.current > a {
|
||
border: none;
|
||
}
|
||
|
||
.wy-side-nav-search, .wy-menu-vertical a, .wy-menu-vertical a span.toctree-expand,
|
||
.wy-menu-vertical li.toctree-l2 a span.toctree-expand {
|
||
color: var(--navbar-level-3-color);
|
||
opacity: 0.9;
|
||
margin-right: 8px;
|
||
}
|
||
|
||
.wy-side-nav-search, .wy-menu-vertical a, .wy-menu-vertical a:hover span.toctree-expand,
|
||
.wy-menu-vertical li.toctree-l2 a:hover span.toctree-expand {
|
||
color: var(--navbar-level-2-color);
|
||
opacity: 1;
|
||
}
|
||
|
||
.wy-side-nav-search, .wy-menu-vertical a, .wy-menu-vertical a:active span.toctree-expand,
|
||
.wy-menu-vertical li.toctree-l2 a:active span.toctree-expand {
|
||
color: var(--navbar-level-1-color);
|
||
opacity: 1;
|
||
}
|
||
|
||
/* Second (and higher) levels of navigation items */
|
||
|
||
.wy-menu-vertical li.current a {
|
||
/* Make long words always display on a single line, keep wrapping for multiple words */
|
||
/* This fixes the class reference titles' display with very long class names */
|
||
display: flex;
|
||
}
|
||
|
||
.wy-menu-vertical li.current a,
|
||
.wy-menu-vertical li.toctree-l2.current > a,
|
||
.wy-menu-vertical li.toctree-l2.current li.toctree-l3 > a,
|
||
.wy-menu-vertical li.toctree-l2.current li.toctree-l4 > a {
|
||
background-color: var(--navbar-current-background-color);
|
||
color: var(--navbar-level-2-color);
|
||
border-color: var(--navbar-current-background-color);
|
||
}
|
||
|
||
.wy-menu-vertical li.current a:hover,
|
||
.wy-menu-vertical li.toctree-l2.current > a:hover,
|
||
.wy-menu-vertical li.toctree-l2.current li.toctree-l3 > a:hover,
|
||
.wy-menu-vertical li.toctree-l3.current li.toctree-l4 > a:hover {
|
||
background-color: var(--navbar-current-background-color-hover);
|
||
}
|
||
|
||
.wy-menu-vertical li.current a:active,
|
||
.wy-menu-vertical li.toctree-l2.current > a:active,
|
||
.wy-menu-vertical li.toctree-l2.current li.toctree-l3 > a:active,
|
||
.wy-menu-vertical li.toctree-l3.current li.toctree-l4 > a:active {
|
||
background-color: var(--navbar-current-background-color-active);
|
||
}
|
||
|
||
.wy-menu-vertical a {
|
||
/* This overrides 8px margin added in other multi-selector rules */
|
||
margin-right: 0;
|
||
}
|
||
|
||
/* Banner panel in sidebar */
|
||
.wy-nav-side .ethical-rtd.fixed {
|
||
position: fixed;
|
||
}
|
||
|
||
/* Version selector (only visible on Read the Docs) */
|
||
|
||
.rst-versions {
|
||
background-color: var(--navbar-current-background-color);
|
||
}
|
||
|
||
.rst-versions a,
|
||
.rst-versions .rst-current-version,
|
||
.rst-versions .rst-current-version .fa,
|
||
.rst-versions .rst-other-versions dd a {
|
||
color: var(--navbar-level-1-color);
|
||
}
|
||
|
||
.rst-versions .rst-other-versions small {
|
||
color: var(--navbar-level-3-color);
|
||
}
|
||
|
||
.rst-versions .rst-other-versions dd a:hover {
|
||
text-decoration: underline;
|
||
}
|
||
|
||
.rst-versions .rst-other-versions {
|
||
color: var(--navbar-heading-color);
|
||
}
|
||
|
||
.rst-versions .rst-current-version {
|
||
background-color: var(--navbar-current-background-color);
|
||
}
|
||
|
||
.rst-versions .rst-current-version:hover {
|
||
background-color: var(--navbar-current-background-color-hover);
|
||
}
|
||
|
||
.rst-versions .rst-current-version:active {
|
||
background-color: var(--navbar-current-background-color-active);
|
||
}
|
||
|
||
.rst-versions.shift-up {
|
||
overflow-y: auto;
|
||
}
|
||
|
||
/* Hide the obnoxious automatic highlight in search results */
|
||
.rst-content .highlighted {
|
||
background-color: transparent;
|
||
font-weight: inherit;
|
||
padding: 0;
|
||
}
|
||
|
||
/* Allows the scrollbar to be shown in the sidebar */
|
||
@media only screen and (min-width: 769px) {
|
||
.wy-side-scroll {
|
||
overflow: hidden;
|
||
}
|
||
|
||
.wy-nav-side .wy-side-scroll .ethical-rtd {
|
||
width: calc(300px - 1.25em);
|
||
padding: 0 0 0 1em;
|
||
}
|
||
}
|
||
.wy-menu.wy-menu-vertical {
|
||
overflow-y: auto;
|
||
overflow-x: hidden;
|
||
max-height: calc(100% - 243px);
|
||
}
|
||
@media screen and (max-width: 768px) {
|
||
.wy-nav-side {
|
||
padding-bottom: 44px;
|
||
}
|
||
.wy-menu.wy-menu-vertical {
|
||
overflow-y: initial;
|
||
max-height: initial;
|
||
}
|
||
}
|
||
|
||
/* Scrollbar styling */
|
||
.wy-menu.wy-menu-vertical {
|
||
scrollbar-color: var(--navbar-scrollbar-color) var(--navbar-scrollbar-background);
|
||
}
|
||
.wy-menu.wy-menu-vertical::-webkit-scrollbar {
|
||
width: .75rem;
|
||
}
|
||
.wy-menu.wy-menu-vertical::-webkit-scrollbar-track {
|
||
background-color: var(--navbar-scrollbar-background);
|
||
}
|
||
.wy-menu.wy-menu-vertical::-webkit-scrollbar-thumb {
|
||
background-color: var(--navbar-scrollbar-color);
|
||
}
|
||
/* Firefox does the dimming on hover automatically. We emulate it for Webkit-based browsers. */
|
||
.wy-menu.wy-menu-vertical::-webkit-scrollbar-thumb:hover {
|
||
background-color: var(--navbar-scrollbar-hover-color);
|
||
}
|
||
.wy-menu.wy-menu-vertical::-webkit-scrollbar-thumb:active {
|
||
background-color: var(--navbar-scrollbar-active-color);
|
||
}
|
||
|
||
/* Breathe tweaks */
|
||
|
||
.rst-content .section > dl > dd {
|
||
margin-left: 0;
|
||
}
|
||
|
||
.rst-content p.breathe-sectiondef-title {
|
||
font-size: 115%;
|
||
color: var(--link-color);
|
||
}
|
||
|
||
.rst-content dl:not(.docutils) dl:not(.rst-other-versions) dt {
|
||
background: var(--admonition-note-background-color) !important;
|
||
border-top: none !important;
|
||
border-left: none !important;
|
||
}
|
||
|
||
/* Misc tweaks */
|
||
|
||
.rst-columns {
|
||
column-width: 18em;
|
||
}
|
||
|
||
.rst-content div.figure, .rst-content figure {
|
||
text-align: center;
|
||
}
|
||
|
||
.wy-alert.wy-alert-danger {
|
||
background-color: var(--admonition-danger-background-color);
|
||
}
|
||
|
||
|
||
dark-mode-toggle::part(fieldset) {
|
||
padding-inline: 0.75rem;
|
||
padding-block: 0;
|
||
}
|
||
|
||
dark-mode-toggle::part(darkLabel),
|
||
dark-mode-toggle::part(lightLabel),
|
||
dark-mode-toggle::part(toggleLabel){
|
||
font-size: unset;
|
||
}
|
||
|
||
/* Home page grid display */
|
||
.grid {
|
||
list-style-type: none !important;
|
||
display: -webkit-box;
|
||
display: -ms-flexbox;
|
||
display: flex;
|
||
-ms-flex-wrap: wrap;
|
||
flex-wrap: wrap;
|
||
-webkit-box-pack: center;
|
||
-ms-flex-pack: center;
|
||
justify-content: center;
|
||
margin: 1rem auto;
|
||
max-width: calc((160px + 2rem) * 4);
|
||
}
|
||
|
||
.grid-item {
|
||
list-style-type: none !important;
|
||
-webkit-box-flex: 0;
|
||
-ms-flex: 0 0 auto;
|
||
flex: 0 0 auto;
|
||
width: 150px;
|
||
text-align: center;
|
||
margin: 1rem;
|
||
}
|
||
|
||
.grid-item a {
|
||
display: block;
|
||
width: 150px;
|
||
height: 150px;
|
||
padding: 20px;
|
||
display: -webkit-box;
|
||
display: -ms-flexbox;
|
||
display: flex;
|
||
-webkit-box-orient: vertical;
|
||
-webkit-box-direction: normal;
|
||
-ms-flex-direction: column;
|
||
flex-direction: column;
|
||
-webkit-box-pack: center;
|
||
-ms-flex-pack: center;
|
||
justify-content: center;
|
||
-webkit-box-align: center;
|
||
-ms-flex-align: center;
|
||
align-items: center;
|
||
border-radius: 0.5rem;
|
||
background: linear-gradient(135deg, #0070c5 0%, #5c13a5 100%);
|
||
color: white;
|
||
}
|
||
|
||
.grid-item h2 {
|
||
font-size: 1rem;
|
||
}
|
||
|
||
.grid-item img {
|
||
margin-bottom: 1rem;
|
||
max-width: 75%;
|
||
}
|
||
|
||
.grid-item a:hover {
|
||
text-decoration: none;
|
||
}
|
||
|
||
.grid-item p {
|
||
font-size: 0.9rem;
|
||
margin-top: 0.5rem;
|
||
color: var(--body-color);
|
||
}
|
||
|
||
.grid-icon {
|
||
line-height: 1.5;
|
||
font-size: 3rem;
|
||
color: white;
|
||
}
|
||
|
||
/* Custom search box, including search engine selection */
|
||
|
||
.search-container {
|
||
position: relative;
|
||
}
|
||
|
||
#search-se-settings-icon {
|
||
position: absolute;
|
||
color: var(--body-color);
|
||
right: 10px;
|
||
top: 50%;
|
||
transform: translateY(-50%);
|
||
cursor: pointer;
|
||
opacity: 0.8;
|
||
}
|
||
|
||
#search-se-menu {
|
||
display: none;
|
||
position: absolute;
|
||
font-size: 11px;
|
||
background-color: var(--input-background-color);
|
||
color: var(--body-color);
|
||
right: 0px;
|
||
top: 36px;
|
||
border: solid 1px var(--body-color);
|
||
border-radius: 10px;
|
||
z-index: 1000;
|
||
}
|
||
|
||
#search-se-menu ul {
|
||
list-style: none;
|
||
margin: 0;
|
||
padding: 2px;
|
||
}
|
||
|
||
#search-se-menu ul li {
|
||
padding: 8px 12px;
|
||
cursor: pointer;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
gap: 1em;
|
||
}
|
||
|
||
#search-se-menu [role="menuitemradio"]:focus {
|
||
background-color: var(--navbar-current-background-color-hover);
|
||
color: var(--navbar-level-1-color);
|
||
border-radius: 10px;
|
||
}
|
||
|
||
#search-se-menu ul li .fa-check {
|
||
display: none;
|
||
}
|
||
|
||
#search-se-menu ul li.selected .fa-check {
|
||
display: inline;
|
||
}
|