nishiki/hugo-theme-relearn
1
0
Fork 0
mirror of https://github.com/McShelby/hugo-theme-relearn.git synced 2024-11-27 01:33:04 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

theme: avoid id collisions between headings and theme #646

Browse source
This commit is contained in:
Sören Weber 2023-09-23 10:18:31 +02:00
parent 862d8bb8c2
commit e18c213e8c
No known key found for this signature in database
GPG key ID: BEC6D55545451B6D
30 changed files with 511 additions and 507 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
exampleSite/content/basics/generator/_index.en.md
View file

@ -26,11 +26,11 @@ Eg. if your new variants file is named `theme-my-custom-variant.css`, you have t
{{% button style="secondary" icon="download" href="javascript:window.variants&&variants.getStylesheet();this.blur();" %}}Download variant{{% /button %}} {{% button style="secondary" icon="download" href="javascript:window.variants&&variants.getStylesheet();this.blur();" %}}Download variant{{% /button %}}
{{% button style="warning" icon="trash" href="javascript:window.variants&&variants.resetVariant();this.blur();" %}}Reset variant{{% /button %}} {{% button style="warning" icon="trash" href="javascript:window.variants&&variants.resetVariant();this.blur();" %}}Reset variant{{% /button %}}
<div id="vargenerator" class="mermaid" style="background-color: var(--INTERNAL-MAIN-TEXT-color);">Graph</div> <div id="R-vargenerator" class="mermaid" style="background-color: var(--INTERNAL-MAIN-TEXT-color);">Graph</div>
{{% button style="secondary" icon="download" href="javascript:window.variants&&variants.getStylesheet();this.blur();" %}}Download variant{{% /button %}} {{% button style="secondary" icon="download" href="javascript:window.variants&&variants.getStylesheet();this.blur();" %}}Download variant{{% /button %}}
{{% button style="warning" icon="trash" href="javascript:window.variants&&variants.resetVariant();this.blur();" %}}Reset variant{{% /button %}} {{% button style="warning" icon="trash" href="javascript:window.variants&&variants.resetVariant();this.blur();" %}}Reset variant{{% /button %}}
<script> <script>
window.variants && variants.generator( '#vargenerator' ); window.variants && variants.generator( '#R-vargenerator' );
</script> </script>

4
exampleSite/content/basics/migration/_index.en.md
View file

@ -20,6 +20,10 @@ This document shows you what's new in the latest release. For a detailed list of
## 5.22.0 (2023-09-21) {#5220} ## 5.22.0 (2023-09-21) {#5220}
- {{% badge style="note" title=" " %}}Change{{% /badge %}} This release fixes an issue where in unfortunate conditions DOM ids generated by Hugo may collide with DOM ids set by the theme. To avoid this, all theme DOM ids are now prefixed with `R-`.
If you haven't modified anything, everything is fine. Otherwise you have to check your custom CSS rules and JavaScript code.
- {{% badge style="note" title=" " %}}Change{{% /badge %}} You can now have structural sections in the hierarchical menu without generating a page for it. - {{% badge style="note" title=" " %}}Change{{% /badge %}} You can now have structural sections in the hierarchical menu without generating a page for it.
This can come in handy, if content for such a section page doesn't make much sense to you. See [the documentation]({{% relref "cont/pages#disable-section-pages" %}}) for how to do this. This can come in handy, if content for such a section page doesn't make much sense to you. See [the documentation]({{% relref "cont/pages#disable-section-pages" %}}) for how to do this.

2
exampleSite/content/basics/topbar/_index.pir.md
View file

@ -1,5 +1,5 @@
+++ +++
title = "Topbarrr modificat'n" title = "Topbarrr Modificat'n"
weight = 27 weight = 27
+++ +++
{{< piratify >}} {{< piratify >}}

2
exampleSite/layouts/partials/custom-header.html
View file

@ -1,6 +1,6 @@
<style> <style>
#body img.bg-white { #R-body img.bg-white {
background-color: white; background-color: white;
} }
</style> </style>

2
exampleSite/layouts/partials/menu-footer.html
View file

@ -4,7 +4,7 @@
<script> <script>
function githubButtonsScheme(){ function githubButtonsScheme(){
var scheme = 'light'; var scheme = 'light';
var colorPropertyValue = window.getComputedStyle( document.querySelector( '#sidebar' ) ).getPropertyValue( 'background-color' ); var colorPropertyValue = window.getComputedStyle( document.querySelector( '#R-sidebar' ) ).getPropertyValue( 'background-color' );
var colorValues = colorPropertyValue.match( /\d+/g ).map( function( e ){ return parseInt(e,10); }); var colorValues = colorPropertyValue.match( /\d+/g ).map( function( e ){ return parseInt(e,10); });
if( colorValues.length === 3 && ((0.2126 * colorValues[0]) + (0.7152 * colorValues[1]) + (0.0722 * colorValues[2]) < 165) ){ if( colorValues.length === 3 && ((0.2126 * colorValues[0]) + (0.7152 * colorValues[1]) + (0.0722 * colorValues[2]) < 165) ){
// Luma, https://en.wikipedia.org/wiki/Luma_%28video%29, SMPTE C, Rec. 709 weightings // Luma, https://en.wikipedia.org/wiki/Luma_%28video%29, SMPTE C, Rec. 709 weightings

6
layouts/404.html
View file

@ -20,7 +20,7 @@
p { p {
text-align: center text-align: center
} }
.notfound #body { .notfound #R-body {
margin-inline-start: 0; margin-inline-start: 0;
max-width: 100%; max-width: 100%;
min-width: 100%; min-width: 100%;
@ -62,8 +62,8 @@
{{- partial "custom-header.html" . }} {{- partial "custom-header.html" . }}
</head> </head>
<body class="mobile-support html notfound" data-url="{{ partial "relLangPrettyUglyURL.hugo" (dict "to" .) }}"> <body class="mobile-support html notfound" data-url="{{ partial "relLangPrettyUglyURL.hugo" (dict "to" .) }}">
<div id="body" class="default-animation"> <div id="R-body" class="default-animation">
<main id="body-inner" class="chapter" tabindex="-1"> <main id="R-body-inner" class="chapter" tabindex="-1">
<div class="flex-block-wrapper"> <div class="flex-block-wrapper">
<article> <article>
<h1 id="404"><span>4</span>{{ partial "shortcodes/icon.html" (dict "page" . "icon" "far fa-frown" )}}<span>4</span></h1> <h1 id="404"><span>4</span>{{ partial "shortcodes/icon.html" (dict "page" . "icon" "far fa-frown" )}}<span>4</span></h1>

6
layouts/partials/body.searchpage.html
View file

@ -7,8 +7,8 @@
<form action="javascript:triggerSearch()"> <form action="javascript:triggerSearch()">
<div class="searchform"> <div class="searchform">
<label class="a11y-only" for="search-by-detail">{{ T "Search" }}</label> <label class="a11y-only" for="R-section--detail">{{ T "Search" }}</label>
<input data-search-input id="search-by-detail" class="search-by" name="search-by" type="search" placeholder="{{ T "Search-placeholder" }}"> <input data-search-input id="R-search-by-detail" class="search-by" name="search-by" type="search" placeholder="{{ T "Search-placeholder" }}">
{{- partial "shortcodes/button.html" (dict {{- partial "shortcodes/button.html" (dict
"page" $page "page" $page
"type" "submit" "type" "submit"
@ -21,7 +21,7 @@
<div class="searchhint"> <div class="searchhint">
</div> </div>
<hr> <hr>
<div id="searchresults"> <div id="R-searchresults">
</div> </div>
<footer class="footline"> <footer class="footline">

4
layouts/partials/footer.html
View file

@ -1,7 +1,7 @@
</div> </div>
</main><!-- #body-inner --> </main><!-- #R-body-inner -->
{{- partial "custom-comments.html" . }} {{- partial "custom-comments.html" . }}
</div><!-- #body --> </div><!-- #R-body -->
{{- $outputFormat := partial "output-format.hugo" .Page }} {{- $outputFormat := partial "output-format.hugo" .Page }}
{{- partial "output-partial.hugo" (dict "base" "menu" "page" . "parameter" . "outputFormat" $outputFormat) }} {{- partial "output-partial.hugo" (dict "base" "menu" "page" . "parameter" . "outputFormat" $outputFormat) }}
<script src="{{"js/clipboard.min.js" | relURL}}{{ if not .Site.Params.disableAssetsBusting }}?{{ now.Unix }}{{ end }}" defer></script> <script src="{{"js/clipboard.min.js" | relURL}}{{ if not .Site.Params.disableAssetsBusting }}?{{ now.Unix }}{{ end }}" defer></script>

10
layouts/partials/header.html
View file

@ -66,9 +66,9 @@
{{- partial "custom-header.html" . }} {{- partial "custom-header.html" . }}
</head> </head>
<body class="mobile-support {{ $outputFormat }}{{- if .Site.Params.disableInlineCopyToClipBoard }} disableInlineCopyToClipboard{{ end }}{{- if .Site.Params.disableHoverBlockCopyToClipBoard }} disableHoverBlockCopyToClipBoard{{ end }}" data-url="{{ partial "relLangPrettyUglyURL.hugo" (dict "to" .) }}"> <body class="mobile-support {{ $outputFormat }}{{- if .Site.Params.disableInlineCopyToClipBoard }} disableInlineCopyToClipboard{{ end }}{{- if .Site.Params.disableHoverBlockCopyToClipBoard }} disableHoverBlockCopyToClipBoard{{ end }}" data-url="{{ partial "relLangPrettyUglyURL.hugo" (dict "to" .) }}">
<div id="body" class="default-animation"> <div id="R-body" class="default-animation">
<div id="body-overlay"></div> <div id="R-body-overlay"></div>
<nav id="topbar"> <nav id="R-topbar">
<div class="topbar-wrapper"> <div class="topbar-wrapper">
<div class="topbar-sidebar-divider"></div> <div class="topbar-sidebar-divider"></div>
<div class="topbar-area topbar-area-start" data-area="start"> <div class="topbar-area topbar-area-start" data-area="start">
@ -90,8 +90,8 @@
</div> </div>
</nav> </nav>
{{- $hook := "styleclass" }} {{- $hook := "styleclass" }}
<div id="main-overlay"></div> <div id="R-main-overlay"></div>
<main id="body-inner" class="highlightable {{ partialCached "archetype.hugo" (dict "hook" $hook "page" . "parameter" . "outputFormat" $outputFormat) .RelPermalink $outputFormat $hook }}" tabindex="-1"> <main id="R-body-inner" class="highlightable {{ partialCached "archetype.hugo" (dict "hook" $hook "page" . "parameter" . "outputFormat" $outputFormat) .RelPermalink $outputFormat $hook }}" tabindex="-1">
<div class="flex-block-wrapper"> <div class="flex-block-wrapper">
{{- define "breadcrumb" }} {{- define "breadcrumb" }}
{{- $breadcrumb := slice }} {{- $breadcrumb := slice }}

22
layouts/partials/logo.html
View file

@ -1,13 +1,13 @@
<style> <style>
#logo svg, #R-logo svg,
#logo svg * { #R-logo svg * {
color: #282828; color: #282828;
color: var(--MENU-SECTIONS-BG-color); color: var(--MENU-SECTIONS-BG-color);
fill: #282828 !important; fill: #282828 !important;
fill: var(--MENU-SECTIONS-BG-color) !important; fill: var(--MENU-SECTIONS-BG-color) !important;
opacity: .945; opacity: .945;
} }
a#logo { a#R-logo {
color: #282828; color: #282828;
color: var(--MENU-SECTIONS-BG-color); color: var(--MENU-SECTIONS-BG-color);
font-family: 'Work Sans', 'Helvetica', 'Tahoma', 'Geneva', 'Arial', sans-serif; font-family: 'Work Sans', 'Helvetica', 'Tahoma', 'Geneva', 'Arial', sans-serif;
@ -19,42 +19,42 @@
width: 14.125rem; width: 14.125rem;
white-space: nowrap; white-space: nowrap;
} }
a#logo:hover { a#R-logo:hover {
color: #282828; color: #282828;
color: var(--MENU-SECTIONS-BG-color); color: var(--MENU-SECTIONS-BG-color);
} }
#logo svg { #R-logo svg {
margin-bottom: -1.25rem; margin-bottom: -1.25rem;
margin-inline-start: -1.47rem; margin-inline-start: -1.47rem;
width: 40.5%; width: 40.5%;
} }
@media only all and (max-width: 60rem) { @media only all and (max-width: 60rem) {
a#logo { a#R-logo {
font-size: 1.5625rem; font-size: 1.5625rem;
margin-top: -.1875rem; margin-top: -.1875rem;
} }
#logo svg { #R-logo svg {
margin-bottom: -.75rem; margin-bottom: -.75rem;
margin-inline-start: -1.47rem; margin-inline-start: -1.47rem;
} }
} }
@media all and (-ms-high-contrast:none) { @media all and (-ms-high-contrast:none) {
{{ "/* IE11s understanding of positioning is weird at best */" | safeCSS }} {{ "/* IE11s understanding of positioning is weird at best */" | safeCSS }}
a#logo { a#R-logo {
margin-top: -3.625rem; margin-top: -3.625rem;
} }
#logo svg { #R-logo svg {
margin-bottom: -3.875rem; margin-bottom: -3.875rem;
margin-left: -1.47rem; margin-left: -1.47rem;
} }
} }
@media only all and (-ms-high-contrast:none) and (max-width: 60rem) { @media only all and (-ms-high-contrast:none) and (max-width: 60rem) {
#logo svg { #R-logo svg {
margin-left: -1.47rem; margin-left: -1.47rem;
} }
} }
</style> </style>
<a id="logo" href="{{ partial "relLangPrettyUglyURL.hugo" (dict "to" .Site.Home) }}"> <a id="R-logo" href="{{ partial "relLangPrettyUglyURL.hugo" (dict "to" .Site.Home) }}">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64.044 64.044"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64.044 64.044">
<path d="M46.103 136.34c-.642-.394-1.222-2.242-1.98-2.358-.76-.117-1.353.506-1.618 1.519-.266 1.012-.446 4.188.173 5.538.213.435.482.787 1.03.845.547.057.967-.504 1.45-1.027.482-.523.437-.9 1.142-.612.705.289 1.051.4 1.586 1.229.535.828 1.085 4.043.868 5.598-.241 1.458-.531 2.8-.59 4.088.26.075.517.148.772.217 2.68.724 5.373 1.037 7.873.02.001-.028.01-.105.008-.11-.048-.165-.18-.41-.36-.698-.18-.29-.414-.645-.586-1.114a3.212 3.212 0 0 1-.125-1.735c.056-.21.153-.342.249-.475 1.237-1.193 2.932-1.373 4.244-1.384.557-.004 1.389.016 2.198.255.809.239 1.706.724 2.068 1.843.187.578.114 1.17-.043 1.623-.153.438-.369.783-.545 1.091-.178.31-.329.6-.401.821-.007.02-.003.071-.005.094 2.256 1.008 4.716.91 7.189.398.55-.114 1.11-.247 1.673-.377.344-1.085.678-2.145.852-3.208.124-.752.158-2.311-.078-3.538-.118-.613-.306-1.15-.52-1.489-.221-.349-.413-.501-.747-.538-.243-.027-.51.013-.796.098-.67.223-1.33.606-1.966.76l-.008.002-.109.032c-.556.152-1.233.158-1.797-.36-.556-.51-.89-1.367-1.117-2.596-.283-1.528-.075-3.279.89-4.518l.071-.09h.07c.65-.71 1.485-.802 2.16-.599.706.213 1.333.629 1.772.84.736.354 1.185.319 1.475.171.291-.148.5-.439.668-.955.332-1.017.301-2.819.022-4.106-.148-.684-.13-1.292-.13-1.883-1.558-.463-3.067-.982-4.574-1.208-1.128-.169-2.263-.173-3.298.164-.13.046-.256.095-.38.15-.373.164-.633.342-.805.52-.077.098-.081.105-.087.21-.004.068.031.289.13.571.1.282.256.634.467 1.03.279.524.448 1.063.431 1.618a2.12 2.12 0 0 1-.499 1.309 1.757 1.757 0 0 1-.62.51h-.002c-.515.291-1.107.404-1.723.464-.86.083-1.787.026-2.598-.097-.806-.123-1.47-.28-1.948-.555-.444-.256-.79-.547-1.037-.925a2.273 2.273 0 0 1-.356-1.301c.029-.837.403-1.437.625-1.897.111-.23.191-.433.236-.583.045-.15.044-.25.046-.24-.005-.029-.127-.355-1.015-.741-1.138-.495-2.322-.673-3.533-.668h-.015a9.711 9.711 0 0 0-.521.016h-.002c-1.163.057-2.35.308-3.541.569.383 1.531.79 2.753.818 4.502-.096 1.297.158 2.114-1.03 2.935-.85.588-1.508.729-2.15.335" style="fill:#282828;fill-opacity:1;stroke:none;stroke-width:1.03763;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" transform="translate(-40.698 -95.175)"/> <path d="M46.103 136.34c-.642-.394-1.222-2.242-1.98-2.358-.76-.117-1.353.506-1.618 1.519-.266 1.012-.446 4.188.173 5.538.213.435.482.787 1.03.845.547.057.967-.504 1.45-1.027.482-.523.437-.9 1.142-.612.705.289 1.051.4 1.586 1.229.535.828 1.085 4.043.868 5.598-.241 1.458-.531 2.8-.59 4.088.26.075.517.148.772.217 2.68.724 5.373 1.037 7.873.02.001-.028.01-.105.008-.11-.048-.165-.18-.41-.36-.698-.18-.29-.414-.645-.586-1.114a3.212 3.212 0 0 1-.125-1.735c.056-.21.153-.342.249-.475 1.237-1.193 2.932-1.373 4.244-1.384.557-.004 1.389.016 2.198.255.809.239 1.706.724 2.068 1.843.187.578.114 1.17-.043 1.623-.153.438-.369.783-.545 1.091-.178.31-.329.6-.401.821-.007.02-.003.071-.005.094 2.256 1.008 4.716.91 7.189.398.55-.114 1.11-.247 1.673-.377.344-1.085.678-2.145.852-3.208.124-.752.158-2.311-.078-3.538-.118-.613-.306-1.15-.52-1.489-.221-.349-.413-.501-.747-.538-.243-.027-.51.013-.796.098-.67.223-1.33.606-1.966.76l-.008.002-.109.032c-.556.152-1.233.158-1.797-.36-.556-.51-.89-1.367-1.117-2.596-.283-1.528-.075-3.279.89-4.518l.071-.09h.07c.65-.71 1.485-.802 2.16-.599.706.213 1.333.629 1.772.84.736.354 1.185.319 1.475.171.291-.148.5-.439.668-.955.332-1.017.301-2.819.022-4.106-.148-.684-.13-1.292-.13-1.883-1.558-.463-3.067-.982-4.574-1.208-1.128-.169-2.263-.173-3.298.164-.13.046-.256.095-.38.15-.373.164-.633.342-.805.52-.077.098-.081.105-.087.21-.004.068.031.289.13.571.1.282.256.634.467 1.03.279.524.448 1.063.431 1.618a2.12 2.12 0 0 1-.499 1.309 1.757 1.757 0 0 1-.62.51h-.002c-.515.291-1.107.404-1.723.464-.86.083-1.787.026-2.598-.097-.806-.123-1.47-.28-1.948-.555-.444-.256-.79-.547-1.037-.925a2.273 2.273 0 0 1-.356-1.301c.029-.837.403-1.437.625-1.897.111-.23.191-.433.236-.583.045-.15.044-.25.046-.24-.005-.029-.127-.355-1.015-.741-1.138-.495-2.322-.673-3.533-.668h-.015a9.711 9.711 0 0 0-.521.016h-.002c-1.163.057-2.35.308-3.541.569.383 1.531.79 2.753.818 4.502-.096 1.297.158 2.114-1.03 2.935-.85.588-1.508.729-2.15.335" style="fill:#282828;fill-opacity:1;stroke:none;stroke-width:1.03763;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" transform="translate(-40.698 -95.175)"/>
<path d="M61.472 101.34v.002c-.3-.003-.603.01-.894.04-.544.055-1.39.165-1.778.306-1.238.364.13 2.344.41 2.913.28.569.285 2.03.14 2.134-.144.103-.375.261-.934.345-.56.084.03-.037-1.589.086-1.62.122-5.506.29-8.265.248-.022.26-.036.521-.097.808-.309 1.442-.63 3.163-.494 4.074.071.473.168.65.414.8.23.14.737.235 1.62-.004.834-.227 1.3-.442 1.887-.456.595-.016 1.555.472 1.965.717.411.245-.03-.008.002 0s.128.05.176.102c.049.053-.276-.523.104.199.379.721.72 3.256.002 4.68-.46.913-1.01 1.49-1.64 1.711-.63.22-1.229.067-1.734-.135-.881-.353-1.584-.7-2.205-.647-1.199 1.94-1.186 4.17-.6 6.602.097.397.212.814.327 1.23 2.68-.556 5.542-1.016 8.337.132 1.064.437 1.73 1.015 1.902 1.857.169.831-.193 1.508-.438 1.986-.122.238-.23.46-.307.642-.07.164-.096.28-.104.324.069.429.309.723.686.945.385.227.89.355 1.35.423.723.104 1.567.152 2.287.086.693-.064 1.032-.338 1.241-.544a2.447 2.447 0 0 0 .303-.437.175.175 0 0 0 .013-.035c-.004-.066-.037-.246-.195-.527-.46-.816-.87-1.595-.817-2.51.028-.476.218-.938.529-1.288.304-.343.698-.586 1.186-.79 1.442-.606 2.96-.609 4.372-.409 1.525.216 2.963.679 4.378 1.083.226-2.09.784-3.9.592-5.77-.058-.565-.287-1.333-.598-1.827-.32-.508-.59-.717-1.036-.642-.648.11-1.472.935-2.707 1.078-.791.092-1.494-.267-1.95-.86-.45-.583-.678-1.335-.78-2.101-.202-1.525.031-3.229.89-4.27.615-.747 1.45-.887 2.15-.74.687.145 1.307.492 1.857.745v-.002c.546.252 1.033.388 1.281.344a.547.547 0 0 0 .353-.188c.113-.124.242-.35.384-.75.604-1.712.206-3.68-.303-5.654-.667.145-1.336.293-2.018.413-1.341.236-2.73.392-4.136.273-.656-.055-1.695-.085-2.58-.476-.442-.195-.903-.514-1.157-1.093-.259-.591-.205-1.313.08-2.014.223-.64 1.082-2.178.692-2.585-.391-.407-1.651-.56-2.554-.571z" style="fill:#282828;fill-opacity:1;stroke:none;stroke-width:.992837;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" transform="translate(-40.698 -95.175)"/> <path d="M61.472 101.34v.002c-.3-.003-.603.01-.894.04-.544.055-1.39.165-1.778.306-1.238.364.13 2.344.41 2.913.28.569.285 2.03.14 2.134-.144.103-.375.261-.934.345-.56.084.03-.037-1.589.086-1.62.122-5.506.29-8.265.248-.022.26-.036.521-.097.808-.309 1.442-.63 3.163-.494 4.074.071.473.168.65.414.8.23.14.737.235 1.62-.004.834-.227 1.3-.442 1.887-.456.595-.016 1.555.472 1.965.717.411.245-.03-.008.002 0s.128.05.176.102c.049.053-.276-.523.104.199.379.721.72 3.256.002 4.68-.46.913-1.01 1.49-1.64 1.711-.63.22-1.229.067-1.734-.135-.881-.353-1.584-.7-2.205-.647-1.199 1.94-1.186 4.17-.6 6.602.097.397.212.814.327 1.23 2.68-.556 5.542-1.016 8.337.132 1.064.437 1.73 1.015 1.902 1.857.169.831-.193 1.508-.438 1.986-.122.238-.23.46-.307.642-.07.164-.096.28-.104.324.069.429.309.723.686.945.385.227.89.355 1.35.423.723.104 1.567.152 2.287.086.693-.064 1.032-.338 1.241-.544a2.447 2.447 0 0 0 .303-.437.175.175 0 0 0 .013-.035c-.004-.066-.037-.246-.195-.527-.46-.816-.87-1.595-.817-2.51.028-.476.218-.938.529-1.288.304-.343.698-.586 1.186-.79 1.442-.606 2.96-.609 4.372-.409 1.525.216 2.963.679 4.378 1.083.226-2.09.784-3.9.592-5.77-.058-.565-.287-1.333-.598-1.827-.32-.508-.59-.717-1.036-.642-.648.11-1.472.935-2.707 1.078-.791.092-1.494-.267-1.95-.86-.45-.583-.678-1.335-.78-2.101-.202-1.525.031-3.229.89-4.27.615-.747 1.45-.887 2.15-.74.687.145 1.307.492 1.857.745v-.002c.546.252 1.033.388 1.281.344a.547.547 0 0 0 .353-.188c.113-.124.242-.35.384-.75.604-1.712.206-3.68-.303-5.654-.667.145-1.336.293-2.018.413-1.341.236-2.73.392-4.136.273-.656-.055-1.695-.085-2.58-.476-.442-.195-.903-.514-1.157-1.093-.259-.591-.205-1.313.08-2.014.223-.64 1.082-2.178.692-2.585-.391-.407-1.651-.56-2.554-.571z" style="fill:#282828;fill-opacity:1;stroke:none;stroke-width:.992837;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" transform="translate(-40.698 -95.175)"/>

46
layouts/partials/menu.html
View file

@ -6,18 +6,18 @@
{{- if ne $outputFormat "html" }} {{- if ne $outputFormat "html" }}
{{- $basename = partial "BaseName.hugo" $format.RelPermalink }} {{- $basename = partial "BaseName.hugo" $format.RelPermalink }}
{{- end }} {{- end }}
<aside id="sidebar" class="default-animation{{ if $showvisitedlinks }} showVisitedLinks{{ end }}"> <aside id="R-sidebar" class="default-animation{{ if $showvisitedlinks }} showVisitedLinks{{ end }}">
{{- $currentNode := . }} {{- $currentNode := . }}
<div id="header-topbar" class="default-animation"></div> <div id="R-header-topbar" class="default-animation"></div>
<div id="header-wrapper" class="default-animation"> <div id="R-header-wrapper" class="default-animation">
<div id="header" class="default-animation"> <div id="R-header" class="default-animation">
{{ partial "logo.html" . }} {{ partial "logo.html" . }}
</div> </div>
{{- if not .Site.Params.disableSearch }} {{- if not .Site.Params.disableSearch }}
{{ partial "search.html" . }} {{ partial "search.html" . }}
{{- end }} {{- end }}
</div> </div>
<div id="homelinks" class="default-animation{{ if not .Site.Params.disableLandingPageButton }} homelinks{{ end }}"> <div id="R-homelinks" class="default-animation{{ if not .Site.Params.disableLandingPageButton }} homelinks{{ end }}">
{{- if not .Site.Params.disableLandingPageButton }} {{- if not .Site.Params.disableLandingPageButton }}
{{- if (ne .Site.Params.landingPageURL nil) }} {{- if (ne .Site.Params.landingPageURL nil) }}
{{- warnf "%q: UNSUPPORTED usage of 'landingPageURL' config parameter found, remove it and optionally overwrite the `logo.html` partial to provide a link if it should not point to the project's home page; see https://mcshelby.github.io/hugo-theme-relearn/basics/migration/#420" .File.Path }} {{- warnf "%q: UNSUPPORTED usage of 'landingPageURL' config parameter found, remove it and optionally overwrite the `logo.html` partial to provide a link if it should not point to the project's home page; see https://mcshelby.github.io/hugo-theme-relearn/basics/migration/#420" .File.Path }}
@ -28,8 +28,8 @@
{{- end }} {{- end }}
<hr class="padding"> <hr class="padding">
</div> </div>
<div id="content-wrapper" class="highlightable"> <div id="R-content-wrapper" class="highlightable">
<div id="topics"> <div id="R-topics">
<ul class="enlarge morespace collapsible-menu"> <ul class="enlarge morespace collapsible-menu">
{{- $defaultOrdersectionsby := .Site.Params.ordersectionsby | default "weight" }} {{- $defaultOrdersectionsby := .Site.Params.ordersectionsby | default "weight" }}
{{- $currentOrdersectionsby := .Site.Home.Params.ordersectionsby | default $defaultOrdersectionsby }} {{- $currentOrdersectionsby := .Site.Home.Params.ordersectionsby | default $defaultOrdersectionsby }}
@ -48,7 +48,7 @@
{{- $page := . }} {{- $page := . }}
{{- $disableShortcutsTitle := .Site.Params.DisableShortcutsTitle }} {{- $disableShortcutsTitle := .Site.Params.DisableShortcutsTitle }}
{{- with .Site.Menus.shortcuts }} {{- with .Site.Menus.shortcuts }}
<div id="shortcuts"> <div id="R-shortcuts">
<div class="nav-title padding">{{ if not $disableShortcutsTitle }}{{ T "Shortcuts-Title" }}{{ end }}</div> <div class="nav-title padding">{{ if not $disableShortcutsTitle }}{{ T "Shortcuts-Title" }}{{ end }}</div>
<ul class="space"> <ul class="space">
{{- range sort . "Weight" }} {{- range sort . "Weight" }}
@ -70,17 +70,17 @@
{{- $footer := partial "menu-footer.html" . }} {{- $footer := partial "menu-footer.html" . }}
{{- $showfooter := not (eq 0 (int (len ($footer | plainify)))) }} {{- $showfooter := not (eq 0 (int (len ($footer | plainify)))) }}
<div class="padding footermargin footerLangSwitch footerVariantSwitch footerVisitedLinks footerFooter{{if $showlangswitch}} showLangSwitch{{end}}{{if $showvariantswitch}} showVariantSwitch{{end}}{{if $showvisitedlinks}} showVisitedLinks{{end}}{{if $showfooter}} showFooter{{end}}"></div> <div class="padding footermargin footerLangSwitch footerVariantSwitch footerVisitedLinks footerFooter{{if $showlangswitch}} showLangSwitch{{end}}{{if $showvariantswitch}} showVariantSwitch{{end}}{{if $showvisitedlinks}} showVisitedLinks{{end}}{{if $showfooter}} showFooter{{end}}"></div>
<div id="menu-footer"> <div id="R-menu-footer">
<hr class="padding default-animation footerLangSwitch footerVariantSwitch footerVisitedLinks footerFooter{{if $showlangswitch}} showLangSwitch{{end}}{{if $showvariantswitch}} showVariantSwitch{{end}}{{if $showvisitedlinks}} showVisitedLinks{{end}}{{if $showfooter}} showFooter{{end}}"> <hr class="padding default-animation footerLangSwitch footerVariantSwitch footerVisitedLinks footerFooter{{if $showlangswitch}} showLangSwitch{{end}}{{if $showvariantswitch}} showVariantSwitch{{end}}{{if $showvisitedlinks}} showVisitedLinks{{end}}{{if $showfooter}} showFooter{{end}}">
<div id="prefooter" class="footerLangSwitch footerVariantSwitch footerVisitedLinks{{if $showlangswitch}} showLangSwitch{{end}}{{if $showvariantswitch}} showVariantSwitch{{end}}{{if $showvisitedlinks}} showVisitedLinks{{end}}"> <div id="R-prefooter" class="footerLangSwitch footerVariantSwitch footerVisitedLinks{{if $showlangswitch}} showLangSwitch{{end}}{{if $showvariantswitch}} showVariantSwitch{{end}}{{if $showvisitedlinks}} showVisitedLinks{{end}}">
<ul> <ul>
<li id="select-language-container" class="footerLangSwitch{{if $showlangswitch}} showLangSwitch{{end}}"> <li id="R-select-language-container" class="footerLangSwitch{{if $showlangswitch}} showLangSwitch{{end}}">
<div class="padding menu-control"> <div class="padding menu-control">
<i class="fas fa-language fa-fw"></i> <i class="fas fa-language fa-fw"></i>
<span>&nbsp;</span> <span>&nbsp;</span>
<div class="control-style"> <div class="control-style">
<label class="a11y-only" for="select-language">{{ T "Language" }}</label> <label class="a11y-only" for="R-select-language">{{ T "Language" }}</label>
<select id="select-language" onchange="location = baseUri + this.value;"> <select id="R-select-language" onchange="location = baseUri + this.value;">
{{- $page := .Page }} {{- $page := .Page }}
{{- $pageLang := .Page.Lang }} {{- $pageLang := .Page.Lang }}
{{- range .Page.AllTranslations }} {{- range .Page.AllTranslations }}
@ -88,9 +88,9 @@
{{- range $siteLanguages }} {{- range $siteLanguages }}
{{- if eq $translation.Lang .Lang }} {{- if eq $translation.Lang .Lang }}
{{- if eq $pageLang .Lang }} {{- if eq $pageLang .Lang }}
<option lang="{{ $translation.Lang }}" id="{{ $translation.Lang }}" value="{{ partial "relLangPrettyUglyURL.hugo" (dict "to" $translation "basename" $basename) }}" selected>{{ .LanguageName }}</option> <option lang="{{ $translation.Lang }}" id="R-{{ $translation.Lang }}" value="{{ partial "relLangPrettyUglyURL.hugo" (dict "to" $translation "basename" $basename) }}" selected>{{ .LanguageName }}</option>
{{- else }} {{- else }}
<option lang="{{ $translation.Lang }}" id="{{ $translation.Lang }}" value="{{ partial "relLangPrettyUglyURL.hugo" (dict "to" $translation "basename" $basename) }}">{{ .LanguageName }}</option> <option lang="{{ $translation.Lang }}" id="R-{{ $translation.Lang }}" value="{{ partial "relLangPrettyUglyURL.hugo" (dict "to" $translation "basename" $basename) }}">{{ .LanguageName }}</option>
{{- end }} {{- end }}
{{- end }} {{- end }}
{{- end }} {{- end }}
@ -100,22 +100,22 @@
<div class="clear"></div> <div class="clear"></div>
</div> </div>
</li> </li>
<li id="select-variant-container" class="footerVariantSwitch{{if $showvariantswitch}} showVariantSwitch{{end}}"> <li id="R-select-variant-container" class="footerVariantSwitch{{if $showvariantswitch}} showVariantSwitch{{end}}">
<div class="padding menu-control"> <div class="padding menu-control">
<i class="fas fa-paint-brush fa-fw"></i> <i class="fas fa-paint-brush fa-fw"></i>
<span>&nbsp;</span> <span>&nbsp;</span>
<div class="control-style"> <div class="control-style">
<label class="a11y-only" for="select-variant">{{ T "Theme" }}</label> <label class="a11y-only" for="R-select-variant">{{ T "Theme" }}</label>
<select id="select-variant" onchange="window.variants && variants.changeVariant( this.value );"> <select id="R-select-variant" onchange="window.variants && variants.changeVariant( this.value );">
{{- $firstvariant := true }} {{- $firstvariant := true }}
{{- range $themevariants }} {{- range $themevariants }}
{{- $themevariant := . }} {{- $themevariant := . }}
{{- $variantname := replaceRE "[-_]+" " " $themevariant }} {{- $variantname := replaceRE "[-_]+" " " $themevariant }}
{{- if $firstvariant }} {{- if $firstvariant }}
{{- $firstvariant = false }} {{- $firstvariant = false }}
<option id="{{ $themevariant }}" value="{{ $themevariant }}" selected>{{ $variantname | title }}</option> <option id="R-{{ $themevariant }}" value="{{ $themevariant }}" selected>{{ $variantname | title }}</option>
{{- else }} {{- else }}
<option id="{{ $themevariant }}" value="{{ $themevariant }}">{{ $variantname | title }}</option> <option id="R-{{ $themevariant }}" value="{{ $themevariant }}">{{ $variantname | title }}</option>
{{- end }} {{- end }}
{{- end }} {{- end }}
</select> </select>
@ -136,7 +136,7 @@
</li> </li>
</ul> </ul>
</div> </div>
<div id="footer" class="footerFooter{{if $showfooter}} showFooter{{end}}"> <div id="R-footer" class="footerFooter{{if $showfooter}} showFooter{{end}}">
{{- $footer }} {{- $footer }}
</div> </div>
</div> </div>
@ -174,9 +174,9 @@
{{- $currentAlwaysopen := .Params.alwaysopen | default $alwaysopen }} {{- $currentAlwaysopen := .Params.alwaysopen | default $alwaysopen }}
{{- $pageHash := md5 .Page }} {{- $pageHash := md5 .Page }}
{{- $isOpen := or $currentAlwaysopen $isSelf $isAncestor }} {{- $isOpen := or $currentAlwaysopen $isSelf $isAncestor }}
<li data-nav-id="{{ $url }}" class="{{if $isActive }}active {{end}}{{if (or $isSelf $isAncestor) }}parent {{end}}{{if $currentAlwaysopen}}alwaysopen{{end}}">{{ if $isCollapsible }}<input type="checkbox" id="section-{{ $pageHash }}" aria-controls="subsections-{{ $pageHash }}"{{ if $isOpen }} checked{{ end }}><label for="section-{{ $pageHash }}"><i class="fas fa-chevron-down"></i><i class="fas fa-chevron-right"></i><span class="a11y-only">{{ T "Submenu" $title }}</span></label>{{ end }}{{ if $url }}<a class="padding" href="{{ $url }}">{{ else }}<span class="padding">{{ end }} <li data-nav-id="R-{{ $url }}" class="{{if $isActive }}active {{end}}{{if (or $isSelf $isAncestor) }}parent {{end}}{{if $currentAlwaysopen}}alwaysopen{{end}}">{{ if $isCollapsible }}<input type="checkbox" id="R-section-{{ $pageHash }}" aria-controls="#R-subsections-{{ $pageHash }}"{{ if $isOpen }} checked{{ end }}><label for="R-section-{{ $pageHash }}"><i class="fas fa-chevron-down"></i><i class="fas fa-chevron-right"></i><span class="a11y-only">{{ T "Submenu" $title }}</span></label>{{ end }}{{ if $url }}<a class="padding" href="{{ $url }}">{{ else }}<span class="padding">{{ end }}
{{- partial "menu-pre.html" . }}{{ $title }}{{ partial "menu-post.html" . }} {{- partial "menu-pre.html" . }}{{ $title }}{{ partial "menu-post.html" . }}
{{- if $url }}{{ if $showvisitedlinks }}<i class="fas fa-check read-icon"></i>{{ end }}</a>{{ else }}</span>{{ end }}<ul id="subsections-{{ $pageHash }}" class="morespace collapsible-menu"> {{- if $url }}{{ if $showvisitedlinks }}<i class="fas fa-check read-icon"></i>{{ end }}</a>{{ else }}</span>{{ end }}<ul id="R-subsections-{{ $pageHash }}" class="morespace collapsible-menu">
{{- $defaultAlwaysopen := .Site.Params.alwaysopen | default true }} {{- $defaultAlwaysopen := .Site.Params.alwaysopen | default true }}
{{- if eq $currentOrdersectionsby "title" }} {{- if eq $currentOrdersectionsby "title" }}
{{- range $pages.ByTitle }} {{- range $pages.ByTitle }}

4
layouts/partials/search.html
View file

@ -6,8 +6,8 @@
{{- end }} {{- end }}
{{- $c:="" }} {{ if $link }}<form action="{{ $link }}" method="get">{{ end }}<div class="searchbox default-animation"> {{- $c:="" }} {{ if $link }}<form action="{{ $link }}" method="get">{{ end }}<div class="searchbox default-animation">
{{ if $link }}<button class="search-detail" type="submit" title="{{ T "Search" }} (CTRL+ALT+f)">{{ end }}<i class="fas fa-search"{{ if not $link }} title="{{ T "Search" }} (CTRL+ALT+f)"{{ end }}></i>{{ if $link }}</button>{{ end }} {{ if $link }}<button class="search-detail" type="submit" title="{{ T "Search" }} (CTRL+ALT+f)">{{ end }}<i class="fas fa-search"{{ if not $link }} title="{{ T "Search" }} (CTRL+ALT+f)"{{ end }}></i>{{ if $link }}</button>{{ end }}
<label class="a11y-only" for="search-by">{{ T "Search" }}</label> <label class="a11y-only" for="R-section-">{{ T "Search" }}</label>
<input data-search-input id="search-by" name="search-by" class="search-by" type="search" placeholder="{{ T "Search-placeholder" }}"> <input data-search-input id="R-search-by" name="search-by" class="search-by" type="search" placeholder="{{ T "Search-placeholder" }}">
<button class="search-clear" type="button" data-search-clear="" title="{{ T "Clear-search" }}"><i class="fas fa-times" title="{{ T "Clear-search" }}"></i></button> <button class="search-clear" type="button" data-search-clear="" title="{{ T "Clear-search" }}"><i class="fas fa-times" title="{{ T "Clear-search" }}"></i></button>
</div>{{ if $link }}</form>{{ end }} </div>{{ if $link }}</form>{{ end }}
{{- $assetBusting := not .Site.Params.disableAssetsBusting }} {{- $assetBusting := not .Site.Params.disableAssetsBusting }}

6
layouts/partials/shortcodes/expand.html
View file

@ -13,13 +13,13 @@
{{- $id := cond (or (eq .id nil) (eq .id "")) (partial "make-random-md5.hugo" $page) .id }} {{- $id := cond (or (eq .id nil) (eq .id "")) (partial "make-random-md5.hugo" $page) .id }}
{{- with $page }} {{- with $page }}
<div class="expand"> <div class="expand">
<input type="checkbox" id="expand-{{ $id }}" aria-controls="expandcontent-{{ $id }}" {{ if $expanded }} checked{{ end }}> <input type="checkbox" id="R-expand-{{ $id }}" aria-controls="expandcontent-{{ $id }}" {{ if $expanded }} checked{{ end }}>
<label class="expand-label" for="expand-{{ $id }}" > <label class="expand-label" for="R-expand-{{ $id }}" >
<i class="fas fa-chevron-down"></i> <i class="fas fa-chevron-down"></i>
<i class="fas fa-chevron-right"></i> <i class="fas fa-chevron-right"></i>
{{ $title | .RenderString }} {{ $title | .RenderString }}
</label> </label>
<div id="expandcontent-{{ $id }}" class="expand-content"> <div id="R-expandcontent-{{ $id }}" class="expand-content">
{{ if ne "<" (substr (strings.TrimLeft " \n\r\t" $content) 0 1) }}<p>{{ end }}<!-- we add a DOM element here if there is none to make collapsing marings work --> {{ if ne "<" (substr (strings.TrimLeft " \n\r\t" $content) 0 1) }}<p>{{ end }}<!-- we add a DOM element here if there is none to make collapsing marings work -->
{{ $content | safeHTML }}</div><!-- no line break allowed here because of awkward behavior of Hugo 110 or this theme when tag shortcode is called standalone outside of tags shortcode ? --> {{ $content | safeHTML }}</div><!-- no line break allowed here because of awkward behavior of Hugo 110 or this theme when tag shortcode is called standalone outside of tags shortcode ? -->
</div> </div>

4
layouts/partials/shortcodes/image.html
View file

@ -66,10 +66,10 @@
{{- end }} {{- end }}
{{- $id := cond (or (eq .id nil) (eq .id "")) (partial "make-random-md5.hugo" $page) .id }} {{- $id := cond (or (eq .id nil) (eq .id "")) (partial "make-random-md5.hugo" $page) .id }}
{{- if $effects.lightbox -}} {{- if $effects.lightbox -}}
<a href="#image-{{ $id }}" class="lightbox-link"> <a href="#R-image-{{ $id }}" class="lightbox-link">
{{- end -}} {{- end -}}
<img src="{{ $url | safeURL }}" alt="{{ $alt }}"{{ with $title }} title="{{ . }}"{{ end }} class="figure-image {{ delimit $classes " " }}" style="height: {{ $height }}; width: {{ $width }};" loading="lazy"> <img src="{{ $url | safeURL }}" alt="{{ $alt }}"{{ with $title }} title="{{ . }}"{{ end }} class="figure-image {{ delimit $classes " " }}" style="height: {{ $height }}; width: {{ $width }};" loading="lazy">
{{- if $effects.lightbox -}} {{- if $effects.lightbox -}}
</a> </a>
<a href="javascript:history.back();" class="lightbox-back" id="image-{{ $id }}"><img src="{{ $url | safeURL }}" alt="{{ $alt }}"{{ with $title }} title="{{ . }}"{{ end }} class="lightbox-image {{ delimit $classes " " }}" loading="lazy"></a> <a href="javascript:history.back();" class="lightbox-back" id="R-image-{{ $id }}"><img src="{{ $url | safeURL }}" alt="{{ $alt }}"{{ with $title }} title="{{ . }}"{{ end }} class="lightbox-image {{ delimit $classes " " }}" loading="lazy"></a>
{{- end }} {{- end }}

2
layouts/partials/shortcodes/openapi.html
View file

@ -14,7 +14,7 @@
<div class="sc-openapi-wrapper is-loading helper-loading-container"> <div class="sc-openapi-wrapper is-loading helper-loading-container">
<div <div
class="sc-openapi-container" class="sc-openapi-container"
id="openapi-{{ $id }}" id="R-openapi-{{ $id }}"
data-openapi-url="{{ $src }}" data-openapi-url="{{ $src }}"
></div> ></div>
</div> </div>

2
layouts/partials/stylesheet.html
View file

@ -19,7 +19,7 @@
{{- $c = "" }}<!-- link href="{{ $autocss.RelPermalink }}{{ if $assetBusting }}?{{ now.Unix }}{{ end }}" rel="stylesheet"--> {{- $c = "" }}<!-- link href="{{ $autocss.RelPermalink }}{{ if $assetBusting }}?{{ now.Unix }}{{ end }}" rel="stylesheet"-->
{{- $themevariants := slice | append (.Site.Params.themeVariant | default "auto" ) }} {{- $themevariants := slice | append (.Site.Params.themeVariant | default "auto" ) }}
{{- with index $themevariants 0 }} {{- with index $themevariants 0 }}
<link href="{{(printf "css/theme-%s.css" .) | relURL}}{{ if $assetBusting }}?{{ now.Unix }}{{ end }}" rel="stylesheet" id="variant-style"> <link href="{{(printf "css/theme-%s.css" .) | relURL}}{{ if $assetBusting }}?{{ now.Unix }}{{ end }}" rel="stylesheet" id="R-variant-style">
{{- end }} {{- end }}
<link href="{{"css/variant.css" | relURL}}{{ if $assetBusting }}?{{ now.Unix }}{{ end }}" rel="stylesheet"> <link href="{{"css/variant.css" | relURL}}{{ if $assetBusting }}?{{ now.Unix }}{{ end }}" rel="stylesheet">
<link href="{{"css/print.css" | relURL}}{{ if $assetBusting }}?{{ now.Unix }}{{ end }}" rel="stylesheet" media="print"> <link href="{{"css/print.css" | relURL}}{{ if $assetBusting }}?{{ now.Unix }}{{ end }}" rel="stylesheet" media="print">

6
static/css/auto-complete.css
View file

@ -44,9 +44,9 @@
.autocomplete-suggestion:hover > .context, .autocomplete-suggestion:hover > .context,
.autocomplete-suggestion:focus > .context, .autocomplete-suggestion:focus > .context,
.autocomplete-suggestion:active > .context, .autocomplete-suggestion:active > .context,
#searchresults .autocomplete-suggestion:hover > .context, #R-searchresults .autocomplete-suggestion:hover > .context,
#searchresults .autocomplete-suggestion:focus > .context, #R-searchresults .autocomplete-suggestion:focus > .context,
#searchresults .autocomplete-suggestion:active > .context { #R-searchresults .autocomplete-suggestion:active > .context {
background: rgba( 56, 56, 56, 1 ); background: rgba( 56, 56, 56, 1 );
color: rgba( 255, 255, 255, 1 ); color: rgba( 255, 255, 255, 1 );
} }

66
static/css/format-print.css
View file

@ -1,16 +1,16 @@
@import "theme-relearn-light.css"; @import "theme-relearn-light.css";
#sidebar { #R-sidebar {
display: none; display: none;
} }
#body { #R-body {
margin-left: 0 !important; margin-left: 0 !important;
margin-right: 0 !important; margin-right: 0 !important;
min-width: 100% !important; min-width: 100% !important;
max-width: 100% !important; max-width: 100% !important;
width: 100% !important; width: 100% !important;
} }
#body #navigation { #R-body #navigation {
display: none; display: none;
} }
html{ html{
@ -27,7 +27,7 @@ code.copy-to-clipboard-code {
pre { pre {
border: 1px solid rgba( 204, 204, 204, 1 ); border: 1px solid rgba( 204, 204, 204, 1 );
} }
#body #topbar{ #R-body #R-topbar{
background-color: rgba( 255, 255, 255, 1 ); /* avoid background bleeding*/ background-color: rgba( 255, 255, 255, 1 ); /* avoid background bleeding*/
border-bottom: 1px solid rgba( 221, 221, 221, 1 ); border-bottom: 1px solid rgba( 221, 221, 221, 1 );
border-radius: 0; border-radius: 0;
@ -35,36 +35,36 @@ pre {
padding-left: 0; /* for print, we want to align with the footer to ease the layout */ padding-left: 0; /* for print, we want to align with the footer to ease the layout */
padding-right: 0; padding-right: 0;
} }
#body .topbar-button { #R-body .topbar-button {
/* we don't need the buttons while printing */ /* we don't need the buttons while printing */
display: none; display: none;
} }
@media screen and (max-width: 48rem) { @media screen and (max-width: 48rem) {
#body .topbar-breadcrumbs { #R-body .topbar-breadcrumbs {
visibility: visible; visibility: visible;
} }
} }
#body .copy-to-clipboard-button { #R-body .copy-to-clipboard-button {
display: none; display: none;
} }
#body h1, #body h2, #body h3, #body .article-subheading, #body h4, #body h5, #body h6 { #R-body h1, #R-body h2, #R-body h3, #R-body .article-subheading, #R-body h4, #R-body h5, #R-body h6 {
/* better contrast for colored elements */ /* better contrast for colored elements */
color: rgba( 0, 0, 0, 1 ); color: rgba( 0, 0, 0, 1 );
} }
#body th, #body td, #R-body th, #R-body td,
#body code, #body strong, #body b, #R-body code, #R-body strong, #R-body b,
#body li, #body dd, #body dt, #R-body li, #R-body dd, #R-body dt,
#body p, #R-body p,
#body a, #body button, #body .badge .badge-content { #R-body a, #R-body button, #R-body .badge .badge-content {
/* better contrast for colored elements */ /* better contrast for colored elements */
color: rgba( 0, 0, 0, 1 ); color: rgba( 0, 0, 0, 1 );
} }
#body .anchor{ #R-body .anchor{
display: none; display: none;
} }
#body pre, #R-body pre,
#body code { #R-body code {
background-color: rgba( 255, 255, 255, 1 ); background-color: rgba( 255, 255, 255, 1 );
border-color: rgba( 221, 221, 221, 1 ); border-color: rgba( 221, 221, 221, 1 );
} }
@ -73,21 +73,21 @@ hr{
border-bottom: 1px solid rgba( 221, 221, 221, 1 ); border-bottom: 1px solid rgba( 221, 221, 221, 1 );
} }
body, body,
#body, #R-body,
#body-inner { #R-body-inner {
overflow: visible !important; /* turn off limitations for perfect scrollbar */ overflow: visible !important; /* turn off limitations for perfect scrollbar */
} }
#body #body-inner { #R-body #R-body-inner {
/* reset paddings for chapters in screen */ /* reset paddings for chapters in screen */
padding: 0 3.25rem 4rem 3.25rem; padding: 0 3.25rem 4rem 3.25rem;
} }
#body #body-inner h1 { #R-body #R-body-inner h1 {
border-bottom: 1px solid rgba( 221, 221, 221, 1 ); border-bottom: 1px solid rgba( 221, 221, 221, 1 );
margin-bottom: 2rem; margin-bottom: 2rem;
padding-bottom: .75rem; padding-bottom: .75rem;
} }
#body-inner .chapter h3:first-of-type { #R-body-inner .chapter h3:first-of-type {
margin-top: 2rem; margin-top: 2rem;
} }
@ -112,26 +112,26 @@ h1 + .footline{
display: none; display: none;
} }
#body #body-inner .headline a, #R-body #R-body-inner .headline a,
#body #body-inner .footline a, #R-body #R-body-inner .footline a,
#body #body-inner .btn a { #R-body #R-body-inner .btn a {
text-decoration: none; text-decoration: none;
} }
#body #body-inner a { #R-body #R-body-inner a {
/* in print we want to distinguish links in our content from /* in print we want to distinguish links in our content from
normal text even if printed black/white; normal text even if printed black/white;
don't use a.highlight in selector to also get links that are don't use a.highlight in selector to also get links that are
put as HTML into markdown */ put as HTML into markdown */
text-decoration-line: underline; text-decoration-line: underline;
} }
#topbar{ #R-topbar{
/* the header is sticky which is not suitable for print; */ /* the header is sticky which is not suitable for print; */
position: inherit; /* IE11 doesn't know "initial" here */ position: inherit; /* IE11 doesn't know "initial" here */
} }
#topbar > .topbar-wrapper { #R-topbar > .topbar-wrapper {
background-color: rgba( 255, 255, 255, 1 ); /* IE11 doesn't know "initial" here */ background-color: rgba( 255, 255, 255, 1 ); /* IE11 doesn't know "initial" here */
} }
#body .topbar-sidebar-divider { #R-body .topbar-sidebar-divider {
border-width: 0; border-width: 0;
} }
.tags { .tags {
@ -151,17 +151,17 @@ div.box > .box-content {
} }
.btn, .btn,
#body .tab-nav-button { #R-body .tab-nav-button {
color: rgba( 0, 0, 0, 1 ); color: rgba( 0, 0, 0, 1 );
} }
#body .tab-nav-button.active { #R-body .tab-nav-button.active {
border-bottom-color: rgba( 255, 255, 255, 1 ); border-bottom-color: rgba( 255, 255, 255, 1 );
color: rgba( 0, 0, 0, 1 ); color: rgba( 0, 0, 0, 1 );
} }
#body .tab-nav-button.active > * { #R-body .tab-nav-button.active > * {
background-color: rgba( 255, 255, 255, 1 ); background-color: rgba( 255, 255, 255, 1 );
} }
#body .tab-content-text { #R-body .tab-content-text {
background-color: rgba( 255, 255, 255, 1 ) ; background-color: rgba( 255, 255, 255, 1 ) ;
color: rgba( 0, 0, 0, 1 ); color: rgba( 0, 0, 0, 1 );
} }
@ -169,6 +169,6 @@ div.box > .box-content {
article { article {
break-before: page; break-before: page;
} }
#body-inner > * > article:first-of-type { #R-body-inner > * > article:first-of-type {
break-before: avoid; break-before: avoid;
} }

148
static/css/ie.css
View file

@ -15,10 +15,10 @@
padding-left: 0.85rem; padding-left: 0.85rem;
} }
/* theme */ /* theme */
#sidebar { #R-sidebar {
left: 0; left: 0;
} }
#header { #R-header {
border-right: 1px solid transparent; border-right: 1px solid transparent;
} }
.searchbox > :first-child { .searchbox > :first-child {
@ -31,16 +31,16 @@
padding-left: 1.8rem; padding-left: 1.8rem;
padding-right: 1.6rem; padding-right: 1.6rem;
} }
#sidebar ul li.visited + span { #R-sidebar ul li.visited + span {
margin-right: 1rem; margin-right: 1rem;
} }
#sidebar ul li .read-icon { #R-sidebar ul li .read-icon {
right: 1rem; right: 1rem;
} }
#sidebar .nav-title { #R-sidebar .nav-title {
padding-left: 1rem; padding-left: 1rem;
} }
#body { #R-body {
margin-left: 18.75rem; margin-left: 18.75rem;
} }
h2, h3, h4, h5, h6 { h2, h3, h4, h5, h6 {
@ -55,11 +55,11 @@
div.attachments .box-content { div.attachments .box-content {
padding-left: 1.75rem; padding-left: 1.75rem;
} }
#body-inner ul.children-h2, #R-body-inner ul.children-h2,
#body-inner ul.children-h3, #R-body-inner ul.children-h3,
#body-inner ul.children-h4, #R-body-inner ul.children-h4,
#body-inner ul.children-h5, #R-body-inner ul.children-h5,
#body-inner ul.children-h6 { #R-body-inner ul.children-h6 {
/* if we display children with style=h2 but without a containerstyle /* if we display children with style=h2 but without a containerstyle
a ul will be used for structuring; we remove default indention for uls a ul will be used for structuring; we remove default indention for uls
in this case */ in this case */
@ -76,7 +76,7 @@
.topbar-wrapper > .topbar-area-end > .topbar-button > .topbar-control { .topbar-wrapper > .topbar-area-end > .topbar-button > .topbar-control {
border-left: 1px solid rgba( 134, 134, 134, .333 ); border-left: 1px solid rgba( 134, 134, 134, .333 );
} }
#body .topbar-sidebar-divider { #R-body .topbar-sidebar-divider {
border-left-style: solid; border-left-style: solid;
border-left-width: 1px; border-left-width: 1px;
margin-right: -1px; margin-right: -1px;
@ -89,21 +89,21 @@
left: 1rem; left: 1rem;
} }
@media screen and (max-width: 60rem) { @media screen and (max-width: 60rem) {
#body { #R-body {
margin-left: 14.375rem; margin-left: 14.375rem;
} }
} }
@media screen and (max-width: 48rem) { @media screen and (max-width: 48rem) {
.mobile-support #sidebar { .mobile-support #R-sidebar {
left: -14.375rem; left: -14.375rem;
} }
.mobile-support #body { .mobile-support #R-body {
margin-left: 0; margin-left: 0;
} }
.mobile-support.sidebar-flyout #sidebar { .mobile-support.sidebar-flyout #R-sidebar {
left: 0; left: 0;
} }
.mobile-support.sidebar-flyout #body { .mobile-support.sidebar-flyout #R-body {
margin-left: 14.375rem; margin-left: 14.375rem;
} }
} }
@ -167,10 +167,10 @@
margin-left: -1rem; margin-left: -1rem;
} }
/* tabs */ /* tabs */
#body .tab-nav-button { #R-body .tab-nav-button {
margin-left: .6rem; margin-left: .6rem;
} }
#body .tab-content{ #R-body .tab-content{
margin-top: -1px; margin-top: -1px;
} }
/* auto-complete */ /* auto-complete */
@ -181,25 +181,25 @@
margin-left: 1em; margin-left: 1em;
} }
/* menu */ /* menu */
#sidebar ul ul { #R-sidebar ul ul {
padding-left: 1rem; padding-left: 1rem;
} }
#sidebar ul.collapsible-menu > li > label { #R-sidebar ul.collapsible-menu > li > label {
left: 0; left: 0;
padding-left: .125rem; padding-left: .125rem;
} }
html[dir="rtl"] #sidebar ul.collapsible-menu > li > label > i.fa-chevron-right { html[dir="rtl"] #R-sidebar ul.collapsible-menu > li > label > i.fa-chevron-right {
transform: scaleX(1); transform: scaleX(1);
} }
#header-topbar { #R-header-topbar {
border-right-style: solid; border-right-style: solid;
border-right-width: 1px; border-right-width: 1px;
} }
#header-wrapper, #R-header-wrapper,
#homelinks, #R-homelinks,
#content-wrapper > * { #R-content-wrapper > * {
border-right-style: solid; border-right-style: solid;
border-right-width: 1px; border-right-width: 1px;
} }
@ -218,15 +218,15 @@
a, a,
.anchor, .anchor,
.topbar-button button, .topbar-button button,
#searchresults .autocomplete-suggestion { #R-searchresults .autocomplete-suggestion {
color: rgba( 72, 106, 201, 1 ); /* var(--MAIN-LINK-color) */ color: rgba( 72, 106, 201, 1 ); /* var(--MAIN-LINK-color) */
} }
#body .topbar-sidebar-divider { #R-body .topbar-sidebar-divider {
border-left-color: rgba( 125, 201, 3, 1 ); /* var(--MENU-TOPBAR-SEPARATOR-color) */ border-left-color: rgba( 125, 201, 3, 1 ); /* var(--MENU-TOPBAR-SEPARATOR-color) */
} }
@media screen and (max-width: 48rem) { @media screen and (max-width: 48rem) {
#body .topbar-sidebar-divider { #R-body .topbar-sidebar-divider {
border-left-color: transparent; border-left-color: transparent;
} }
} }
@ -237,11 +237,11 @@
color: rgba( 32, 40, 145, 1 ); /* var(--MAIN-LINK-HOVER-color) */ color: rgba( 32, 40, 145, 1 ); /* var(--MAIN-LINK-HOVER-color) */
} }
#sidebar { #R-sidebar {
background: rgba( 40, 40, 40, 1 ); /* var(--MENU-SECTIONS-BG-color) */ background: rgba( 40, 40, 40, 1 ); /* var(--MENU-SECTIONS-BG-color) */
} }
#header-wrapper { #R-header-wrapper {
/* initially use section background to avoid flickering on load when a /* initially use section background to avoid flickering on load when a
non default variant is active */ non default variant is active */
background-color: rgba( 0, 0, 0, 0 ); /* var(--MENU-SECTIONS-BG-color) */ background-color: rgba( 0, 0, 0, 0 ); /* var(--MENU-SECTIONS-BG-color) */
@ -258,8 +258,8 @@
opacity: .45; opacity: .45;
} }
#sidebar .searchbox > :first-child, #R-sidebar .searchbox > :first-child,
#sidebar .searchbox > :last-child { #R-sidebar .searchbox > :last-child {
color: rgba( 224, 224, 224, 1 ); /* var(--INTERNAL-MENU-SEARCH-color) */ color: rgba( 224, 224, 224, 1 ); /* var(--INTERNAL-MENU-SEARCH-color) */
} }
@ -268,51 +268,51 @@
opacity: .666; opacity: .666;
} }
#sidebar .collapsible-menu label, #R-sidebar .collapsible-menu label,
#sidebar .menu-control, #R-sidebar .menu-control,
#sidebar :is( a, span ) { #R-sidebar :is( a, span ) {
color: rgba( 186, 186, 186, 1 ); /* var(--MENU-SECTIONS-LINK-color) */ color: rgba( 186, 186, 186, 1 ); /* var(--MENU-SECTIONS-LINK-color) */
} }
#sidebar select:hover, #R-sidebar select:hover,
#sidebar .collapsible-menu li:not(.active) > label:hover, #R-sidebar .collapsible-menu li:not(.active) > label:hover,
#sidebar .menu-control:hover, #R-sidebar .menu-control:hover,
#sidebar a:hover { #R-sidebar a:hover {
color: rgba( 255, 255, 255, 1 ); /* var(--MENU-SECTIONS-LINK-HOVER-color) */ color: rgba( 255, 255, 255, 1 ); /* var(--MENU-SECTIONS-LINK-HOVER-color) */
} }
#sidebar .menu-control button, #R-sidebar .menu-control button,
#sidebar .menu-control select{ #R-sidebar .menu-control select{
outline-color: rgba( 255, 255, 255, 1 ); /* var(--MENU-SECTIONS-LINK-HOVER-color) */ outline-color: rgba( 255, 255, 255, 1 ); /* var(--MENU-SECTIONS-LINK-HOVER-color) */
} }
#sidebar ul.enlarge > li.parent, #R-sidebar ul.enlarge > li.parent,
#sidebar ul.enlarge > li.active { #R-sidebar ul.enlarge > li.active {
background-color: rgba( 0, 0, 0, .166 ); /* var(--MENU-SECTIONS-ACTIVE-BG-color) */ background-color: rgba( 0, 0, 0, .166 ); /* var(--MENU-SECTIONS-ACTIVE-BG-color) */
} }
#sidebar li.active > label, #R-sidebar li.active > label,
#sidebar li.active > a { #R-sidebar li.active > a {
color: rgba( 68, 68, 68, 1 ); /* var(--MENU-SECTION-ACTIVE-CATEGORY-color) */ color: rgba( 68, 68, 68, 1 ); /* var(--MENU-SECTION-ACTIVE-CATEGORY-color) */
} }
#sidebar li.active > a { #R-sidebar li.active > a {
background-color: rgba( 255, 255, 255, 1 ); /* var(--MENU-SECTION-ACTIVE-CATEGORY-BG-color) */ background-color: rgba( 255, 255, 255, 1 ); /* var(--MENU-SECTION-ACTIVE-CATEGORY-BG-color) */
} }
#sidebar ul li > a .read-icon { #R-sidebar ul li > a .read-icon {
color: rgba( 72, 106, 201, 1 ); /* var(--MENU-VISITED-color) */ color: rgba( 72, 106, 201, 1 ); /* var(--MENU-VISITED-color) */
} }
#sidebar .nav-title { #R-sidebar .nav-title {
color: rgba( 186, 186, 186, 1 ); /* var(--MENU-SECTIONS-LINK-color) */ color: rgba( 186, 186, 186, 1 ); /* var(--MENU-SECTIONS-LINK-color) */
} }
#content-wrapper hr { #R-content-wrapper hr {
border-color: rgba( 96, 96, 96, 1 ); /* var(--MENU-SECTION-SEPARATOR-color) */ border-color: rgba( 96, 96, 96, 1 ); /* var(--MENU-SECTION-SEPARATOR-color) */
} }
#footer { #R-footer {
color: rgba( 186, 186, 186, 1 ); /* var(--MENU-SECTIONS-LINK-color) */ color: rgba( 186, 186, 186, 1 ); /* var(--MENU-SECTIONS-LINK-color) */
} }
@ -511,12 +511,12 @@
background-color: rgba( 255, 255, 255, 1 ) /* var(--INTERNAL-MAIN-BG-color); */ background-color: rgba( 255, 255, 255, 1 ) /* var(--INTERNAL-MAIN-BG-color); */
} }
#topbar { #R-topbar {
background-color: rgba( 255, 255, 255, 1 ); /* var(--MAIN-BG-color) */ background-color: rgba( 255, 255, 255, 1 ); /* var(--MAIN-BG-color) */
} }
#body a[aria-disabled="true"], #R-body a[aria-disabled="true"],
#searchresults .autocomplete-suggestion > .context { #R-searchresults .autocomplete-suggestion > .context {
color: rgba( 16, 16, 16, 1 ); /* var(--MAIN-TEXT-color) - inherit is not processed correctly in Chrome */ color: rgba( 16, 16, 16, 1 ); /* var(--MAIN-TEXT-color) - inherit is not processed correctly in Chrome */
} }
@ -547,19 +547,19 @@
color: rgba( 248, 248, 248, 1 ); /* var(--CODE-BLOCK-BG-color) */ color: rgba( 248, 248, 248, 1 ); /* var(--CODE-BLOCK-BG-color) */
} }
#homelinks { #R-homelinks {
background-color: rgba( 125, 201, 3, 1 ); /* var(--MENU-HEADER-BORDER-color) */ background-color: rgba( 125, 201, 3, 1 ); /* var(--MENU-HEADER-BORDER-color) */
} }
#homelinks a { #R-homelinks a {
color: rgba( 64, 64, 64, 1 ) /* var(--MENU-HOME-LINK-color) */ color: rgba( 64, 64, 64, 1 ) /* var(--MENU-HOME-LINK-color) */
} }
#homelinks a:hover { #R-homelinks a:hover {
color: rgba( 128, 128, 128, 1 ) /* var(--MENU-HOME-LINK-HOVER-color) */; color: rgba( 128, 128, 128, 1 ) /* var(--MENU-HOME-LINK-HOVER-color) */;
} }
#homelinks hr { #R-homelinks hr {
border-color: rgba( 125, 201, 3, 1 ); /* var(--MENU-HEADER-SEPARATOR-color) */ border-color: rgba( 125, 201, 3, 1 ); /* var(--MENU-HEADER-SEPARATOR-color) */
} }
@ -694,17 +694,17 @@
color: rgba( 74, 74, 74, 1 ); /* var(--MAIN-TITLES-TEXT-color) */ color: rgba( 74, 74, 74, 1 ); /* var(--MAIN-TITLES-TEXT-color) */
} }
#body .tags a.tag-link { #R-body .tags a.tag-link {
background-color: rgba( 125, 201, 3, 1 ); /* var(--TAG-BG-color) */ background-color: rgba( 125, 201, 3, 1 ); /* var(--TAG-BG-color) */
color: rgba( 255, 255, 255, 1 ); /* var(--MAIN-BG-color) */ color: rgba( 255, 255, 255, 1 ); /* var(--MAIN-BG-color) */
margin-right: 16px; margin-right: 16px;
} }
#body .tags a.tag-link:before { #R-body .tags a.tag-link:before {
border-right-color: rgba( 125, 201, 3, 1 ); /* var(--TAG-BG-color) */ border-right-color: rgba( 125, 201, 3, 1 ); /* var(--TAG-BG-color) */
} }
#body .tags a.tag-link:after { #R-body .tags a.tag-link:after {
background: rgba( 255, 255, 255, 1 ); /* var(--MAIN-BG-color) */ background: rgba( 255, 255, 255, 1 ); /* var(--MAIN-BG-color) */
} }
@ -780,11 +780,11 @@
} }
/* no style support for tabs in IE11; all styled as default */ /* no style support for tabs in IE11; all styled as default */
#body .tab-nav-button { #R-body .tab-nav-button {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-MAIN-TEXT-color) */ color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-MAIN-TEXT-color) */
} }
#body .tab-nav-button.active { #R-body .tab-nav-button.active {
background-color: rgba( 255, 255, 255, 1 ); /* var(--VARIABLE-BOX-BG-color) */ background-color: rgba( 255, 255, 255, 1 ); /* var(--VARIABLE-BOX-BG-color) */
border-bottom-color: rgba( 255, 255, 255, 1 ); /* var(--VARIABLE-BOX-BG-color) */ border-bottom-color: rgba( 255, 255, 255, 1 ); /* var(--VARIABLE-BOX-BG-color) */
border-left-color: rgba( 134, 134, 134, .4 ); /* var(--VARIABLE-BOX-color) */ border-left-color: rgba( 134, 134, 134, .4 ); /* var(--VARIABLE-BOX-color) */
@ -793,40 +793,40 @@
color: rgba( 16, 16, 16, 1 ); /* var(--VARIABLE-BOX-TEXT-color) */ color: rgba( 16, 16, 16, 1 ); /* var(--VARIABLE-BOX-TEXT-color) */
} }
#body .tab-nav-button.active > *{ #R-body .tab-nav-button.active > *{
background-color: rgba( 255, 255, 255, 1 ); /* var(--VARIABLE-BOX-BG-color) */ background-color: rgba( 255, 255, 255, 1 ); /* var(--VARIABLE-BOX-BG-color) */
} }
#body .tab-nav-button > * > *{ #R-body .tab-nav-button > * > *{
border-color: rgba( 134, 134, 134, .4 ); /* var(--VARIABLE-BOX-color) */ border-color: rgba( 134, 134, 134, .4 ); /* var(--VARIABLE-BOX-color) */
} }
#body .tab-content{ #R-body .tab-content{
background-color: rgba( 255, 255, 255, 1 ); /* var(--VARIABLE-BOX-BG-color) */ background-color: rgba( 255, 255, 255, 1 ); /* var(--VARIABLE-BOX-BG-color) */
border-color: rgba( 134, 134, 134, .4 ); /* var(--VARIABLE-BOX-color) */ border-color: rgba( 134, 134, 134, .4 ); /* var(--VARIABLE-BOX-color) */
} }
#body .tab-content-text{ #R-body .tab-content-text{
background-color: rgba( 255, 255, 255, 1 ); /* var(--VARIABLE-BOX-BG-color) */ background-color: rgba( 255, 255, 255, 1 ); /* var(--VARIABLE-BOX-BG-color) */
color: rgba( 16, 16, 16, 1 ); /* var(--VARIABLE-BOX-TEXT-color) */ color: rgba( 16, 16, 16, 1 ); /* var(--VARIABLE-BOX-TEXT-color) */
} }
#topbar { #R-topbar {
border-bottom-color: transparent; /* var(--MAIN-TOPBAR-BORDER-color) */ border-bottom-color: transparent; /* var(--MAIN-TOPBAR-BORDER-color) */
} }
#header-topbar { #R-header-topbar {
border-bottom-color: transparent; border-bottom-color: transparent;
border-right-color: transparent; /* var(--MENU-TOPBAR-BORDER-color) */ border-right-color: transparent; /* var(--MENU-TOPBAR-BORDER-color) */
} }
#header-wrapper, #R-header-wrapper,
#homelinks, #R-homelinks,
#content-wrapper > * { #R-content-wrapper > * {
border-right-color: transparent; /* var(--MENU-BORDER-color) */ border-right-color: transparent; /* var(--MENU-BORDER-color) */
} }
#sidebar ul.collapsible-menu li.active > a{ #R-sidebar ul.collapsible-menu li.active > a{
border-bottom-color: transparent; /* var(--MENU-BORDER-color) */ border-bottom-color: transparent; /* var(--MENU-BORDER-color) */
border-top-color: transparent; /* var(--MENU-BORDER-color) */ border-top-color: transparent; /* var(--MENU-BORDER-color) */
border-left-color: transparent; /* var(--MENU-BORDER-color) */ border-left-color: transparent; /* var(--MENU-BORDER-color) */
@ -843,7 +843,7 @@
} }
/* our silly dinosaur browser wants to have the real colors */ /* our silly dinosaur browser wants to have the real colors */
#header-wrapper { #R-header-wrapper {
background-color: rgba( 125, 201, 3, 1 ); /* var(--MENU-HEADER-BG-color) */ background-color: rgba( 125, 201, 3, 1 ); /* var(--MENU-HEADER-BG-color) */
border-bottom-color: rgba( 125, 201, 3, 1 ); /* var(--MENU-HEADER-BORDER-color) */ border-bottom-color: rgba( 125, 201, 3, 1 ); /* var(--MENU-HEADER-BORDER-color) */
} }

8
static/css/tags.css
View file

@ -5,7 +5,7 @@
margin-top:1rem; margin-top:1rem;
} }
#body .tags a.tag-link { #R-body .tags a.tag-link {
border-bottom-right-radius: 3px; border-bottom-right-radius: 3px;
border-top-right-radius: 3px; border-top-right-radius: 3px;
box-shadow: 0 1px 2px rgba( 0, 0, 0, .2 ); box-shadow: 0 1px 2px rgba( 0, 0, 0, .2 );
@ -19,7 +19,7 @@
position: relative; position: relative;
} }
#body .tags a.tag-link:before { #R-body .tags a.tag-link:before {
border-color: transparent; border-color: transparent;
border-style: solid; border-style: solid;
border-width: 1em 1em 1em 0; border-width: 1em 1em 1em 0;
@ -31,7 +31,7 @@
width: 0; width: 0;
} }
#body .tags a.tag-link:after { #R-body .tags a.tag-link:after {
border-radius: 100%; border-radius: 100%;
content: ""; content: "";
left: 1px; left: 1px;
@ -41,6 +41,6 @@
width: 5px; width: 5px;
} }
#body .tags a.tag-link:hover:after { #R-body .tags a.tag-link:hover:after {
width: 5px; width: 5px;
} }

8
static/css/theme-learn.css
View file

@ -48,10 +48,10 @@
--BOX-TEXT-color: rgba( 16, 16, 16, 1 ); /* fixed color of the content text */ --BOX-TEXT-color: rgba( 16, 16, 16, 1 ); /* fixed color of the content text */
} }
body a#logo, body a#R-logo,
body a#logo:hover, body a#R-logo:hover,
body #logo svg, body #R-logo svg,
body #logo svg * { body #R-logo svg * {
color: var(--INTERNAL-MENU-SEARCH-color); color: var(--INTERNAL-MENU-SEARCH-color);
fill: var(--INTERNAL-MENU-SEARCH-color) !important; fill: var(--INTERNAL-MENU-SEARCH-color) !important;
} }

84
static/css/theme-neon.css
View file

@ -72,15 +72,15 @@
--BOX-RED-TEXT-color: var( --BOX-RED-color ); /* text color of red boxes */ --BOX-RED-TEXT-color: var( --BOX-RED-color ); /* text color of red boxes */
} }
body a#logo, body a#R-logo,
body a#logo:hover, body a#R-logo:hover,
body #logo svg, body #R-logo svg,
body #logo svg * { body #R-logo svg * {
color: var(--INTERNAL-MENU-SEARCH-BORDER-color); color: var(--INTERNAL-MENU-SEARCH-BORDER-color);
fill: var(--INTERNAL-MENU-SEARCH-BORDER-color) !important; fill: var(--INTERNAL-MENU-SEARCH-BORDER-color) !important;
} }
body a#logo{ body a#R-logo{
text-shadow: text-shadow:
0 0 1px var(--INTERNAL-MENU-SEARCH-BORDER-color), 0 0 1px var(--INTERNAL-MENU-SEARCH-BORDER-color),
0 0 2px var(--INTERNAL-MENU-SEARCH-BORDER-color), 0 0 2px var(--INTERNAL-MENU-SEARCH-BORDER-color),
@ -161,7 +161,7 @@ body h6 {
color: rgba( 255, 255, 255, 1 ) !important; color: rgba( 255, 255, 255, 1 ) !important;
} }
body #sidebar .searchbox button:hover{ body #R-sidebar .searchbox button:hover{
color: rgba( 255, 255, 255, 1 ); color: rgba( 255, 255, 255, 1 );
text-shadow: text-shadow:
0 0 1px rgba( 255, 255, 255, 1 ), 0 0 1px rgba( 255, 255, 255, 1 ),
@ -171,10 +171,10 @@ body #sidebar .searchbox button:hover{
0 0 8px var(--INTERNAL-MENU-SEARCH-color); 0 0 8px var(--INTERNAL-MENU-SEARCH-color);
} }
body #sidebar select:hover, body #R-sidebar select:hover,
body #sidebar .collapsible-menu li:not(.active) > label:hover, body #R-sidebar .collapsible-menu li:not(.active) > label:hover,
body #sidebar .menu-control:hover, body #R-sidebar .menu-control:hover,
body #sidebar a:hover { body #R-sidebar a:hover {
color: rgba( 255, 255, 255, 1 ); color: rgba( 255, 255, 255, 1 );
text-shadow: text-shadow:
0 0 1px rgba( 255, 255, 255, 1 ), 0 0 1px rgba( 255, 255, 255, 1 ),
@ -184,8 +184,8 @@ body #sidebar a:hover {
0 0 8px var(--INTERNAL-MENU-SECTIONS-LINK-HOVER-color); 0 0 8px var(--INTERNAL-MENU-SECTIONS-LINK-HOVER-color);
} }
body #sidebar li.active > label, body #R-sidebar li.active > label,
body #sidebar li.active > :is( a, span ) { body #R-sidebar li.active > :is( a, span ) {
color: rgba( 255, 255, 255, 1 ); color: rgba( 255, 255, 255, 1 );
text-shadow: text-shadow:
0 0 1px rgba( 255, 255, 255, 1 ), 0 0 1px rgba( 255, 255, 255, 1 ),
@ -195,7 +195,7 @@ body #sidebar li.active > :is( a, span ) {
0 0 8px var(--INTERNAL-MENU-SECTION-ACTIVE-CATEGORY-color); 0 0 8px var(--INTERNAL-MENU-SECTION-ACTIVE-CATEGORY-color);
} }
body #homelinks a:hover { body #R-homelinks a:hover {
color: rgba( 255, 255, 255, 1 ); color: rgba( 255, 255, 255, 1 );
text-shadow: text-shadow:
0 0 1px rgba( 255, 255, 255, 1 ), 0 0 1px rgba( 255, 255, 255, 1 ),
@ -264,54 +264,54 @@ body .box.cstyle.transparent {
} }
@media print { @media print {
#body h1, #R-body h1,
#body h2, #R-body h2,
#body h3, #body .article-subheading, #R-body h3, #R-body .article-subheading,
#body h4, #R-body h4,
#body h5, #R-body h5,
#body h6 { #R-body h6 {
text-shadow: none; text-shadow: none;
} }
#body .badge, #R-body .badge,
#body .badge > .badge-content, #R-body .badge > .badge-content,
#body .btn, #R-body .btn,
#body .btn > *, #R-body .btn > *,
#body div.box, #R-body div.box,
#body div.box > .box-label { #R-body div.box > .box-label {
box-shadow: none; box-shadow: none;
text-shadow: none; text-shadow: none;
} }
#body .badge.cstyle:not(.transparent), #R-body .badge.cstyle:not(.transparent),
#body .btn.cstyle { #R-body .btn.cstyle {
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-NEUTRAL-TEXT-color); --VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-NEUTRAL-TEXT-color);
} }
} }
/* if we are in print chapter preview our @media statement from /* if we are in print chapter preview our @media statement from
above will not apply, so we have to repeat it here */ above will not apply, so we have to repeat it here */
.print #body h1, .print #R-body h1,
.print #body h2, .print #R-body h2,
.print #body h3, .print #body .article-subheading, .print #R-body h3, .print #R-body .article-subheading,
.print #body h4, .print #R-body h4,
.print #body h5, .print #R-body h5,
.print #body h6 { .print #R-body h6 {
text-shadow: none; text-shadow: none;
} }
.print #body .badge, .print #R-body .badge,
.print #body .badge > .badge-content, .print #R-body .badge > .badge-content,
.print #body .btn, .print #R-body .btn,
.print #body .btn > *, .print #R-body .btn > *,
.print #body div.box, .print #R-body div.box,
.print #body div.box > .box-label { .print #R-body div.box > .box-label {
box-shadow: none; box-shadow: none;
text-shadow: none; text-shadow: none;
} }
.print #body .badge.cstyle:not(.transparent), .print #R-body .badge.cstyle:not(.transparent),
.print #body .btn.cstyle { .print #R-body .btn.cstyle {
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-NEUTRAL-TEXT-color); --VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-NEUTRAL-TEXT-color);
} }
#content-wrapper { #R-content-wrapper {
--ps-thumb-color: rgba( 208, 208, 208, 1 ); --ps-thumb-color: rgba( 208, 208, 208, 1 );
--ps-thumb-hover-color: rgba( 204, 204, 204, 1 ); --ps-thumb-hover-color: rgba( 204, 204, 204, 1 );
} }

8
static/css/theme-relearn-bright.css
View file

@ -51,10 +51,10 @@
--BOX-TEXT-color: rgba( 16, 16, 16, 1 ); /* text color of colored box content */ --BOX-TEXT-color: rgba( 16, 16, 16, 1 ); /* text color of colored box content */
} }
body a#logo, body a#R-logo,
body a#logo:hover, body a#R-logo:hover,
body #logo svg, body #R-logo svg,
body #logo svg * { body #R-logo svg * {
color: var(--MENU-SEARCH-color); color: var(--MENU-SEARCH-color);
fill: var(--MENU-SEARCH-color) !important; fill: var(--MENU-SEARCH-color) !important;
} }

8
static/css/theme-zen-dark.css
View file

@ -58,10 +58,10 @@
--BOX-GREY-color: rgba( 71, 71, 71, 1 ); /* background color of grey boxes */ --BOX-GREY-color: rgba( 71, 71, 71, 1 ); /* background color of grey boxes */
} }
body a#logo, body a#R-logo,
body a#logo:hover, body a#R-logo:hover,
body #logo svg, body #R-logo svg,
body #logo svg * { body #R-logo svg * {
color: var(--MENU-HOME-LINK-color); color: var(--MENU-HOME-LINK-color);
fill: var(--MENU-HOME-LINK-color) !important; fill: var(--MENU-HOME-LINK-color) !important;
} }

8
static/css/theme-zen-light.css
View file

@ -58,10 +58,10 @@
--BOX-GREY-color: rgba( 210, 210, 210, 1 ); /* background color of grey boxes */ --BOX-GREY-color: rgba( 210, 210, 210, 1 ); /* background color of grey boxes */
} }
body a#logo, body a#R-logo,
body a#logo:hover, body a#R-logo:hover,
body #logo svg, body #R-logo svg,
body #logo svg * { body #R-logo svg * {
color: var(--MENU-HOME-LINK-color); color: var(--MENU-HOME-LINK-color);
fill: var(--MENU-HOME-LINK-color) !important; fill: var(--MENU-HOME-LINK-color) !important;
} }

356
static/css/theme.css
View file

@ -149,7 +149,7 @@ dd {
transition: all 0.35s ease; transition: all 0.35s ease;
} }
#sidebar { #R-sidebar {
display: flex; display: flex;
flex-basis: auto; flex-basis: auto;
flex-direction: column; flex-direction: column;
@ -166,21 +166,21 @@ dd {
width: 18.75rem; width: 18.75rem;
} }
#sidebar a{ #R-sidebar a{
text-decoration: none; text-decoration: none;
} }
#header-wrapper { #R-header-wrapper {
text-align: center; text-align: center;
padding: 1rem; padding: 1rem;
position: relative; position: relative;
} }
#header { #R-header {
border-block-end: 1px solid transparent; border-block-end: 1px solid transparent;
position: relative; position: relative;
z-index: 1; z-index: 1;
} }
#header a { #R-header a {
display: inline-block; display: inline-block;
} }
@ -216,12 +216,12 @@ dd {
position: absolute; position: absolute;
} }
#sidebar .searchbox > :first-child, #R-sidebar .searchbox > :first-child,
#sidebar .searchbox > :last-child{ #R-sidebar .searchbox > :last-child{
opacity: .65; opacity: .65;
} }
#sidebar .searchbox button:hover { #R-sidebar .searchbox button:hover {
opacity: 1; opacity: 1;
} }
@ -243,7 +243,7 @@ dd {
opacity: .45; opacity: .45;
} }
#content-wrapper { #R-content-wrapper {
--ps-rail-hover-color: rgba( 176, 176, 176, .25 ); --ps-rail-hover-color: rgba( 176, 176, 176, .25 );
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -253,7 +253,7 @@ dd {
z-index: 100; z-index: 100;
} }
#sidebar .padding { #R-sidebar .padding {
padding: 0 1rem; padding: 0 1rem;
} }
@ -268,31 +268,31 @@ dd {
margin: 0 auto; margin: 0 auto;
} }
#footer > hr:first-child { #R-footer > hr:first-child {
margin-top: 0; margin-top: 0;
} }
/* increase specifity to override following #content-wrapper hr style */ /* increase specifity to override following #R-content-wrapper hr style */
#footer > hr:nth-child(n) { #R-footer > hr:nth-child(n) {
margin-left: 0; margin-left: 0;
margin-right: 0; margin-right: 0;
} }
#sidebar ul { #R-sidebar ul {
list-style: none; list-style: none;
padding: 0; padding: 0;
margin: 0; margin: 0;
} }
#sidebar ul li { #R-sidebar ul li {
padding: 0; padding: 0;
} }
#sidebar ul li.visited + span { #R-sidebar ul li.visited + span {
margin-inline-end: 1rem; margin-inline-end: 1rem;
} }
#sidebar ul li .read-icon { #R-sidebar ul li .read-icon {
display: none; display: none;
font-size: .8125rem; font-size: .8125rem;
inset-inline-end: 1rem; inset-inline-end: 1rem;
@ -301,11 +301,11 @@ dd {
position: absolute; position: absolute;
} }
#sidebar ul li.visited > a .read-icon { #R-sidebar ul li.visited > a .read-icon {
display: inline; display: inline;
} }
#sidebar .nav-title { #R-sidebar .nav-title {
font-size: 2rem; font-size: 2rem;
font-weight: 200; font-weight: 200;
letter-spacing: -.02175em; letter-spacing: -.02175em;
@ -316,17 +316,17 @@ dd {
text-transform: uppercase; text-transform: uppercase;
} }
#sidebar .footermargin { #R-sidebar .footermargin {
flex-grow: 1; flex-grow: 1;
} }
#content-wrapper hr { #R-content-wrapper hr {
border-bottom-style: solid; border-bottom-style: solid;
border-bottom-width: 1px; border-bottom-width: 1px;
margin: 1.5rem 1rem 1rem 1rem; margin: 1.5rem 1rem 1rem 1rem;
} }
#body { #R-body {
display: flex; display: flex;
flex-basis: 100%; flex-basis: 100%;
flex-direction: column; flex-direction: column;
@ -343,40 +343,40 @@ dd {
z-index: 70; z-index: 70;
} }
#body img, #R-body img,
#body .video-container { #R-body .video-container {
display: block; display: block;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
text-align: center; text-align: center;
} }
#body img:not(.lightbox-image).left { #R-body img:not(.lightbox-image).left {
margin-left: 0; margin-left: 0;
} }
#body img:not(.lightbox-image).right { #R-body img:not(.lightbox-image).right {
margin-right: 0; margin-right: 0;
} }
#body img:not(.lightbox-image).border, #R-body img:not(.lightbox-image).border,
#body .video-container.border { #R-body .video-container.border {
background-clip: padding-box; background-clip: padding-box;
border: 1px solid rgba( 134, 134, 134, .333 ); border: 1px solid rgba( 134, 134, 134, .333 );
} }
#body img:not(.lightbox-image).shadow, #R-body img:not(.lightbox-image).shadow,
#body .video-container.shadow { #R-body .video-container.shadow {
box-shadow: 0 10px 30px rgba( 176, 176, 176, .666 ); box-shadow: 0 10px 30px rgba( 176, 176, 176, .666 );
} }
#body img:not(.lightbox-image).inline { #R-body img:not(.lightbox-image).inline {
display: inline !important; display: inline !important;
margin: 0 !important; margin: 0 !important;
vertical-align: bottom; vertical-align: bottom;
} }
#body-inner { #R-body-inner {
display: flex; display: flex;
flex: auto; flex: auto;
flex-direction: column; flex-direction: column;
@ -385,12 +385,12 @@ dd {
position: relative; /* PS */ position: relative; /* PS */
} }
@media screen and (max-width: 60rem) { @media screen and (max-width: 60rem) {
#body-inner { #R-body-inner {
padding: 0 2rem 1rem 2rem; padding: 0 2rem 1rem 2rem;
} }
} }
@media screen and (max-width: 48rem) { @media screen and (max-width: 48rem) {
#body-inner { #R-body-inner {
padding: 0 1.25rem .375rem 1.25rem; padding: 0 1.25rem .375rem 1.25rem;
} }
} }
@ -411,58 +411,58 @@ article a:focus {
text-decoration: underline; text-decoration: underline;
} }
#body-inner:focus-visible{ #R-body-inner:focus-visible{
/* remove focus indicator for programatically set focus */ /* remove focus indicator for programatically set focus */
outline: none; outline: none;
} }
#body h1 + hr { #R-body h1 + hr {
margin-bottom: 2rem; margin-bottom: 2rem;
margin-top: -1rem; margin-top: -1rem;
} }
#body .flex-block-wrapper { #R-body .flex-block-wrapper {
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
max-width: calc( 81.25rem - 18.75rem - 2 * 3.25rem ); max-width: calc( 81.25rem - 18.75rem - 2 * 3.25rem );
width: 100%; width: 100%;
} }
body:not(.print) #body .narrow .flex-block-wrapper { body:not(.print) #R-body .narrow .flex-block-wrapper {
max-width: calc( 81.25rem - 18.75rem - 2 * 9.75rem ); max-width: calc( 81.25rem - 18.75rem - 2 * 9.75rem );
} }
/* we limit width if we have large screens */ /* we limit width if we have large screens */
@media screen and ( min-width: 81.25rem ){ /* #sidebar/width + ./max-width */ @media screen and ( min-width: 81.25rem ){ /* #R-sidebar/width + ./max-width */
#body .flex-block-wrapper { #R-body .flex-block-wrapper {
width: calc( 81.25rem - 18.75rem - 2 * 3.25rem ); width: calc( 81.25rem - 18.75rem - 2 * 3.25rem );
} }
body:not(.print) #body .narrow .flex-block-wrapper { body:not(.print) #R-body .narrow .flex-block-wrapper {
width: calc( 81.25rem - 18.75rem - 2 * 9.75rem ); width: calc( 81.25rem - 18.75rem - 2 * 9.75rem );
} }
} }
body:not(.print) #body-inner.narrow { body:not(.print) #R-body-inner.narrow {
padding: 2rem 9.75rem; padding: 2rem 9.75rem;
} }
@media screen and (max-width: 60rem) { @media screen and (max-width: 60rem) {
body:not(.print) #body-inner.narrow { body:not(.print) #R-body-inner.narrow {
padding: 1rem 6.5rem; padding: 1rem 6.5rem;
} }
} }
@media screen and (max-width: 48rem) { @media screen and (max-width: 48rem) {
body:not(.print) #body-inner.narrow { body:not(.print) #R-body-inner.narrow {
padding: .375rem 3.25rem; padding: .375rem 3.25rem;
} }
} }
#body-inner div.article-subheading, #R-body-inner div.article-subheading,
#body-inner .chapter.deprecated h3:first-of-type { #R-body-inner .chapter.deprecated h3:first-of-type {
font-weight: 200; font-weight: 200;
margin-top: 0; margin-top: 0;
text-align: center; text-align: center;
} }
body:not(.print) #body-inner.narrow p { body:not(.print) #R-body-inner.narrow p {
font-size: 1.2rem; font-size: 1.2rem;
text-align: justify; text-align: justify;
} }
@ -483,17 +483,17 @@ h1 {
text-transform: uppercase; text-transform: uppercase;
} }
body:not(.print) #body-inner.narrow h1 { body:not(.print) #R-body-inner.narrow h1 {
border-bottom: 4px solid rgba( 134, 134, 134, .125 ); border-bottom: 4px solid rgba( 134, 134, 134, .125 );
font-size: 3.5rem; font-size: 3.5rem;
} }
@media only screen and (min-width: 48rem) and (max-width: 60rem) { @media only screen and (min-width: 48rem) and (max-width: 60rem) {
body:not(.print) #body-inner.narrow h1 { body:not(.print) #R-body-inner.narrow h1 {
font-size: 2.8rem; font-size: 2.8rem;
} }
} }
@media only screen and (max-width: 48rem) { @media only screen and (max-width: 48rem) {
body:not(.print) #body-inner.narrow h1 { body:not(.print) #R-body-inner.narrow h1 {
font-size: 2.5rem; font-size: 2.5rem;
} }
} }
@ -591,34 +591,34 @@ p:empty {
} }
/* in case of image render hook, Hugo may generate empty <p>s that we want to ignore aswell, so a simple :first-child or :last-child is not enough */ /* in case of image render hook, Hugo may generate empty <p>s that we want to ignore aswell, so a simple :first-child or :last-child is not enough */
#body table th > :nth-child(1 of :not(:empty)), #R-body table th > :nth-child(1 of :not(:empty)),
#body table th > :nth-child(1 of :not(:empty)) :nth-child(1 of :not(:empty)), #R-body table th > :nth-child(1 of :not(:empty)) :nth-child(1 of :not(:empty)),
#body table td > :nth-child(1 of :not(:empty)), #R-body table td > :nth-child(1 of :not(:empty)),
#body table td > :nth-child(1 of :not(:empty)) :nth-child(1 of :not(:empty)), #R-body table td > :nth-child(1 of :not(:empty)) :nth-child(1 of :not(:empty)),
#body div.box > .box-content > :nth-child(1 of :not(:empty)), #R-body div.box > .box-content > :nth-child(1 of :not(:empty)),
#body div.box > .box-content > :nth-child(1 of :not(:empty)) :nth-child(1 of :not(:empty)), #R-body div.box > .box-content > :nth-child(1 of :not(:empty)) :nth-child(1 of :not(:empty)),
#body div.expand > .expand-content-text > :nth-child(1 of :not(:empty)), #R-body div.expand > .expand-content-text > :nth-child(1 of :not(:empty)),
#body div.expand > .expand-content-text > :nth-child(1 of :not(:empty)) :nth-child(1 of :not(:empty)), #R-body div.expand > .expand-content-text > :nth-child(1 of :not(:empty)) :nth-child(1 of :not(:empty)),
#body div.tab-content > .tab-content-text > :nth-child(1 of :not(:empty)), #R-body div.tab-content > .tab-content-text > :nth-child(1 of :not(:empty)),
#body div.tab-content > .tab-content-text > :nth-child(1 of :not(:empty)) :nth-child(1 of :not(:empty)) { #R-body div.tab-content > .tab-content-text > :nth-child(1 of :not(:empty)) :nth-child(1 of :not(:empty)) {
margin-top: 0; margin-top: 0;
} }
#body table th > :nth-last-child(1 of :not(:empty)), #R-body table th > :nth-last-child(1 of :not(:empty)),
#body table th > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)), #R-body table th > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)),
#body table th > div.highlight:last-child pre, #R-body table th > div.highlight:last-child pre,
#body table td > :nth-last-child(1 of :not(:empty)), #R-body table td > :nth-last-child(1 of :not(:empty)),
#body table td > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)), #R-body table td > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)),
#body table td > div:last-child pre, #R-body table td > div:last-child pre,
#body div.box > .box-content > :nth-last-child(1 of :not(:empty)), #R-body div.box > .box-content > :nth-last-child(1 of :not(:empty)),
#body div.box > .box-content > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)), #R-body div.box > .box-content > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)),
#body div.box > .box-content > div:last-child pre, #R-body div.box > .box-content > div:last-child pre,
#body div.expand > .expand-content-text > :nth-last-child(1 of :not(:empty)), #R-body div.expand > .expand-content-text > :nth-last-child(1 of :not(:empty)),
#body div.expand > .expand-content-text > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)), #R-body div.expand > .expand-content-text > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)),
#body div.expand > .expand-content-text > div:last-child pre, #R-body div.expand > .expand-content-text > div:last-child pre,
#body div.tab-content > .tab-content-text > :nth-last-child(1 of :not(:empty)), #R-body div.tab-content > .tab-content-text > :nth-last-child(1 of :not(:empty)),
#body div.tab-content > .tab-content-text > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)), #R-body div.tab-content > .tab-content-text > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)),
#body div.tab-content > .tab-content-text > div:last-child pre { #R-body div.tab-content > .tab-content-text > div:last-child pre {
margin-bottom: 0; margin-bottom: 0;
} }
@ -654,19 +654,19 @@ div.attachments .box-content {
padding-top: 0; padding-top: 0;
} }
#body-inner .children h2, #R-body-inner .children h2,
#body-inner .children h3, #R-body-inner .children h3,
#body-inner .children h4, #R-body-inner .children h4,
#body-inner .children h5, #R-body-inner .children h5,
#body-inner .children h6 { #R-body-inner .children h6 {
margin-bottom: 0; margin-bottom: 0;
margin-top: 1rem; margin-top: 1rem;
} }
#body-inner ul.children-h2, #R-body-inner ul.children-h2,
#body-inner ul.children-h3, #R-body-inner ul.children-h3,
#body-inner ul.children-h4, #R-body-inner ul.children-h4,
#body-inner ul.children-h5, #R-body-inner ul.children-h5,
#body-inner ul.children-h6 { #R-body-inner ul.children-h6 {
/* if we display children with style=h2 but without a containerstyle /* if we display children with style=h2 but without a containerstyle
a ul will be used for structuring; we remove default indention for uls a ul will be used for structuring; we remove default indention for uls
in this case */ in this case */
@ -749,10 +749,10 @@ div.highlight > div table{
div.highlight > div td{ div.highlight > div td{
border-width: 0; border-width: 0;
} }
#body div.highlight > div a { #R-body div.highlight > div a {
line-height: inherit; line-height: inherit;
} }
#body div.highlight > div a:after { #R-body div.highlight > div a:after {
display: none; display: none;
} }
/* disable selection for lineno cells */ /* disable selection for lineno cells */
@ -802,7 +802,7 @@ hr {
border-bottom: 4px solid rgba( 134, 134, 134, .125 ); border-bottom: 4px solid rgba( 134, 134, 134, .125 );
} }
#body-inner pre { #R-body-inner pre {
white-space: pre-wrap; white-space: pre-wrap;
} }
@ -969,13 +969,13 @@ td {
top: 50%; top: 50%;
} }
#topbar { #R-topbar {
min-height: 3rem; min-height: 3rem;
position: relative; position: relative;
z-index: 170; z-index: 170;
} }
#topbar > .topbar-wrapper { #R-topbar > .topbar-wrapper {
align-items: center; align-items: center;
background-color: rgba( 134, 134, 134, .066 ); background-color: rgba( 134, 134, 134, .066 );
display: flex; display: flex;
@ -1092,18 +1092,18 @@ html[dir="rtl"] .topbar-button-next i {
display: inline-block; display: inline-block;
} }
#body a[aria-disabled="true"] { #R-body a[aria-disabled="true"] {
pointer-events: none; pointer-events: none;
text-decoration: none; text-decoration: none;
} }
@media screen and (max-width: 60rem) { @media screen and (max-width: 60rem) {
#sidebar { #R-sidebar {
min-width: 14.375rem; min-width: 14.375rem;
max-width: 14.375rem; max-width: 14.375rem;
width: 14.375rem; width: 14.375rem;
} }
#body { #R-body {
margin-inline-start: 14.375rem; margin-inline-start: 14.375rem;
min-width: calc( 100% - 14.375rem); min-width: calc( 100% - 14.375rem);
max-width: calc( 100% - 14.375rem); max-width: calc( 100% - 14.375rem);
@ -1112,32 +1112,32 @@ html[dir="rtl"] .topbar-button-next i {
} }
@media screen and (max-width: 48rem) { @media screen and (max-width: 48rem) {
/* we don't support sidebar flyout in mobile */ /* we don't support sidebar flyout in mobile */
.mobile-support #sidebar { .mobile-support #R-sidebar {
inset-inline-start: -14.375rem; inset-inline-start: -14.375rem;
} }
.mobile-support #navshow{ .mobile-support #navshow{
display: inline; display: inline;
} }
.mobile-support #body { .mobile-support #R-body {
min-width: 100%; min-width: 100%;
max-width: 100%; max-width: 100%;
width: 100%; width: 100%;
} }
.mobile-support #body { .mobile-support #R-body {
margin-inline-start: 0; margin-inline-start: 0;
} }
.mobile-support.sidebar-flyout { .mobile-support.sidebar-flyout {
overflow: hidden; overflow: hidden;
} }
.mobile-support.sidebar-flyout #sidebar { .mobile-support.sidebar-flyout #R-sidebar {
inset-inline-start: 0; inset-inline-start: 0;
z-index: 90; z-index: 90;
} }
.mobile-support.sidebar-flyout #body { .mobile-support.sidebar-flyout #R-body {
margin-inline-start: 14.375rem; margin-inline-start: 14.375rem;
overflow: hidden; overflow: hidden;
} }
.mobile-support.sidebar-flyout #body-overlay{ .mobile-support.sidebar-flyout #R-body-overlay{
background-color: rgba( 134, 134, 134, .5 ); background-color: rgba( 134, 134, 134, .5 );
bottom: 0; bottom: 0;
cursor: pointer; cursor: pointer;
@ -1215,13 +1215,13 @@ pre > .copy-to-clipboard-button {
border-inline-end-width: 1px; border-inline-end-width: 1px;
} }
#homelinks { #R-homelinks {
padding: 0; padding: 0;
} }
#homelinks ul { #R-homelinks ul {
margin: .5rem 0; margin: .5rem 0;
} }
#homelinks hr { #R-homelinks hr {
border-bottom-style: solid; border-bottom-style: solid;
border-bottom-width: 1px; border-bottom-width: 1px;
margin: 0 1rem 3px 1rem; margin: 0 1rem 3px 1rem;
@ -1297,7 +1297,7 @@ html[dir="rtl"] .expand > .expand-label > i.fa-chevron-right {
transform: scaleX(-1); transform: scaleX(-1);
} }
#body footer.footline{ #R-body footer.footline{
margin-top: 2rem; margin-top: 2rem;
} }
@ -1362,7 +1362,7 @@ html[dir="rtl"] .expand > .expand-label > i.fa-chevron-right {
/* Table of contents */ /* Table of contents */
.topbar-flyout #main-overlay{ .topbar-flyout #R-main-overlay{
bottom: 0; bottom: 0;
cursor: pointer; cursor: pointer;
left: 0; left: 0;
@ -1482,7 +1482,7 @@ html[dir="rtl"] .expand > .expand-label > i.fa-chevron-right {
content: "\200b" content: "\200b"
} }
#body #body-inner .btn > *.highlight:after { #R-body #R-body-inner .btn > *.highlight:after {
background-color: transparent; background-color: transparent;
} }
@ -1525,21 +1525,21 @@ h6 a {
font-weight: inherit; font-weight: inherit;
} }
#body h1 + h2, #R-body h1 + h2,
#body h1 + h3, #R-body h1 + h3,
#body h1 + h4, #R-body h1 + h4,
#body h1 + h5, #R-body h1 + h5,
#body h1 + h6, #R-body h1 + h6,
#body h2 + h3, #R-body h2 + h3,
#body h2 + h4, #R-body h2 + h4,
#body h2 + h5, #R-body h2 + h5,
#body h2 + h6, #R-body h2 + h6,
#body h3 + h4, #R-body h3 + h4,
#body h3 + h5, #R-body h3 + h5,
#body h3 + h6, #R-body h3 + h6,
#body h4 + h5, #R-body h4 + h5,
#body h4 + h6, #R-body h4 + h6,
#body h5 + h6 { #R-body h5 + h6 {
margin-top: 1rem; margin-top: 1rem;
} }
@ -1729,7 +1729,7 @@ input[type="search"]::-webkit-search-results-decoration { display: none; }
height: 1.5rem; height: 1.5rem;
} }
#searchresults a.autocomplete-suggestion { #R-searchresults a.autocomplete-suggestion {
display: block; display: block;
font-size: 1.3rem; font-size: 1.3rem;
font-weight: 500; font-weight: 500;
@ -1738,11 +1738,11 @@ input[type="search"]::-webkit-search-results-decoration { display: none; }
text-decoration: none; text-decoration: none;
} }
#searchresults a.autocomplete-suggestion:after { #R-searchresults a.autocomplete-suggestion:after {
height: 0; height: 0;
} }
#searchresults .autocomplete-suggestion > .context { #R-searchresults .autocomplete-suggestion > .context {
font-size: 1rem; font-size: 1rem;
font-weight: 300; font-weight: 300;
margin-top: .66rem; margin-top: .66rem;
@ -1856,51 +1856,51 @@ article ul > li > input[type="checkbox"]:checked::before {
/* basic menu list styles (non-collapsible) */ /* basic menu list styles (non-collapsible) */
#sidebar ul > li > :is( a, span ) { #R-sidebar ul > li > :is( a, span ) {
display: block; display: block;
position: relative; position: relative;
} }
#sidebar ul.space > li > * { #R-sidebar ul.space > li > * {
padding-bottom: .125rem; padding-bottom: .125rem;
padding-top: .125rem; padding-top: .125rem;
} }
#sidebar ul.space > li > ul { #R-sidebar ul.space > li > ul {
padding-bottom: 0; padding-bottom: 0;
padding-top: 0; padding-top: 0;
} }
#sidebar ul.morespace > li > * { #R-sidebar ul.morespace > li > * {
padding-bottom: .25rem; padding-bottom: .25rem;
padding-top: .25rem; padding-top: .25rem;
} }
#sidebar ul.morespace > li > ul { #R-sidebar ul.morespace > li > ul {
padding-bottom: 0; padding-bottom: 0;
padding-top: 0; padding-top: 0;
} }
#sidebar ul.enlarge > li > :is( a, span ) { #R-sidebar ul.enlarge > li > :is( a, span ) {
font-size: 1.1rem; font-size: 1.1rem;
line-height: 2rem; line-height: 2rem;
} }
#sidebar ul.enlarge > li > a > .read-icon { #R-sidebar ul.enlarge > li > a > .read-icon {
margin-top: .5rem; margin-top: .5rem;
} }
#sidebar ul.enlarge > li > ul > li:last-child { #R-sidebar ul.enlarge > li > ul > li:last-child {
padding-bottom: 1rem; padding-bottom: 1rem;
} }
#sidebar ul ul { #R-sidebar ul ul {
padding-inline-start: 1rem; padding-inline-start: 1rem;
} }
/* collapsible menu style overrides */ /* collapsible menu style overrides */
#sidebar ul.collapsible-menu > li { #R-sidebar ul.collapsible-menu > li {
position: relative; position: relative;
} }
#sidebar ul.collapsible-menu > li > input { #R-sidebar ul.collapsible-menu > li > input {
-webkit-appearance: none; -webkit-appearance: none;
appearance: none; appearance: none;
cursor: pointer; cursor: pointer;
@ -1912,11 +1912,11 @@ article ul > li > input[type="checkbox"]:checked::before {
width: 1rem; width: 1rem;
z-index: 1; z-index: 1;
} }
#sidebar ul.collapsible-menu.enlarge > li > input { #R-sidebar ul.collapsible-menu.enlarge > li > input {
margin-top: .9rem; margin-top: .9rem;
} }
#sidebar ul.collapsible-menu > li > label { #R-sidebar ul.collapsible-menu > li > label {
cursor: pointer; cursor: pointer;
display: inline-block; display: inline-block;
inset-inline-start: 0; inset-inline-start: 0;
@ -1926,12 +1926,12 @@ article ul > li > input[type="checkbox"]:checked::before {
width: 1rem; width: 1rem;
z-index: 2; z-index: 2;
} }
#sidebar ul.collapsible-menu.enlarge > li > label { #R-sidebar ul.collapsible-menu.enlarge > li > label {
font-size: 1.1rem; font-size: 1.1rem;
line-height: 2rem; line-height: 2rem;
} }
#sidebar ul.collapsible-menu > li > label:after { #R-sidebar ul.collapsible-menu > li > label:after {
content: ""; content: "";
display: block; display: block;
height: 1px; height: 1px;
@ -1939,61 +1939,61 @@ article ul > li > input[type="checkbox"]:checked::before {
width: 0%; width: 0%;
} }
#sidebar ul.collapsible-menu > li > label:hover:after { #R-sidebar ul.collapsible-menu > li > label:hover:after {
width: 100%; width: 100%;
} }
#sidebar ul.collapsible-menu > li > label > .fas { #R-sidebar ul.collapsible-menu > li > label > .fas {
font-size: .8rem; font-size: .8rem;
width: .6rem; width: .6rem;
} }
#sidebar ul.collapsible-menu > li > :is( a, span ) { #R-sidebar ul.collapsible-menu > li > :is( a, span ) {
display: inline-block; display: inline-block;
width: 100%; width: 100%;
} }
/* menu states for not(.collapsible-menu) */ /* menu states for not(.collapsible-menu) */
#sidebar ul ul { #R-sidebar ul ul {
display: none; display: none;
} }
#sidebar ul > li.parent > ul, #R-sidebar ul > li.parent > ul,
#sidebar ul > li.active > ul, #R-sidebar ul > li.active > ul,
#sidebar ul > li.alwaysopen > ul { #R-sidebar ul > li.alwaysopen > ul {
display: block; display: block;
} }
/* closed menu */ /* closed menu */
#sidebar ul.collapsible-menu > li > input + label ~ ul { #R-sidebar ul.collapsible-menu > li > input + label ~ ul {
display: none; display: none;
} }
#sidebar ul.collapsible-menu > li > input + label > .fa-chevron-down { #R-sidebar ul.collapsible-menu > li > input + label > .fa-chevron-down {
display: none; display: none;
} }
#sidebar ul.collapsible-menu > li > input + label > .fa-chevron-right { #R-sidebar ul.collapsible-menu > li > input + label > .fa-chevron-right {
display: inline-block; display: inline-block;
} }
/* open menu */ /* open menu */
#sidebar ul.collapsible-menu > li > input:checked + label ~ ul { #R-sidebar ul.collapsible-menu > li > input:checked + label ~ ul {
display: block; display: block;
} }
#sidebar ul.collapsible-menu > li > input:checked + label > .fa-chevron-down { #R-sidebar ul.collapsible-menu > li > input:checked + label > .fa-chevron-down {
display: inline-block; display: inline-block;
} }
#sidebar ul.collapsible-menu > li > input:checked + label > .fa-chevron-right { #R-sidebar ul.collapsible-menu > li > input:checked + label > .fa-chevron-right {
display: none; display: none;
} }
/* adjust menu for RTL reading direction */ /* adjust menu for RTL reading direction */
html[dir="rtl"] #sidebar ul.collapsible-menu > li > label > i.fa-chevron-right { html[dir="rtl"] #R-sidebar ul.collapsible-menu > li > label > i.fa-chevron-right {
transform: scaleX(-1); transform: scaleX(-1);
} }
@ -2006,17 +2006,17 @@ html[dir="rtl"] #sidebar ul.collapsible-menu > li > label > i.fa-chevron-right {
} }
} }
#body .tab-panel{ #R-body .tab-panel{
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
margin-top: 1.5rem; margin-top: 1.5rem;
} }
#body .tab-nav{ #R-body .tab-nav{
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
} }
#body .tab-nav-title{ #R-body .tab-nav-title{
font-size: .9rem; font-size: .9rem;
font-weight: 400; font-weight: 400;
line-height: 1.42857143; line-height: 1.42857143;
@ -2024,7 +2024,7 @@ html[dir="rtl"] #sidebar ul.collapsible-menu > li > label > i.fa-chevron-right {
margin-inline-start: .6rem; margin-inline-start: .6rem;
} }
#body .tab-nav-button{ #R-body .tab-nav-button{
-webkit-appearance: none; -webkit-appearance: none;
appearance: none; appearance: none;
background-color: transparent; background-color: transparent;
@ -2036,44 +2036,44 @@ html[dir="rtl"] #sidebar ul.collapsible-menu > li > label > i.fa-chevron-right {
margin-inline-start: .6rem; margin-inline-start: .6rem;
} }
#body .tab-nav-button.active{ #R-body .tab-nav-button.active{
border-radius: 2px 2px 0 0; border-radius: 2px 2px 0 0;
cursor: default; cursor: default;
} }
#body .tab-nav-button > *{ #R-body .tab-nav-button > *{
display: block; display: block;
position: relative; position: relative;
} }
#body .tab-nav-button.active > *{ #R-body .tab-nav-button.active > *{
border-radius: 1px 1px 0 0; border-radius: 1px 1px 0 0;
} }
#body .tab-nav-button > * > *{ #R-body .tab-nav-button > * > *{
border-bottom-style: solid; border-bottom-style: solid;
border-bottom-width: .2rem; border-bottom-width: .2rem;
padding: .2rem .6rem 0 .6rem; padding: .2rem .6rem 0 .6rem;
} }
#body .tab-nav-button.active > * > *{ #R-body .tab-nav-button.active > * > *{
border-bottom-color: transparent; border-bottom-color: transparent;
font-weight: 500; font-weight: 500;
} }
#body .tab-nav-button > * > .tab-nav-hidden{ #R-body .tab-nav-button > * > .tab-nav-hidden{
display: block; display: block;
font-weight: 500; font-weight: 500;
visibility: hidden; visibility: hidden;
} }
#body .tab-nav-button > * > .tab-nav-text{ #R-body .tab-nav-button > * > .tab-nav-text{
display: block; display: block;
position: absolute; position: absolute;
top: 0; top: 0;
} }
#body .tab-content{ #R-body .tab-content{
border-style: solid; border-style: solid;
border-width: 1px; border-width: 1px;
display: none; display: none;
@ -2083,37 +2083,37 @@ html[dir="rtl"] #sidebar ul.collapsible-menu > li > label > i.fa-chevron-right {
z-index: 10; z-index: 10;
} }
#body .tab-content.active{ #R-body .tab-content.active{
display: block; display: block;
} }
#body .tab-content-text{ #R-body .tab-content-text{
padding: 1rem; padding: 1rem;
} }
/* remove margin if only a single code block is contained in the tab (FF without :has using .codify style) */ /* remove margin if only a single code block is contained in the tab (FF without :has using .codify style) */
#body .tab-content.codify > .tab-content-text{ #R-body .tab-content.codify > .tab-content-text{
padding: 0; padding: 0;
} }
#body .tab-content-text:has(> div.highlight:only-child){ #R-body .tab-content-text:has(> div.highlight:only-child){
padding: 0; padding: 0;
} }
/* remove border from code block if single in tab */ /* remove border from code block if single in tab */
#body .tab-content-text > div.highlight:only-child > div, #R-body .tab-content-text > div.highlight:only-child > div,
#body .tab-content-text > div.highlight:only-child pre, #R-body .tab-content-text > div.highlight:only-child pre,
#body .tab-content-text > pre.pre-code:only-child{ #R-body .tab-content-text > pre.pre-code:only-child{
border-width: 0; border-width: 0;
} }
/* bordering the menu and topbar */ /* bordering the menu and topbar */
#topbar { #R-topbar {
border-bottom-style: solid; border-bottom-style: solid;
border-bottom-width: 1px; border-bottom-width: 1px;
} }
#header-topbar { #R-header-topbar {
border-bottom-color: transparent; border-bottom-color: transparent;
border-bottom-style: solid; border-bottom-style: solid;
border-bottom-width: 1px; border-bottom-width: 1px;
@ -2126,9 +2126,9 @@ html[dir="rtl"] #sidebar ul.collapsible-menu > li > label > i.fa-chevron-right {
z-index: 1; z-index: 1;
} }
#header-wrapper, #R-header-wrapper,
#homelinks, #R-homelinks,
#content-wrapper > * { #R-content-wrapper > * {
border-inline-end-style: solid; border-inline-end-style: solid;
border-inline-end-width: 1px; border-inline-end-width: 1px;
} }
@ -2137,7 +2137,7 @@ html[dir="rtl"] #sidebar ul.collapsible-menu > li > label > i.fa-chevron-right {
margin-top: 1rem; margin-top: 1rem;
} }
#sidebar ul.collapsible-menu li.active > a{ #R-sidebar ul.collapsible-menu li.active > a{
border-style: solid; border-style: solid;
border-width: 1px; border-width: 1px;
padding-bottom: calc( .25rem - var(--bpx1)*1px); padding-bottom: calc( .25rem - var(--bpx1)*1px);
@ -2147,6 +2147,6 @@ html[dir="rtl"] #sidebar ul.collapsible-menu > li > label > i.fa-chevron-right {
width: calc(100% + var(--bpx1)*1px); width: calc(100% + var(--bpx1)*1px);
} }
#menu-footer { #R-menu-footer {
padding-bottom: 1rem; padding-bottom: 1rem;
} }

104
static/css/variant.css
View file

@ -13,7 +13,7 @@ body {
a, a,
.anchor, .anchor,
.topbar-button button, .topbar-button button,
#searchresults .autocomplete-suggestion { #R-searchresults .autocomplete-suggestion {
color: var(--INTERNAL-MAIN-LINK-color); color: var(--INTERNAL-MAIN-LINK-color);
} }
@ -23,11 +23,11 @@ a:hover,
color: var(--INTERNAL-MAIN-LINK-HOVER-color); color: var(--INTERNAL-MAIN-LINK-HOVER-color);
} }
#sidebar { #R-sidebar {
background: var(--INTERNAL-MENU-SECTIONS-BG-color); background: var(--INTERNAL-MENU-SECTIONS-BG-color);
} }
#header-wrapper { #R-header-wrapper {
background-color: var(--INTERNAL-MENU-HEADER-BG-color); background-color: var(--INTERNAL-MENU-HEADER-BG-color);
color: var(--INTERNAL-MENU-SEARCH-color); color: var(--INTERNAL-MENU-SEARCH-color);
} }
@ -37,8 +37,8 @@ a:hover,
background-color: var(--INTERNAL-MENU-SEARCH-BG-color); background-color: var(--INTERNAL-MENU-SEARCH-BG-color);
} }
#sidebar .searchbox > :first-child, #R-sidebar .searchbox > :first-child,
#sidebar .searchbox > :last-child { #R-sidebar .searchbox > :last-child {
color: var(--INTERNAL-MENU-SEARCH-color); color: var(--INTERNAL-MENU-SEARCH-color);
} }
@ -47,51 +47,51 @@ a:hover,
color: var(--INTERNAL-MENU-SEARCH-color); color: var(--INTERNAL-MENU-SEARCH-color);
} }
#sidebar .collapsible-menu label, #R-sidebar .collapsible-menu label,
#sidebar .menu-control, #R-sidebar .menu-control,
#sidebar :is( a, span ) { #R-sidebar :is( a, span ) {
color: var(--INTERNAL-MENU-SECTIONS-LINK-color); color: var(--INTERNAL-MENU-SECTIONS-LINK-color);
} }
#sidebar select:hover, #R-sidebar select:hover,
#sidebar .collapsible-menu li:not(.active) > label:hover, #R-sidebar .collapsible-menu li:not(.active) > label:hover,
#sidebar .menu-control:hover, #R-sidebar .menu-control:hover,
#sidebar a:hover { #R-sidebar a:hover {
color: var(--INTERNAL-MENU-SECTIONS-LINK-HOVER-color); color: var(--INTERNAL-MENU-SECTIONS-LINK-HOVER-color);
} }
#sidebar .menu-control button, #R-sidebar .menu-control button,
#sidebar .menu-control select{ #R-sidebar .menu-control select{
outline-color: var(--INTERNAL-MENU-SECTIONS-LINK-HOVER-color); outline-color: var(--INTERNAL-MENU-SECTIONS-LINK-HOVER-color);
} }
#sidebar ul.enlarge > li.parent, #R-sidebar ul.enlarge > li.parent,
#sidebar ul.enlarge > li.active { #R-sidebar ul.enlarge > li.active {
background-color: var(--INTERNAL-MENU-SECTIONS-ACTIVE-BG-color); background-color: var(--INTERNAL-MENU-SECTIONS-ACTIVE-BG-color);
} }
#sidebar li.active > label, #R-sidebar li.active > label,
#sidebar li.active > a { #R-sidebar li.active > a {
color: var(--INTERNAL-MENU-SECTION-ACTIVE-CATEGORY-color); color: var(--INTERNAL-MENU-SECTION-ACTIVE-CATEGORY-color);
} }
#sidebar li.active > a { #R-sidebar li.active > a {
background-color: var(--INTERNAL-MENU-SECTION-ACTIVE-CATEGORY-BG-color); background-color: var(--INTERNAL-MENU-SECTION-ACTIVE-CATEGORY-BG-color);
} }
#sidebar ul li > a .read-icon { #R-sidebar ul li > a .read-icon {
color: var(--INTERNAL-MENU-VISITED-color); color: var(--INTERNAL-MENU-VISITED-color);
} }
#sidebar .nav-title { #R-sidebar .nav-title {
color: var(--INTERNAL-MENU-SECTIONS-LINK-color); color: var(--INTERNAL-MENU-SECTIONS-LINK-color);
} }
#content-wrapper hr { #R-content-wrapper hr {
border-color: var(--INTERNAL-MENU-SECTION-SEPARATOR-color); border-color: var(--INTERNAL-MENU-SECTION-SEPARATOR-color);
} }
#footer { #R-footer {
color: var(--INTERNAL-MENU-SECTIONS-LINK-color); color: var(--INTERNAL-MENU-SECTIONS-LINK-color);
} }
@ -249,7 +249,7 @@ table {
background-color: var(--INTERNAL-MAIN-BG-color); background-color: var(--INTERNAL-MAIN-BG-color);
} }
#topbar { #R-topbar {
background-color: var(--INTERNAL-MAIN-BG-color); background-color: var(--INTERNAL-MAIN-BG-color);
} }
@ -257,8 +257,8 @@ table {
border-inline-start-color: var(--INTERNAL-MENU-TOPBAR-SEPARATOR-color); border-inline-start-color: var(--INTERNAL-MENU-TOPBAR-SEPARATOR-color);
} }
#body a[aria-disabled="true"], #R-body a[aria-disabled="true"],
#searchresults .autocomplete-suggestion > .context { #R-searchresults .autocomplete-suggestion > .context {
color: var(--INTERNAL-MAIN-TEXT-color); color: var(--INTERNAL-MAIN-TEXT-color);
} }
@ -302,19 +302,19 @@ pre .copy-to-clipboard-button:hover {
color: var(--INTERNAL-MAIN-LINK-HOVER-color); color: var(--INTERNAL-MAIN-LINK-HOVER-color);
} }
#homelinks { #R-homelinks {
background-color: var(--INTERNAL-MENU-HEADER-BORDER-color); background-color: var(--INTERNAL-MENU-HEADER-BORDER-color);
} }
#homelinks a { #R-homelinks a {
color: var(--INTERNAL-MENU-HOME-LINK-color); color: var(--INTERNAL-MENU-HOME-LINK-color);
} }
#homelinks a:hover { #R-homelinks a:hover {
color: var(--INTERNAL-MENU-HOME-LINK-HOVER-color); color: var(--INTERNAL-MENU-HOME-LINK-HOVER-color);
} }
#homelinks hr { #R-homelinks hr {
border-color: var(--INTERNAL-MENU-HEADER-SEPARATOR-color); border-color: var(--INTERNAL-MENU-HEADER-SEPARATOR-color);
} }
@ -353,16 +353,16 @@ pre .copy-to-clipboard-button:hover {
--VARIABLE-BOX-TEXT-color: var(--VARIABLE-BOX-CAPTION-color); --VARIABLE-BOX-TEXT-color: var(--VARIABLE-BOX-CAPTION-color);
} }
#body .tags a.tag-link { #R-body .tags a.tag-link {
background-color: var(--INTERNAL-TAG-BG-color); background-color: var(--INTERNAL-TAG-BG-color);
color: var(--INTERNAL-MAIN-BG-color); color: var(--INTERNAL-MAIN-BG-color);
} }
#body .tags a.tag-link:before { #R-body .tags a.tag-link:before {
border-right-color: var(--INTERNAL-TAG-BG-color); border-right-color: var(--INTERNAL-TAG-BG-color);
} }
#body .tags a.tag-link:after { #R-body .tags a.tag-link:after {
background-color: var(--INTERNAL-MAIN-BG-color); background-color: var(--INTERNAL-MAIN-BG-color);
} }
@ -384,30 +384,30 @@ article ul > li > input[type="checkbox"] {
color: var(--INTERNAL-MAIN-TEXT-color); color: var(--INTERNAL-MAIN-TEXT-color);
} }
#body .tab-nav-button { #R-body .tab-nav-button {
color: var(--INTERNAL-MAIN-TEXT-color); color: var(--INTERNAL-MAIN-TEXT-color);
} }
#body .tab-nav-button.active { #R-body .tab-nav-button.active {
background-color: var(--VARIABLE-BOX-color); background-color: var(--VARIABLE-BOX-color);
border-bottom-color: var(--VARIABLE-BOX-BG-color); border-bottom-color: var(--VARIABLE-BOX-BG-color);
color: var(--VARIABLE-BOX-TEXT-color); color: var(--VARIABLE-BOX-TEXT-color);
} }
#body .tab-nav-button.active > *{ #R-body .tab-nav-button.active > *{
background-color: var(--VARIABLE-BOX-BG-color); background-color: var(--VARIABLE-BOX-BG-color);
} }
#body .tab-nav-button > * > *{ #R-body .tab-nav-button > * > *{
border-color: var(--VARIABLE-BOX-color); border-color: var(--VARIABLE-BOX-color);
} }
#body .tab-content{ #R-body .tab-content{
background-color: var(--VARIABLE-BOX-color); background-color: var(--VARIABLE-BOX-color);
border-color: var(--VARIABLE-BOX-color); border-color: var(--VARIABLE-BOX-color);
} }
#body .tab-content-text{ #R-body .tab-content-text{
background-color: var(--VARIABLE-BOX-BG-color); background-color: var(--VARIABLE-BOX-BG-color);
color: var(--VARIABLE-BOX-TEXT-color); color: var(--VARIABLE-BOX-TEXT-color);
} }
@ -422,40 +422,40 @@ article ul > li > input[type="checkbox"] {
--VARIABLE-BOX-BG-color: transparent; --VARIABLE-BOX-BG-color: transparent;
} }
#body .tab-panel-style.cstyle.initial.tab-nav-button.active, #R-body .tab-panel-style.cstyle.initial.tab-nav-button.active,
#body .tab-panel-style.cstyle.default.tab-nav-button.active, #R-body .tab-panel-style.cstyle.default.tab-nav-button.active,
#body .tab-panel-style.cstyle.transparent.tab-nav-button.active{ #R-body .tab-panel-style.cstyle.transparent.tab-nav-button.active{
background-color: var(--VARIABLE-BOX-BG-color); background-color: var(--VARIABLE-BOX-BG-color);
border-left-color: var(--VARIABLE-BOX-color); border-left-color: var(--VARIABLE-BOX-color);
border-right-color: var(--VARIABLE-BOX-color); border-right-color: var(--VARIABLE-BOX-color);
border-top-color: var(--VARIABLE-BOX-color); border-top-color: var(--VARIABLE-BOX-color);
} }
#body .tab-panel-style.cstyle.code.tab-nav-button:not(.active){ #R-body .tab-panel-style.cstyle.code.tab-nav-button:not(.active){
--VARIABLE-BOX-color: var(--INTERNAL-BOX-NEUTRAL-color); --VARIABLE-BOX-color: var(--INTERNAL-BOX-NEUTRAL-color);
} }
#body .tab-panel-style.cstyle.initial.tab-content, #R-body .tab-panel-style.cstyle.initial.tab-content,
#body .tab-panel-style.cstyle.default.tab-content, #R-body .tab-panel-style.cstyle.default.tab-content,
#body .tab-panel-style.cstyle.transparent.tab-content{ #R-body .tab-panel-style.cstyle.transparent.tab-content{
background-color: var(--VARIABLE-BOX-BG-color); background-color: var(--VARIABLE-BOX-BG-color);
} }
#topbar { #R-topbar {
border-bottom-color: var(--INTERNAL-MAIN-TOPBAR-BORDER-color); border-bottom-color: var(--INTERNAL-MAIN-TOPBAR-BORDER-color);
} }
#header-topbar { #R-header-topbar {
border-inline-end-color: var(--INTERNAL-MENU-TOPBAR-BORDER-color); border-inline-end-color: var(--INTERNAL-MENU-TOPBAR-BORDER-color);
} }
#header-wrapper, #R-header-wrapper,
#homelinks, #R-homelinks,
#content-wrapper > * { #R-content-wrapper > * {
border-inline-end-color: var(--INTERNAL-MENU-BORDER-color); border-inline-end-color: var(--INTERNAL-MENU-BORDER-color);
} }
#sidebar ul.collapsible-menu li.active > a{ #R-sidebar ul.collapsible-menu li.active > a{
border-bottom-color: var(--INTERNAL-MENU-BORDER-color); border-bottom-color: var(--INTERNAL-MENU-BORDER-color);
border-top-color: var(--INTERNAL-MENU-BORDER-color); border-top-color: var(--INTERNAL-MENU-BORDER-color);
border-inline-start-color: var(--INTERNAL-MENU-BORDER-color); border-inline-start-color: var(--INTERNAL-MENU-BORDER-color);

14
static/js/search.js
View file

@ -2,7 +2,7 @@ window.relearn = window.relearn || {};
window.relearn.runInitialSearch = function(){ window.relearn.runInitialSearch = function(){
if( window.relearn.isSearchInit && window.relearn.isLunrInit ){ if( window.relearn.isSearchInit && window.relearn.isLunrInit ){
var input = document.querySelector('#search-by-detail'); var input = document.querySelector('#R-search-by-detail');
if( !input ){ if( !input ){
return; return;
} }
@ -45,7 +45,7 @@ function initLunrIndex( index ){
} }
function triggerSearch(){ function triggerSearch(){
var input = document.querySelector('#search-by-detail'); var input = document.querySelector('#R-search-by-detail');
if( !input ){ if( !input ){
return; return;
} }
@ -97,7 +97,7 @@ window.addEventListener( 'popstate', function ( event ){
} }
}); });
var input = document.querySelector('#search-by-detail'); var input = document.querySelector('#R-search-by-detail');
if( input ){ if( input ){
input.addEventListener( 'keydown', function(event) { input.addEventListener( 'keydown', function(event) {
// if we are pressing ESC in the searchdetail our focus will // if we are pressing ESC in the searchdetail our focus will
@ -199,7 +199,7 @@ function resolvePlaceholders( s, args ) {
}; };
function searchDetail( value ) { function searchDetail( value ) {
var results = document.querySelector('#searchresults'); var results = document.querySelector('#R-searchresults');
var hint = document.querySelector('.searchhint'); var hint = document.querySelector('.searchhint');
hint.innerText = ''; hint.innerText = '';
results.textContent = ''; results.textContent = '';
@ -252,7 +252,7 @@ initLunrJson();
initLunrJs(); initLunrJs();
function startSearch(){ function startSearch(){
var input = document.querySelector('#search-by-detail'); var input = document.querySelector('#R-search-by-detail');
if( input ){ if( input ){
var state = window.history.state || {}; var state = window.history.state || {};
state = Object.assign( {}, ( typeof state === 'object' ) ? state : {} ); state = Object.assign( {}, ( typeof state === 'object' ) ? state : {} );
@ -262,8 +262,8 @@ function startSearch(){
var searchList = new autoComplete({ var searchList = new autoComplete({
/* selector for the search box element */ /* selector for the search box element */
selectorToInsert: '#header-wrapper', selectorToInsert: '#R-header-wrapper',
selector: '#search-by', selector: '#R-search-by',
/* source is the callback to perform the search */ /* source is the callback to perform the search */
source: function(term, response) { source: function(term, response) {
response(search(term)); response(search(term));

46
static/js/theme.js
View file

@ -35,7 +35,7 @@ var formelements = 'button, datalist, fieldset, input, label, legend, meter, opt
var psc; var psc;
var psm; var psm;
var pst = new Map(); var pst = new Map();
var elc = document.querySelector('#body-inner'); var elc = document.querySelector('#R-body-inner');
function regexEscape( s ){ function regexEscape( s ){
return s.replace( /[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&' ); return s.replace( /[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&' );
@ -356,7 +356,7 @@ function initOpenapi( update, attrs ){
function renderOpenAPI(oc) { function renderOpenAPI(oc) {
var buster = window.themeUseOpenapi.assetsBuster ? '?' + window.themeUseOpenapi.assetsBuster : ''; var buster = window.themeUseOpenapi.assetsBuster ? '?' + window.themeUseOpenapi.assetsBuster : '';
var print = isPrint || attrs.isPrintPreview ? "PRINT-" : ""; var print = isPrint || attrs.isPrintPreview ? "PRINT-" : "";
var theme = print ? `${baseUri}/css/theme-relearn-light.css` : document.querySelector( '#variant-style' ).attributes.href.value var theme = print ? `${baseUri}/css/theme-relearn-light.css` : document.querySelector( '#R-variant-style' ).attributes.href.value
var swagger_theme = variants.getColorValue( print + 'OPENAPI-theme' ); var swagger_theme = variants.getColorValue( print + 'OPENAPI-theme' );
var swagger_code_theme = variants.getColorValue( print + 'OPENAPI-CODE-theme' ); var swagger_code_theme = variants.getColorValue( print + 'OPENAPI-CODE-theme' );
@ -652,7 +652,7 @@ function initArrowNav(){
// keyboard navigation // keyboard navigation
// avoid prev/next navigation if we are not at the start/end of the // avoid prev/next navigation if we are not at the start/end of the
// horizontal area // horizontal area
var el = document.querySelector('#body-inner'); var el = document.querySelector('#R-body-inner');
var scrollStart = 0; var scrollStart = 0;
var scrollEnd = 0; var scrollEnd = 0;
document.addEventListener('keydown', function(event){ document.addEventListener('keydown', function(event){
@ -708,7 +708,7 @@ function initMenuScrollbar(){
return; return;
} }
var elm = document.querySelector('#content-wrapper'); var elm = document.querySelector('#R-content-wrapper');
var elt = document.querySelector('.topbar-button.topbar-flyout .topbar-content-wrapper'); var elt = document.querySelector('.topbar-button.topbar-flyout .topbar-content-wrapper');
var autofocus = true; var autofocus = true;
@ -747,7 +747,7 @@ function initMenuScrollbar(){
psm && psm.scrollbarY.focus(); psm && psm.scrollbarY.focus();
} }
else{ else{
document.querySelector('#body-inner').focus(); document.querySelector('#R-body-inner').focus();
psc && psc.scrollbarY.focus(); psc && psc.scrollbarY.focus();
} }
} }
@ -755,8 +755,8 @@ function initMenuScrollbar(){
// scrollbars will install their own keyboard handlers // scrollbars will install their own keyboard handlers
// that need to be executed inbetween our own handlers // that need to be executed inbetween our own handlers
// PSC removed for #242 #243 #244 // PSC removed for #242 #243 #244
// psc = elc && new PerfectScrollbar('#body-inner'); // psc = elc && new PerfectScrollbar('#R-body-inner');
psm = elm && new PerfectScrollbar('#content-wrapper'); psm = elm && new PerfectScrollbar('#R-content-wrapper');
document.querySelectorAll('.topbar-button .topbar-content-wrapper').forEach( function( e ){ document.querySelectorAll('.topbar-button .topbar-content-wrapper').forEach( function( e ){
var button = getTopbarButtonParent( e ); var button = getTopbarButtonParent( e );
if( !button ){ if( !button ){
@ -790,7 +790,7 @@ function initMenuScrollbar(){
}); });
// now that we may have collapsible menus, we need to call a resize // now that we may have collapsible menus, we need to call a resize
// for the menu scrollbar if sections are expanded/collapsed // for the menu scrollbar if sections are expanded/collapsed
document.querySelectorAll('#sidebar .collapsible-menu input').forEach( function(e){ document.querySelectorAll('#R-sidebar .collapsible-menu input').forEach( function(e){
e.addEventListener('change', function(){ e.addEventListener('change', function(){
psm && setTimeout( function(){ psm.update(); }, 10 ); psm && setTimeout( function(){ psm.update(); }, 10 );
}); });
@ -846,7 +846,7 @@ function printShortcutHandler( event ){
} }
function showSearch(){ function showSearch(){
var s = document.querySelector( '#search-by' ); var s = document.querySelector( '#R-search-by' );
if( !s ){ if( !s ){
return; return;
} }
@ -870,7 +870,7 @@ function openNav(){
b.classList.add( 'sidebar-flyout' ); b.classList.add( 'sidebar-flyout' );
psm && setTimeout( function(){ psm.update(); }, 10 ); psm && setTimeout( function(){ psm.update(); }, 10 );
psm && psm.scrollbarY.focus(); psm && psm.scrollbarY.focus();
var a = document.querySelector( '#sidebar a' ) var a = document.querySelector( '#R-sidebar a' )
if( a ){ if( a ){
a.focus(); a.focus();
} }
@ -1011,11 +1011,11 @@ function initToc(){
document.addEventListener( 'keydown', navEscapeHandler ); document.addEventListener( 'keydown', navEscapeHandler );
document.addEventListener( 'keydown', topbarFlyoutEscapeHandler ); document.addEventListener( 'keydown', topbarFlyoutEscapeHandler );
var b = document.querySelector( '#body-overlay' ); var b = document.querySelector( '#R-body-overlay' );
if( b ){ if( b ){
b.addEventListener( 'click', closeNav ); b.addEventListener( 'click', closeNav );
} }
var m = document.querySelector( '#main-overlay' ); var m = document.querySelector( '#R-main-overlay' );
if( m ){ if( m ){
m.addEventListener( 'click', closeSomeTopbarButtonFlyout ); m.addEventListener( 'click', closeSomeTopbarButtonFlyout );
} }
@ -1059,16 +1059,16 @@ function initSwipeHandler(){
return false; return false;
}; };
var s = document.querySelector( '#body-overlay' ); var s = document.querySelector( '#R-body-overlay' );
s && s.addEventListener("touchstart", handleStartX, false); s && s.addEventListener("touchstart", handleStartX, false);
document.querySelector( '#sidebar' ).addEventListener("touchstart", handleStartX, false); document.querySelector( '#R-sidebar' ).addEventListener("touchstart", handleStartX, false);
document.querySelectorAll( '#sidebar *' ).forEach( function(e){ e.addEventListener("touchstart", handleStartX); }, false); document.querySelectorAll( '#R-sidebar *' ).forEach( function(e){ e.addEventListener("touchstart", handleStartX); }, false);
s && s.addEventListener("touchmove", handleMoveX, false); s && s.addEventListener("touchmove", handleMoveX, false);
document.querySelector( '#sidebar' ).addEventListener("touchmove", handleMoveX, false); document.querySelector( '#R-sidebar' ).addEventListener("touchmove", handleMoveX, false);
document.querySelectorAll( '#sidebar *' ).forEach( function(e){ e.addEventListener("touchmove", handleMoveX); }, false); document.querySelectorAll( '#R-sidebar *' ).forEach( function(e){ e.addEventListener("touchmove", handleMoveX); }, false);
s && s.addEventListener("touchend", handleEndX, false); s && s.addEventListener("touchend", handleEndX, false);
document.querySelector( '#sidebar' ).addEventListener("touchend", handleEndX, false); document.querySelector( '#R-sidebar' ).addEventListener("touchend", handleEndX, false);
document.querySelectorAll( '#sidebar *' ).forEach( function(e){ e.addEventListener("touchend", handleEndX); }, false); document.querySelectorAll( '#R-sidebar *' ).forEach( function(e){ e.addEventListener("touchend", handleEndX); }, false);
} }
function initImage(){ function initImage(){
@ -1126,7 +1126,7 @@ function initScrollPositionSaver(){
function scrollToPositions() { function scrollToPositions() {
// show active menu entry // show active menu entry
window.setTimeout( function(){ window.setTimeout( function(){
var e = document.querySelector( '#sidebar li.active a' ); var e = document.querySelector( '#R-sidebar li.active a' );
if( e && e.scrollIntoView ){ if( e && e.scrollIntoView ){
e.scrollIntoView({ e.scrollIntoView({
block: 'center', block: 'center',
@ -1183,7 +1183,7 @@ function scrollToPositions() {
function mark() { function mark() {
// mark some additional stuff as searchable // mark some additional stuff as searchable
var bodyInnerLinks = document.querySelectorAll( '#body-inner a:not(.lightbox-link):not(.btn):not(.lightbox-back)' ); var bodyInnerLinks = document.querySelectorAll( '#R-body-inner a:not(.lightbox-link):not(.btn):not(.lightbox-back)' );
for( var i = 0; i < bodyInnerLinks.length; i++ ){ for( var i = 0; i < bodyInnerLinks.length; i++ ){
bodyInnerLinks[i].classList.add( 'highlight' ); bodyInnerLinks[i].classList.add( 'highlight' );
} }
@ -1435,7 +1435,7 @@ function useMermaid( config ){
if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') { if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
mermaid.initialize( Object.assign( { "securityLevel": "antiscript", "startOnLoad": false }, config ) ); mermaid.initialize( Object.assign( { "securityLevel": "antiscript", "startOnLoad": false }, config ) );
if( config.theme && variants ){ if( config.theme && variants ){
var write_style = variants.findLoadedStylesheet( 'variant-style' ); var write_style = variants.findLoadedStylesheet( 'R-variant-style' );
write_style.setProperty( '--CONFIG-MERMAID-theme', config.theme ); write_style.setProperty( '--CONFIG-MERMAID-theme', config.theme );
} }
} }
@ -1474,7 +1474,7 @@ ready( function(){
(function(){ (function(){
var body = document.querySelector( 'body' ); var body = document.querySelector( 'body' );
var topbar = document.querySelector( '#topbar' ); var topbar = document.querySelector( '#R-topbar' );
function addTopbarButtonInfos(){ function addTopbarButtonInfos(){
// initially add some management infos to buttons and areas // initially add some management infos to buttons and areas
var areas = body.querySelectorAll( '.topbar-area' ); var areas = body.querySelectorAll( '.topbar-area' );

28
static/js/variant.js
View file

@ -64,7 +64,7 @@ var variants = {
markSelectedVariant: function(){ markSelectedVariant: function(){
var variant = this.getVariant(); var variant = this.getVariant();
var select = document.querySelector( '#select-variant' ); var select = document.querySelector( '#R-select-variant' );
if( !select ){ if( !select ){
return; return;
} }
@ -102,7 +102,7 @@ var variants = {
if( !variantbase ){ if( !variantbase ){
return; return;
} }
var select = document.querySelector( '#select-variant' ); var select = document.querySelector( '#R-select-variant' );
if( !select ){ if( !select ){
return; return;
} }
@ -146,12 +146,12 @@ var variants = {
// temp styles to document // temp styles to document
var head = document.querySelector( 'head' ); var head = document.querySelector( 'head' );
var style = document.createElement( 'style' ); var style = document.createElement( 'style' );
style.id = 'custom-variant-style'; style.id = 'R-custom-variant-style';
style.appendChild( document.createTextNode( stylesheet ) ); style.appendChild( document.createTextNode( stylesheet ) );
head.appendChild( style ); head.appendChild( style );
var interval_id = setInterval( function(){ var interval_id = setInterval( function(){
if( this.findLoadedStylesheet( 'variant-style' ) ){ if( this.findLoadedStylesheet( 'R-variant-style' ) ){
clearInterval( interval_id ); clearInterval( interval_id );
// save the styles to the current variant stylesheet // save the styles to the current variant stylesheet
this.variantvariables.forEach( function( e ){ this.variantvariables.forEach( function( e ){
@ -183,7 +183,7 @@ var variants = {
}, },
switchStylesheet: function( variant, without_check ){ switchStylesheet: function( variant, without_check ){
var link = document.querySelector( '#variant-style' ); var link = document.querySelector( '#R-variant-style' );
if( !link ){ if( !link ){
return; return;
} }
@ -193,7 +193,7 @@ var variants = {
// Chrome needs a new element to trigger the load callback again // Chrome needs a new element to trigger the load callback again
var new_link = document.createElement( 'link' ); var new_link = document.createElement( 'link' );
new_link.id = 'variant-style'; new_link.id = 'R-variant-style';
new_link.rel = 'stylesheet'; new_link.rel = 'stylesheet';
new_link.onload = this.onLoadStylesheet; new_link.onload = this.onLoadStylesheet;
new_link.setAttribute( 'href', new_path ); new_link.setAttribute( 'href', new_path );
@ -358,8 +358,8 @@ var variants = {
return; return;
} }
var read_style = this.findLoadedStylesheet( 'custom-variant-style' ); var read_style = this.findLoadedStylesheet( 'R-custom-variant-style' );
var write_style = this.findLoadedStylesheet( 'variant-style' ); var write_style = this.findLoadedStylesheet( 'R-variant-style' );
if( !read_style ){ if( !read_style ){
read_style = write_style; read_style = write_style;
} }
@ -419,8 +419,8 @@ var variants = {
}, },
generateStylesheet: function(){ generateStylesheet: function(){
var read_style = this.findLoadedStylesheet( 'custom-variant-style' ); var read_style = this.findLoadedStylesheet( 'R-custom-variant-style' );
var write_style = this.findLoadedStylesheet( 'variant-style' ); var write_style = this.findLoadedStylesheet( 'R-variant-style' );
if( !read_style ){ if( !read_style ){
read_style = write_style; read_style = write_style;
} }
@ -435,10 +435,10 @@ var variants = {
}, },
styleGraphGroup: function( selector, colorvar ){ styleGraphGroup: function( selector, colorvar ){
this.adjustCSSRules( '#body svg '+selector+' > rect', 'color: var(--INTERNAL-'+colorvar+'); fill: var(--INTERNAL-'+colorvar+'); stroke: #80808080;' ); this.adjustCSSRules( '#R-body svg '+selector+' > rect', 'color: var(--INTERNAL-'+colorvar+'); fill: var(--INTERNAL-'+colorvar+'); stroke: #80808080;' );
this.adjustCSSRules( '#body svg '+selector+' > .label .nodeLabel', 'color: var(--INTERNAL-'+colorvar+'); fill: var(--INTERNAL-'+colorvar+'); stroke: #80808080;' ); this.adjustCSSRules( '#R-body svg '+selector+' > .label .nodeLabel', 'color: var(--INTERNAL-'+colorvar+'); fill: var(--INTERNAL-'+colorvar+'); stroke: #80808080;' );
this.adjustCSSRules( '#body svg '+selector+' > .cluster-label .nodeLabel', 'color: var(--INTERNAL-'+colorvar+'); fill: var(--INTERNAL-'+colorvar+'); stroke: #80808080;' ); this.adjustCSSRules( '#R-body svg '+selector+' > .cluster-label .nodeLabel', 'color: var(--INTERNAL-'+colorvar+'); fill: var(--INTERNAL-'+colorvar+'); stroke: #80808080;' );
this.adjustCSSRules( '#body svg '+selector+' .nodeLabel', 'filter: grayscale(1) invert(1) contrast(10000);' ); this.adjustCSSRules( '#R-body svg '+selector+' .nodeLabel', 'filter: grayscale(1) invert(1) contrast(10000);' );
}, },
styleGraph: function(){ styleGraph: function(){