From 03a8e55e18f74375b2b5cc7f131942f587af77f5 Mon Sep 17 00:00:00 2001 From: Sachindu-Nethmin Date: Mon, 27 Apr 2026 14:36:08 +0530 Subject: [PATCH] Integrate custom CSS theme assets into documentation configuration --- en/docs/assets/css/custom.css | 15 + en/docs/assets/css/theme.css | 1727 +++++++++++++++++++++++++++++++++ en/mkdocs.yml | 1 + 3 files changed, 1743 insertions(+) create mode 100644 en/docs/assets/css/theme.css diff --git a/en/docs/assets/css/custom.css b/en/docs/assets/css/custom.css index f48298a96..bd5a7acd4 100644 --- a/en/docs/assets/css/custom.css +++ b/en/docs/assets/css/custom.css @@ -83,4 +83,19 @@ hr.rounded { .custom-table-header { background-color: var(--md-code-bg-color); font-weight: bold; +} + +/* Apply white background to images in dark mode ONLY in content area for better visibility of transparent diagrams */ +/* Refined to avoid affecting logos or icons (e.g., enterprise support) that might be in the content */ +[data-md-color-scheme="slate"] .md-content img:not([alt*="Logo" i]):not([alt*="icon" i]):not([alt*="Support" i]) { + background-color: #ffffff !important; + padding: 10px; + box-sizing: border-box; + border-radius: 4px; +} + +/* Force hover color to orange */ +.md-nav__link:hover, +.md-typeset a:hover { + color: var(--md-primary-fg-color) !important; } \ No newline at end of file diff --git a/en/docs/assets/css/theme.css b/en/docs/assets/css/theme.css new file mode 100644 index 000000000..7ef0991f5 --- /dev/null +++ b/en/docs/assets/css/theme.css @@ -0,0 +1,1727 @@ +/** + * Copyright (c) 2026, WSO2 LLC. (https://www.wso2.com). + * + * WSO2 LLC. licenses this file to you under the Apache License, + * Version 2.0 (the "License"); you may not use this file except + * in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, + * software distributed under the License is distributed on an + * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + * KIND, either express or implied. See the License for the + * specific language governing permissions and limitations + * under the License. + */ + +/* Merged Partials Start */ + +/* _button.css */ +:root, +[data-md-color-scheme=default] { + --md-button-asgardeo-mini-icon-path-primary-fill-color: var(--md-primary-fg-color); +} + +.md-button { + border-radius: var(--md-border-radius); + color: var(--md-typeset-color); + cursor: pointer; + display: inline-block; + font-weight: 500; + transition: color 125ms,background-color 125ms,border-color 125ms; +} + +.md-button:hover { + opacity: 0.9; +} + +.md-button.md-button--primary { + background: linear-gradient(77.74deg, var(--md-primary-fg-shade-color) 11.16%, var(--md-primary-fg-color) 99.55%) !important; + color: var(--colors-white); +} + +.md-button.md-button--primary.md-button--asgardeo { + border-radius: 38px; + padding-left: 20px; + padding-right: 20px; +} + +.md-button.md-button--link { + background-color: transparent; + border-color: transparent; +} + +.md-button.md-button--small { + padding: 6px 12px; +} + +.md-button.md-button--flex { + display: flex; + flex-direction: row; + align-content: center; + align-items: center; + gap: 10px; +} + +.md-button--asgardeo-mini { + svg .primary { + fill: var(--md-button-asgardeo-mini-icon-path-primary-fill-color); + } +} + +.md-button.md-button--discord:hover { + color: var(--colors-discord-blurple); +} + +.md-button.md-button--discord:hover svg { + fill: var(--colors-discord-blurple); +} + +.md-button.md-button--discord:hover label { + cursor: pointer; +} + +.md-button.md-button--asgardeo svg, .md-button.md-button--discord svg { + height: var(--md-header-link-icon-size); + width: var(--md-header-link-icon-size); +} + +/* _card.css */ +:root, +[data-md-color-scheme=default] { + --md-card-border-radius: var(--md-border-radius-2x); +} + +.md-card { + box-shadow: var(--md-default-box-shadow); + border: 1px solid var(--md-divider-color); + border-radius: var(--md-card-border-radius); + background-color: var(--md-surface-fg-color); + padding: 30px; +} + +/* _footer.css */ +:root, +[data-md-color-scheme=default] { + --md-footer-bg-color: var(--colors-alabaster); + --md-footer-section-icon-size: 24px; + --md-footer-section-horizontal-spacing: 3.5rem; + --md-footer-link-font-weight: 500; + --md-footer-link-chevron-size: var(--rem); + --md-footer-community-logo-size: 18px; +} + +.md-footer { + color: var(--md-typeset-color); + background-color: var(--md-default-bg-color); + border-top: 1px solid var(--md-divider-color); +} + +.md-footer__content { + max-width: var(--md-main-content-max-width); + margin: 3rem auto 2rem auto; + display: flex; + align-items: flex-start; + justify-content: center; + flex-direction: column; +} + +@media screen and (max-width: 768px) { + .md-footer__content { + padding: 0 2rem; + } +} + +.md-footer__meta { + background-color: var(--md-footer-bg-color); +} + +.md-footer .md-footer__content .md-footer__meta-sections { + width: 100%; + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + grid-gap: var(--md-footer-section-horizontal-spacing); +} + +.md-footer .md-footer__content .md-footer__meta-sections .md-footer__meta-section--discord .discord-icon { + height: var(--md-footer-section-icon-size); + width: var(--md-footer-section-icon-size); + fill: var(--colors-discord-blurple); +} + +.md-footer .md-footer__content .md-footer__meta-sections .md-footer__meta-section .md-footer__meta-section__links { + display: flex; + flex-direction: column; + gap: 25px; +} + +.md-footer .md-footer__content .md-footer__meta-sections .md-footer__meta-section .md-footer__meta-section__text-content .md-footer__meta-section__heading { + margin-top: 0.4rem; +} + +.md-footer .md-footer__content .md-footer__meta-sections .md-footer__meta-section .md-footer__meta-section__text-content .md-footer__meta-section__description { + margin-bottom: 1rem; +} + +.md-footer .md-footer__content .md-footer__meta-sections .md-footer__meta-section .md-footer__meta-section__link { + color: var(--md-typeset-color); + font-weight: var(--md-footer-link-font-weight); + display: flex; + align-items: center; + gap: 8px; +} + +.md-footer .md-footer__content .md-footer__meta-sections .md-footer__meta-section .md-footer__meta-section__link:hover:not(.md-footer__meta-section__link--composite) { + color: var(--md-primary-fg-color); +} + +.md-footer .md-footer__content .md-footer__meta-sections .md-footer__meta-section .md-footer__meta-section__link:hover:not(.md-footer__meta-section__link--composite) svg { + fill: var(--md-primary-fg-color); +} + +.md-footer .md-footer__content .md-footer__meta-sections .md-footer__meta-section .md-footer__meta-section__link .chevron { + width: var(--md-footer-link-chevron-size); + height: var(--md-footer-link-chevron-size); +} + +.md-footer .md-footer__content .md-footer__meta-sections .md-footer__meta-section .md-footer__meta-section__link--composite label { + font-weight: 400; +} + +.md-footer .md-footer__content .md-footer__meta-sections .md-footer__meta-section .md-footer__meta-section__link--composite a { + cursor: pointer; +} + +.md-footer .md-footer__content .md-footer__meta-sections .md-footer__meta-section .md-footer__meta-section__link--composite .community-logo { + height: var(--md-footer-community-logo-size); + width: var(--md-footer-community-logo-size); +} + +.md-footer .md-footer__content .md-footer__meta-sections .md-footer__meta-section .md-footer__meta-section__link--composite .community-logo--monochrome path { + fill: var(--md-typeset-color); +} + +.md-footer .md-copyright { + border-top: 1px solid var(--md-divider-color); + color: var(--md-typeset-color); +} + +.md-footer .md-copyright .md-copyright__content { + margin: 0 auto; + max-width: var(--md-main-content-max-width); + display: flex; + flex-direction: row; + justify-content: space-between; + flex-wrap: wrap; +} + +.md-footer .md-copyright .md-copyright__highlight { + color: var(--md-typeset-color); +} + +.md-footer .md-copyright .md-copyright__content a { + color: var(--md-typeset-color); +} + +.md-footer .md-copyright .md-copyright__content a:hover { + color: var(--md-primary-fg-color); +} + +/* _header.css */ +:root, +[data-md-color-scheme=default] { + --md-header-box-shadow: none; + --md-header-min-height: 62px; + --md-header-link-font-size: .7rem; + --md-header-link-font-weight: 400; + --md-header-link-opacity: 1; + --md-header-link-icon-size: 20px; + --md-header-tabs-mobile-breakpoint: 70.1875em; + --md-header-links-vertical-spacing: 2px; +} + +.md-header { + border-bottom: 1px solid var(--md-divider-color); + box-shadow: var(--md-header-box-shadow); +} + +.md-header__inner { + padding: 0 1rem; + min-height: var(--md-header-min-height); +} + +.md-header__topic { + font-size: .8rem; + position: relative; + top: -2px; + transform: none !important; + opacity: 1 !important; +} + +.md-header__topic:first-child { + font-weight: 400; + display: block !important; + position: relative !important; +} + +.md-header__topic:last-child { + display: none !important; +} + +.md-header__ellipsis { + overflow: visible !important; +} + +.md-header__title { + margin-left: 0; +} + +.md-header .md-search { + margin: 0 0; +} + +.md-header .md-tabs { + position: relative; + overflow: visible; + height: 48px; + z-index: 1; +} + +[data-md-color-scheme=default] .md-header, +[data-md-color-scheme=default] .md-tabs { + background-color: var(--md-default-bg-color); + color: var(--md-default-fg-color); +} + +[data-md-color-scheme=slate] .md-header, +[data-md-color-scheme=slate] .md-tabs { + background-color: var(--md-default-bg-color); +} + +.md-header .md-tabs .md-tabs__list { + position: absolute; + left: 0; + top: 0; +} + +.md-tabs__link--active, +.md-tabs__link:focus, +.md-tabs__link:hover { + color: var(--md-primary-fg-color); +} + +.md-tabs__link { + font-size: var(--md-header-link-font-size); + font-weight: var(--md-header-link-font-weight); + opacity: var(--md-header-link-opacity); + -webkit-font-smoothing: auto; +} + +@media screen and (min-width: 100em) { + .md-header .md-tabs { + position: relative; + overflow: visible; + height: 53px; + } +} + +.md-header__button { + margin-right: var(--md-header-links-vertical-spacing); +} + +.md-header__button.md-logo img, +.md-header__button.md-logo svg { + height: 1.4rem; + padding: .1rem 0; +} + +.md-header .md-header__button.md-icon svg { + height: var(--md-header-link-icon-size); + width: var(--md-header-link-icon-size); +} + +.md-header .md-header__button.md-icon.md-theme-switch svg path { + fill: var(--md-default-fg-color); +} + +[data-md-toggle=search]:checked~.md-header .md-header__option { + opacity: 1; + max-width: none; +} + +.md-header__extra { + display: flex; +} + +.md-header__extra .md-header__links { + display: flex; + flex-direction: row; + align-items: center; +} + +.md-header__extra:before { + width: 1px; + background-color: var(--md-divider-color); + content: ""; +} + +.md-header__extra button { + margin-right: var(--md-header-links-vertical-spacing); +} + +.md-button.md-button--asgardeo, +.md-button.md-button--discord, +.md-button.md-button--linkedin, +.md-button.md-button--youtube, +.md-button.md-button--twitter { + display: none; +} + +.md-icon.md-button--asgardeo-mini, +.md-icon.md-button--discord-mini, +.md-header__button.md-button--asgardeo-mini { + display: block; +} + +.md-header__version-select { + overflow: visible; + width: 3.5rem; + margin-left: 1.5rem; +} + +.md-header__version-select .md-tabs__link.md-tabs__dropdown-link { + font-size: 0.8rem; +} + +.md-header__version-select .md-tabs__link.md-tabs__dropdown-link i { + font-size: 14px; + margin-left: 3px; +} + +.mb-tabs__dropdown { + position: relative; + text-align: center; +} + +.md-tabs__dropdown-link { + display: contents; +} + +.mb-tabs__dropdown.group-select { + background-color: #737373; +} + +.mb-tabs__dropdown .mb-tabs__dropdown-content { + position: absolute; + left: 0; + top: 3.5em; + -webkit-transition: all .2s cubic-bezier(.680, 0, .265, 1); + transition: all .2s; + -webkit-transform: scale(0); + transform: scale(0); + -webkit-transform-origin: 0 0; + transform-origin: top left; + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .16), 0 2px 8px 0 rgba(0, 0, 0, .12); + background: var(--md-surface-fg-color); + font-size: 1.4rem; + color: var(--md-default-fg-color); + padding: 0; + z-index: 1; + visibility: hidden; + pointer-events: none; +} + +.mb-tabs__dropdown.open .mb-tabs__dropdown-content { + visibility: visible; + pointer-events: auto; +} + +.mb-tabs__dropdown .mb-tabs__dropdown-content .md-tabs__item { + padding: 2px; +} + +.mb-tabs__dropdown .mb-tabs__dropdown-content .md-tabs__item a:hover { + background-color: #a4a4a44d; + border-radius: 5px; +} + +.mb-tabs__dropdown .mb-tabs__dropdown-content li { + display: block; + width: 100%; + opacity: 0; + transform: translate(-20px, 0); +} + +.mb-tabs__dropdown.open .mb-tabs__dropdown-content li { + display: block; + transition: all .4s; + opacity: 1; + transform: translate(0, 0); + height: auto; +} + +.mb-tabs__dropdown ul li a { + width: 100%; + padding: .5rem; + white-space: pre; + box-sizing: border-box; + display: block; + font-size: .7rem; + text-transform: capitalize; +} + +.mb-tabs__dropdown ul li a:hover { + background: var(--md-default-fg-color--lightest); +} + +.mb-tabs__dropdown.open .mb-tabs__dropdown-content { + -webkit-transform: scale(1); + transform: scale(1); + transition-timing-function: cubic-bezier(.680, 0, .265, 1); +} + +.md-header__version-select .md-tabs__link { + color: var(--md-primary-fg-color-header-text-active); +} + +.md-header__version-select .mb-tabs__dropdown .mb-tabs__dropdown-content, +.md-header__distribution-select .mb-tabs__dropdown .mb-tabs__dropdown-content { + border-radius: 5px; + background: var(--md-surface-fg-color); + color: var(--md-default-fg-color); + opacity: 1; + border: 1px solid var(--md-divider-color); +} + +.md-header__version-select .mb-tabs__dropdown .mb-tabs__dropdown-content { + top: 0rem; +} + +@media screen and (max-width: 768px) { + :root { + --md-header-links-vertical-spacing: 4px; + } + + .md-header__topic { + left: 0; + top: 0; + } + + .md-header__inner { + padding: 0 0.25rem; + } + + .md-header__button { + margin-right: 2px; + } + + .md-header__title { + flex-shrink: 1; + min-width: 0; + overflow: hidden; + } + + .md-header__button.md-logo img, + .md-header__button.md-logo svg { + height: 1.2rem; + } + + .md-header__button.md-icon[for="__search"], + label[for="__search"].md-header__button { + margin-right: 0; + } +} + +/* _icon.css */ +:root, +[data-md-color-scheme=default] { + --md-icon-padding: 8px; + --md-icon-hover-background-color: var(--colors-mystic); +} + +[data-md-color-scheme=slate] { + --md-icon-hover-background-color: #393939; + --md-header-box-shadow: none; +} + +.md-icon.md-icon--hover { + padding: 8px; +} + +.md-icon.md-icon--hover:hover { + background: var(--md-icon-hover-background-color); + border-radius: 50%; +} + +/* _search.css */ +:root, +[data-md-color-scheme=default] { + --md-home-search-background-color: #ffffff; + --md-search-results-meta-background-color: #f5f5fa; + --md-home-search-box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1); + --md-home-search-box-shadow-hover: 0 10px 15px 2px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1); + --md-home-search-border-radius: 9999px; + --md-home-search-expanded-width: 60%; + --md-home-search-expanded-box-shadow: 0 8px 22px 0 rgba(37, 44, 97, .15), 0 4px 6px 0 rgba(93, 100, 148, .2); + --md-home-search-expanded-border-radius: 8px; + --md-home-search-border-color: #f2f2f3; + + --md-header-search-background-color: #f6f6f7; + --md-header-search-hover-border-color: var(--md-primary-fg-color); + --md-header-search-border-color: var(--md-divider-color); +} + +[data-md-color-scheme=slate] { + --md-home-search-background-color: #1b1b1d; + --md-home-search-box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1); + --md-home-search-box-shadow-hover: 0 10px 15px 2px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1); + --md-home-search-border-color: #2c2c2c; + + --md-header-search-background-color: #161618; + --md-search-results-meta-background-color: #2d2d37; +} + +.md-search-result__meta { + background-color: var(--md-search-results-meta-background-color); + line-height: 1rem; +} + +.md-search__output .md-search-result .md-search-result__meta { + padding-top: 10px; + padding-bottom: 6px; + margin-top: 3px; +} + +[data-md-toggle=search]:checked~.md-container .md-search__output .md-search-result__more { + border-radius: 0; + border-right: 0; + border-left: 0; +} + +[data-md-toggle=search]:checked~.md-container .md-search__output .md-search-result__more summary { + display: flex; + flex-direction: row; + flex-wrap: nowrap; + justify-content: space-between; +} + +[data-md-toggle=search]:checked~.md-container .md-search__output .md-search-result__more summary::after { + position: relative; + right: 0; +} + +.md-search-result__more>summary:focus>div, +.md-search-result__more>summary:hover>div { + background-color: transparent; +} + +[data-md-toggle=search]:checked~.md-header .md-search .md-search__inner .md-search__form, +[data-md-toggle=search]:checked~.md-container .md-home-search-container .md-search__form { + border-radius: var(--md-home-search-expanded-border-radius); + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; +} + +.md-home-search-container .md-search .md-search__inner { + background-color: var(--md-home-search-background-color); + box-shadow: var(--md-home-search-box-shadow); + border-radius: var(--md-home-search-border-radius); + border: 1px solid var(--md-home-search-border-color); + padding: 0; +} + +.md-home-search-container .md-search .md-search__inner:hover { + box-shadow: var(--md-home-search-box-shadow-hover); +} + +.md-home-search-container .md-search .md-search__inner .md-search__form { + background: transparent; +} + +.md-home-search-container .md-search .md-search__inner .md-search__form .md-search__input::placeholder { + --text-opacity: 0.8; + color: var(--md-typeset-color); + opacity: var(--text-opacity); +} + +[data-md-toggle=search]:checked~.md-container .md-home-search-container .md-search__inner { + width: var(--md-home-search-expanded-width); + box-shadow: var(--md-home-search-expanded-box-shadow); +} + +@media screen and (max-width: 59.9375em) { + [data-md-toggle=search]:checked~.md-container .md-home-search-container .md-search__inner { + width: 100%; + } +} + +[data-md-toggle=search]:checked~.md-container .md-home-search-container .md-search__output { + box-shadow: var(--md-home-search-expanded-box-shadow); + border-bottom-left-radius: var(--md-home-search-expanded-border-radius); + border-bottom-right-radius: var(--md-home-search-expanded-border-radius); + padding-top: 5px; + margin-top: -13px; +} + +.md-header .md-search__input, +.md-header .md-search__input::placeholder, +.md-header .md-search .md-search__inner .md-search__form .md-search__suggest { + font-size: var(--md-header-link-font-size); +} + +[dir=ltr] .md-search__suggest { + padding-left: 1.8rem; + top: 1px; +} + +.md-header .md-search .md-search__inner .md-search__form .md-search__icon.md-icon, +.md-header .md-search .md-search__inner .md-search__form .md-search__options { + display: flex; + align-items: center; +} + +.md-header .md-search__input { + padding-left: 1.8rem; +} + +.md-header .md-search .md-search__inner .md-search__form .md-search__icon.md-icon svg, +.md-header .md-search .md-search__inner .md-search__form .md-search__options svg { + height: var(--md-header-link-icon-size); + width: var(--md-header-link-icon-size); +} + +.md-header .md-search .md-search__inner .md-search__form { + background-color: var(--md-header-search-background-color); + border: 1px solid var(--md-header-search-border-color); + border-radius: var(--md-border-radius); +} + +[data-md-toggle=search]:not(:checked)~.md-header .md-search .md-search__inner .md-search__form:hover { + border-color: var(--md-header-search-hover-border-color); +} + +[data-md-toggle=search]:checked~.md-header .md-search__output { + box-shadow: var(--md-home-search-expanded-box-shadow); + border-bottom-left-radius: var(--md-home-search-expanded-border-radius); + border-bottom-right-radius: var(--md-home-search-expanded-border-radius); + border: 1px solid var(--md-home-search-border-color); + padding-top: 5px; + margin-top: -13px; +} + +@media screen and (max-width: 59.9375em) { + .md-search { + margin: 0 !important; + } +} + +@media screen and (min-width: 60em) { + [dir=ltr] .md-search__suggest { + top: 0; + } +} + +/* _typography.css */ +:root { + --rem: 16px; +} + +@font-face { + font-family: 'Gilmer'; + src: url('../fonts/gilmer/gilmer-regular.eot'); + src: + url('../fonts/gilmer/gilmer-regular.eot?#iefix') format('embedded-opentype'), + url('../fonts/gilmer/gilmer-regular.woff2') format('woff2'), + url('../fonts/gilmer/gilmer-regular.woff') format('woff'), + url('../fonts/gilmer/gilmer-regular.ttf') format('truetype'); + font-weight: normal; + font-style: normal; +} + +@font-face { + font-family: 'Gilmer'; + src: url('../fonts/gilmer/gilmer-medium.eot'); + src: + url('../fonts/gilmer/gilmer-medium.eot?#iefix') format('embedded-opentype'), + url('../fonts/gilmer/gilmer-medium.woff2') format('woff2'), + url('../fonts/gilmer/gilmer-medium.woff') format('woff'), + url('../fonts/gilmer/gilmer-medium.ttf') format('truetype'); + font-weight: 500; + font-style: normal; +} + +@font-face { + font-family: 'Gilmer'; + src: url('../fonts/gilmer/gilmer-bold.eot'); + src: + url('../fonts/gilmer/gilmer-bold.eot?#iefix') format('embedded-opentype'), + url('../fonts/gilmer/gilmer-bold.woff2') format('woff2'), + url('../fonts/gilmer/gilmer-bold.woff') format('woff'), + url('../fonts/gilmer/gilmer-bold.ttf') format('truetype'); + font-weight: bold; + font-style: normal; +} + +.md-typeset { + font-size: var(--rem); +} + +.md-typeset ul, +.md-typeset ol { + margin: 0 0 1em 0; + padding-left: 2em; +} + +.md-typeset ul li, +.md-typeset ol li { + margin-bottom: 0.5em; + margin-left: 0; +} + +.md-typeset ul li:last-child, +.md-typeset ol li:last-child { + margin-bottom: 0; +} + +.md-typeset ul ul, +.md-typeset ul ol, +.md-typeset ol ul, +.md-typeset ol ol { + margin-top: 0.5em; + margin-bottom: 0.5em; +} + +.md-typeset blockquote { + padding-left: 0.6rem; + border-left: 0.2rem solid var(--md-default-fg-color--lighter); + margin-left: 0; +} + +.md-typeset .admonition > *, +.md-typeset details > * { + margin-left: 0; + margin-right: 0; +} + +.md-typeset pre { + margin: 1em 0; +} + +.md-typeset .toc ul { + margin-left: 0; +} + +.md-typeset .toc ul li { + margin-left: 0; +} + +/* Merged Partials End */ + +:root { + --md-main-content-max-width: 1400px; + --md-border-radius: 8px; + --md-border-radius-2x: 12px; + --md-default-box-shadow: 0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1); + --md-box-shadow-2: 0 12px 32px rgba(0, 0, 0, .1), 0 2px 6px rgba(0, 0, 0, .08); + --md-sidebar-width: 15.2rem; + --md-sidebar-hide-width: -15.2rem; + --md-default-letter-spacing: 0.1px; +} + +:root, +[data-md-color-scheme=default] { + /* START OF - Default Material Theme Overrides */ + --md-text-font: "Gilmer", sans-serif; + --md-primary-fg-color: #ff7300; + --md-primary-fg-shade-color: #eb4f63; + --md-accent-fg-color: #e46700; + --md-redoc-example-bg-color: #2b3339; + /* END OF - Default Material Theme Overrides */ + + /* START OF - Icon Colors */ + --icon-bg-color-opacity: 1; + --icon-color-1-bg: rgba(233, 246, 252, var(--icon-bg-color-opacity)); + --icon-color-1-fg: #27aae1; + --icon-color-2-bg: rgba(255, 236, 246, var(--icon-bg-color-opacity)); + --icon-color-2-fg: #cf3b89; + --icon-color-3-bg: rgba(231, 246, 245, var(--icon-bg-color-opacity)); + --icon-color-3-fg: #15a79e; + --icon-color-4-bg: rgba(255, 247, 239, var(--icon-bg-color-opacity)); + --icon-color-4-fg: #f7931e; + /* END OF - Icon Colors */ + + /* START OF - Colors */ + --colors-white: #ffffff; + --colors-mystic: #d8dde8; + --colors-shark: #1f2024; + --colors-alabaster: #f9f9f9; + --colors-discord-blurple: #5865F2; + /* END OF - Colors */ + + --md-divider-color: var(--colors-mystic); + --md-surface-fg-color: var(--colors-white); + + /* START OF - Chip Variable */ + --md-chip-border-width: 0px; + --md-chip-bg-color: var(--md-primary-fg-color); + --md-chip-beta-bg-color: linear-gradient(131deg, rgba(143, 197, 246, 0.30) 0%, rgba(72, 141, 180, 0.30) 100%); + --md-chip-beta-border-color: #488DB4; + --md-chip-beta-text-color: linear-gradient(93deg, #488DB4 0%, #1F3D4E 100%); + --md-chip-preview-bg-color: linear-gradient(131deg, rgba(233, 95, 255, 0.30) 0%, rgba(140, 57, 153, 0.30) 100%); + --md-chip-preview-border-color: #8C3999; + --md-chip-preview-text-color: linear-gradient(93deg, #8C3999 0%, #2F1333 100%); + --md-chip-new-bg-color: linear-gradient(131deg, rgba(117, 237, 161, 0.30) 28.46%, rgba(52, 146, 86, 0.30) 119.09%); + --md-chip-new-border-color: #349256; + --md-chip-new-text-color: linear-gradient(93deg, #349256 28.46%, #102C1A 119.09%); + --md-chip-premium-bg-color: linear-gradient(131deg, rgba(224, 184, 52, 0.30) 25.98%, rgba(181, 138, 0, 0.30) 112.91%); + --md-chip-premium-border-color: #928934; + --md-chip-premium-text-color: linear-gradient(93deg, #928934 28.46%, #2C2910 119.09%); + /* END OF - Chip Variables */ +} + +:root, +[data-md-color-scheme=default], +[data-md-color-scheme=slate] { + --md-code-fg-color: #d9d9de; + --md-code-bg-color: #161618; + --md-code-hl-color: #29353f; + --md-code-hl-number-color: #d52a2a; + --md-code-hl-special-color: #db1457; + --md-code-hl-function-color: #ec9752; + --md-code-hl-constant-color: #00AFFE; + --md-code-hl-keyword-color: #4489FF; + --md-code-hl-string-color: #a0fbaa; + --md-code-hl-name-color: #d9d9de; + --md-code-hl-operator-color: #d9d9de; + --md-code-hl-punctuation-color: #d9d9de; + --md-code-hl-comment-color: #47bfffb5; + --md-code-hl-generic-color: #47bfffb5; + --md-code-hl-variable-color: #47bfffb5; + + --md-code-tab-bg-color: #393c43; + --md-code-linenos-bg-color: #161618; + --md-code-block-radius: .4rem; +} + +:root, [data-md-color-scheme=slate] { + /* START OF - Default Material Theme Overrides */ + --md-default-bg-color: #232327; + --md-redoc-example-bg-color: #36363b; + /* END OF - Default Material Theme Overrides */ + + /* START OF - Icon Colors */ + --icon-bg-color-opacity: 0.1; + /* END OF - Icon Colors */ + + --md-typeset-inverted-color: var(--colors-white); + --md-divider-opacity: 0.1; + --md-divider-color: rgba(255, 255, 255, var(--md-divider-opacity)); + --md-surface-fg-color: var(--colors-shark); + --md-default-box-shadow: 0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1); + + /* START OF - Chip Colors */ + --md-chip-beta-text-color: linear-gradient(93deg, #adcddf 0%, #59859e 100%); + --md-chip-preview-text-color: linear-gradient(93deg, #ef85ff 0%, #e1bae7 100%); + --md-chip-new-text-color: linear-gradient(93deg, #5bb77c 28.46%, #65d48d 119.09%); + --md-chip-premium-text-color: linear-gradient(93deg, #d9d07c 28.46%, #867f46 119.09%); + /* END OF - Chip Colors */ +} + +@supports selector(::-webkit-scrollbar) { + [dir=ltr] .md-sidebar__inner { + padding-right: calc(100% - var(--md-sidebar-width)); + } + [dir=rtl] .md-sidebar__inner { + padding-left: calc(100% - var(--md-sidebar-width)); + } +} + +@media screen and (max-width: 76.1875em) { + [dir=ltr] .md-sidebar--primary { + left: var(--md-sidebar-hide-width); + } +} + +@media screen and (max-width: 76.1875em) { + [data-md-toggle=drawer]:checked~.md-container .md-sidebar--primary { + transform: translateX(var(--md-sidebar-width)); + } +} + +.md-sidebar { + width: var(--md-sidebar-width); +} + +.icon-color-1 { background-color: var(--icon-color-1-bg); } +.icon-color-1 svg path { fill: var(--icon-color-1-fg) !important; } +.icon-color-2 { background-color: var(--icon-color-2-bg); } +.icon-color-2 svg path { fill: var(--icon-color-2-fg) !important; } +.icon-color-3 { background-color: var(--icon-color-3-bg); } +.icon-color-3 svg path { fill: var(--icon-color-3-fg) !important; } +.icon-color-4 { background-color: var(--icon-color-4-bg); } +.icon-color-4 svg path { fill: var(--icon-color-4-fg) !important; } + +[data-md-color-scheme=default] .md-typeset pre > .md-clipboard { + color: var(--md-default-bg-color--lightest); +} + +[data-md-color-scheme=default] .md-typeset pre:hover > .md-clipboard { + color: var(--md-default-bg-color--light); +} + +[data-md-color-scheme=default] .md-typeset pre > .md-clipboard:focus, +[data-md-color-scheme=default] .md-typeset pre > .md-clipboard:hover { + color: var(--md-accent-fg-color); +} + +.md-typeset .tabbed-labels, +.highlight span.filename { + border-top-left-radius: var(--md-code-block-radius); + border-top-right-radius: var(--md-code-block-radius); + background-color: var(--md-code-tab-bg-color); + color: var(--md-code-fg-color); +} + +.highlighttable .linenos { + box-shadow: -.01rem 0 #5c5c5c inset; + background-color: var(--md-code-linenos-bg-color); + border-bottom-left-radius: var(--md-code-block-radius); + border-top-left-radius: var(--md-code-block-radius); +} + +.highlighttable th.filename, +.md-typeset .tabbed-labels > label { + color: var(--colors-white); +} + +.md-typeset .highlighttable > tbody > tr + tr > .code > div > pre > code { + border-top-left-radius: 0; + border-top-right-radius: 0; +} + +.md-typeset .highlighttable > tbody > tr + tr > .linenos { + border-top-left-radius: 0; +} + +.md-typeset code { + color: var(--md-code-fg-color); + background-color: var(--md-code-bg-color); + border-radius: .25rem; + padding: .1rem .3rem; +} + +[data-md-color-scheme=default] .md-typeset code { + background-color: var(--md-code-fg-color); + color: var(--md-code-bg-color); +} + +.md-typeset pre > code { + border-radius: var(--md-code-block-radius); + color: var(--md-code-fg-color) !important; + background-color: var(--md-code-bg-color) !important; +} + +.highlighttable .linenodiv pre { + color: var(--md-code-hl-name-color); +} + +.md-typeset code .nx, +.md-typeset code .err { + color: var(--md-code-hl-name-color); +} + +.md-grid { + max-width: 100%; +} + +.md-tabs { + width: auto; + line-height: 1.2; + z-index: 0; +} + +.md-content__inner { + margin: 0 2rem 1.2rem; +} + +.md-typeset h1 { + color: var(--md-default-fg-color); +} + +.md-search__form { + background-color: #7a7a7a42; +} + +.md-sidebar__scrollwrap { + padding: 1rem 0; + margin: 0 0 0 1rem; + height: 100% !important; +} + +.center-all { + text-align: center; +} + +.center-all .cards-container { + justify-content: center; +} + +.cards-grid h1:first-child { + margin-bottom: 0; +} + +.cards-container { + margin: 50px 0; + display: flex; + flex-wrap: wrap; + align-items: stretch; +} + +.cards-container > h1 { + margin-bottom: 0; +} + +.cards-container > h3 { + margin: 0.5em 0 2em; +} + +.cards-container .card { + display: inline-block; + margin: 50px; + padding: 20px; + border-radius: 4px; + border: 1px solid var(--md-default-fg-color--lightest); + max-width: 330px; + text-align: center; + color: var(--md-default-fg-color); +} + +.centered-container { + display: flex; + justify-content: left; + align-items: baseline; + } + + .border-text { + margin: 10px; + text-align: center; + } + +.cards-container .card > h3 { + margin-top: 0; +} + +.cards-container .card > p:last-child { + margin-bottom: 0; +} + +.cards-container .card.square { + width: 185px; + height: 185px; +} + +.cards-container a.card:hover { + background: var(--md-default-fg-color--lightest); + color: var(--md-default-fg-color); +} + +.cards-container .card > img { + width: 100px; + max-height: 100px; +} + +.cards-container .card > p > a { + margin: 10px; + color: var(--md-default-fg-color); +} + +.cards-container .card > p > a:hover { + color: var(--md-primary-fg-color); +} + +.image-text-wrapped-container { + display: flex; + align-items: center; + margin: 0 auto; + max-width: 1000px; +} + +.image-text-wrapped-container > h2 { + margin-top: 1em; +} + +.image-text-wrapped-container .wrapping-text { + flex: 1; + padding: 20px; + margin-bottom: 1em; +} + +.image-text-wrapped-container .wrapped-image { + flex-shrink: 0; + padding: 20px; + max-width: 100%; +} + +.image-text-wrapped-container .wrapped-image > img { + max-width: 100%; + height: auto; + display: block; +} + +[data-md-color-scheme=default] .md-icon svg { + fill: var(--md-typeset-color); +} + +[data-md-color-scheme=default] .md-icon.md-top:hover svg { + fill: var(--md-accent-bg-color); +} + +[data-md-color-scheme=default] .md-search__input::placeholder { + color: var(--md-default-fg-color); +} + +[data-md-color-scheme=default] [data-md-component=logo][data-md-color=slate] { + display: none !important; +} + +[data-md-color-scheme=slate] img[data-md-component=logo][data-md-color=slate] { + display: inline-block !important; +} + +[data-md-color-scheme=slate] img[data-md-component=logo][data-md-color=default] { + display: none !important; +} + +[data-md-color-scheme=slate] .asgardeo-community-icon path.black { + fill: #fff; +} + +.md-sidebar { + padding: 0px !important; + height: 93vh; +} + +.md-main__inner { + margin-top: 0px; + letter-spacing: var(--md-default-letter-spacing); +} + +.md-nav__item { + margin-top: .8em; + font-size: 16px; +} + +.md-nav { + font-size: .6rem; + line-height: 1.3; +} + +.md-sidebar--secondary .md-nav--secondary > ul ul > li { + padding-left: 30px; + font-size: 0.6rem; +} + +.md-main.hide-toc .md-sidebar.md-sidebar--secondary { + display: none; +} + +/* Overriding the global class to allow the new layout of sidebars */ +.md-grid { + margin-right: 0; + margin-left: 0; + max-width: unset; +} + +.md-nav__title { + display: none; +} + +.md-nav__link-read_time { + font-size: 10px; + color: var(--md-default-fg-color--light);; + white-space: nowrap; + word-break: keep-all; + font-style: italic; +} + +.md-nav__link-read_time > .md-nav__link-read_check:after { + background-color: #00c853; + -webkit-mask-image: var(--md-admonition-icon--success); + mask-image: var(--md-admonition-icon--success); + content: ""; + height: .6rem; + -webkit-mask-position: center; + mask-position: center; + -webkit-mask-repeat: no-repeat; + mask-repeat: no-repeat; + -webkit-mask-size: contain; + mask-size: contain; + position: absolute; + width: .6rem; + display: none; + padding-left: 25px; + top: .82rem; +} + +.md-nav__link-read_time.visited > .md-nav__link-read_check:after { + display: inline-block; +} + +.md-typeset h1 > span { + font-size: 14px; + font-style: italic; + color: var(--md-default-fg-color--light); +} + +.tabbed-content.tab_with_no_code { + background: var(--md-default-fg-color--lightest); + padding: 0 20px 10px; + border-radius: 0 0 var(--md-code-block-radius) var(--md-code-block-radius); +} + +.md-nav__list hr { + border: 1px solid var(--md-divider-color); + opacity: 0.3; + height: 0; + margin: 8px 16px 18px 16px; +} + +.md-nav__link .icon { + width: 17px; + margin-right: 8px; + display: inline-block; + vertical-align: middle; + text-align: center; +} + +.md-nav__link .icon svg { + max-height: 16px; +} + +.md-nav__link .icon svg path { + fill: #848484; +} + +.md-nav__item.md-nav__item--nested.md-nav--has-icon nav.md-nav > ul.md-nav__list > li.md-nav__item { + padding-left: 20px; +} + +.md-nav__item.md-nav__item--nested.md-nav--has-icon > nav.md-nav > ul.md-nav__list > li.md-nav__item { + padding-left: 29px; +} + +.md-nav__item.md-nav--expanded-section.md-nav__item--active > label, +.md-nav__item.md-nav--expanded-section.md-nav__item--active > .md-nav__link--index > a > span { + font-weight: 500; +} + +.md-nav__item--active > .md-nav__link > span { + font-weight: 500; +} + +.md-nav__item.md-nav--expanded-section > .md-nav__toggle:checked ~ label, +.md-nav__item.md-nav--expanded-section > .md-nav__toggle:checked ~ .md-nav__link--index > a > span { + font-weight: 500; +} + +.md-nav__item.md-nav--expanded-section-verticle-line > .md-nav__toggle:checked ~ nav.md-nav > ul.md-nav__list { + border-left: 1px solid var(--md-default-fg-color--light); + margin: 15px 0; + padding-left: 15px; +} + +/* Keep vertical line visible when section is active (clicked) */ +.md-nav__item.md-nav--expanded-section-verticle-line.md-nav__item--active > nav.md-nav > ul.md-nav__list { + border-left: 1px solid var(--md-default-fg-color--light); + margin: 15px 0; + padding-left: 15px; +} + +/* Always show vertical line for no-collapsible sections */ +.md-nav__item.md-nav--expanded-section-verticle-line.md-nav--no-collapsible > nav.md-nav > ul.md-nav__list { + border-left: 1px solid var(--md-default-fg-color--light); + margin: 15px 0; + padding-left: 15px; +} + +.md-nav__item.md-nav--expanded-section.md-nav--expanded-section-no-indent > nav.md-nav > ul.md-nav__list > .md-nav__item { + padding-left: 0; +} + +.md-nav__item.md-nav--expanded-section > nav.md-nav { + margin: 15px 0; +} + +/* Allow expanded sections to be collapsible - only show content when checkbox is checked */ +.md-nav__item.md-nav--expanded-section > .md-nav__toggle:not(:checked) ~ nav.md-nav { + display: none; +} + +/* Always show content for non-collapsible expanded sections */ +.md-nav__item.md-nav--expanded-section.md-nav--no-collapsible > nav.md-nav { + display: block !important; +} + +.md-nav:not(.md-nav--lifted) .md-nav__item.md-nav--hide, +.md-nav:not(.md-nav--lifted) .md-nav__item--nested.md-nav--hide, +.md-nav:not(.md-nav--lifted) .md-nav__link.md-nav--hide-sub-nav { + display: none !important; +} + +.md-nav:not(.md-nav--lifted) .md-nav__link.md-nav__item.md-nav--override-sub-nav { + padding-left: 0; +} + +.md-nav--lifted > .md-nav__list > .md-nav__item--active > .md-nav__link { + display: none; +} + +.md-nav.md-nav--lifted hr.md-nav--expanded-section-divider { + display: none !important; +} + +.md-nav--lifted > .md-nav > .md-nav__list > .md-nav__item { + display: none !important; +} + +.md-nav__item .md-chip { + margin-left: 5px; + height: 18px; +} + +.md-nav__item .md-chip > .md-chip__label { + padding: 0 6px; + font-size: 0.5rem; +} + +/* TODO: Unify with md-chip */ +.md-nav__item .chip { + height: 18px; + line-height: 18px; + font-size: 10px; + display: inline-block; + padding: 0 10px 0 8px; + margin-left: 8px; + background: var(--md-primary-fg-color); + color: var(--md-default-fg-color); + white-space: nowrap; + border-radius: var(--md-border-radius); +} + +.md-nav__item .chip.chip-ai { + position: relative; + background: transparent; +} + +.md-nav__item .chip.chip-ai::before { + content: ""; + position: absolute; + inset: 0; + border-radius: 12px; + padding: 1px; + background:linear-gradient(45deg, #97389d, #426dd7); + mask: + linear-gradient(#000 0 0) content-box, + linear-gradient(#000 0 0); + mask-composite: exclude; +} + +.md-nav__item .chip > .icon { + height: 10px; + width: 10px; + margin-right: 1px !important; + vertical-align: top; + margin-top: 1.5px; +} + +.md-nav__item .chip > .icon path { + fill: var(--md-default-fg-color); +} + +.md-nav--lifted .md-nav > .md-nav__list > .md-nav__item.md-nav__item--active > .md-nav__toggle~.md-nav { + display: block !important; +} + +.md-nav--lifted .md-nav > .md-nav__list > .md-nav__item.md-nav__item--active > .md-nav__toggle~.md-nav.md-nav.md-nav--secondary { + display: none !important; +} + +.md-nav--lifted .md-nav__item.md-nav__item--nested.md-nav__item--active.md-nav--has-icon nav.md-nav > ul.md-nav__list > li.md-nav__item { + padding-left: 13px; +} + +.md-nav--lifted .md-nav > .md-nav__list > .md-nav__item.md-nav__item--active { + display: flex; +} + +.md-nav.md-nav--lifted .md-nav__link.md-nav__link--active > .md-nav__icon.md-icon { + display: none; +} + +.md-nav__list { + margin-bottom: 15px; +} + +.md-chip { + max-width: 100%; + font-family: Gilmer, sans-serif; + display: inline-flex; + align-items: center; + justify-content: center; + color: var(--md-default-fg-color); + background: var(--md-chip-bg-color); + cursor: default; + vertical-align: middle; + box-sizing: border-box; + font-size: 0.6125rem; + height: 24px; + border-radius: 6px; + white-space: nowrap; + transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1); + outline: 0px; + text-decoration: none; + border-width: var(--md-chip-border-width); + border-style: solid; + border-color: initial; + border-image: initial; + padding: 0px; +} + +.md-chip__label { + overflow: hidden; + text-overflow: ellipsis; + padding-left: 12px; + padding-right: 12px; + white-space: nowrap; + font-weight: 600; +} + +.md-chip--beta { + background: var(--md-chip-beta-bg-color); + border-color: var(--md-chip-beta-border-color); + color: var(--md-chip-beta-text-color); +} + +.md-chip--beta .md-chip__label { + background-image: var(--md-chip-beta-text-color); + background-clip: text; + -webkit-background-clip: text; + color: transparent; +} + +.md-chip--preview { + background: var(--md-chip-preview-bg-color); + border-color: var(--md-chip-preview-border-color); + color: var(--md-chip-preview-text-color); +} + +.md-chip--preview .md-chip__label { + background-image: var(--md-chip-preview-text-color); + background-clip: text; + -webkit-background-clip: text; + color: transparent; +} + +.md-chip--new { + background: var(--md-chip-new-bg-color); + border-color: var(--md-chip-new-border-color); + color: var(--md-chip-new-text-color); +} + +.md-chip--new .md-chip__label { + background-image: var(--md-chip-new-text-color); + background-clip: text; + -webkit-background-clip: text; + color: transparent; +} + +.md-chip--premium { + background: var(--md-chip-premium-bg-color); + border-color: var(--md-chip-premium-border-color); + color: var(--md-chip-premium-text-color); +} + +.md-chip--premium .md-chip__label { + background-image: var(--md-chip-premium-text-color); + background-clip: text; + -webkit-background-clip: text; + color: transparent; +} + +.md-footer__content, +.md-copyright__content { + max-width: none !important; + padding: .5rem 1.7rem; + display: grid !important; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: var(--md-footer-section-horizontal-spacing); +} + +.md-copyright { + margin: 0; +} + +/* Media query breakpoints + + $base_px: 16px; + + $break-devices: + mobile: + portrait: 220px - 479px + landscape: 480px - 719px + tablet: + portrait: 720px - 959px + landscape: 960px - 1219px + screen: + small: 1220px - 1599px + medium: 1600px - 1999px + large: 2000px + + https://github.com/squidfunk/mkdocs-material/blob/master/src/templates/assets/stylesheets/_config.scss + + https://www.w3schools.com/tags/ref_pxtoemconversion.asp + +*/ + +@media screen and (max-width: 76.1875em) { + html, + body { + overflow-x: hidden; + } + + .md-nav--primary .md-nav__title[for=__drawer] { + background-color: var(--md-default-bg-color); + height: 3.9rem; + } + + .md-sidebar { + height: 100vh; + } + + .md-nav__item.md-nav__item--active.md-nav--hide.md-nav__item--nested { + height: 100%; + } + + .md-nav__item.md-nav--expanded-section > label, + .md-nav__item.md-nav--expanded-section > .md-nav__link--index > a > span { + font-weight: normal; + } + + .md-nav__title, + .md-nav:not(.md-nav--lifted).md-nav--hide-sub-nav { + display: block !important; + } + + .md-nav__list hr, + .md-nav__link-read_time { + display: none; + } + + .md-nav__item.md-nav--expanded-section > .md-nav__toggle:checked ~ nav.md-nav, + .md-nav__item.md-nav--expanded-section.md-nav--expanded-section-verticle-line > .md-nav__toggle:checked ~ nav.md-nav > ul.md-nav__list { + margin: 0; + } + + /* Hide content when collapsed in mobile view */ + .md-nav__item.md-nav--expanded-section > .md-nav__toggle:not(:checked) ~ nav.md-nav { + display: none; + } + + /* Always show content for non-collapsible expanded sections in mobile view */ + .md-nav__item.md-nav--expanded-section.md-nav--no-collapsible > nav.md-nav { + display: block !important; + } + + .md-nav__item.md-nav__item--nested.md-nav--has-icon nav.md-nav > ul.md-nav__list > li.md-nav__item, + .md-nav__item.md-nav--expanded-section.md-nav--expanded-section-verticle-line > nav.md-nav > ul.md-nav__list { + padding-left: 0; + } + + .md-nav--lifted > .md-nav__list > .md-nav__item--active, + .md-nav--lifted > .md-nav__list > .md-nav__item--active > .md-nav__link { + display: flex !important; + } + + .md-nav:not(.md-nav--lifted) .md-nav__link.md-nav__item.md-nav--override-sub-nav { + padding-left: .6rem; + } + + .md-nav__item .chip { + height: 24px; + width: 24px; + border-radius: 12px; + padding: 4px 6px; + margin-left: 8px; + } + + .md-nav__item .chip > .icon { + height: 13px; + width: 13px; + } + + .md-nav__item .chip > .text { + display: none; + } + + .md-nav--primary .md-nav__link { + padding: .7rem .8rem .8rem; + } + + .md-nav__list { + margin-bottom: 0; + } + + .md-nav__item { + margin-top: 0; + } +} + +@media screen and (min-width: 76.25em) { + [dir=ltr] .md-sidebar--secondary:not([hidden])~.md-content > .md-content__inner, + [dir=rtl] .md-sidebar--primary:not([hidden])~.md-content > .md-content__inner { + margin: 0 auto 3rem; + padding: .5rem 2rem; + max-width: 900px; + } + + [data-md-toggle=search]:checked~.md-header .md-tabs, + [data-md-toggle=search]:checked~.md-header .md-header__version-select-dropdown { + transition: opacity .25s; + opacity: 0; + } + + .md-nav__item.md-nav--expanded-section > .md-nav__toggle:checked ~ nav.md-nav { + display: block; + } + + /* Removed the rule that hides navigation icons for expanded sections */ + /* .md-nav__item.md-nav--expanded-section > .md-nav__link .md-nav__icon.md-icon { + display: none; + } */ + + .md-nav__item.md-nav__item--nested.md-nav--has-icon.md-nav--expanded-section-verticle-line > nav.md-nav > ul.md-nav__list > li.md-nav__item { + padding-left: 22px; + } + + .md-nav__item.md-nav__item--nested.md-nav--has-icon.md-nav--expanded-section-verticle-line > nav.md-nav > ul.md-nav__list { + padding-left: 0; + margin-left: 8px; + } +} + +@media screen and (min-width: 76.25em) and (max-width: 99.9375em) { + .md-tabs { + margin-left: 0; + } + + .md-sidebar--secondary [data-md-component='toc'] .md-nav__link::before { + top: 1.1rem; + } + + .md-nav__link .icon { + height: 16px; + width: 16px; + } +} diff --git a/en/mkdocs.yml b/en/mkdocs.yml index bd7cc4eae..b62d72ef7 100644 --- a/en/mkdocs.yml +++ b/en/mkdocs.yml @@ -1210,6 +1210,7 @@ plugins: extra_css: - assets/lib/highlightjs/styles/custom-highlight-styles.css - assets/css/theme.css + - assets/css/custom.css - assets/css/copy-page.css - assets/lib/json-formatter/json-formatter.css - assets/css/config-catalog.css