marc/ddgo-controller-docs
1
0
Fork 0
mirror of https://github.com/marcriera/ddgo-controller-docs.git synced 2025-05-01 06:07:05 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

deploy: 4d649fdd2f

Browse source
This commit is contained in:
MarcRiera 2022-10-10 13:19:01 +00:00
parent ec2de2c143
commit 34aa7b2e9d
242 changed files with 5054 additions and 1972 deletions
Download patch file Download diff file Expand all files Collapse all files

39
css/fonts.css Normal file
View file

@ -0,0 +1,39 @@
@font-face {
font-family: 'Work Sans';
font-style: normal;
font-weight: 200;
src: url("../fonts/WorkSans-ExtraLight.woff") format("woff2"), url("../fonts/WorkSans-ExtraLight.woff") format("woff");
font-display: swap;
}
@font-face {
font-family: 'Work Sans';
font-style: normal;
font-weight: 300;
src: url("../fonts/WorkSans-Light.woff2") format("woff2"), url("../fonts/WorkSans-Light.woff") format("woff");
font-display: swap;
}
@font-face {
font-family: 'Work Sans';
font-style: normal;
font-weight: 400;
src: url("../fonts/WorkSans-Regular.woff2") format("woff2"), url("../fonts/WorkSans-Regular.woff") format("woff");
font-display: swap;
}
@font-face {
font-family: 'Work Sans';
font-style: normal;
font-weight: 500;
src: url("../fonts/WorkSans-Medium.woff2") format("woff2"), url("../fonts/WorkSans-Medium.woff") format("woff");
font-display: swap;
}
@font-face {
font-family: 'Work Sans';
font-style: normal;
font-weight: 600;
src: url("../fonts/WorkSans-Bold.woff2") format("woff2"), url("../fonts/WorkSans-Bold.woff") format("woff");
font-display: swap;
}

181
css/format-print.css Normal file
View file

@ -0,0 +1,181 @@
@import "theme-relearn-light.css";
#sidebar {
display: none;
}
#body {
margin-left: 0;
min-width: 100%;
max-width: 100%;
width: 100%;
}
#body #navigation {
display: none;
}
html,
body #body{
font-size: 8.9pt;
}
body {
background-color: white;
}
pre code {
font-size: 8.3pt;
}
code.copy-to-clipboard-code {
border-bottom-right-radius: 2px;
border-top-right-radius: 2px;
border-right-width: 1px;
}
pre {
border: 1px solid #ccc;
}
#body #topbar{
background-color: #fff; /* avoid background bleeding*/
border-bottom: 1px solid #ddd;
border-radius: 0;
padding-left: 0; /* for print, we want to align with the footer to ease the layout */
color: #777;
}
.navigation,
#top-print-link,
#top-github-link {
/* we don't need this while printing */
display: none;
}
#body #breadcrumbs {
width: 100%;
}
#body #breadcrumbs .links {
overflow-x: hidden;
visibility: visible;
}
.copy-to-clipboard-button {
display: none;
}
#body h1, #body h2, #body h3, #body h4, #body h5, #body h6 {
/* better contrast for colored elements */
color: black;
}
#body th, #body td,
#body code, #body strong, #body b,
#body li, #body dd, #body dt,
#body p,
#body a {
/* better contrast for colored elements */
color: black;
}
#body .anchor{
display: none;
}
#body pre,
#body code {
background-color: white;
border-color: #ddd;
}
hr{
border-bottom: 1px solid #ddd;
}
body,
#body,
#body-inner {
overflow: visible !important; /* turn off limitations for perfect scrollbar */
}
#body #body-inner {
/* reset paddings for chapters in screen */
padding: 0 3.25rem 4rem 3.25rem;
}
#body #body-inner h1 {
border-bottom: 1px solid #ddd;
margin-bottom: 2rem;
padding-bottom: .75rem;
}
#body-inner .chapter h3:first-of-type {
margin-top: 2rem;
}
#body-inner .chapter p {
font-size: 1rem;
}
.footline {
/* in print mode show footer line to signal reader the end of document */
border-top: 1px solid #ddd;
color: #777;
margin-top: 1.5rem;
padding-top: .75rem;
}
#body #body-inner .footline a {
text-decoration: none;
}
#body #body-inner a {
/* in print we want to distinguish links in our content from
normal text even if printed black/white;
don't use a.highlight in selector to also get links that are
put as HTML into markdown */
text-decoration-line: underline;
}
#toc-menu {
/* we don't need this while printing */
display: none;
}
#body #sidebar-toggle-span {
/* we don't need this while printing */
display: none;
}
#breadcrumbs .links {
display: inline;
}
#topbar{
/* the header is sticky which is not suitable for print; */
position: inherit; /* IE11 doesn't know "initial" here */
}
#topbar > div {
background-color: #ffffff; /* IE11 doesn't know "initial" here */
}
#body .tab-nav-button:not(.active) {
opacity: .5;
}
#head-tags {
display: none;
}
mark {
background: inherit;
color: inherit;
}
.mermaid > svg:hover {
border-color: transparent;
}
div.box {
border: 1px solid #ddd;
}
div.box > .box-content {
background-color: white;
}
rapi-doc{
/* adjust rapi-doc internals to fill out available space */
font-size: 4pt;
margin-left: -12px;
width: calc( 100% + 12px + 8px );
}
.btn,
#body .tab-nav-button {
color: black !important;
}
#body .tab-nav-button.active {
background-color: white !important;
border-bottom-color: white !important;
color: black;
}
#body .tab-nav-button:not(.active) {
opacity: 1;
}
article {
break-before: page;
}
#body-inner > * > article:first-of-type {
break-before: avoid;
}

449
css/ie.css Normal file
View file

@ -0,0 +1,449 @@
@media all and (-ms-high-contrast:none) {
/* set default colors as in variant.css for IE11 */
body {
background-color: #ffffff; /* var(--MAIN-BG-color) */
color: #101010; /* var(--MAIN-TEXT-color) */
font-family: "Work Sans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; /* var(--MAIN-font) */
}
a,
.anchor,
#toc-menu,
#body a.highlight:after {
color: #486ac9; /* var(--MAIN-LINK-color) */
}
a:hover,
.anchor:hover,
#toc-menu:hover,
#body a.highlight:hover:after {
color: #202891; /* var(--MAIN-LINK-HOVER-color) */
}
#sidebar {
background: #282828; /* var(--MENU-SECTIONS-BG-color) */
}
#header-wrapper {
/* initially use section background to avoid flickering on load when a
non default variant is active */
background-color: rgba( 0, 0, 0, 0 ); /* var(--MENU-SECTIONS-BG-color) */
border-bottom-color: rgba( 0, 0, 0, 0 ); /* var(--MENU-SECTIONS-BG-color) */
color: #e0e0e0; /* var(--MENU-SEARCH-color) */
}
.searchbox {
border-color: #e0e0e0; /* var(--MENU-SEARCH-BORDER-color) */
background-color: #323232; /* var(--MENU-SEARCH-BG-color) */
}
#sidebar .collapsible-menu label:after,
#sidebar a {
color: #bababa; /* var(--MENU-SECTIONS-LINK-color) */
}
#sidebar select:hover,
#sidebar .collapsible-menu label:hover:after,
#sidebar a:hover {
color: #ffffff; /* var(--MENU-SECTIONS-LINK-HOVER-color) */
}
#sidebar ul.topics > li.parent,
#sidebar ul.topics > li.active {
background-color: rgba( 0, 0, 0, .166 ); /* var(--MENU-SECTIONS-ACTIVE-BG-color) */
}
#sidebar ul.topics li.active > label:after,
#sidebar ul.topics li.active > a {
background-color: #ffffff; /* var(--MENU-SECTION-ACTIVE-CATEGORY-BG-color) */
color: #444444; /* var(--MENU-SECTION-ACTIVE-CATEGORY-color) */
}
#sidebar ul li.visited > a .read-icon {
color: #486ac9; /* var(--MENU-VISITED-color) */
}
#sidebar .nav-title {
color: #ffffff; /* var(--MENU-SECTIONS-LINK-HOVER-color) */
}
#sidebar hr {
border-color: #606060; /* var(--MENU-SECTION-HR-color) */
}
#footer {
color: #bababa; /* var(--MENU-SECTIONS-LINK-color) */
}
h1 {
color: #101010; /* var(--MAIN-TEXT-color) */
font-family: "Work Sans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; /* var(--MAIN-font) */
}
h2, h3, .article-subheading, h4, h5, h6 {
color: #4a4a4a; /* var(--MAIN-TITLES-TEXT-color) */
font-family: "Work Sans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; /* var(--MAIN-TITLES-TEXT-font) */
}
div.box {
background-color: rgba( 128, 128, 128, 1 ); /* var(--INTERNAL-BOX-NEUTRAL-color) */
}
div.box > .box-label {
color: rgba( 255, 255, 255, 1 ); /* var(--BOX-CAPTION-color) */
}
div.box > .box-content {
background-color: rgba( 255, 255, 255, .833 ); /* var(--BOX-BG-color) */
color: rgba( 16, 16, 16, 1 ); /* var(--BOX-TEXT-color) */
}
div.box.info {
background-color: rgba( 48, 117, 229, 1 ); /* var(--INTERNAL-BOX-INFO-color) */
}
div.box.info > .box-content {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-INFO-TEXT-color) */
}
div.box.warning {
background-color: rgba( 224, 62, 62, 1 ); /* var(--INTERNAL-BOX-WARNING-color) */
}
div.box.warning > .box-content {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-WARNING-TEXT-color) */
}
div.box.note {
background-color: rgba( 237, 153, 9, 1 ); /* var(--INTERNAL-BOX-NOTE-color) */
}
div.box.note > .box-content {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-NOTE-TEXT-color) */
}
div.box.tip {
background-color: rgba( 42, 178, 24, 1 ); /* var(--INTERNAL-BOX-TIP-color) */
}
div.box.tip > .box-content {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-TIP-TEXT-color) */
}
div.box.primary {
background-color: #7dc903; /* var(--INTERNAL-PRIMARY-color) */
}
div.box.primary > .box-content {
color: #101010; /* var(--INTERNAL-MAIN-TEXT-color) */
}
div.box.secondary {
background-color: #486ac9; /* var(--INTERNAL-SECONDARY-color) */
}
div.box.secondary > .box-content {
color: #101010; /* var(--INTERNAL-MAIN-TEXT-color) */
}
div.box.blue {
background-color: rgba( 48, 117, 229, 1 ); /* var(--INTERNAL-BOX-BLUE-color) */
}
div.box.blue > .box-content {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-BLUE-TEXT-color) */
}
div.box.green {
background-color: rgba( 42, 178, 24, 1 ); /* var(--INTERNAL-BOX-GREEN-color) */
}
div.box.green > .box-content {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-GREEN-TEXT-color) */
}
div.box.grey {
background-color: rgba( 128, 128, 128, 1 ); /* var(--INTERNAL-BOX-GREY-color) */
}
div.box.grey > .box-content {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-GREY-TEXT-color) */
}
div.box.orange {
background-color: rgba( 237, 153, 9, 1 ); /* var(--INTERNAL-BOX-ORANGE-color) */
}
div.box.orange > .box-content {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-ORANGE-TEXT-color) */
}
div.box.red {
background-color: rgba( 224, 62, 62, 1 ); /* var(--INTERNAL-BOX-RED-color) */
}
div.box.red > .box-content {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-RED-TEXT-color) */
}
div.box.transparent {
background-color: transparent;
}
div.box.transparent > .box-label {
color: #4a4a4a; /* var(--MAIN-TITLES-TEXT-color) */
}
div.box.transparent > .box-content {
background-color: transparent;
color: #101010; /* var(--MAIN-TEXT-color) */
}
code,
kbd,
pre,
samp {
font-family: "Consolas", menlo, monospace; /* var(--CODE-font) */
}
code {
background-color: #fffae9; /* var(--CODE-INLINE-BG-color) */
border-color: #f8e8c8; /* var(--CODE-INLINE-BORDER-color) */
color: #5e5e5e; /* var(--CODE-INLINE-color) */
}
pre {
background-color: #f8f8f8; /* var(--CODE-BLOCK-BG-color) */
border-color: #d8d8d8; /* var(--CODE-BLOCK-BORDER-color) */
color: #000000; /* var(--CODE-BLOCK-color) */
}
div.featherlight .featherlight-content{
background-color: #ffffff /* var(--INTERNAL-MAIN-BG-color); */
}
#topbar {
background-color: #ffffff; /* var(--MAIN-BG-color) */
}
#body a[aria-disabled="true"] {
color: #101010; /* var(--MAIN-TEXT-color) - inherit is not processed correctly in Chrome */
}
.copy-to-clipboard-button {
background-color: #fffae9; /* var(--CODE-INLINE-BG-color) */
border-color: #f8e8c8; /* var(--CODE-INLINE-BORDER-color) */
color: #5e5e5e; /* var(--CODE-INLINE-color) */
font-family: "Consolas", menlo, monospace; /* var(--CODE-font) */
}
.copy-to-clipboard-button:hover {
background-color: #5e5e5e; /* var(--CODE-INLINE-color) */
color: #fffae9; /* var(--CODE-INLINE-BG-color) */
}
pre .copy-to-clipboard-button {
border-color: #d8d8d8; /* var(--CODE-BLOCK-BORDER-color) */
color: #486ac9; /* var(--MAIN-LINK-color) */
}
pre .copy-to-clipboard-button:hover {
background-color: #486ac9; /* var(--MAIN-LINK-color) */
border-color: #486ac9; /* var(--MAIN-LINK-color) */
color: #f8f8f8; /* var(--CODE-BLOCK-BG-color) */
}
#homelinks {
background-color: #7dc903; /* var(--MENU-HEADER-BORDER-color) */
border-color: #7dc903; /* var(--MENU-HEADER-BORDER-color) */
}
#homelinks a {
color: #323232 /* var(--MENU-HOME-LINK-color) */
}
#homelinks a:hover {
color: #808080 /* var(--MENU-HOME-LINK-HOVER-color) */;
}
#body a.highlight:after {
background-color: #486ac9; /* var(--MAIN-LINK-color) */
}
#body a.highlight:hover:after {
background-color: #202891; /* var(--MAIN-LINK-HOVER-color) */
}
.progress {
background-color: #ffffff; /* var(--MAIN-BG-color) */
}
.btn {
background-color: rgba( 128, 128, 128, 1 ); /* var(--BOX-NEUTRAL-color) */
}
.btn a {
border-color: rgba( 128, 128, 128, 1 ); /* var(--BOX-NEUTRAL-color) */
color: rgba( 255, 255, 255, 1 ); /* var(--BOX-CAPTION-color) */
}
.btn a:hover,
.btn a:focus,
.btn a:active {
background-color: rgba( 255, 255, 255, .833 ); /* var(--BOX-BG-color) */
color: rgba( 16, 16, 16, 1 ); /* var(--BOX-NEUTRAL-TEXT-color) */
}
.btn.cstyle.info {
background-color: rgba( 48, 117, 229, 1 ); /* var(--BOX-INFO-color) */
}
.btn.cstyle.info a {
border-color: rgba( 48, 117, 229, 1 ); /* var(--BOX-INFO-color) */
}
.btn.cstyle.note {
background-color: rgba( 237, 153, 9, 1 ); /* var(--BOX-NOTE-color) */
}
.btn.cstyle.note a {
border-color: rgba( 237, 153, 9, 1 ); /* var(--BOX-NOTE-color) */
}
.btn.cstyle.tip {
background-color: rgba( 42, 178, 24, 1 ); /* var(--BOX-TIP-color) */
}
.btn.cstyle.tip a {
border-color: rgba( 42, 178, 24, 1 ); /* var(--BOX-TIP-color) */
}
.btn.cstyle.warning {
background-color: rgba( 224, 62, 62, 1 ); /* var(--BOX-WARNING-color) */
}
.btn.cstyle.warning a {
border-color: rgba( 224, 62, 62, 1 ); /* var(--BOX-WARNING-color) */
}
.btn.cstyle.primary {
background-color: #7dc903; /* var(--PRIMARY-color) */
}
.btn.cstyle.primary a {
border-color: #7dc903; /* var(--PRIMARY-color) */
}
.btn.cstyle.secondary {
background-color: #486ac9; /* var(--SECONDARY-color) */
}
.btn.cstyle.secondary a {
border-color: #486ac9; /* var(--SECONDARY-color) */
}
.btn.cstyle.blue {
background-color: rgba( 48, 117, 229, 1 ); /* var(--BOX-BLUE-color) */
}
.btn.cstyle.blue a {
border-color: rgba( 48, 117, 229, 1 ); /* var(--BOX-BLUE-color) */
}
.btn.cstyle.green {
background-color: rgba( 42, 178, 24, 1 ); /* var(--BOX-GREEN-color) */
}
.btn.cstyle.green a {
border-color: rgba( 42, 178, 24, 1 ); /* var(--BOX-GREEN-color) */
}
.btn.cstyle.grey {
background-color: rgba( 128, 128, 128, 1 ); /* var(--BOX-GREY-color) */
}
.btn.cstyle.grey a {
border-color: rgba( 128, 128, 128, 1 ); /* var(--BOX-GREY-color) */
}
.btn.cstyle.orange {
background-color: rgba( 237, 153, 9, 1 ); /* var(--BOX-ORANGE-color) */
}
.btn.cstyle.orange a {
border-color: rgba( 237, 153, 9, 1 ); /* var(--BOX-ORANGE-color) */
}
.btn.cstyle.red {
background-color: rgba( 224, 62, 62, 1 ); /* var(--BOX-RED-color) */
}
.btn.cstyle.red a {
border-color: rgba( 224, 62, 62, 1 ); /* var(--BOX-RED-color) */
}
.btn.cstyle.transparent {
background-color: transparent;
color: #101010; /* var(--MAIN-TEXT-color) */
}
.btn.cstyle.transparent:hover,
.btn.cstyle.transparent:focus,
.btn.cstyle.transparent:active {
background-color: rgba( 128, 128, 128, 1 ); /* var(--BOX-NEUTRAL-color) */
}
.btn.cstyle.transparent a {
color: #4a4a4a; /* var(--MAIN-TITLES-TEXT-color) */
}
#body .tags a.tag-link {
background-color: #7dc903; /* var(--TAG-BG-color) */
color: #ffffff; /* var(--MAIN-BG-color) */
}
#body .tags a.tag-link:before {
border-right-color: #7dc903; /* var(--TAG-BG-color) */
}
#body .tags a.tag-link:after {
background: #ffffff; /* var(--MAIN-BG-color) */
}
#body .tab-nav-button.active {
background-color: #ffffff !important; /* var(--MAIN-BG-color) */
border-bottom-color: #ffffff !important; /* var(--MAIN-BG-color) */
}
}
@media all and (-ms-high-contrast:none) {
/* set further styles to fix broken stuff in IE11 */
/* turn off animiation in IE because this causes the menu
to move in from the left on every page load */
.default-animation{
transition: none;
}
/* our silly dinosaur browser wants to have the real colors */
#header-wrapper {
background-color: #7dc903; /* var(--MENU-HEADER-BG-color) */
border-bottom-color: #7dc903; /* var(--MENU-HEADER-BORDER-color) */
}
/* clears the 'X' from Internet Explorer's search input */
input[type=search]::-ms-clear { display: none; width : 0; height: 0; }
input[type=search]::-ms-reveal { display: none; width : 0; height: 0; }
/* turn off variant selector as it uses modern stuff; don't change
order with block below */
.showVariantSwitch{
display: getamodernbrowser;
}
/* dumb IE11 doesn't understand initial, so we force a fallback here */
.showLangSwitch,
.showVisitedLinks,
.showFooter {
display: block;
}
}

4
css/nucleus.css
View file

@ -180,7 +180,7 @@ body {
font-size: 1rem;
line-height: 1.5; }
h1, h2, h3, h4, h5, h6 {
h1, h2, h3, .article-subheading, h4, h5, h6 {
margin: 0.85rem 0 1rem 0;
text-rendering: optimizeLegibility; }
@ -190,7 +190,7 @@ h1 {
h2 {
font-size: 2.55rem; }
h3 {
h3, .article-subheading {
font-size: 2.15rem; }
h4 {

180
css/print.css
View file

@ -1,179 +1 @@
@import "theme-relearn-light.css";
#sidebar {
display: none;
}
#body {
margin-left: 0;
min-width: 100%;
max-width: 100%;
width: 100%;
}
#body #navigation {
display: none;
}
html,
body #body{
font-size: 8.9pt;
}
body {
background-color: white;
}
pre code {
font-size: 8.3pt;
}
code.copy-to-clipboard-code {
border-bottom-right-radius: 2px;
border-top-right-radius: 2px;
border-right-width: 1px;
}
pre {
border: 1px solid #ccc;
}
#body #topbar{
background-color: #fff; /* avoid background bleeding*/
border-bottom: 1px solid #ddd;
border-radius: 0;
padding-left: 0; /* for print, we want to align with the footer to ease the layout */
color: #777;
}
.navigation,
#top-print-link,
#top-github-link {
/* we don't need this while printing */
display: none;
}
#body #breadcrumbs {
width: 100%;
}
#body #breadcrumbs .links {
overflow-x: hidden;
visibility: visible;
}
.copy-to-clipboard-button {
display: none;
}
#body h1, #body h2, #body h3, #body h4, #body h5, #body h6 {
/* better contrast for colored elements */
color: black;
}
#body th, #body td,
#body code, #body strong, #body b,
#body li, #body dd, #body dt,
#body p,
#body .anchor,
#body a {
/* better contrast for colored elements */
color: black;
}
#body pre,
#body code {
background-color: white;
border-color: #ddd;
}
hr{
border-bottom: 1px solid #ddd;
}
body,
#body,
#body-inner {
overflow: visible !important; /* turn off limitations for perfect scrollbar */
}
#body #body-inner {
/* reset paddings for chapters in screen */
padding: 0 3rem 4rem 3rem;
}
#body #body-inner h1 {
border-bottom: 1px solid #ddd;
margin-bottom: 2rem;
padding-bottom: .75rem;
}
#body-inner .chapter h3:first-of-type {
margin-top: 2rem;
}
#body-inner .chapter p {
font-size: 1rem;
}
.footline {
/* in print mode show footer line to signal reader the end of document */
border-top: 1px solid #ddd;
color: #777;
margin-top: 1.5rem;
padding-top: .75rem;
}
#body #body-inner .footline a {
text-decoration: none;
}
#body #body-inner a {
/* in print we want to distinguish links in our content from
normal text even if printed black/white;
don't use a.highlight in selector to also get links that are
put as HTML into markdown */
text-decoration-line: underline;
}
#toc-menu {
/* we don't need this while printing */
display: none;
}
#body #sidebar-toggle-span {
/* we don't need this while printing */
display: none;
}
#breadcrumbs .links {
display: inline;
}
#topbar{
/* the header is sticky which is not suitable for print; */
position: inherit; /* IE11 doesn't know "initial" here */
}
#topbar > div {
background-color: #ffffff; /* IE11 doesn't know "initial" here */
}
#body .tab-nav-button:not(.active) {
opacity: .5;
}
#head-tags {
display: none;
}
mark {
background: inherit;
color: inherit;
}
.mermaid > svg:hover {
border-color: transparent;
}
div.box {
border: 1px solid #ddd;
}
div.box > .box-content {
background-color: white;
}
rapi-doc{
/* adjust rapi-doc internals to fill out available space */
font-size: 4pt;
margin-left: -12px;
width: calc( 100% + 12px + 8px );
}
.btn-default,
#body .tab-nav-button {
color: black !important;
}
#body .tab-nav-button.active {
background-color: white !important;
border-bottom-color: white !important;
color: black;
}
#body .tab-nav-button:not(.active) {
opacity: 1;
}
article {
break-before: page;
}
#body-inner article:first-of-type {
break-before: avoid;
}
@import "format-print.css";

21
css/tabs.css
View file

@ -1,26 +1,27 @@
#body .tab-nav-button {
background-color: rgba( 134, 134, 134, .166 ) !important;
border-color: rgba( 134, 134, 134, .333 ) !important;
border-radius: 4px 4px 0 0 !important;
border-width: 1px 1px 1px 1px !important;
background-color: rgba( 134, 134, 134, .166 );
border-color: rgba( 134, 134, 134, .333 );
border-radius: 4px 4px 0 0;
border-style: solid;
border-width: 1px;
bottom: -1px;
-webkit-print-color-adjust: exact;
color-adjust: exact;
display: block;
float: left;
font-size: .9rem;
font-weight: 500;
line-height: 1.42857143;
margin-left: 4px;
padding: 6px 12px;
position: relative;
}
#body .tab-nav-button:first-child {
margin-left: 9px;
}
#body .tab-nav-button.active {
background-color: #ffffff !important; /* var(--MAIN-BG-color) */
border-bottom-color: #ffffff !important; /* var(--MAIN-BG-color) */
}
#body .tab-nav-button:not(.active) {
border-bottom-color: rgba( 134, 134, 134, .1 ) !important;
margin-top: 7px;
border-bottom-color: rgba( 134, 134, 134, .1 );
margin-top: 8px;
padding-bottom: 2px !important;
padding-top: 2px !important;
}

5
css/tags.css
View file

@ -6,11 +6,9 @@
}
#body .tags a.tag-link {
background: #7dc903; /* var(--TAG-BG-color) */
border-bottom-right-radius: 3px;
border-top-right-radius: 3px;
box-shadow: 0 1px 2px rgba(0,0,0,0.2);
color: #ffffff; /* var(--MAIN-BG-color) */
display: inline-block;
font-size: 0.8em;
font-weight: 400;
@ -21,7 +19,7 @@
}
#body .tags a.tag-link:before {
border-color: transparent #7dc903 transparent transparent; /* var(--TAG-BG-color) */
border-color: transparent;
border-style: solid;
border-width: 1em 1em 1em 0;
content: "";
@ -33,7 +31,6 @@
}
#body .tags a.tag-link:after {
background: #ffffff; /* var(--MAIN-BG-color) */
border-radius: 100%;
content: "";
left: 1px;

7
css/theme-blue.css
View file

@ -8,9 +8,8 @@
:root {
--MAIN-TEXT-color: #323232; /* Color of text by default */
--MAIN-TITLES-TEXT-color: #5e5e5e; /* Color of titles h2-h3-h4-h5-h6 */
--MAIN-LINK-color: #1C90F3; /* Color of links */
--MAIN-LINK-color: #1c90f3; /* Color of links */
--MAIN-LINK-HOVER-color: #167ad0; /* Color of hovered links */
--MAIN-ANCHOR-color: #1C90F3; /* color of anchors on titles */
--MAIN-BG-color: #ffffff; /* color of text by default */
/* adjusted to base16-snazzy chroma style */
@ -25,7 +24,7 @@
--MENU-HOME-LINK-color: #323232; /* Color of the home button text */
--MENU-HOME-LINK-HOVER-color: #5e5e5e; /* Color of the hovered home button text */
--MENU-HEADER-BG-color: #1C90F3; /* Background color of menu header */
--MENU-HEADER-BG-color: #1c90f3; /* Background color of menu header */
--MENU-HEADER-BORDER-color: #33a1ff; /*Color of menu header border */
--MENU-SEARCH-color: #ffffff; /* Color of search field text */
@ -39,7 +38,7 @@
--MENU-SECTION-ACTIVE-CATEGORY-color: #777; /* Color of active category text */
--MENU-SECTION-ACTIVE-CATEGORY-BG-color: #fff; /* Color of background for the active category (only) */
--MENU-VISITED-color: #33a1ff; /* Color of 'page visited' icons in menu */
--MENU-VISITED-color: #1c90f3; /* Color of 'page visited' icons in menu */
--MENU-SECTION-HR-color: #20272b; /* Color of <hr> separator in menu */
/* base styling for boxes */

1
css/theme-green.css
View file

@ -10,7 +10,6 @@
--MAIN-TITLES-TEXT-color: #5e5e5e; /* Color of titles h2-h3-h4-h5-h6 */
--MAIN-LINK-color: #599a3e; /* Color of links */
--MAIN-LINK-HOVER-color: #3f6d2c; /* Color of hovered links */
--MAIN-ANCHOR-color: #599a3e; /* color of anchors on titles */
--MAIN-BG-color: #ffffff; /* color of text by default */
/* adjusted to base16-snazzy chroma style */

12
css/theme-learn.css
View file

@ -10,7 +10,6 @@
--MAIN-TITLES-TEXT-color: #5e5e5e; /* Color of titles h2-h3-h4-h5-h6 */
--MAIN-LINK-color: #00bdf3; /* Color of links */
--MAIN-LINK-HOVER-color: #0082a7; /* Color of hovered links */
--MAIN-ANCHOR-color: #00bdf3; /* color of anchors on titles */
--MAIN-BG-color: #ffffff; /* color of text by default */
/* adjusted to base16-snazzy chroma style */
@ -47,3 +46,14 @@
--BOX-BG-color: rgba( 255, 255, 255, .833 ); /* color of the content background */
--BOX-TEXT-color: rgba( 16, 16, 16, 1 ); /* fixed color of the content text */
}
body a#logo,
body #logo svg,
body #logo svg * {
color: var(--INTERNAL-MENU-SEARCH-color);
fill: var(--INTERNAL-MENU-SEARCH-color) !important;
}
body a#logo:hover {
color: var(--INTERNAL-MENU-SEARCH-color);
}

141
css/theme-neon.css
View file

@ -6,88 +6,81 @@
@import "chroma-neon.css";
:root {
--MAIN-TEXT-color: #e0e0e0; /* Color of text by default */
--MAIN-TITLES-TEXT-color: #f300b2; /* Color of titles h2-h3-h4-h5-h6 */
--PRIMARY-color: #f300b2; /* brand primary color */
--SECONDARY-color: #1c90f3; /* brand secondary color */
--MAIN-TEXT-color: #e0e0e0; /* text color of content and h1 titles */
--MAIN-LINK-HOVER-color: #4cabff; /* hoverd link color of content */
--MAIN-BG-color: #202020; /* background color of content */
/* optional overwrites for specific headers */
--MAIN-TITLES-H3-color: #00f3d3; /* Color of h3 headlines */
--MAIN-TITLES-H4-color: #ffff00; /* Color of h4 headlines */
--MAIN-LINK-color: #1c90f3; /* Color of links */
--MAIN-LINK-HOVER-color: #4cabff; /* Color of hovered links */
--MAIN-ANCHOR-color: #4cabff; /* color of anchors on titles */
--MAIN-BG-color: #202020; /* color for code background */
--MAIN-TITLES-TEXT-color: #f300b2; /* text color of h2-h6 titles and transparent box titles */
--MAIN-TITLES-H3-color: #00f3d3; /* text color of h3-h6 titles */
--MAIN-TITLES-H4-color: #ffff00; /* text color of h4-h6 titles */
/* adjusted to neon chroma style */
--CODE-BLOCK-color: #f8f8f2; /* fallback color for block code text */
--CODE-BLOCK-BG-color: #000000; /* fallback color for block code background */
--CODE-BLOCK-BORDER-color: #000000; /* color of block code border */
--CODE-BLOCK-color: #f8f8f2; /* fallback text color of block code; should be adjusted to your selected chroma style */
--CODE-BLOCK-BG-color: #000000; /* fallback background color of block code; should be adjusted to your selected chroma style */
--CODE-INLINE-color: #82e550; /* color for inline code text */
--CODE-INLINE-BG-color: #282a36; /* color for inline code background */
--CODE-INLINE-BORDER-color: #464646; /* color of inline code border */
--CODE-INLINE-color: #82e550; /* text color of inline code */
--CODE-INLINE-BG-color: #282a36; /* background color of inline code */
--CODE-INLINE-BORDER-color: #464646; /* border color of inline code */
--MERMAID-theme: dark; /* name of the default Mermaid theme for this variant, can be overridden in config.toml */
--SWAGGER-theme: dark; /* name of the default Swagger theme for this variant, can be overridden in config.toml */
--TAG-BG-color: #04d1b5; /* Background color of menu header */
--MENU-HEADER-BG-color: rgba( 0, 0, 0, 0 ); /* background color of menu header */
--MENU-HOME-LINK-color: #323232; /* Color of the home button text */
--MENU-HOME-LINK-HOVER-color: #5e5e5e; /* Color of the hovered home button text */
--MENU-HOME-LINK-color: #323232; /* home button color if configured */
--MENU-HOME-LINK-HOVER-color: #5e5e5e; /* hoverd home button color if configured */
--MENU-HEADER-BG-color: rgba( 0, 0, 0, 0 ); /* Background color of menu header */
--MENU-HEADER-BORDER-color: rgba( 0, 0, 0, 0 ); /*Color of menu header border */
--MENU-SEARCH-color: #e0e0e0; /* text and icon color of search box */
--MENU-SEARCH-BG-color: #323232; /* background color of search box */
--MENU-SEARCH-BORDER-color: #e0e0e0; /* border color of search box */
--MENU-SEARCH-color: #e0e0e0; /* Color of search field text */
--MENU-SEARCH-BG-color: #323232; /* Search field background color (by default borders + icons) */
--MENU-SEARCH-BORDER-color: #e0e0e0; /* Override search field border color */
--MENU-SECTIONS-BG-color: linear-gradient( 165deg, #f300b2d3 0%, #1c90f3b3 65%, #00e3d3b3 100% ); /* background of the menu; this is NOT just a color value but can be a complete CSS background definition including gradients, etc. */
--MENU-SECTIONS-ACTIVE-BG-color: rgba( 0, 0, 0, .166 ); /* background color of the active menu section */
--MENU-SECTIONS-LINK-color: #ffffff; /* link color of menu topics */
--MENU-SECTIONS-LINK-HOVER-color: #d0d0d0; /* hoverd link color of menu topics */
--MENU-SECTION-ACTIVE-CATEGORY-color: #56ffe8; /* text color of the displayed menu topic */
--MENU-SECTION-HR-color: #bababa; /* separator color of menu footer */
--MENU-SECTIONS-ACTIVE-BG-color: rgba( 0, 0, 0, .166 ); /* Background color of the active section and its children */
--MENU-SECTIONS-BG-color: linear-gradient( 165deg, #f300b2d3 0%, #1c90f3b3 65%, #00e3d3b3 100% ); /* Background color of side bar */
--MENU-SECTIONS-LINK-color: #ffffff; /* Color of links in menu */
--MENU-SECTIONS-LINK-HOVER-color: #d0d0d0; /* Color of links in menu, when hovered */
--MENU-SECTION-ACTIVE-CATEGORY-color: #56ffe8; /* Color of active category text */
--MENU-SECTION-ACTIVE-CATEGORY-BG-color: #202020; /* Color of background for the active category (only) */
--MENU-VISITED-color: #33a1ff; /* Color of 'page visited' icons in menu */
--MENU-SECTION-HR-color: #bababa; /* Color of <hr> separator in menu */
--MENU-VISITED-color: #33a1ff; /* icon color of visited menu topics if configured */
/* base styling for boxes */
--BOX-CAPTION-color: rgba( 240, 240, 240, 1 ); /* color of the title text */
--BOX-BG-color: rgba( 20, 20, 20, 1 ); /* color of the content background */
--BOX-TEXT-color: initial; /* automatic color of the content text */
--BOX-CAPTION-color: rgba( 240, 240, 240, 1 ); /* text color of colored box titles */
--BOX-BG-color: rgba( 20, 20, 20, 1 ); /* background color of colored boxes */
--BOX-TEXT-color: initial; /* text color of colored box content */
/* optional base colors for colored boxes as in attachments and notice shortcode */
--BOX-BLUE-color: rgba( 48, 117, 229, 1 );
--BOX-GREEN-color: rgba( 42, 178, 24, 1 );
--BOX-GREY-color: rgba( 128, 128, 128, 1 );
--BOX-ORANGE-color: rgba( 237, 153, 9, 1 );
--BOX-RED-color: rgba( 224, 62, 62, 1 );
--BOX-BLUE-TEXT-color: var(--BOX-BLUE-color);
--BOX-GREEN-TEXT-color: var(--BOX-GREEN-color);
--BOX-GREY-TEXT-color: var(--BOX-GREY-color);
--BOX-ORANGE-TEXT-color: var(--BOX-ORANGE-color);
--BOX-RED-TEXT-color: var(--BOX-RED-color);
--BOX-BLUE-color: rgba( 48, 117, 229, 1 ); /* background color of blue boxes */
--BOX-BLUE-TEXT-color: var( --BOX-BLUE-color ); /* text color of blue boxes */
--BOX-GREEN-color: rgba( 42, 178, 24, 1 ); /* background color of green boxes */
--BOX-GREEN-TEXT-color: var( --BOX-GREEN-color ); /* text color of green boxes */
--BOX-GREY-color: rgba( 128, 128, 128, 1 ); /* background color of grey boxes */
--BOX-GREY-TEXT-color: var( --BOX-GREY-color ); /* text color of grey boxes */
--BOX-ORANGE-color: rgba( 237, 153, 9, 1 ); /* background color of orange boxes */
--BOX-ORANGE-TEXT-color: var( --BOX-ORANGE-color ); /* text color of orange boxes */
--BOX-RED-color: rgba( 224, 62, 62, 1 ); /* background color of red boxes */
--BOX-RED-TEXT-color: var( --BOX-RED-color ); /* text color of red boxes */
}
body a#logo,
body #logo svg,
body #logo svg * {
color: var(--INTERNAL-MENU-SEARCH-BORDER-color);
fill: var(--INTERNAL-MENU-SEARCH-BORDER-color) !important;
color: var(--INTERNAL-MENU-SEARCH-color);
fill: var(--INTERNAL-MENU-SEARCH-color) !important;
}
body a#logo{
color: #fff;
color: var(--INTERNAL-MENU-SEARCH-color);
text-shadow:
0 0 1px #fff,
0 0 2px #fff,
0 0 4px #c0c0c0,
0 0 1px var(--INTERNAL-MENU-SEARCH-color),
0 0 2px var(--INTERNAL-MENU-SEARCH-color),
0 0 4px var(--INTERNAL-MENU-SEARCH-color),
0 0 8px #808080,
0 0 4px var(--INTERNAL-MENU-SECTIONS-LINK-HOVER-color),
0 0 8px var(--INTERNAL-MENU-SECTIONS-LINK-HOVER-color),
0 0 12px var(--INTERNAL-MENU-SECTIONS-LINK-HOVER-color);
0 0 8px var(--INTERNAL-MENU-SECTIONS-LINK-HOVER-color);
}
body h1 {
@ -113,7 +106,7 @@ body h2 {
0 0 10px var(--INTERNAL-MAIN-TITLES-H2-color);
}
body h3 {
body h3, body .article-subheading {
color: #fff;
text-shadow:
0 0 1px #fff,
@ -157,7 +150,7 @@ body h6 {
0 0 10px var(--INTERNAL-MAIN-TITLES-H5-color);
}
body #sidebar ul.topics li.active > label,
body #sidebar ul.topics li.active > label:after,
body #sidebar ul.topics li.active > a {
color: #fff;
text-shadow:
@ -190,37 +183,58 @@ body .anchor {
text-shadow: none;
}
body .btn,
body div.box {
box-shadow:
0 0 1px #fff,
0 0 2px #fff,
0 0 4px #808080,
0 0 4px var(--VARIABLE-BOX-color),
0 0 8px var(--VARIABLE-BOX-color);
0 0 4px var(--VARIABLE-BOX-color);
}
body .btn,
body div.box > .box-label {
text-shadow:
0 0 1px #fff,
0 0 2px #fff,
0 0 4px #808080,
0 0 4px var(--VARIABLE-BOX-CAPTION-color),
0 0 8px var(--VARIABLE-BOX-CAPTION-color);
0 0 4px var(--VARIABLE-BOX-CAPTION-color);
}
body div.box.transparent {
body .btn.cstyle {
--VARIABLE-BOX-TEXT-color: var(--VARIABLE-BOX-CAPTION-color);
}
body .btn.cstyle.transparent {
--VARIABLE-BOX-BG-color: var(--INTERNAL-BOX-BG-color);
}
body .btn.cstyle.transparent a {
border-color: var(--VARIABLE-BOX-color);
color: var(--VARIABLE-BOX-CAPTION-color);
}
body .btn.cstyle.transparent a:hover,
body .btn.cstyle.transparent a:focus,
body .btn.cstyle.transparent a:active {
background-color: var(--INTERNAL-MAIN-TITLES-TEXT-color);
color: var(--INTERNAL-MAIN-TEXT-color);
}
body .box.cstyle.transparent {
box-shadow: none;
}
@media print {
#body h1,
#body h2,
#body h3,
#body h3, #body .article-subheading,
#body h4,
#body h5,
#body h6 {
text-shadow: none;
}
#body .btn,
#body div.box,
#body div.box > .box-label {
box-shadow: none;
@ -232,12 +246,13 @@ body div.box.transparent {
above will not apply, so we have to repeat it here */
.print #body h1,
.print #body h2,
.print #body h3,
.print #body h3, .print #body .article-subheading,
.print #body h4,
.print #body h5,
.print #body h6 {
text-shadow: none;
}
.print #body .btn,
.print #body div.box,
.print #body div.box > .box-label {
box-shadow: none;

3
css/theme-red.css
View file

@ -10,7 +10,6 @@
--MAIN-TITLES-TEXT-color: #5e5e5e; /* Color of titles h2-h3-h4-h5-h6 */
--MAIN-LINK-color: #f31c1c; /* Color of links */
--MAIN-LINK-HOVER-color: #d01616; /* Color of hovered links */
--MAIN-ANCHOR-color: #f31c1c; /* color of anchors on titles */
--MAIN-BG-color: #ffffff; /* color of text by default */
/* adjusted to base16-snazzy chroma style */
@ -39,7 +38,7 @@
--MENU-SECTION-ACTIVE-CATEGORY-color: #777; /* Color of active category text */
--MENU-SECTION-ACTIVE-CATEGORY-BG-color: #fff; /* Color of background for the active category (only) */
--MENU-VISITED-color: #ff3333; /* Color of 'page visited' icons in menu */
--MENU-VISITED-color: #f31c1c; /* Color of 'page visited' icons in menu */
--MENU-SECTION-HR-color: #2b2020; /* Color of <hr> separator in menu */
/* base styling for boxes */

59
css/theme-relearn-dark.css
View file

@ -6,47 +6,42 @@
@import "chroma-relearn-dark.css";
:root {
--MAIN-TEXT-color: #e0e0e0; /* Color of text by default */
--MAIN-TITLES-TEXT-color: #ffffff; /* Color of titles h2-h3-h4-h5-h6 */
--MAIN-LINK-color: #1c90f3; /* Color of links */
--MAIN-LINK-HOVER-color: #4cabff; /* Color of hovered links */
--MAIN-ANCHOR-color: #4cabff; /* color of anchors on titles */
--MAIN-BG-color: #202020; /* color for code background */
--PRIMARY-color: #7dc903; /* brand primary color */
--SECONDARY-color: #6c8ce3; /* brand secondary color */
--MAIN-TEXT-color: #e0e0e0; /* text color of content and h1 titles */
--MAIN-LINK-HOVER-color: #93b0ff; /* hoverd link color of content */
--MAIN-BG-color: #202020; /* background color of content */
--MAIN-TITLES-TEXT-color: #ffffff; /* text color of h2-h6 titles and transparent box titles */
/* adjusted to relearn-dark chroma style */
--CODE-BLOCK-color: #f8f8f8; /* fallback color for block code text */
--CODE-BLOCK-BG-color: #2b2b2b; /* fallback color for block code background */
--CODE-BLOCK-BORDER-color: #2b2b2b; /* color of block code border */
--CODE-BLOCK-color: #f8f8f8; /* fallback text color of block code; should be adjusted to your selected chroma style */
--CODE-BLOCK-BG-color: #2b2b2b; /* fallback background color of block code; should be adjusted to your selected chroma style */
--CODE-INLINE-color: #82e550; /* color for inline code text */
--CODE-INLINE-BG-color: #2d2d2d; /* color for inline code background */
--CODE-INLINE-BORDER-color: #464646; /* color of inline code border */
--CODE-INLINE-color: #82e550; /* text color of inline code */
--CODE-INLINE-BG-color: #2d2d2d; /* background color of inline code */
--CODE-INLINE-BORDER-color: #464646; /* border color of inline code */
--MERMAID-theme: dark; /* name of the default Mermaid theme for this variant, can be overridden in config.toml */
--SWAGGER-theme: dark; /* name of the default Swagger theme for this variant, can be overridden in config.toml */
--MENU-HOME-LINK-color: #323232; /* Color of the home button text */
--MENU-HOME-LINK-HOVER-color: #5e5e5e; /* Color of the hovered home button text */
--MENU-HOME-LINK-color: #323232; /* home button color if configured */
--MENU-HOME-LINK-HOVER-color: #5e5e5e; /* hoverd home button color if configured */
--MENU-HEADER-BG-color: #7dc903; /* Background color of menu header */
--MENU-HEADER-BORDER-color: #7dc903; /*Color of menu header border */
--MENU-SEARCH-color: #e0e0e0; /* text and icon color of search box */
--MENU-SEARCH-BG-color: #323232; /* background color of search box */
--MENU-SEARCH-BORDER-color: #e0e0e0; /* border color of search box */
--MENU-SEARCH-color: #e0e0e0; /* Color of search field text */
--MENU-SEARCH-BG-color: #323232; /* Search field background color (by default borders + icons) */
--MENU-SEARCH-BORDER-color: #e0e0e0; /* Override search field border color */
--MENU-SECTIONS-BG-color: #2b2b2b; /* background of the menu; this is NOT just a color value but can be a complete CSS background definition including gradients, etc. */
--MENU-SECTIONS-LINK-color: #bababa; /* link color of menu topics */
--MENU-SECTIONS-LINK-HOVER-color: #ffffff; /* hoverd link color of menu topics */
--MENU-SECTIONS-ACTIVE-BG-color: #323232; /* background color of the active menu section */
--MENU-SECTION-ACTIVE-CATEGORY-color: #82e550; /* text color of the displayed menu topic */
--MENU-SECTION-HR-color: #606060; /* separator color of menu footer */
--MENU-SECTIONS-ACTIVE-BG-color: #323232; /* Background color of the active section and its children */
--MENU-SECTIONS-BG-color: #2b2b2b; /* Background color of other sections */
--MENU-SECTIONS-LINK-color: #bababa; /* Color of links in menu */
--MENU-SECTIONS-LINK-HOVER-color: #ffffff; /* Color of links in menu, when hovered */
--MENU-SECTION-ACTIVE-CATEGORY-color: #82e550; /* Color of active category text */
--MENU-SECTION-ACTIVE-CATEGORY-BG-color: #202020; /* Color of background for the active category (only) */
--MENU-VISITED-color: #486ac9; /* icon color of visited menu topics if configured */
--MENU-VISITED-color: #569cd8; /* Color of 'page visited' icons in menu */
--MENU-SECTION-HR-color: #606060; /* Color of <hr> separator in menu */
/* base styling for boxes */
--BOX-CAPTION-color: rgba( 240, 240, 240, 1 ); /* color of the title text */
--BOX-BG-color: rgba( 20, 20, 20, 1 ); /* color of the content background */
--BOX-TEXT-color: #e0e0e0; /* automatic color of the content text */
--BOX-CAPTION-color: rgba( 240, 240, 240, 1 ); /* text color of colored box titles */
--BOX-BG-color: rgba( 20, 20, 20, 1 ); /* background color of colored boxes */
--BOX-TEXT-color: #e0e0e0; /* text color of colored box content */
}

61
css/theme-relearn-light.css
View file

@ -6,44 +6,41 @@
@import "chroma-relearn-light.css";
:root {
--MAIN-TEXT-color: #101010; /* Color of text by default */
--MAIN-TITLES-TEXT-color: #4a4a4a; /* Color of titles h2-h3-h4-h5-h6 */
--MAIN-LINK-color: #486ac9; /* Color of links */
--MAIN-LINK-HOVER-color: #134fbf; /* Color of hovered links */
--MAIN-ANCHOR-color: #134fbf; /* color of anchors on titles */
--MAIN-BG-color: #ffffff; /* color of text by default */
--PRIMARY-color: #7dc903; /* brand primary color */
--SECONDARY-color: #486ac9; /* brand secondary color */
--MAIN-TEXT-color: #101010; /* text color of content and h1 titles */
--MAIN-LINK-HOVER-color: #202891; /* hoverd link color of content */
--MAIN-BG-color: #ffffff; /* background color of content */
--MAIN-TITLES-TEXT-color: #4a4a4a; /* text color of h2-h6 titles and transparent box titles */
/* adjusted to relearn-light chroma style */
--CODE-BLOCK-color: #000000; /* fallback color for block code text */
--CODE-BLOCK-BG-color: #f8f8f8; /* fallback color for block code background */
--CODE-BLOCK-BORDER-color: #d8d8d8; /* color of block code border */
--CODE-BLOCK-color: #000000; /* fallback text color of block code; should be adjusted to your selected chroma style */
--CODE-BLOCK-BG-color: #f8f8f8; /* fallback background color of block code; should be adjusted to your selected chroma style */
--CODE-BLOCK-BORDER-color: #d8d8d8; /* border color of block code */
--CODE-INLINE-color: #5e5e5e; /* color for inline code text */
--CODE-INLINE-BG-color: #fffae9; /* color for inline code background */
--CODE-INLINE-BORDER-color: #f8e8c8; /* color of inline code border */
--CODE-INLINE-color: #5e5e5e; /* text color of inline code */
--CODE-INLINE-BG-color: #fffae9; /* background color of inline code */
--CODE-INLINE-BORDER-color: #f8e8c8; /* border color of inline code */
--MENU-HOME-LINK-color: #323232; /* Color of the home button text */
--MENU-HOME-LINK-HOVER-color: #808080; /* Color of the hovered home button text */
--MERMAID-theme: default; /* name of the default Mermaid theme for this variant, can be overridden in config.toml */
--SWAGGER-theme: light; /* name of the default Swagger theme for this variant, can be overridden in config.toml */
--MENU-HEADER-BG-color: #7dc903; /* Background color of menu header */
--MENU-HEADER-BORDER-color: #7dc903; /*Color of menu header border */
--MENU-HOME-LINK-color: #323232; /* home button color if configured */
--MENU-HOME-LINK-HOVER-color: #808080; /* hoverd home button color if configured */
--MENU-SEARCH-color: #e0e0e0; /* Color of search field text */
--MENU-SEARCH-BG-color: #323232; /* Search field background color (by default borders + icons) */
--MENU-SEARCH-BORDER-color: #e0e0e0; /* Override search field border color */
--MENU-SEARCH-color: #e0e0e0; /* text and icon color of search box */
--MENU-SEARCH-BG-color: #323232; /* background color of search box */
--MENU-SEARCH-BORDER-color: #e0e0e0; /* border color of search box */
--MENU-SECTIONS-ACTIVE-BG-color: rgba( 0, 0, 0, .166 ); /* Background color of the active section and its children */
--MENU-SECTIONS-BG-color: #282828; /* Background color of other sections */
--MENU-SECTIONS-LINK-color: #bababa; /* Color of links in menu */
--MENU-SECTIONS-LINK-HOVER-color: #ffffff; /* Color of links in menu, when hovered */
--MENU-SECTION-ACTIVE-CATEGORY-color: #444444; /* Color of active category text */
--MENU-SECTION-ACTIVE-CATEGORY-BG-color: #ffffff; /* Color of background for the active category (only) */
--MENU-SECTIONS-BG-color: #282828; /* background of the menu; this is NOT just a color value but can be a complete CSS background definition including gradients, etc. */
--MENU-SECTIONS-ACTIVE-BG-color: rgba( 0, 0, 0, .166 ); /* background color of the active menu section */
--MENU-SECTIONS-LINK-color: #bababa; /* link color of menu topics */
--MENU-SECTIONS-LINK-HOVER-color: #ffffff; /* hoverd link color of menu topics */
--MENU-SECTION-ACTIVE-CATEGORY-color: #444444; /* text color of the displayed menu topic */
--MENU-SECTION-HR-color: #606060; /* separator color of menu footer */
--MENU-VISITED-color: #506397; /* Color of 'page visited' icons in menu */
--MENU-SECTION-HR-color: #606060; /* Color of <hr> separator in menu */
/* base styling for boxes */
--BOX-CAPTION-color: rgba( 255, 255, 255, 1 ); /* color of the title text */
--BOX-BG-color: rgba( 255, 255, 255, .833 ); /* color of the content background */
--BOX-TEXT-color: rgba( 16, 16, 16, 1 ); /* fixed color of the content text */
--BOX-CAPTION-color: rgba( 255, 255, 255, 1 ); /* text color of colored box titles */
--BOX-BG-color: rgba( 255, 255, 255, .833 ); /* background color of colored boxes */
--BOX-TEXT-color: rgba( 16, 16, 16, 1 ); /* text color of colored box content */
}

508
css/theme.css
View file

@ -3,90 +3,37 @@
@import "tags.css";
@import "tabs.css";
@font-face {
font-family: 'Work Sans';
font-style: normal;
font-weight: 200;
src: url("../fonts/WorkSans-ExtraLight.woff") format("woff2"), url("../fonts/WorkSans-ExtraLight.woff") format("woff");
font-display: swap;
}
@font-face {
font-family: 'Work Sans';
font-style: normal;
font-weight: 300;
src: url("../fonts/WorkSans-Light.woff2") format("woff2"), url("../fonts/WorkSans-Light.woff") format("woff");
font-display: swap;
}
@font-face {
font-family: 'Work Sans';
font-style: normal;
font-weight: 400;
src: url("../fonts/WorkSans-Regular.woff2") format("woff2"), url("../fonts/WorkSans-Regular.woff") format("woff");
font-display: swap;
}
@font-face {
font-family: 'Work Sans';
font-style: normal;
font-weight: 500;
src: url("../fonts/WorkSans-Medium.woff2") format("woff2"), url("../fonts/WorkSans-Medium.woff") format("woff");
font-display: swap;
}
@font-face {
font-family: 'Work Sans';
font-style: normal;
font-weight: 600;
src: url("../fonts/WorkSans-Bold.woff2") format("woff2"), url("../fonts/WorkSans-Bold.woff") format("woff");
font-display: swap;
}
html {
width: 100%;
height: 100%;
}
body {
background-color: #ffffff; /* var(--MAIN-BG-color) */
color: #101010; /* var(--MAIN-TEXT-color) */
display: flex;
flex-direction: row-reverse; /* IE11 to allow body to have initial focus for PS */
font-family: "Work Sans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; /* var(--MAIN-font) */
flex-direction: row-reverse; /* IE11 to allow body to have initial focus for PS and better SEO and a11y */
font-size: 16.25px;
font-weight: 300;
height: 100%;
justify-content: flex-end;
line-height: 1.574;
overflow: hidden; /* to avoid browser scrollbar to flicker before we create our own */
/* overflow: hidden; PSC removed for #242 #243 #244; to avoid browser scrollbar to flicker before we create our own */
width: 100%;
}
body #body-inner .chapter h1 {
body #body-inner.narrow h1 {
font-size: 3.5rem;
}
@media only screen and (min-width: 48em) and (max-width: 59.938em) {
body #body-inner .chapter h1 {
body #body-inner.narrow h1 {
font-size: 2.8rem;
}
}
@media only screen and (max-width: 47.938em) {
body #body-inner .chapter h1 {
font-size: 2rem;
body #body-inner.narrow h1 {
font-size: 2.5rem;
}
}
a,
#toc-menu {
color: #486ac9; /* var(--MAIN-LINK-color) */
}
a:hover,
#toc-menu:hover {
color: #134fbf; /* var(--MAIN-LINK-HOVER-color) */
}
pre {
position: relative;
}
@ -103,7 +50,6 @@ th {
}
#sidebar {
background: #282828; /* var(--MENU-SECTIONS-BG-color) */
display: flex;
flex-basis: auto;
flex-direction: column;
@ -118,15 +64,12 @@ th {
max-width: 300px;
position: fixed;
width: 300px;
z-index: 310;
z-index: 80;
}
#header-wrapper {
/* initially use section background to avoid flickering on load when a
non default variant is active */
background-color: rgba( 0, 0, 0, 0 ); /* var(--MENU-SECTIONS-BG-color) */
border-bottom: 4px solid rgba( 0, 0, 0, 0 ); /* var(--MENU-SECTIONS-BG-color) */
color: #e0e0e0; /* var(--MENU-SEARCH-color) */
border-bottom-style: solid;
border-bottom-width: 4px;
text-align: center;
padding: 1rem;
position: relative;
@ -136,9 +79,9 @@ th {
}
.searchbox {
border: 1px solid #e0e0e0; /* var(--MENU-SEARCH-BORDER-color) */
border-radius: 4px;
background-color: #323232; /* var(--MENU-SEARCH-BG-color) */
border-style: solid;
border-width: 1px;
position: relative;
margin-top: 1rem;
}
@ -187,18 +130,7 @@ th {
flex: 1; /* fill rest of vertical space */
overflow: hidden;
position: relative; /* PS */
z-index: 410;
}
#sidebar .collapsible-menu label:after,
#sidebar a {
color: #bababa; /* var(--MENU-SECTIONS-LINK-color) */
}
#sidebar select:hover,
#sidebar .collapsible-menu label:hover:after,
#sidebar a:hover {
color: #ffffff; /* var(--MENU-SECTIONS-LINK-HOVER-color) */
z-index: 100;
}
#sidebar a.padding {
@ -209,10 +141,6 @@ th {
margin: 0 1rem;
}
#sidebar ul.topics.searched ul {
display: block;
}
#sidebar ul.topics ul {
display: none;
}
@ -262,10 +190,6 @@ th {
padding-right: 1rem;
}
#sidebar ul.topics > li.parent {
background-color: rgba( 0, 0, 0, .166 ); /* var(--MENU-SECTIONS-ACTIVE-BG-color) */
}
#sidebar ul.topics li > a {
margin-left: -1rem;
margin-right: -1rem;
@ -273,11 +197,6 @@ th {
padding-right: 1rem;
}
#sidebar ul.topics li.active > a {
background-color: #ffffff; /* var(--MENU-SECTION-ACTIVE-CATEGORY-BG-color) */
color: #444444; /* var(--MENU-SECTION-ACTIVE-CATEGORY-color) */
}
#sidebar ul {
list-style: none;
padding: 0;
@ -331,12 +250,10 @@ th {
}
#sidebar ul li.visited > a .read-icon {
color: #506397; /* var(--MENU-VISITED-color) */
display: inline;
}
#sidebar .nav-title {
color: #ffffff; /* var(--MENU-SECTIONS-LINK-HOVER-color) */
font-size: 2rem;
font-weight: 200;
letter-spacing: -1px;
@ -352,14 +269,11 @@ th {
}
#sidebar hr {
border-bottom: 1px solid #606060; /* var(--MENU-SECTION-HR-color) */
border-bottom-style: solid;
border-bottom-width: 1px;
margin: 1.5rem 1rem 1rem 1rem;
}
#footer {
color: #bababa; /* var(--MENU-SECTIONS-LINK-color) */
}
#body {
display: flex;
flex-basis: 100%;
@ -374,7 +288,7 @@ th {
overflow-wrap: break-word; /* avoid x-scrolling of body if it is to large to fit */
position: relative; /* PS */
width: calc( 100% - 300px);
z-index: 300;
z-index: 70;
}
#body img,
@ -403,9 +317,10 @@ th {
#body-inner {
display: flex;
flex: 1; /* fill rest of vertical space */
flex: auto;
flex-direction: column;
padding: 0 3rem 4rem 3rem;
overflow-y: auto;
padding: 0 3.25rem 4rem 3.25rem;
position: relative; /* PS */
}
@media screen and (max-width: 59.938em) {
@ -415,10 +330,15 @@ th {
}
@media screen and (max-width: 47.938em) {
#body-inner {
padding: 0 1rem 5px 1rem;
padding: 0 1.25rem 5px 1.25rem;
}
}
#body-inner:focus-visible{
/* remove focus indicator for programatically set focus */
outline: none;
}
#body h1 + hr {
margin-bottom: 2rem;
margin-top: -1rem;
@ -429,53 +349,55 @@ th {
#body .flex-block-wrapper {
margin-left: auto;
margin-right: auto;
max-width: 1000px;
min-width: calc( 1300px - 300px - 2 * 3.25rem );
width: calc( 1300px - 300px - 2 * 3.25rem );
max-width: calc( 1300px - 300px - 2 * 3.25rem );
}
#body .narrow .flex-block-wrapper {
min-width: calc( 1300px - 300px - 2 * 9.75rem );
width: calc( 1300px - 300px - 2 * 9.75rem );
max-width: calc( 1300px - 300px - 2 * 9.75rem );
}
}
#body-inner.chapter {
margin-left: auto;
margin-right: auto;
padding: 2rem 9rem;
#body-inner.narrow {
padding: 2rem 9.75rem;
}
@media screen and (max-width: 59.938em) {
#body-inner.chapter {
padding: 15px 4rem 15px 4rem;
#body-inner.narrow {
padding: 15px 6.5rem;
}
}
@media screen and (max-width: 47.938em) {
#body-inner.chapter {
padding: 5px 2rem 5px 2rem;
#body-inner.narrow {
padding: 5px 3.25rem;
}
}
#body-inner .chapter h3:first-of-type {
#body-inner div.article-subheading,
#body-inner .chapter.deprecated h3:first-of-type {
font-weight: 200;
margin-top: 0;
text-align: center;
}
#body-inner .chapter h1 {
#body-inner.narrow h1 {
border-bottom: 4px solid rgba( 134, 134, 134, .125 );
font-size: 5rem;
}
#body-inner .chapter p {
#body-inner.narrow p {
font-size: 1.2rem;
text-align: justify;
}
h1 {
color: #101010; /* var(--MAIN-TEXT-color) */
font-family: "Work Sans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; /* var(--MAIN-font) */
font-weight: 200;
text-align: center;
text-transform: uppercase;
}
h2, h3, h4, h5, h6 {
color: #4a4a4a; /* var(--MAIN-TITLES-TEXT-color) */
font-family: "Work Sans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; /* var(--MAIN-TITLES-TEXT-font) */
h2, h3, .article-subheading, h4, h5, h6 {
letter-spacing: -1px;
text-rendering: optimizeLegibility;
}
@ -503,143 +425,34 @@ blockquote cite {
div.box {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-NEUTRAL-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-NEUTRAL-TEXT-color);
--VARIABLE-BOX-CAPTION-color: var(--INTERNAL-BOX-CAPTION-color);
background-color: #808080; /* var(--INTERNAL-BOX-NEUTRAL-color) */
--VARIABLE-BOX-BG-color: var(--INTERNAL-BOX-BG-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-NEUTRAL-TEXT-color);
-webkit-print-color-adjust: exact;
color-adjust: exact;
margin: 1.5rem 0;
}
div.box > .box-label {
color: rgba( 255, 255, 255, 1 ); /* var(--BOX-CAPTION-color) */
font-weight: 500;
padding: .2rem .6rem;
}
div.box > .box-content {
background-color: rgba( 255, 255, 255, .833 ); /* var(--BOX-BG-color) */
color: rgba( 16, 16, 16, 1 ); /* var(--BOX-TEXT-color) */
padding-bottom: .1rem;
padding-left: 1rem;
padding-right: 1rem;
}
div.box > .box-content > :first-child {
#body div.box > .box-content > :first-child {
margin-top: 0;
padding-top: 1rem;
}
div.box > .box-content > :last-child {
#body div.box > .box-content > :last-child {
margin-bottom: 1rem;
}
div.box.info {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-INFO-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-INFO-TEXT-color);
background-color: rgba( 48, 117, 229, 1 ); /* var(--INTERNAL-BOX-INFO-color) */
}
div.box.info > .box-content {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-INFO-TEXT-color) */
}
div.box.warning {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-WARNING-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-WARNING-TEXT-color);
background-color: rgba( 224, 62, 62, 1 ); /* var(--INTERNAL-BOX-WARNING-color) */
}
div.box.warning > .box-content {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-WARNING-TEXT-color) */
}
div.box.note {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-NOTE-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-NOTE-TEXT-color);
background-color: rgba( 237, 153, 9, 1 ); /* var(--INTERNAL-BOX-NOTE-color) */
}
div.box.note > .box-content {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-NOTE-TEXT-color) */
}
div.box.tip {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-TIP-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-TIP-TEXT-color);
background-color: rgba( 42, 178, 24, 1 ); /* var(--INTERNAL-BOX-TIP-color) */
}
div.box.tip > .box-content {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-TIP-TEXT-color) */
}
div.box.blue {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-BLUE-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-BLUE-TEXT-color);
background-color: rgba( 48, 117, 229, 1 ); /* var(--INTERNAL-BOX-BLUE-color) */
}
div.box.blue > .box-content {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-BLUE-TEXT-color) */
}
div.box.green {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-GREEN-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-GREEN-TEXT-color);
background-color: rgba( 42, 178, 24, 1 ); /* var(--INTERNAL-BOX-GREEN-color) */
}
div.box.green > .box-content {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-GREEN-TEXT-color) */
}
div.box.grey {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-GREY-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-GREY-TEXT-color);
background-color: #808080; /* var(--INTERNAL-BOX-GREY-color) */
}
div.box.grey > .box-content {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-GREY-TEXT-color) */
}
div.box.orange {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-ORANGE-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-WARNING-ORANGE-color);
background-color: rgba( 237, 153, 9, 1 ); /* var(--INTERNAL-BOX-ORANGE-color) */
}
div.box.orange > .box-content {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-ORANGE-TEXT-color) */
}
div.box.red {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-RED-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-RED-TEXT-color);
background-color: rgba( 224, 62, 62, 1 ); /* var(--INTERNAL-BOX-RED-color) */
}
div.box.red > .box-content {
color: rgba( 16, 16, 16, 1 ); /* var(--INTERNAL-BOX-RED-TEXT-color) */
}
div.box.transparent {
--VARIABLE-BOX-color: transparent;
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-MAIN-TEXT-color);
--VARIABLE-BOX-CAPTION-color: var(--INTERNAL-MAIN-TITLES-TEXT-color);
background-color: transparent;
}
div.box.transparent > .box-label {
color: #4a4a4a; /* var(--MAIN-TITLES-TEXT-color) */
}
div.box.transparent > .box-content {
background-color: transparent;
color: #101010; /* var(--MAIN-TEXT-color) */
}
/* attachments shortcode */
div.attachments .box-content {
@ -695,16 +508,14 @@ code,
kbd,
pre,
samp {
font-family: "Consolas", menlo, monospace; /* var(--CODE-font) */
font-size: 92%;
vertical-align: baseline;
}
code {
background-color: #fffae9; /* var(--CODE-INLINE-BG-color) */
border: 1px solid #f8e8c8; /* var(--CODE-INLINE-BORDER-color) */
border-radius: 2px;
color: #5e5e5e; /* var(--CODE-INLINE-color) */
border-style: solid;
border-width: 1px;
-webkit-print-color-adjust: economy;
color-adjust: economy;
padding-left: 2px;
@ -723,10 +534,9 @@ code.copy-to-clipboard-code {
}
pre {
background-color: #f8f8f8; /* var(--CODE-BLOCK-BG-color) */
border: 1px solid #d8d8d8; /* var(--CODE-BLOCK-BORDER-color) */
border-radius: 2px;
color: #000000; /* var(--CODE-BLOCK-color) */
border-style: solid;
border-width: 1px;
-webkit-print-color-adjust: economy;
color-adjust: economy;
line-height: 1.15;
@ -758,7 +568,8 @@ hr {
#body-inner h3,
#body-inner h4,
#body-inner h5,
#body-inner h6 {
#body-inner h6,
#body-inner .article-subheading {
/* big titles cause a horizontal scrollbar - fixing this by wrapping text */
overflow-wrap: break-word;
overflow-x: hidden;
@ -808,7 +619,7 @@ td {
text-transform: none;
white-space: pre;
word-wrap: break-word;
z-index: 450;
z-index: 140;
}
.tooltipped:before {
@ -820,7 +631,7 @@ td {
pointer-events: none;
position: absolute;
width: 0;
z-index: 460;
z-index: 150;
}
.tooltipped:hover:before,
@ -938,10 +749,9 @@ td {
}
#topbar {
background-color: #ffffff; /* var(--MAIN-BG-color) */
min-height: 3rem;
position: relative;
z-index: 480;
z-index: 170;
}
#topbar > div {
@ -1048,7 +858,6 @@ span.nav i{
}
#body a[aria-disabled="true"] {
color: #101010; /* var(--MAIN-TEXT-color) - inherit is not processed correctly in Chrome */
pointer-events: none;
text-decoration: none;
}
@ -1067,7 +876,7 @@ span.nav i{
}
}
@media screen and (max-width: 47.938em) {
/* we don't support sidebar flyout in IE */
/* we don't support sidebar flyout in mobile */
.mobile-support #sidebar {
left: -230px;
}
@ -1085,7 +894,7 @@ span.nav i{
}
.mobile-support.sidebar-flyout #sidebar {
left: 0;
z-index: 400;
z-index: 90;
}
.mobile-support.sidebar-flyout #body {
margin-left: 230px;
@ -1099,17 +908,15 @@ span.nav i{
position: absolute;
right: 0;
top: 0;
z-index: 500;
z-index: 190;
}
}
.copy-to-clipboard-button {
background-color: #fffae9; /* var(--CODE-INLINE-BG-color) */
border: 1px solid #f8e8c8; /* var(--CODE-INLINE-BORDER-color) */
border-radius: 0 2px 2px 0;
color: #5e5e5e; /* var(--CODE-INLINE-color) */
border-style: solid;
border-width: 1px;
cursor: pointer;
font-family: "Consolas", menlo, monospace; /* var(--CODE-font) */
font-size: 92%;
padding-left: 22px;
}
@ -1125,42 +932,33 @@ span.nav i{
padding-right: 5px;
}
.copy-to-clipboard-button:hover {
background-color: #5e5e5e; /* var(--CODE-INLINE-color) */
color: #fffae9; /* var(--CODE-INLINE-BG-color) */
}
pre .copy-to-clipboard-button {
background-color: rgba( 160, 160, 160, .2 );
border: 1px solid #d8d8d8; /* var(--CODE-BLOCK-BORDER-color) */
border-radius: 2px;
color: #486ac9; /* var(--MAIN-LINK-color) */
border-style: solid;
border-width: 1px;
padding: 5px 3px 5px 25px;
position: absolute;
right: 4px;
top: 4px;
}
pre .copy-to-clipboard-button:hover {
background-color: #486ac9; /* var(--MAIN-LINK-color) */
border-color: #486ac9; /* var(--MAIN-LINK-color) */
color: #f8f8f8; /* var(--CODE-BLOCK-BG-color) */
.disableInlineCopyToClipboard :not(pre) > code.copy-to-clipboard-code + span.copy-to-clipboard-button {
display: none;
}
.disableInlineCopyToClipboard :not(pre) > code.copy-to-clipboard-code {
border-bottom-right-radius: 2px;
border-top-right-radius: 2px;
border-right-width: 1px;
}
#homelinks {
background-color: #7dc903; /* var(--MENU-HEADER-BORDER-color) */
border-bottom: 4px solid #7dc903; /* var(--MENU-HEADER-BORDER-color) */
border-bottom-style: solid;
border-bottom-width: 4px;
padding: 7px 0;
}
#homelinks a {
color: #323232 /* var(--MENU-HOME-LINK-color) */
}
#homelinks a:hover {
color: #808080 /* var(--MENU-HOME-LINK-HOVER-color) */;
}
option {
color: initial;
}
@ -1278,7 +1076,6 @@ option {
}
#body a.highlight:after {
background-color: #486ac9; /* var(--MAIN-LINK-color) */
content: "";
display: block;
height: 1px;
@ -1291,7 +1088,7 @@ option {
width: 100%;
}
#body .navigation a.highlight:after,
#body #topbar .navigation a.highlight:after,
#body #sidebar-toggle-span a.highlight:after,
#body #top-print-link a.highlight:after,
#body #top-github-link a.highlight:after {
@ -1307,11 +1104,10 @@ option {
position: absolute;
right: 0;
top: 0;
z-index: 470;
z-index: 160;
}
.progress {
background-color: #ffffff; /* var(--MAIN-BG-color) */
border: 0px solid rgba( 134, 134, 134, .166 );
box-shadow: 1px 2px 5px 1px rgba( 134, 134, 134, .2 );
height: 0;
@ -1319,7 +1115,7 @@ option {
overflow: hidden;
position: absolute;
width: 0;
z-index: 490;
z-index: 180;
}
.toc-flyout .progress {
@ -1341,9 +1137,10 @@ option {
#TableOfContents {
font-size: 13px !important;
max-height: 85%;
overflow: auto;
max-height: 90vh;
overflow: hidden;
padding: 15px 5px !important;
position: relative; /* PS */
}
#TableOfContents > ul > li > a {
@ -1351,59 +1148,59 @@ option {
}
.btn {
background-image: none !important;
border: 1px solid transparent !important;
border-radius: 4px !important;
cursor: pointer !important;
display: inline-block !important;
font-size: 14px !important;
--VARIABLE-BOX-color: var(--INTERNAL-BOX-NEUTRAL-color);
--VARIABLE-BOX-CAPTION-color: var(--INTERNAL-BOX-CAPTION-color);
--VARIABLE-BOX-BG-color: var(--INTERNAL-BOX-BG-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-NEUTRAL-TEXT-color);
border-radius: 4px;
-webkit-print-color-adjust: exact;
color-adjust: exact;
cursor: pointer;
display: inline-block;
font-size: .9rem;
font-weight: 500;
line-height: 1.42857143 !important;
padding: 6px 12px !important;
margin-bottom: 0 !important;
text-align: center !important;
touch-action: manipulation !important;
transition: all 0.15s !important;
-ms-user-select: none !important;
-webkit-user-select: none !important;
user-select: none !important;
white-space: nowrap !important;
line-height: 1.42857143;
margin-bottom: 0;
touch-action: manipulation;
-ms-user-select: none;
-webkit-user-select: none;
user-select: none;
}
.btn:focus {
outline: none !important;
}
.btn:hover,
.btn:focus {
text-decoration: none !important;
}
.btn-default {
color: #101010 !important; /* var(--MAIN-TEXT-color) */
.btn a {
border-radius: 4px;
border-style: solid;
border-width: 1px;
padding: 6px 12px;
text-align: center;
touch-action: manipulation;
-ms-user-select: none;
-webkit-user-select: none;
user-select: none;
white-space: nowrap;
background-color: transparent;
border-color: rgba( 134, 134, 134, .333 ) !important;
}
.btn-default:hover,
.btn-default:focus,
.btn-default:active {
color: #ffffff !important; /* var(--MAIN-BG-color) */
background-color: rgba( 134, 134, 134, .75 ) !important;
border-color: rgba( 134, 134, 134, .75 ) !important;
#body #body-inner .btn a.highlight:after {
background-color: transparent;
}
.btn-default:active {
background-image: none !important;
.btn a:focus {
outline: none;
}
.btn a:hover,
.btn a:focus {
text-decoration: none;
}
/* anchors */
.anchor {
color: #134fbf; /* var(--MAIN-ANCHOR-color) */
cursor: pointer;
font-size: .5em;
margin-left: .66em;
vertical-align: middle;
margin-top: .9em;
position: absolute;
visibility: hidden;
}
@ -1412,7 +1209,7 @@ h3:hover .anchor,
h4:hover .anchor,
h5:hover .anchor,
h6:hover .anchor {
visibility:visible;
visibility: visible;
}
/* Redfines headers style */
@ -1432,7 +1229,7 @@ h6 a {
margin-top: 2rem;
}
#body h3 {
#body h3, #body .article-subheading {
font-size: 1.8rem;
font-weight: 500;
margin-top: 2rem;
@ -1543,42 +1340,16 @@ rapi-doc {
display: initial;
}
.footerVisitedLinks a {
cursor: pointer;
}
@media screen and (max-width: 47.938em) {
#breadcrumbs .links {
display: none;
}
}
@media all and (-ms-high-contrast:none) {
/* turn off animiation in IE because this causes the menu
to move in from the left on every page load */
.default-animation{
transition: none;
}
/* our silly dinosaur browser wants to have the real colors */
#header-wrapper {
background-color: #7dc903; /* var(--MENU-HEADER-BG-color) */
border-bottom: 4px solid #7dc903; /* var(--MENU-HEADER-BORDER-color) */
}
/* clears the 'X' from Internet Explorer's search input */
input[type=search]::-ms-clear { display: none; width : 0; height: 0; }
input[type=search]::-ms-reveal { display: none; width : 0; height: 0; }
/* turn off variant selector as it uses modern stuff; don't change
order with block below */
.showVariantSwitch{
display: getamodernbrowser;
}
/* dumb IE11 doesn't understand initial, so we force a fallback here */
.showLangSwitch,
.showVisitedLinks,
.showFooter {
display: block;
}
}
/* clears the 'X' from Chrome's search input */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
@ -1600,17 +1371,23 @@ input[type="search"]::-webkit-search-results-decoration { display: none; }
display: inline;
height: 1rem;
left: 0;
margin-top: .25em;
margin-top: .2em;
position: absolute;
width: 1rem;
}
#sidebar .collapsible-menu input.toggle + label:after {
content: "▸";
content: "\f054";
font-family: "Font Awesome 5 Free";
font-size: .8rem;
font-weight: 900;
}
#sidebar .collapsible-menu input.toggle:checked + label:after {
content: "▾";
content: "\f078";
font-family: "Font Awesome 5 Free";
font-size: .8rem;
font-weight: 900;
}
#sidebar .collapsible-menu input.toggle + label + a + ul {
@ -1620,3 +1397,24 @@ input[type="search"]::-webkit-search-results-decoration { display: none; }
#sidebar .collapsible-menu input.toggle:checked + label + a + ul {
display: inline;
}
.math.align-center > mjx-container{
text-align: center !important;
}
.math.align-left > mjx-container{
text-align: left !important;
}
.math.align-right > mjx-container{
text-align: right !important;
}
.scrollbar-measure {
/* https://davidwalsh.name/detect-scrollbar-width */
height: 100px;
overflow: scroll;
position: absolute;
width: 100px;
top: -9999px;
}

267
css/variant.css
View file

@ -1,9 +1,13 @@
:root {
/* initially use section background to avoid flickering on load when a non default variant is active;
this is only possible because every color variant defines this variable, otherwise we would have been lost */
--INTERNAL-PRIMARY-color: var(--PRIMARY-color, var(--MENU-HEADER-BG-color, rgba( 0, 0, 0, 0 ))); /* not --INTERNAL-MENU-HEADER-BG-color */
--INTERNAL-SECONDARY-color: var(--SECONDARY-color, var(--MAIN-LINK-color, #486ac9)); /* not --INTERNAL-MAIN-LINK-color */
--INTERNAL-MAIN-TEXT-color: var(--MAIN-TEXT-color, #101010);
--INTERNAL-MAIN-TITLES-TEXT-color: var(--MAIN-TITLES-TEXT-color, #4a4a4a);
--INTERNAL-MAIN-LINK-color: var(--MAIN-LINK-color, #486ac9);
--INTERNAL-MAIN-LINK-color: var(--MAIN-LINK-color, var(--SECONDARY-color, #486ac9)); /* not --INTERNAL-SECONDARY-color */
--INTERNAL-MAIN-LINK-HOVER-color: var(--MAIN-LINK-HOVER-color, var(--INTERNAL-MAIN-LINK-color));
--INTERNAL-MAIN-ANCHOR-color: var(--MAIN-ANCHOR-color, var(--INTERNAL-MAIN-LINK-HOVER-color));
--INTERNAL-MAIN-BG-color: var(--MAIN-BG-color, #ffffff);
--INTERNAL-MAIN-TITLES-H1-color: var(--MAIN-TITLES-H1-color, var(--INTERNAL-MAIN-TEXT-color));
@ -33,14 +37,12 @@
--INTERNAL-CODE-font: var(--CODE-font, "Consolas", menlo, monospace);
--INTERNAL-MERMAID-theme: var(--CONFIG-MERMAID-theme, var(--MERMAID-theme, default));
--INTERNAL-SWAGGER-theme: var(--CONFIG-SWAGGER-theme, var(--SWAGGER-theme, light));
--INTERNAL-MERMAID-theme: var(--CONFIG-MERMAID-theme, var(--MERMAID-theme, var(--INTERNAL-PRINT-MERMAID-theme)));
--INTERNAL-SWAGGER-theme: var(--CONFIG-SWAGGER-theme, var(--SWAGGER-theme, var(--INTERNAL-PRINT-SWAGGER-theme)));
--INTERNAL-TAG-BG-color: var(--TAG-BG-color, var(--INTERNAL-MENU-HEADER-BG-color));
--INTERNAL-TAG-BG-color: var(--TAG-BG-color, var(--INTERNAL-PRIMARY-color));
/* initially use section background to avoid flickering on load when a non default variant is active;
this is only possible because every color variant defines this variable, otherwise we would have been lost */
--INTERNAL-MENU-HEADER-BG-color: var(--MENU-HEADER-BG-color, rgba( 0, 0, 0, 0 ));
--INTERNAL-MENU-HEADER-BG-color: var(--MENU-HEADER-BG-color, var(--PRIMARY-color, rgba( 0, 0, 0, 0 ))); /* not --INTERNAL-PRIMARY-color */
--INTERNAL-MENU-HEADER-BORDER-color: var(--MENU-HEADER-BORDER-color, var(--INTERNAL-MENU-HEADER-BG-color));
--INTERNAL-MENU-HOME-LINK-color: var(--MENU-HOME-LINK-color, #323232);
@ -57,7 +59,7 @@
--INTERNAL-MENU-SECTION-ACTIVE-CATEGORY-color: var(--MENU-SECTION-ACTIVE-CATEGORY-color, #444444);
--INTERNAL-MENU-SECTION-ACTIVE-CATEGORY-BG-color: var(--MENU-SECTION-ACTIVE-CATEGORY-BG-color, var(--INTERNAL-MAIN-BG-color));
--INTERNAL-MENU-VISITED-color: var(--MENU-VISITED-color, #506397);
--INTERNAL-MENU-VISITED-color: var(--MENU-VISITED-color, var(--INTERNAL-SECONDARY-color));
--INTERNAL-MENU-SECTION-HR-color: var(--MENU-SECTION-HR-color, #606060);
--INTERNAL-BOX-CAPTION-color: var(--BOX-CAPTION-color, rgba( 255, 255, 255, 1 ));
@ -87,6 +89,15 @@
--INTERNAL-BOX-NOTE-TEXT-color: var(--BOX-NOTE-TEXT-color, var(--INTERNAL-BOX-ORANGE-TEXT-color));
--INTERNAL-BOX-TIP-TEXT-color: var(--BOX-TIP-TEXT-color, var(--INTERNAL-BOX-GREEN-TEXT-color));
--INTERNAL-BOX-WARNING-TEXT-color: var(--BOX-WARNING-TEXT-color, var(--INTERNAL-BOX-RED-TEXT-color));
/* print style, values taken from relearn-light as it is used as a default print style */
--INTERNAL-PRINT-MERMAID-theme: var(--PRINT-MERMAID-theme, default);
--INTERNAL-PRINT-MAIN-BG-color: var(--PRINT-MAIN-BG-color, #ffffff);
--INTERNAL-PRINT-CODE-font: var(--PRINT-CODE-font, "Consolas", menlo, monospace);
--INTERNAL-PRINT-TAG-BG-color: var(--PRINT-TAG-BG-color, #7dc903);
--INTERNAL-PRINT-MAIN-font: var(--PRINT-MAIN-font, "Work Sans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif);
--INTERNAL-PRINT-MAIN-TEXT-color: var(--PRINT-MAIN-TEXT-color, #101010);
--INTERNAL-PRINT-SWAGGER-theme: var(--PRINT-SWAGGER-theme, light);
}
body {
@ -96,13 +107,16 @@ body {
}
a,
#toc-menu {
.anchor,
#toc-menu,
#body a.highlight:after {
color: var(--INTERNAL-MAIN-LINK-color);
}
a:hover,
.anchor:hover,
#toc-menu:hover,
#body a.highlight:after {
#body a.highlight:hover:after {
color: var(--INTERNAL-MAIN-LINK-HOVER-color);
}
@ -137,6 +151,7 @@ a:hover,
background-color: var(--INTERNAL-MENU-SECTIONS-ACTIVE-BG-color);
}
#sidebar ul.topics li.active > label:after,
#sidebar ul.topics li.active > a {
background-color: var(--INTERNAL-MENU-SECTION-ACTIVE-CATEGORY-BG-color);
color: var(--INTERNAL-MENU-SECTION-ACTIVE-CATEGORY-color);
@ -168,7 +183,7 @@ h2 {
font-family: var(--INTERNAL-MAIN-TITLES-H2-font);
}
h3 {
h3, .article-subheading {
color: var(--INTERNAL-MAIN-TITLES-H3-color);
font-family: var(--INTERNAL-MAIN-TITLES-H3-font);
}
@ -188,6 +203,88 @@ h6 {
font-family: var(--INTERNAL-MAIN-TITLES-H6-font);
}
div.box {
background-color: var(--VARIABLE-BOX-color);
}
div.box > .box-label {
color: var(--VARIABLE-BOX-CAPTION-color);
}
div.box > .box-content {
background-color: var(--VARIABLE-BOX-BG-color);
color: var(--VARIABLE-BOX-TEXT-color);
}
.cstyle.info {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-INFO-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-INFO-TEXT-color);
}
.cstyle.warning {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-WARNING-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-WARNING-TEXT-color);
}
.cstyle.note {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-NOTE-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-NOTE-TEXT-color);
}
.cstyle.tip {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-TIP-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-TIP-TEXT-color);
}
.cstyle.primary {
--VARIABLE-BOX-color: var(--INTERNAL-PRIMARY-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-MAIN-TEXT-color);
}
.cstyle.secondary {
--VARIABLE-BOX-color: var(--INTERNAL-SECONDARY-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-MAIN-TEXT-color);
}
.cstyle.blue {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-BLUE-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-BLUE-TEXT-color);
}
.cstyle.green {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-GREEN-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-GREEN-TEXT-color);
}
.cstyle.grey {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-GREY-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-GREY-TEXT-color);
}
.cstyle.orange {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-ORANGE-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-ORANGE-TEXT-color);
}
.cstyle.red {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-RED-color);
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-BOX-RED-TEXT-color);
}
.cstyle.transparent {
--VARIABLE-BOX-color: transparent;
--VARIABLE-BOX-CAPTION-color: var(--INTERNAL-MAIN-TITLES-TEXT-color);
--VARIABLE-BOX-BG-color: transparent;
--VARIABLE-BOX-TEXT-color: var(--INTERNAL-MAIN-TEXT-color);
}
code,
kbd,
pre,
samp {
font-family: var(--INTERNAL-CODE-font);
}
code {
background-color: var(--INTERNAL-CODE-INLINE-BG-color);
border-color: var(--INTERNAL-CODE-INLINE-BORDER-color);
@ -204,7 +301,7 @@ div.featherlight .featherlight-content{
background-color: var(--INTERNAL-MAIN-BG-color);
}
body #topbar {
#topbar {
background-color: var(--INTERNAL-MAIN-BG-color);
}
@ -216,6 +313,7 @@ body #topbar {
background-color: var(--INTERNAL-CODE-INLINE-BG-color);
border-color: var(--INTERNAL-CODE-INLINE-BORDER-color);
color: var(--INTERNAL-CODE-INLINE-color);
font-family: var(--INTERNAL-CODE-font);
}
.copy-to-clipboard-button:hover {
@ -236,7 +334,7 @@ pre .copy-to-clipboard-button:hover {
#homelinks {
background-color: var(--INTERNAL-MENU-HEADER-BORDER-color);
border-bottom-color: var(--INTERNAL-MENU-HEADER-BORDER-color);
border-color: var(--INTERNAL-MENU-HEADER-BORDER-color);
}
#homelinks a {
@ -251,22 +349,43 @@ pre .copy-to-clipboard-button:hover {
background-color: var(--INTERNAL-MAIN-LINK-color);
}
#body a.highlight:hover:after {
background-color: var(--INTERNAL-MAIN-LINK-HOVER-color);
}
.progress {
background-color: var(--INTERNAL-MAIN-BG-color);
}
.btn-default {
color: var(--INTERNAL-MAIN-TEXT-color) !important;
.btn {
background-color: var(--VARIABLE-BOX-color);
}
.btn-default:hover,
.btn-default:focus,
.btn-default:active {
color: var(--INTERNAL-MAIN-BG-color) !important;
.btn a {
border-color: var(--VARIABLE-BOX-color);
color: var(--VARIABLE-BOX-CAPTION-color);
}
.anchor {
color: var(--INTERNAL-MAIN-ANCHOR-color);
.btn a:hover,
.btn a:focus,
.btn a:active {
background-color: var(--VARIABLE-BOX-BG-color);
color: var(--VARIABLE-BOX-TEXT-color);
}
.btn.cstyle.transparent {
--VARIABLE-BOX-BG-color: var(--INTERNAL-BOX-BG-color);
}
.btn.cstyle.transparent:hover,
.btn.cstyle.transparent:focus,
.btn.cstyle.transparent:active {
background-color: var(--INTERNAL-BOX-NEUTRAL-color);
}
.btn.cstyle.transparent a {
--VARIABLE-BOX-color: var(--INTERNAL-BOX-NEUTRAL-color);
--VARIABLE-BOX-TEXT-color: var(--VARIABLE-BOX-CAPTION-color);
}
#body .tags a.tag-link {
@ -286,107 +405,3 @@ pre .copy-to-clipboard-button:hover {
background-color: var(--INTERNAL-MAIN-BG-color) !important;
border-bottom-color: var(--INTERNAL-MAIN-BG-color) !important;
}
div.box {
background-color: var(--INTERNAL-BOX-NEUTRAL-color);
}
div.box > .box-label {
color: var(--INTERNAL-BOX-CAPTION-color);
}
div.box > .box-content {
background-color: var(--INTERNAL-BOX-BG-color);
color: var(--INTERNAL-BOX-NEUTRAL-TEXT-color);
}
div.box.info {
background-color: var(--INTERNAL-BOX-INFO-color);
}
div.box.info > .box-content {
color: var(--INTERNAL-BOX-INFO-TEXT-color);
}
div.box.warning {
background-color: var(--INTERNAL-BOX-WARNING-color);
}
div.box.warning > .box-content {
color: var(--INTERNAL-BOX-WARNING-TEXT-color);
}
div.box.note {
background-color: var(--INTERNAL-BOX-NOTE-color);
}
div.box.note > .box-content {
color: var(--INTERNAL-BOX-NOTE-TEXT-color);
}
div.box.tip {
background-color: var(--INTERNAL-BOX-TIP-color);
}
div.box.tip > .box-content {
color: var(--INTERNAL-BOX-TIP-TEXT-color);
}
div.box.blue {
background-color: var(--INTERNAL-BOX-BLUE-color);
}
div.box.blue > .box-content {
color: var(--INTERNAL-BOX-BLUE-TEXT-color);
}
div.box.green {
background-color: var(--INTERNAL-BOX-GREEN-color);
}
div.box.green > .box-content {
color: var(--INTERNAL-BOX-GREEN-TEXT-color);
}
div.box.grey {
background-color: var(--INTERNAL-BOX-GREY-color);
}
div.box.grey > .box-content {
color: var(--INTERNAL-BOX-GREY-TEXT-color);
}
div.box.orange {
background-color: var(--INTERNAL-BOX-ORANGE-color);
}
div.box.orange > .box-content {
color: var(--INTERNAL-BOX-ORANGE-TEXT-color);
}
div.box.red {
background-color: var(--INTERNAL-BOX-RED-color);
}
div.box.red > .box-content {
color: var(--INTERNAL-BOX-RED-TEXT-color);
}
div.box.transparent > .box-label {
color: var(--INTERNAL-MAIN-TITLES-TEXT-color);
}
div.box.transparent > .box-content {
color: var(--INTERNAL-MAIN-TEXT-color);
}
code,
kbd,
pre,
samp {
font-family: var(--INTERNAL-CODE-font);
}
.copy-to-clipboard-button {
font-family: var(--INTERNAL-CODE-font);
}