diff --git a/material-overrides/.icons/docs.svg b/material-overrides/.icons/docs.svg index 3b1dc56a6..51fa8c908 100644 --- a/material-overrides/.icons/docs.svg +++ b/material-overrides/.icons/docs.svg @@ -1,51 +1,23 @@ - + id="g184" + style="fill:#ffffff;fill-opacity:1" + transform="translate(1.0116736e-4,-3.0753712)"> + d="M 9.901,16.289 A 0.644,0.644 0 1 1 9.9,17.576 0.644,0.644 0 0 1 9.901,16.289 Z m 10.106,-3.985 a 0.64450019,0.64450019 0 1 1 10e-4,-1.289 0.64450019,0.64450019 0 0 1 -10e-4,1.289 z m 0,-2.636 a 1.994,1.994 0 0 0 -1.888,2.626 l -6.582,3.504 A 1.984,1.984 0 0 0 9.9,14.94 c -0.76,0 -1.452,0.436 -1.787,1.115 L 2.2,12.937 C 1.574,12.608 1.107,11.58 1.156,10.643 1.182,10.154 1.351,9.775 1.608,9.628 1.771,9.537 1.968,9.544 2.177,9.653 l 0.038,0.021 c 1.568,0.825 6.695,3.527 6.912,3.627 0.333,0.154 0.518,0.217 1.086,-0.053 l 10.6,-5.513 C 20.969,7.677 21.151,7.527 21.151,7.301 21.151,6.987 20.826,6.864 20.825,6.864 20.222,6.574 19.295,6.141 18.392,5.718 16.459,4.813 14.269,3.788 13.308,3.284 12.478,2.85 11.809,3.216 11.69,3.29 L 11.459,3.404 C 7.13,5.543 1.338,8.413 1.008,8.613 c -0.59,0.36 -0.955,1.076 -1.003,1.964 -0.073,1.409 0.645,2.878 1.672,3.416 l 6.254,3.225 a 1.994,1.994 0 0 0 1.97,1.707 1.996,1.996 0 0 0 1.992,-1.962 L 18.781,13.23 A 1.99,1.99 0 0 0 22,11.66 1.995,1.995 0 0 0 20.007,9.667" + id="path182" + style="fill:#ffffff;fill-opacity:1" /> - - - - + id="defs189" /> diff --git a/material-overrides/.icons/telegram.svg b/material-overrides/.icons/telegram.svg index cf199548f..7c7a55c40 100644 --- a/material-overrides/.icons/telegram.svg +++ b/material-overrides/.icons/telegram.svg @@ -1,39 +1,17 @@ - + d="m 17.609233,0.1413996 c 0,0 1.78,-0.694 1.632,0.993 -0.05,0.694 -0.494,3.124 -0.84,5.753 l -1.188,7.7870004 c 0,0 -0.099,1.14 -0.99,1.34 -0.89,0.198 -2.225,-0.695 -2.472,-0.894 -0.198,-0.149 -3.71,-2.38 -4.9470005,-3.472 -0.3459997,-0.297 -0.7419997,-0.892 0.05,-1.587 L 14.047233,5.1013996 c 0.594,-0.595 1.188,-1.983 -1.286,-0.297 l -6.9250002,4.712 c 0,0 -0.791,0.4960004 -2.275,0.05 l -3.21599998,-0.993 c 0,0 -1.18700001,-0.744 0.84099998,-1.488 4.947,-2.33 11.0310002,-4.711 16.4230002,-6.943 z" + id="path497" + style="fill:#ffffff;fill-opacity:1" /> diff --git a/material-overrides/api-reference.html b/material-overrides/api-reference.html deleted file mode 100644 index f30e45e11..000000000 --- a/material-overrides/api-reference.html +++ /dev/null @@ -1,7 +0,0 @@ -{% extends "main.html" %} - -{% block container %} -
- {{ super() }} -
-{% endblock %} diff --git a/material-overrides/assets/images/card-bg-1.svg b/material-overrides/assets/images/card-bg-1.svg deleted file mode 100644 index 59451a5a7..000000000 --- a/material-overrides/assets/images/card-bg-1.svg +++ /dev/null @@ -1,1511 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/material-overrides/assets/images/card-bg-2.svg b/material-overrides/assets/images/card-bg-2.svg deleted file mode 100644 index 614707f3f..000000000 --- a/material-overrides/assets/images/card-bg-2.svg +++ /dev/null @@ -1,990 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/material-overrides/assets/images/card-bg.svg b/material-overrides/assets/images/card-bg.svg deleted file mode 100644 index 77ba5bb6f..000000000 --- a/material-overrides/assets/images/card-bg.svg +++ /dev/null @@ -1,69 +0,0 @@ - - - - - - - - - - - - - - diff --git a/material-overrides/assets/images/dropdown-icons/ai-resources.svg b/material-overrides/assets/images/dropdown-icons/ai-resources.svg deleted file mode 100644 index 96758c5e1..000000000 --- a/material-overrides/assets/images/dropdown-icons/ai-resources.svg +++ /dev/null @@ -1,43 +0,0 @@ - - - - - - diff --git a/material-overrides/assets/images/dropdown-icons/core-messaging.svg b/material-overrides/assets/images/dropdown-icons/core-messaging.svg deleted file mode 100644 index 2dc34b950..000000000 --- a/material-overrides/assets/images/dropdown-icons/core-messaging.svg +++ /dev/null @@ -1,10 +0,0 @@ - - - - - - - - - - diff --git a/material-overrides/assets/images/dropdown-icons/glossary.svg b/material-overrides/assets/images/dropdown-icons/glossary.svg deleted file mode 100644 index e0d0326b8..000000000 --- a/material-overrides/assets/images/dropdown-icons/glossary.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - - diff --git a/material-overrides/assets/images/dropdown-icons/governance.svg b/material-overrides/assets/images/dropdown-icons/governance.svg deleted file mode 100644 index d26b4ccb5..000000000 --- a/material-overrides/assets/images/dropdown-icons/governance.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/material-overrides/assets/images/dropdown-icons/infrastructure.svg b/material-overrides/assets/images/dropdown-icons/infrastructure.svg deleted file mode 100644 index 3d1c764bc..000000000 --- a/material-overrides/assets/images/dropdown-icons/infrastructure.svg +++ /dev/null @@ -1,11 +0,0 @@ - - - - - - - - - - - diff --git a/material-overrides/assets/images/dropdown-icons/introduction.svg b/material-overrides/assets/images/dropdown-icons/introduction.svg deleted file mode 100644 index ae8e3d9d0..000000000 --- a/material-overrides/assets/images/dropdown-icons/introduction.svg +++ /dev/null @@ -1,16 +0,0 @@ - - - - - - - - - - - - - - - - diff --git a/material-overrides/assets/images/dropdown-icons/reference.svg b/material-overrides/assets/images/dropdown-icons/reference.svg deleted file mode 100644 index c21d6e0a5..000000000 --- a/material-overrides/assets/images/dropdown-icons/reference.svg +++ /dev/null @@ -1,10 +0,0 @@ - - - - - - - - - - diff --git a/material-overrides/assets/images/dropdown-icons/relayers.svg b/material-overrides/assets/images/dropdown-icons/relayers.svg deleted file mode 100644 index 22cc55614..000000000 --- a/material-overrides/assets/images/dropdown-icons/relayers.svg +++ /dev/null @@ -1,15 +0,0 @@ - - - - - - - - - - - - - - - diff --git a/material-overrides/assets/images/dropdown-icons/security.svg b/material-overrides/assets/images/dropdown-icons/security.svg deleted file mode 100644 index a796aff4f..000000000 --- a/material-overrides/assets/images/dropdown-icons/security.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/material-overrides/assets/images/dropdown-icons/solidity-sdk.svg b/material-overrides/assets/images/dropdown-icons/solidity-sdk.svg deleted file mode 100644 index a33c8bad5..000000000 --- a/material-overrides/assets/images/dropdown-icons/solidity-sdk.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/material-overrides/assets/images/dropdown-icons/spy.svg b/material-overrides/assets/images/dropdown-icons/spy.svg deleted file mode 100644 index 3fafcb229..000000000 --- a/material-overrides/assets/images/dropdown-icons/spy.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/material-overrides/assets/images/dropdown-icons/start-building.svg b/material-overrides/assets/images/dropdown-icons/start-building.svg deleted file mode 100644 index 43b7f82d5..000000000 --- a/material-overrides/assets/images/dropdown-icons/start-building.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/material-overrides/assets/images/dropdown-icons/toolkit.svg b/material-overrides/assets/images/dropdown-icons/toolkit.svg deleted file mode 100644 index 462f5d6c0..000000000 --- a/material-overrides/assets/images/dropdown-icons/toolkit.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/material-overrides/assets/images/dropdown-icons/typescript-sdk.svg b/material-overrides/assets/images/dropdown-icons/typescript-sdk.svg deleted file mode 100644 index f8248b94b..000000000 --- a/material-overrides/assets/images/dropdown-icons/typescript-sdk.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/material-overrides/assets/images/dropdown-icons/wormholescan.svg b/material-overrides/assets/images/dropdown-icons/wormholescan.svg deleted file mode 100644 index 2f17e3940..000000000 --- a/material-overrides/assets/images/dropdown-icons/wormholescan.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/material-overrides/assets/images/explore-products-bg.svg b/material-overrides/assets/images/explore-products-bg.svg deleted file mode 100644 index b1e3eec65..000000000 --- a/material-overrides/assets/images/explore-products-bg.svg +++ /dev/null @@ -1,112 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/material-overrides/assets/images/hero-animation.mp4 b/material-overrides/assets/images/hero-animation.mp4 deleted file mode 100644 index 994fd7b91..000000000 Binary files a/material-overrides/assets/images/hero-animation.mp4 and /dev/null differ diff --git a/material-overrides/assets/images/dropdown-icons/connect.svg b/material-overrides/assets/images/home-icons/connect.svg similarity index 100% rename from material-overrides/assets/images/dropdown-icons/connect.svg rename to material-overrides/assets/images/home-icons/connect.svg diff --git a/material-overrides/assets/images/dropdown-icons/multichain-assets.svg b/material-overrides/assets/images/home-icons/multichain-assets.svg similarity index 100% rename from material-overrides/assets/images/dropdown-icons/multichain-assets.svg rename to material-overrides/assets/images/home-icons/multichain-assets.svg diff --git a/material-overrides/assets/images/dropdown-icons/multigov.svg b/material-overrides/assets/images/home-icons/multigov.svg similarity index 100% rename from material-overrides/assets/images/dropdown-icons/multigov.svg rename to material-overrides/assets/images/home-icons/multigov.svg diff --git a/material-overrides/assets/images/dropdown-icons/queries.svg b/material-overrides/assets/images/home-icons/queries.svg similarity index 100% rename from material-overrides/assets/images/dropdown-icons/queries.svg rename to material-overrides/assets/images/home-icons/queries.svg diff --git a/material-overrides/assets/images/dropdown-icons/settlement.svg b/material-overrides/assets/images/home-icons/settlement.svg similarity index 100% rename from material-overrides/assets/images/dropdown-icons/settlement.svg rename to material-overrides/assets/images/home-icons/settlement.svg diff --git a/material-overrides/assets/images/dropdown-icons/transfers.svg b/material-overrides/assets/images/home-icons/transfers.svg similarity index 100% rename from material-overrides/assets/images/dropdown-icons/transfers.svg rename to material-overrides/assets/images/home-icons/transfers.svg diff --git a/material-overrides/assets/images/logo-for-kapa.webp b/material-overrides/assets/images/logo-for-kapa.webp deleted file mode 100644 index bb0b6c506..000000000 Binary files a/material-overrides/assets/images/logo-for-kapa.webp and /dev/null differ diff --git a/material-overrides/assets/images/wormhole-ai-logo.webp b/material-overrides/assets/images/wormhole-ai-logo.webp deleted file mode 100644 index 96e9f7530..000000000 Binary files a/material-overrides/assets/images/wormhole-ai-logo.webp and /dev/null differ diff --git a/material-overrides/assets/images/wormhole.webp b/material-overrides/assets/images/wormhole-dark.webp similarity index 100% rename from material-overrides/assets/images/wormhole.webp rename to material-overrides/assets/images/wormhole-dark.webp diff --git a/material-overrides/assets/images/wormhole-home-logo.webp b/material-overrides/assets/images/wormhole-home-logo.webp deleted file mode 100644 index 26e163dfb..000000000 Binary files a/material-overrides/assets/images/wormhole-home-logo.webp and /dev/null differ diff --git a/material-overrides/assets/images/wormhole-light.webp b/material-overrides/assets/images/wormhole-light.webp new file mode 100644 index 000000000..d85a75909 Binary files /dev/null and b/material-overrides/assets/images/wormhole-light.webp differ diff --git a/material-overrides/assets/stylesheets/extra.css b/material-overrides/assets/stylesheets/extra.css index cdd6e7435..01c45849f 100644 --- a/material-overrides/assets/stylesheets/extra.css +++ b/material-overrides/assets/stylesheets/extra.css @@ -1,4 +1,8 @@ -@font-face { +/** +These styles are not currently being used. Keeping here for future reference. +**/ + +/* @font-face { font-family: 'Druk'; src: url('fonts/DrukText-Medium.otf') format('opentype'); } @@ -6,4 +10,4 @@ @font-face { font-family: 'Druk Wide'; src: url('fonts/DrukWide-Medium.otf') format('opentype'); -} +} */ diff --git a/material-overrides/assets/stylesheets/home.css b/material-overrides/assets/stylesheets/home.css index 05b5221a1..aa7e58086 100644 --- a/material-overrides/assets/stylesheets/home.css +++ b/material-overrides/assets/stylesheets/home.css @@ -1,522 +1,114 @@ -:root .md-content__inner { - --md-header-font: 'Druk', sans-serif; - --line-height-90: 90%; - --line-height-100: 100%; - --header-font-weight: 800; - --header-text-style: uppercase; +.md-typeset h3, +.md-typeset h4 { + font-weight: 400; } -.md-content__inner .md-typeset h1 { - font-size: 120px; - font-family: var(--md-header-font); - line-height: var(--line-height-90); - text-transform: var(--header-text-style); - font-weight: var(--header-font-weight); -} - -.md-content__inner .md-typeset h2 { - font-size: 72px; - font-family: var(--md-header-font); - line-height: var(--line-height-100); - text-transform: var(--header-text-style); - font-weight: var(--header-font-weight); -} - -.md-content__inner .md-typeset h3 { - font-family: var(--md-header-font); - line-height: var(--line-height-100); - text-transform: var(--header-text-style); - font-weight: var(--header-font-weight); -} - -.md-typeset.md-content__inner a { - text-decoration: none; -} - -.md-main__inner { - max-width: unset; +.md-typeset h3 { + font-size: 1.25em; } .md-content__inner { - padding: 1em; + margin-top: 1.6em; + margin-bottom: 1.6em; } -/** ------------------------ - Styles for the hero section ------------------------- **/ .hero { - display: flex; - text-align: left; - padding: 0; - align-items: center; - min-height: 50em; - max-width: 61rem; - margin: auto; - margin-top: -8em; -} - -.hero-content { - position: relative; - width: 40%; - z-index: 1; - padding: 2em 0; -} - -.md-typeset .hero video { - position: absolute; - z-index: -1; - max-width: 61rem; - margin-right: auto; - object-fit: fill; - object-position: center; -} - -.hero p { - margin: 1em 0 3em; -} - -.button-wrapper { - display: flex; - flex-wrap: wrap; - gap: 1em; -} - -/** --------------------------- - Styles for the product section ---------------------------- **/ -.integrate-products { display: flex; flex-direction: column; align-items: center; - gap: 2em; - max-width: 61rem; - margin: auto; -} - -.integrate-products h2 { - max-width: 72%; - margin: 0; + margin: 0 auto; text-align: center; + border: var(--border-width) solid var(--md-accent-fg-color--active); + border-radius: var(--border-radius); + padding: 1em; + background-image: linear-gradient( + to right, + var(--md-accent-fg-color--active) 1px, + transparent 1px + ), + linear-gradient( + to bottom, + var(--md-accent-fg-color--active) 1px, + transparent 1px + ); + background-size: 60px 60px; + background-position: center; +} + +.md-typeset .hero h1 { + margin-bottom: 0; } -.product-cards { - display: flex; - flex-direction: column; - justify-self: center; - max-width: 90%; - gap: .75em; -} - -.product-card { - display: flex; - justify-content: space-between; - align-items: center; - background: url(../images/card-bg.svg), var(--grey); - background-size: cover; - border-radius: 16px; - padding: 32px 0; - border: 1px solid hsl(270 1.1% 62.7%/.15); -} - -.product-card:hover { - background-color: rgb(55 55 55/1); -} - -.md-typeset a.product-card:focus, -.md-typeset a.product-card:hover { - opacity: 1; -} - -.product-card > * { - padding: 0 32px; - min-height: 44px; - height: 100%; -} - -.product-card > *:nth-child(2) { - border-left: 1px solid var(--light-transparent-26); -} - -.product-card h3 { - font-size: 36px; - font-weight: 700; - margin: 0; - align-content: center; - flex: 18%; - color: var(--md-default-fg-color); -} - -.product-card p { - color: #A09FA1; - font-size: 14px; - line-height: 22.4px; - margin: 0; - flex: 25%; - display: flex; - align-items: center; +.hero a { + margin-top: 2em; + margin-bottom: .3em; } -.product-card a { - font-family: var(--md-cta-font); - text-transform: var(--md-cta-text-style); - font-weight: 500; - font-size: 11px; - line-height: 13.2px; +.row { display: flex; - justify-content: end; - align-items: center; - gap: 8px; - flex: 10%; -} - -.md-typeset .twemoji svg { - width: 20px; - height: 20px; -} - -/** -------------------------------- - Styles for explore products section --------------------------------- **/ -.explore-products { - max-width: 61rem; - margin: auto; - position: relative; + flex-direction: row; } -.explore-products img { - position: absolute; - z-index: -1; -} - -.explore-products-content { +.column { display: flex; flex-direction: column; - align-items: center; - padding-top: 8em; - padding-bottom: 8em; -} - -.explore-products h2 { - margin-top: .5em; - text-align: center; } -.explore-products-content .button-wrapper { - display: grid; - grid-template-columns: repeat(2, 1fr); +.features .row { gap: 1em; + margin-bottom: 1em; + flex-wrap: wrap; } -.explore-products-content button.md-button { - width: 100%; - padding: 1.6em 2.35em; +.md-typeset .hero p { + margin-bottom: 0; + max-width: 60%; } -/** ----------------------- - Styles for feature section ------------------------ **/ -.feature { - max-width: 61rem; - margin: auto; +.md-typeset a.card { + color: var(--md-default-fg-color); + border: var(--border); + border-radius: var(--border-radius); + padding: 1em; + flex: 1 1 0; display: flex; - justify-content: space-between; + align-items: normal; gap: 2em; + min-width: 30%; + max-width: 32.5% } -.feature-card { - display: flex; - flex-direction: column; - flex: 1 1 0%; - border-radius: 16px; - min-width: 0; - padding: 4em; - position: relative; - border: 1px solid hsl(270 1.1% 62.7%/.15); -} - -.feature-card p { - width: 75%; -} - -.feature-card:nth-child(1){ - background: url(../images/card-bg-1.svg); - background-size: cover; - background-repeat: no-repeat; - background-position: top; - border: 1px solid hsl(270 1.1% 62.7%/.15); -} - -.feature-card:nth-child(2){ - background: url(../images/card-bg-2.svg); - background-size: cover; - background-repeat: no-repeat; - background-position: top; - border: 1px solid hsl(270 1.1% 62.7%/.15); -} - -.feature-card .start-building.md-button { - padding: 1.6em 2.35em; - margin-top: 5em; -} - -.md-content__inner .md-typeset .feature-card h2 { - font-size: 60px; - margin: 0; - overflow-wrap: break-word; +.md-typeset a.card:hover { + cursor: pointer; } -.feature-card a { - margin-top: auto; +.md-typeset .card h3 { + margin: 0 0 0.5em; } -/** ----------------------------- - Styles for start building footer ------------------------------ **/ -.start-building-footer { - padding: 5em 0 3em; - max-width: 61rem; - margin: auto; - margin-top: 1em; - display: flex; - justify-content: space-between; - gap: 2em; +.card img { + width: 2rem; + height: 2rem; } -.md-content__inner .md-typeset .start-building-footer h3 { - font-size: 60px; +.card p { margin-top: 0; margin-bottom: 0; - width: 66%; -} - -.start-building.md-button { - display: flex; - align-items: center; - height: fit-content; - gap: 1em; - padding: 0.9em 2.35em; -} - -.start-building img { - height: 30px; - width: 30px; -} - -/** ----------- - Mobile styling ------------ **/ -@media screen and (max-width: 80em) { - .md-typeset .hero video { - object-fit: cover; - /* These width values come from .md-content__inner padding (1em) and margin (.8rem) */ - max-width: calc(100vw - 1em - .8rem); - } - - .product-card a { - flex: 15%; - } - - .explore-products { - width: 100vw; - margin-left: -2em; - } - - .md-content__inner .md-typeset .integrate-products h2 { - max-width: 80%; - } -} - -@media screen and (max-width: 76.234375em) { - .hero { - margin-top: -10em; - } - - .md-content__inner .md-typeset .integrate-products h2 { - max-width: 90%; - } - - .feature-card { - padding: 3em; - } - - .md-content__inner .md-typeset .feature-card h2 { - font-size: 64px; - } -} - -@media screen and (max-width: 70em) { - .product-cards { - max-width: unset; - } -} - -@media screen and (max-width: 66em) { - .hero { - min-height: unset; - padding-bottom: 3em; - margin-top: 0; - } - - .md-content__inner .md-typeset h1 { - font-size: 90px; - } - - .hero-content { - width: 100%; - padding-top: 0; - } - - .hero p { - margin: 0 0 3em; - } - - .md-typeset .hero video { - display: none; - } - - .md-content__inner .md-typeset h2 { - font-size: 60px; - } - - .md-content__inner .md-typeset .product-card h3 { - font-size: 28px; - } - - .product-card a { - justify-content: left; - } - - .explore-products-content { - padding: 0 1.2rem; - } - - .md-content__inner .md-typeset .explore-products h2 { - max-width: unset; - } - - .explore-products-content { - padding-top: 6em; - padding-bottom: 6em; - } - - .md-content__inner .md-typeset .feature-card h2, - .md-content__inner .md-typeset .start-building-footer h3 { - font-size: 48px; - overflow-wrap: break-word; - word-break: break-word; - } } -@media screen and (max-width: 60em) { - .feature-card { - padding: 2em; +@media screen and (max-width: 1064px) { + .md-typeset a.card { + min-width: 48.5%; + max-width: 48.5%; } } -@media screen and (max-width: 52em) { - .feature { - flex-direction: column; - } - - .feature-card { - padding: 4em; - } -} - -@media screen and (max-width: 47.5em) { - .md-main__inner { - margin-top: 0; - } - - .hero { - padding-bottom: 5em; - } - - .hero-content { - padding: unset; - } - - .md-content__inner .md-typeset h1 { - font-size: 60px; - } - - .hero p { - margin: 0 0 2em; - } - - .button-wrapper .md-button { - font-size: var(--caption-size); - } - - .product-card { - flex-direction: column; - } - - .product-card > *:nth-child(2) { - border: none; - } - - .md-content__inner .md-typeset .product-card h3 { - text-align: center; - } - - .explore-products-content { - padding-top: 2em; - padding-bottom: 3em; - } - - .explore-products .button-wrapper { - justify-content: left; - flex-direction: column; - max-width: 90%; - display: flex; - } - - .md-content__inner .md-typeset h2 { - font-size: 48px; - } - - .md-content__inner .md-typeset .feature-card h2, - .md-content__inner .md-typeset .start-building-footer h3 { - font-size: 36px; - } - - .start-building-footer { - flex-direction: column; - padding: 3em 0 1em; - } - - .md-content__inner .md-typeset .start-building-footer h3 { - width: 100%; - } - - .start-building.md-button { - width: fit-content; - } -} - -@media screen and (max-width: 35.125em) { - .md-main { - padding: 0; - } - - .md-content__inner { - margin: 0 1.2rem; - padding: 0; - } - - .hero .button-wrapper { - justify-content: left; - flex-direction: column; - max-width: 90%; - } - - .md-typeset .explore-products img { - display: none; +@media screen and (max-width: 642px) { + .md-typeset a.card { + min-width: 100%; } - .feature-card { - max-width: unset; - padding: 2em; + .md-typeset .hero p { + max-width: 100%; } } diff --git a/material-overrides/assets/stylesheets/index-page.css b/material-overrides/assets/stylesheets/index-page.css deleted file mode 100644 index e992ed4c9..000000000 --- a/material-overrides/assets/stylesheets/index-page.css +++ /dev/null @@ -1,27 +0,0 @@ -.md-main { - display: flex; - height: 100%; -} - -.md-main__inner { - height: unset; - width: 100%; -} - -.index-page, -.main-page { - height: 100%; - display: flex; - flex-direction: column; -} - -.md-nav__list .md-nav__item { - display: block; -} - -@media screen and (min-width: 76.25em) { - .main-page-sidebar .md-nav__item .md-nav__link-wrapper.md-nav__link--active a, - .main-page-sidebar .md-nav__item .md-nav__link--active a { - margin-left: 0; - } -} diff --git a/material-overrides/assets/stylesheets/spantable-neoteroi.css b/material-overrides/assets/stylesheets/spantable-neoteroi.css index 740d6a895..8fb326b05 100644 --- a/material-overrides/assets/stylesheets/spantable-neoteroi.css +++ b/material-overrides/assets/stylesheets/spantable-neoteroi.css @@ -7,11 +7,14 @@ **/ /** Span Table CSS **/ +.span-table-wrapper { + overflow-x: scroll; +} .span-table-wrapper table { - border-collapse: collapse; + border-collapse: separate; margin-bottom: 2rem; - border-radius: var(--md-border-radius); + border-radius: var(--border-radius); } .span-table td, @@ -21,17 +24,20 @@ max-width: 100%; overflow: auto; touch-action: auto; - border-bottom: 0.05rem solid var(--md-typeset-table-color); padding: 0.9375em 1.25em; vertical-align: top; } +table.span-table tr > *:first-child { + border-left: none; +} + .span-table tr:first-child { background-color: var(--md-typeset-table-color); } .span-table tr:first-child td:first-child { - border-top-left-radius: var(--md-border-radius); + border-top-left-radius: var(--border-radius); } .span-table tr:first-child td:last-child { @@ -48,7 +54,7 @@ /* This is only applicable to 6 column tables */ /* Might need to make this more dynamic in the future */ -.span-table tr:not(:first-child):has(:nth-child(6)) > td:first-child { +.span-table tr:not(:first-child):has(:nth-child(5)) > td:first-child { border-left: 0.05rem solid var(--md-typeset-table-color); border-right: 0.05rem solid var(--md-typeset-table-color); font-weight: bold; diff --git a/material-overrides/assets/stylesheets/timeline-neoteroi.css b/material-overrides/assets/stylesheets/timeline-neoteroi.css index bd9a802e5..9f0d9ac27 100644 --- a/material-overrides/assets/stylesheets/timeline-neoteroi.css +++ b/material-overrides/assets/stylesheets/timeline-neoteroi.css @@ -5,6 +5,22 @@ Neoteroi Mkdocs timeline extension: https://github.com/Neoteroi/mkdocs-plugins/b /* displays if timeline doesn't render properly (bad file path to JSON, etc)*/ +[data-md-color-scheme="custom-light"] { + --gradient-before-color-1: rgba(193, 187, 246, 1) 0%; + --gradient-before-color-2: rgba(193, 187, 246, 1) 100%; + + --gradient-after-color-1: var(--md-default-bg-color) 0%; + --gradient-after-color-2: var(--md-default-bg-color) 100%; +} + +[data-md-color-scheme="custom-dark"] { + --gradient-before-color-1: rgba(193, 187, 246, 1) 0%; + --gradient-before-color-2: rgba(193, 187, 246, 1) 100%; + + --gradient-after-color-1: var(--md-default-bg-color) 0%; + --gradient-after-color-2: var(--md-default-bg-color) 100%; +} + .nt-error { border: 2px dashed darkred; padding: 0 1rem; @@ -52,8 +68,8 @@ Neoteroi Mkdocs timeline extension: https://github.com/Neoteroi/mkdocs-plugins/b &.center { .nt-timeline-before { background-image: linear-gradient( - rgba(193, 187, 246, 1) 0%, - rgba(193, 187, 246, 1) 100% + var(--gradient-before-color-1), + var(--gradient-before-color-2) ); background-repeat: no-repeat; background-size: 100% 2px; @@ -63,8 +79,8 @@ Neoteroi Mkdocs timeline extension: https://github.com/Neoteroi/mkdocs-plugins/b .nt-timeline-after { background-image: linear-gradient( 180deg, - rgba(0, 0, 0, 0) 0%, - rgba(17, 17, 18, 1) 100% + var(--gradient-after-color-1), + var(--gradient-after-color-2) ); background-repeat: no-repeat; background-size: 100% 2px; @@ -74,8 +90,8 @@ Neoteroi Mkdocs timeline extension: https://github.com/Neoteroi/mkdocs-plugins/b .nt-timeline-items { background-image: radial-gradient( circle, - rgba(193, 187, 246, 1) 0%, - rgba(17, 17, 18, 1) 100% + var(--gradient-before-color-1), + var(--gradient-after-color-2) ); background-repeat: no-repeat; background-size: 100% 2px; @@ -118,16 +134,16 @@ Neoteroi Mkdocs timeline extension: https://github.com/Neoteroi/mkdocs-plugins/b /* px here control left margin/width of timeline */ .nt-timeline-before { background: linear-gradient( - rgba(193, 187, 246, 1) 0%, - rgba(193, 187, 246, 1) 100% + var(--gradient-before-color-1), + var(--gradient-before-color-2) ) no-repeat 30px/2px 100%; } .nt-timeline-after { background: linear-gradient( - rgba(0, 0, 0, 0) 0%, - rgba(17, 17, 18, 1) 100% + var(--gradient-after-color-1), + var(--gradient-after-color-2) ) no-repeat 30px/2px 100%; display: none; @@ -135,8 +151,8 @@ Neoteroi Mkdocs timeline extension: https://github.com/Neoteroi/mkdocs-plugins/b .nt-timeline-items { background: linear-gradient( - rgba(193, 187, 246, 1) 0%, - rgba(17, 17, 18, 1) 100% + var(--gradient-before-color-1), + var(--gradient-after-color-2) ) no-repeat 30px/2px 100%; } @@ -148,7 +164,7 @@ Neoteroi Mkdocs timeline extension: https://github.com/Neoteroi/mkdocs-plugins/b &.bigger { top: 0px; left: 10px; - background: #000000; + background: var(--md-default-bg-color); } } } @@ -169,7 +185,7 @@ Neoteroi Mkdocs timeline extension: https://github.com/Neoteroi/mkdocs-plugins/b /* set height for timeline gradient above the first item */ .nt-timeline-before { - content: ''; + content: ""; height: 15px; } @@ -185,7 +201,7 @@ Neoteroi Mkdocs timeline extension: https://github.com/Neoteroi/mkdocs-plugins/b height: 20px; border-radius: 100%; - background-color: #000000; + background-color: var(--md-default-fg-color); position: absolute; top: 0px; z-index: 2; @@ -195,7 +211,7 @@ Neoteroi Mkdocs timeline extension: https://github.com/Neoteroi/mkdocs-plugins/b align-items: center; /* border around each icon */ - border: 2px solid white; + border: 2px solid var(--md-default-fg-color); &:not(.bigger) { .icon { @@ -210,7 +226,7 @@ Neoteroi Mkdocs timeline extension: https://github.com/Neoteroi/mkdocs-plugins/b } .icon { - color: white; + color: var(--md-default-fg-color); position: relative; bottom: 1px; } diff --git a/material-overrides/assets/stylesheets/wormhole.css b/material-overrides/assets/stylesheets/wormhole.css index 0e5fde767..30d5ce73c 100644 --- a/material-overrides/assets/stylesheets/wormhole.css +++ b/material-overrides/assets/stylesheets/wormhole.css @@ -1,777 +1,762 @@ :root { - /* Borders */ - --md-border-radius: 12px; - --md-border-width: 1px; - - /* Opacity */ - --md-hover-opacity: 0.7; - /* Colors */ --dark: #000000; - --dark-grey: #111112; - --grey: #1c1c1c; --light: #ffffff; - --light-transparent-90: rgba(255, 255, 255, 0.9); - --light-transparent-60: rgba(255, 255, 255, 0.6); - --light-transparent-40: rgba(255, 255, 255, 0.4); - --light-transparent-26: rgba(255, 255, 255, 0.26); - --light-transparent-20: rgba(255, 255, 255, 0.2); - --light-transparent-12: rgba(255, 255, 255, 0.12); - --light-transparent-10: rgba(255, 255, 255, 0.1); - --light-transparent-07: rgba(255, 255, 255, 0.07); + + --black: hsl(0 0% 0%); + --grey-05: hsl(0 0% 5%); + --grey-08: hsl(0 0% 8%); + --grey-10: hsl(0 0% 10%); + --grey-10-opacity-1: rgb(26, 26, 26); + --grey-15: hsl(0 0% 15%); + --grey-17: hsl(0 0% 17%); + --grey-20: hsl(0 0% 20%); + --grey-30: hsl(0 0% 30%); + --grey-35: hsl(0 0% 35%); + --grey-40: hsl(0 0% 40%); + --grey-50: hsl(0 0% 50%); + --grey-60: hsl(0 0% 60%); + --grey-70: hsl(0 0% 70%); + --grey-75: hsl(0 0% 75%); + --grey-80: hsl(0 0% 80%); + --grey-85: hsl(0 0% 85%); + --grey-90: hsl(0 0% 90%); + --grey-95: hsl(0 0% 95%); + --grey-95-opacity-1: rgb(242, 242, 242); + --white: hsl(0 0% 100%); + --plum: #c1bbf6; + --yellow: #dde95a; + --coral: #fd8058; + --plum-transparent-70: rgba(193, 187, 246, 0.7); --plum-transparent-50: rgba(193, 187, 246, 0.5); + --plum-transparent-30: rgba(193, 187, 246, 0.3); --plum-transparent-15: rgba(193, 187, 246, 0.15); --plum-transparent-10: rgba(193, 187, 246, 0.1); - --yellow: #dde95a; - --coral: #fd8058; + + --yellow-transparent-90: rgba(221, 233, 90, 0.9); + --coral-transparent-90: rgba(253, 128, 88, 0.9); --coral-transparent-12: rgba(253, 128, 88, 0.12); - /* Fonts*/ - --h1-size: 56px; - --h2-size: 48px; - --h3-size: 40px; - --h4-size: 32px; + --label-text-style: uppercase; + + /* Borders */ + --border-radius: 0.5em; + --border-width: 1px; +} - --body-l-text-size: 18px; - --body-text-size: 16px; - --body-s-text-size: 14px; - --body-xs-text-size: 12px; +/* Color scheme overrides */ +[data-md-color-scheme="custom-light"] { + --md-default-fg-color: var(--dark); + --md-default-bg-color: var(--grey-95); + --md-primary-fg-color: var(--grey-95); + --md-primary-bg-color: var(--dark); - --body-l-text-line-height: 160%; - --body-text-line-height: 170%; - --body-s-text-line-height: 140%; - --body-xs-text-line-height: 140%; + --md-primary-bg-color--light: var(--grey-40); - --caption-size: 11px; - --label-size: 12px; + --md-default-fg-color--light: var(--dark); + --md-default-fg-color--lightest: var(--light); - --md-header-font: 'Inter', sans-serif; - --header-line-height: 115%; - --header-font-weight: 600; + --md-typeset-color: var(--dark); + --md-typeset-a-color: #5b4fc9; - --md-cta-font: 'Druk Wide', sans-serif; - --md-cta-text-style: uppercase; + --border-color: var(--grey-80); + --border: var(--border-width) solid var(--border-color); - --md-nav-labels-font: 'Roboto Mono', monospace; - --label-text-style: uppercase; + --md-accent-fg-color: #5b4fc9; + --md-accent-fg-color--active: var(--plum-transparent-30); + --md-accent-fg-color--transparent: var(--plum-transparent-30); + + --md-footer-bg-color: var(--grey-95); + --md-footer-bg-color--dark: var(--grey-95); + --md-footer-fg-color: var(--grey-40); + + --md-typeset-table-color: var(--grey-80); + --table-header-bg-color: var(--grey-90); + --md-typeset-table-color--light: var(--plum-transparent-30); + + --md-admonition-bg-color: var(--grey-95); + --md-admonition-fg-color: var(--dark); + + --md-typeset-kbd-color: var(--yellow); + + /** Branded code snippets**/ + --md-code-fg-color: var(--grey-10); + --md-code-bg-color: var(--grey-85); + --code-filename-divider: var(--grey-60); + /* Numbers */ + --md-code-hl-number-color: var(--grey-10); + /* Python function names */ + --md-code-hl-function-color: #e65c3d; + /* Strings */ + --md-code-hl-string-color: #e65c3d; + /* Python print */ + --md-code-hl-constant-color: #5b4fc9; + /* Imports, const, let, var, async, await, function, etc. */ + --md-code-hl-keyword-color: #5b4fc9; + /* Comments */ + --md-code-hl-comment-color: var(--grey-35); + /* Code highlighting */ + --md-code-hl-variable-color: #e65c3d; + --md-code-hl-color--light: var(--plum-transparent-50); + --md-code-hl-color: #5b4fc9; + + /** Mermaid diagrams */ + --md-mermaid-edge-color: var(--md-default-fg-color); + --md-mermaid-label-fg-color: var(--md-default-fg-color); + --md-mermaid-sequence-actor-line-color: var(--grey-75); + --md-mermaid-sequence-actor-bg-color: rgb(227, 226, 242); } -:root, -[data-md-color-scheme='default'] { +[data-md-color-scheme="custom-dark"] { --md-default-fg-color: var(--light); - --md-default-fg-color--light: var(--light-transparent-10); - --md-default-fg-color--lighter: var(--plum); - --md-default-fg-color--lightest: var(--light-transparent-10); - --md-default-bg-color: var(--dark); + --md-default-bg-color: var(--grey-10); + --md-primary-fg-color: var(--grey-10); + --md-primary-bg-color: var(--light); + + --md-primary-bg-color--light: var(--grey-60); + + --md-default-fg-color--light: var(--light); + --md-default-fg-color--lightest: var(--grey-08); + + --md-typeset-color: var(--grey-80); + --md-typeset-a-color: var(--plum); - --md-primary-fg-color: var(--plum); - --md-primary-fg-color--dark: var(--plum); + --border-color: var(--grey-17); + --border: var(--border-width) solid var(--border-color); --md-accent-fg-color: var(--plum); - --md-accent-fg-color-light: var(---light-transparent-90); - --md-accent-bg-color: var(--plum-transparent-70); + --md-accent-fg-color--active: var(--plum-transparent-15); + --md-accent-fg-color--transparent: var(--plum-transparent-15); - --md-footer-bg-color: var(--dark); - --md-footer-bg-color--dark: var(--dark); + /* --md-default-fg-color--lighter: var(--plum); */ + /* --md-primary-fg-color--dark: var(--plum); */ + /* --md-primary-bg-color--light: var(--light-transparent-50); */ + /* --md-accent-fg-color-light: var(---light-transparent-90); */ + /* --md-accent-bg-color: var(--plum-transparent-70); */ - /* Important is needed to override mkdocs specificity */ - --md-typeset-a-color: var(--plum) !important; - --md-typeset-a-color--hover: var(--plum-transparent-70); + --md-footer-bg-color: var(--grey-10); + --md-footer-bg-color--dark: var(--grey-10); + --md-footer-fg-color: var(--grey-60); - --md-border-color: var(--light-transparent-10); + --md-typeset-table-color: var(--grey-17); + --table-header-bg-color: var(--grey-15); + --md-typeset-table-color--light: var(--plum-transparent-15); - --md-typeset-table-color: var(--grey); - --md-typeset-kbd-color: var(--grey); + --md-admonition-bg-color: var(--grey-10); + --md-admonition-fg-color: var(--light); - /** Optional: For branded code snippets**/ - --md-code-fg-color: var(--yellow); - --md-code-bg-color: var(--dark-grey); - /** Code highlighting color shades **/ + --md-typeset-kbd-color: var(--grey-30); + + /** Branded code snippets**/ + --md-code-fg-color: var(--yellow-transparent-90); + --md-code-bg-color: var(--grey-08); + --code-filename-divider: var(--grey-40); /* Numbers */ --md-code-hl-number-color: var(--light); /* Python function names */ - --md-code-hl-function-color: var(--coral); + --md-code-hl-function-color: var(--coral-transparent-90); /* JavaScript booleans, Python variable names */ - --md-code-hl-name-color: var(--yellow); + --md-code-hl-name-color: var(--yellow-transparent-90); /* Strings */ - --md-code-hl-string-color: var(--coral); + --md-code-hl-string-color: var(--coral-transparent-90); /* Python print */ --md-code-hl-constant-color: var(--plum); /* Imports, const, let, var, async, await, function, etc. */ --md-code-hl-keyword-color: var(--plum); /* Comments */ - --md-code-hl-comment-color: var(--light-transparent-60); + --md-code-hl-comment-color: var(--grey-50); /* Operators (=, >, <)*/ --md-code-hl-operator-color: var(--light); /* Punctuation, brackets, parenthesis, etc. */ --md-code-hl-punctuation-color: var(--light); /* Code highlighting */ - --md-code-hl-variable-color: var(--coral); + --md-code-hl-variable-color: var(--coral-transparent-90); --md-code-hl-color--light: var(--plum-transparent-10); --md-code-hl-color: var(--plum); - --md-admonition-icon--code: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+PHBhdGggZD0iTTE0LjYsMTYuNkwxOS4yLDEyTDE0LjYsNy40TDE2LDZMMjIsMTJMMTYsMThMMTQuNiwxNi42TTkuNCwxNi42TDQuOCwxMkw5LjQsNy40TDgsNkwyLDEyTDgsMThMOS40LDE2LjZaIiAvPjwvc3ZnPg=='); -} + /** Mermaid diagrams */ + --md-mermaid-edge-color: var(--md-default-fg-color); + --md-mermaid-label-fg-color: var(--md-default-fg-color); + --md-mermaid-sequence-actor-line-color: var(--grey-35); + --md-mermaid-sequence-actor-bg-color: rgb(51, 50, 58); -/* Fonts */ -.md-typeset h1, -.md-typeset h2, -.md-typeset h3, -.md-typeset h4 { - font-family: var(--md-header-font); - font-weight: var(--header-font-weight); - line-height: var(--header-line-height); + /** Admonitions */ + --md-admonition-icon--code: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+PHBhdGggZD0iTTE0LjYsMTYuNkwxOS4yLDEyTDE0LjYsNy40TDE2LDZMMjIsMTJMMTYsMThMMTQuNiwxNi42TTkuNCwxNi42TDQuOCwxMkw5LjQsNy40TDgsNkwyLDEyTDgsMThMOS40LDE2LjZaIiAvPjwvc3ZnPg=="); } -.md-typeset h1 { - color: var(--md-default-fg-color); +/* General styling: images */ +[data-md-color-scheme="custom-light"] img[src$="#only-dark"], +[data-md-color-scheme="custom-dark"] img[src$="#only-light"] { + display: none !important; /* Hide dark images in light mode and vice versa */ } -.md-content__inner h1 { - font-size: var(--h1-size); - margin: 0; +.md-header__button.md-logo img { + height: 0.8rem; } -.md-content__inner h2 { - font-size: var(--h2-size); - margin-top: 1em; +.md-header__button.md-logo svg { + height: 1rem; } -.md-content__inner h3 { - font-size: var(--h3-size); - margin-top: 1em; +.md-icon svg, +.md-search-result__icon { + height: 1rem; + width: 1rem; } -.md-content__inner h4 { - font-size: var(--h4-size); +/* General styling: fonts */ +.md-typeset h1, +.md-typeset h2, +.md-typeset h3, +.md-typeset h4 { + font-weight: 700; + color: var(--md-default-fg-color); } -.md-nav { - font-size: var(--body-xs-text-size); - line-height: var(--body-xs-text-line-height); - font-weight: 500; +.md-typeset a:hover, +.md-typeset a:focus { + background-color: var(--md-accent-fg-color--active); } -@media screen and (max-width: 30em) { - .md-typeset h1 { - font-size: 48px; - word-break: break-word; - } - - .md-typeset h2 { - font-size: 36px; - word-break: break-word; - } - - .md-typeset h3 { - font-size: 28px; - word-break: break-word; - } - - .md-typeset h4 { - font-size: 22px; - word-break: break-word; - } +.md-typeset h1 { + margin-bottom: 0.5em; + font-size: 2.15em; } -/* General styling */ -.md-typeset { - font-size: var(--body-text-size); - line-height: var(--body-text-line-height); +.md-typeset h2 { + font-size: 1.8em; } -.md-typeset.md-content__inner a { - text-decoration: underline; +.md-typeset h3 { + font-size: 1.45em; } -.md-typeset a:focus, -.md-typeset a:hover { - color: var(--md-typeset-a-color); - opacity: var(--md-hover-opacity); +.md-typeset h4 { + font-size: 1.1em; } -/* All icons (i.e., Next, Prev, Feedback, etc. */ -.md-icon svg { - width: 1.5rem; - height: 1.5rem; - fill: var(--md-typeset-a-color); +.md-typeset .headerlink { + color: var(--md-default-fg-color); } -/* Header styles */ -.md-header, -.md-tabs { - background-color: var(--md-default-bg-color); - font-family: var(--md-nav-labels-font); - text-transform: var(--label-text-style); - font-size: var(--label-size); +/* General styling: pages */ +.md-grid { + max-width: 1536px; + padding: 0 2em; } -.md-header__inner { - grid-template-columns: 1fr auto 1fr; - display: grid; +.md-main__inner { + margin-top: 0.75rem; + margin-bottom: 0.75rem; } -.md-tabs { - z-index: unset; - display: flex; +.md-content__inner { + padding-top: 0; } -/* To align with Wormhole website */ -.md-header { - /* Make header a little thicker */ - padding: 1.6em 0; +.md-content__inner:before { + height: 0; } -[dir='ltr'] .md-header__title { - margin-left: 0; - height: unset; - padding-bottom: .15em; +.md-typeset pre > code, +.md-sidebar__scrollwrap:focus-within, +.md-sidebar__scrollwrap:hover { + scrollbar-color: var(--md-primary-bg-color--light) #0000 !important; } -.md-header__title > .md-header__ellipsis { - width: 12.1rem; +@media screen and (min-width: 100em) { + html { + font-size: 125%; + } } -.md-header__button.md-logo { - margin: 0.1rem; - padding: 0; +@media screen and (min-width: 125em) { + html { + font-size: 130%; + } } -.md-header__button.md-logo img { - height: 12px; - width: 132px; +@media (min-resolution: 2dppx) { + html { + font-size: clamp(1rem, 125%, 1.25rem); + } } -@media screen and (max-width: 80em) { - .md-header__inner { - margin: 0 1rem; +@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-right: 3rem; } - .md-header__title > .md-header__ellipsis { - width: 11.1rem; + [dir="ltr"] + .md-sidebar--primary:not([hidden]) + ~ .md-content + > .md-content__inner { + margin-left: 3rem; } -} -@media screen and (max-width: 76.234375em) { - .md-header__button:not(.focus-visible) { - margin-left: 0; + .md-grid { + padding: 0 5.75em; } } -@media screen and (max-width: 60em) { - [dir='ltr'] .md-header__title { - display: none; - } +/* Header styling */ +.md-header { + padding-top: 1em; +} - .md-header__inner { - display: flex; - } +.md-header--shadow { + box-shadow: none; + border-bottom: var(--border); } -@media screen and (max-width: 47.5em) { - .md-header__inner { - margin: 0 1rem; - } +.md-header__topic { + display: none; } -/* Make spacing of nav items slightly larger */ -li.md-nav__item, -.md-nav__item--section > .md-nav > .md-nav__list > .md-nav__item { - margin: 0.3em 0; +.md-tabs__list { + gap: 1rem; } -/* Set all non-primary sections font and margin size to be smaller */ -.md-nav__link.md-nav__link--index, -.md-nav__link { - margin-top: 0; - padding: 0.4em 0; +.md-tabs__item { + padding-left: 0; + padding-right: 0; } -/* Make the secondary section font larger on left capitalized (i.e., Get Started, Build, etc.) */ -.md-nav__item--section > .md-nav__link { - text-transform: var(--label-text-style); +.md-tabs__item--active { + border-bottom: 2px solid var(--md-typeset-a-color); } -/** Styling for nav items that are active or hovered over on larger screens **/ -@media screen and (min-width: 76.25em) { - /* Make the primary section font larger on left nav (i.e., Build, Learn, etc.) */ - .md-nav--lifted > .md-nav__list > .md-nav__item--active > .md-nav__link { - font-size: 24px; - font-weight: 600; - line-height: 130%; - padding: 0 0 0.5em 0.9em; - margin-left: -0.9em; - background-color: var(--dark); - border-bottom: var(--md-border-width) solid var(--md-border-color); - box-shadow: none; - } +.md-tabs__item--active .md-tabs__link { + color: var(--md-typeset-a-color); +} - /* Highlight current active nav item and nav items on hover */ - .md-nav__link:hover, - .md-nav__link-wrapper.md-nav__item.md-nav__item--active, - .md-nav__item div.md-nav__link--active { - background: var(--grey); - border-radius: var(--border-radius); - } +.md-tabs__item--active:hover .md-tabs__link { + background-color: var(--md-default-bg-color); +} - .md-nav__link:hover { - margin-left: -0.9em; - padding-left: 0.9em; - } +.md-tabs__link:hover { + color: var(--md-typeset-a-color); + background-color: var(--md-accent-fg-color--active); +} - .md-nav__link-wrapper.md-nav__item.md-nav__item--active { - margin-left: -0.8em; - padding-left: 0.8em; +@media screen and (min-width: 60em) { + .md-tabs__link { + font-size: 0.64rem; + opacity: 1; + margin-top: 0.7rem; + padding: 0.2rem 0.5rem; + border-radius: 0.3em; } - .md-nav__item div.md-nav__link--active { - margin-left: -0.9em; - padding-left: 0; + .md-search__form { + border: var(--border); + background-color: var(--md-default-bg-color); + color: var(--md-default-fg-color); + border-radius: var(--border-radius); } - /* For active sections, when on that section index page */ - .md-nav__item .md-nav__link-wrapper.md-nav__link--active a, - .md-nav__item .md-nav__link--active a { - margin-left: 0.9em; + [dir="ltr"] .md-search-result__meta, + [dir="ltr"] .md-search__input { + padding-left: 1.9rem; + font-size: 0.64rem; } - /* For section links on hover */ - .md-nav__link.md-nav__link--index:hover a { - color: var(--md-typeset-a-color); + [data-md-toggle="search"]:checked ~ .md-header .md-search__output { + border-bottom-left-radius: 1em; + border-bottom-right-radius: 1em; + border: var(--border); + z-index: 3; } - [dir='ltr'] .md-nav--primary .md-nav__item > .md-nav__link, - [dir='ltr'] .md-nav--primary .md-nav__item > .md-nav__link:hover { - margin-right: 0; + [data-md-toggle="search"]:checked ~ .md-header .md-search__form { + border-top-left-radius: 1em; + border-top-right-radius: 1em; } - .md-nav__icon { - height: unset; + .md-search__icon[for="__search"] { + align-content: center; } -} -/** Styling for nav items that are active or hovered over on smaller screens **/ -@media screen and (max-width: 76.1875em) { - /* For links on hover */ - .md-nav__link:hover a { - margin-left: 1em; + .md-search__icon.md-icon svg { + fill: var(--md-primary-bg-color--light); } - .md-nav__link-wrapper.md-nav__item.md-nav__item--active { - margin-left: -1em; + .md-search__form:hover { + background-color: var(--md-default-fg-color--lightest); } - /* Apply background to active pages and sections */ - .md-nav--primary .md-nav__item--active > .md-nav__link { - background-color: var(--grey); + [data-md-toggle="search"]:checked ~ .md-header .md-search__form { + background-color: var(--md-default-fg-color--lightest); } - /* Nav hover styling for sections */ - div.md-nav__link:hover { - margin-left: 0; - padding-left: 0; + .md-search__scrollwrap { + scrollbar-color: var(--md-primary-bg-color--light) #0000 !important; } - /* Nav hover styling for pages */ - a.md-nav__link:hover { - margin-left: 0; - padding-left: 1em; + .md-search-result__item pre code { + border-radius: var(--border-radius); } } -/* Only show the active items on the left nav */ +/* Left nav styling */ +.external-link svg { + height: 0.64rem; + width: 0.64rem; + fill: var(--md-default-fg-color); + vertical-align: middle; +} + @media screen and (min-width: 76.25em) { - /* To hide the inactive dropdown sections on the left nav */ - .md-nav > .md-nav__list .md-nav__item--section { - display: none; + .md-nav { + font-size: 0.64rem; + transition: opacity 0.2s ease; + opacity: 0; } - /* To show only the active dropdown section on the left nav */ - .main-page-sidebar .md-nav > .md-nav__list .md-nav__item--section, - .md-nav > .md-nav__list .md-nav__item--section.md-nav__item--active { - display: block; + /* --- To better handle page reloads and minimize flickering */ + :not(.js-loading) .md-nav { + opacity: 1; } - /* Allow section headers to be clickable */ - .md-nav--lifted - > .md-nav__list - > .md-nav__item--active - > .md-nav__link:not(.md-nav__container), - .md-nav__item--section > .md-nav__link:not(.md-nav__container) { - pointer-events: auto; + .js-loading nav.md-nav { + display: none !important; } - /* Remove arrow (dropdown) icon next to the section header (i.e., Builders, Node Operators, etc.) */ - .md-nav--lifted - > .md-nav__list - > .md-nav__item--active - > .md-nav__link - label - span.md-nav__icon:after { + .nav__item--section:not(.expanded) > nav.md-nav { display: none; } + /* --- */ - /* Override mkdocs styling to account for the nav-wrapper */ - .md-nav__toggle.md-toggle--indeterminate ~ .md-nav, - .md-nav__toggle:checked ~ .nav-wrapper { - display: grid; - grid-template-rows: 1fr; - opacity: 1; - transition: grid-template-rows 0.25s cubic-bezier(0.86, 0, 0.07, 1), - opacity 0.15s 0.1s, visibility 0ms; - visibility: visible; - } - - .md-nav__toggle ~ .md-nav > .nav-wrapper { - overflow: hidden; - } - - .md-nav { + .nav__item--section + > .md-nav__link[for] + + .md-nav[data-md-level="2"][aria-expanded="true"] { margin-bottom: 0; } - /* Section lines */ - li > nav.md-nav[data-md-level='3'] ul.md-nav__list, - li > nav.md-nav[data-md-level='4'] ul.md-nav__list { - border-left: var(--md-border-width) solid var(--plum); - margin: 0.75em 0; - } - - /** - NOTE: The rest of the styling in this media query follows a simple - principle: apply a base style to all items, then selectively override - styles where necessary. - - These styles are specific to dropdown items for pages and sections. - */ - - /* Put display none on all the nav items*/ - .md-nav__list > .md-nav__item { + .md-nav__icon.md-icon.mobile { display: none; } - /* Ensures pages are shown for dropdown items that are sections */ - .md-nav--primary .md-nav__list:first-child .md-nav__item--section.md-nav__item--nested .md-nav__item { + .nav__icon.plus, + .nav__item--section + > .md-nav__link[for]:has(+ .md-nav[data-md-level="2"][aria-expanded="true"]) + .nav__icon.minus { display: block; } - /* For dropdown items that are pages, ensure they show up prominently on root-level index pages - by applying the styling to all nav items (including sections) */ - .md-nav--primary ul.md-nav__list:first-child > li.md-nav__item { - margin-top: 1em; - font-weight: 700; - text-transform: uppercase; - } - - /* For dropdown items that are pages, ensure the page is shown in nav when on that page and reset - the styles applied in the above declaration. For example, this modifies the Introduction to Wormhole - title in the nav on the Learn > Introduction page */ - .md-nav--primary .md-nav__list:first-child .md-nav__item.md-nav__item--active:not(.md-nav__item--nested) { - display: block; - font-weight: 400; - text-transform: capitalize; + .nav__icon.minus, + .nav__item--section + > .md-nav__link[for]:has(+ .md-nav[data-md-level="2"][aria-expanded="true"]) + .nav__icon.plus { + display: none; } - /* For dropdown items that are sections, maintain the preexisting styling */ - .md-nav--primary ul.md-nav__list:first-child > li.md-nav__item ul.md-nav__list > li.md-nav__item { - margin-top: unset; - font-weight: 400; - text-transform: none; + .nav__icon.md-icon svg { + height: 0.8rem; } - /* For the TOC, display all nav items */ - .md-nav--secondary .md-nav__list > .md-nav__item { - display: block; + .md-nav__link { + gap: 0.2rem; } -} - -/* Add spacing below the section lines */ -.md-nav--primary .md-nav__list { - padding-bottom: 0; - margin-bottom: 0.5em; -} - -/* Render arrow next to expandable sections */ -.md-nav__link > * { - cursor: pointer; - display: flex; - align-self: center; -} - -/* Scrollbar styling for left nav */ -/* For Chrome, Edge, and Safari */ -.md-sidebar__scrollwrap:focus-within::-webkit-scrollbar-thumb, -.md-sidebar__scrollwrap:hover::-webkit-scrollbar-thumb, -.md-typeset pre > code::-webkit-scrollbar-thumb { - background-color: var(--plum); - /* color of the tracking area */ -} - -/* For Firefox */ -.md-typeset pre > code:focus-within, -.md-typeset pre > code:hover, -.md-sidebar__scrollwrap:focus-within, -.md-sidebar__scrollwrap:hover { - scrollbar-color: var(--plum); - /* color of the tracking area */ -} -/** TOC styling **/ -.md-nav--secondary .md-nav__item .md-nav__link--active { - color: var(--plum); -} - -/* Styling for the "Section" title on the TOC */ -.md-nav--secondary .md-nav__title { - box-shadow: none; - padding: 0.5em 0; - color: var(--light); - background-color: transparent; - position: unset; -} - -.md-nav--secondary .md-nav__link:hover { - background: transparent; - color: var(--plum); -} - -/* Apply opacity to sections in TOC as scrolling past them */ -.md-nav__link--passed { - color: var(--light-transparent-60); -} - -/* Adjust nav and TOC styling for smaller screens*/ -@media screen and (max-width: 76.1875em) { - /* Hide Nav Bar header label text - only show back arrow */ - .md-nav--primary .md-nav__title[for='__drawer'], - .md-nav--primary .md-nav__title { - background: var(--md-default-bg-color); - border-bottom: var(--md-border-width) solid var(--grey); + .md-nav__link[for]:focus { color: var(--md-default-fg-color); - text-transform: var(--label-text-style); } - /* Don't display Wormhhole Docs under logo */ - .toc-sections-title { - display: none; + .md-nav__link[for]:hover { + color: var(--md-accent-fg-color); } - /* Remove lines between nav items */ - .md-nav--primary .md-nav__item { - border-top: none; + /* .md-nav__item { + color: var(--md-default-fg-color); + } */ + + .md-nav--primary > .md-nav__list > .md-nav__item > .md-nav__link { + text-transform: var(--label-text-style); + padding-left: 1.7rem; + margin-left: 0; + margin-bottom: 0.5em; } - .md-nav__link-wrapper.md-nav__item.md-nav__item--active - .md-nav__link.md-nav__link--active { - display: none; + [dir="ltr"] + .md-nav--primary + .md-nav__item + > .md-nav__link:has(+ .md-nav[data-md-level="2"]) { + padding-top: 1em; + font-weight: 700; + text-transform: var(--label-text-style); + color: var(--md-default-fg-color); } - .md-nav__link.md-nav__link--index, - .md-nav__link { - font-size: var(--body-text-size); + .md-nav--lifted + > .md-nav__list + > .md-nav__item--active.md-nav__item--section { + margin-left: -0.5rem; } - /* Adjust font of nav items */ - .md-nav__link, - .md-nav__item--section > .md-nav__link { - font-size: var(--body-text-size); + .md-nav[data-md-level="1"] + > .md-nav__list:first-of-type + > .md-nav__item:not(.nav__item--section) { + margin-left: 1.2rem; } - /* To adjust the root-level section font */ - .md-nav--lifted > .md-nav__list > .md-nav__item--active > .md-nav__link { - text-transform: capitalize; - font-size: var(--body-text-size); - font-weight: 400; - padding: 0.6rem 0.8rem; - letter-spacing: normal; + .md-nav[data-md-level="2"] > .md-nav__list { + padding-left: 1.2rem; } - .md-nav--lifted + .md-nav[data-md-level="2"] > .md-nav__list .md-nav .md-nav__list, + .md-nav[data-md-level="2"] > .md-nav__list - > .md-nav__item--active - > .md-nav__link:hover { - padding-left: unset; + .md-nav + .md-nav__list + .md-nav__link { + padding-left: 0.5rem; } - li.md-nav__item, - .md-nav__item--section > .md-nav > .md-nav__list > .md-nav__item { - margin: 0; + .md-nav__link { + padding: 0.2rem; + padding-left: 0.5rem; + margin-top: 0; } - /* To adjust lower-level section font */ - .md-nav__item--section > .md-nav__link { - text-transform: capitalize; + .md-nav__item .md-nav__link--active { + color: var(--md-typeset-a-color); + background: var(--md-accent-fg-color--active); + padding: 0.2rem; + padding-left: 0.5rem; + border-radius: 0.33em; } - /* Keep nav items as scrolling over and hovering over) in line */ - .md-nav--primary .md-nav__link, - .md-nav__link.md-nav__link--index, - .md-nav__link { - margin-top: unset; - padding: 0.6rem 0.8rem; - align-items: center; + .md-nav--lifted > .md-nav__list > .md-nav__item--active > .md-nav__link { + box-shadow: none; } -} -/* TOC styling */ -@media screen and (min-width: 60em) { - .md-nav--secondary { - background: var(--grey); - border: var(--md-border-width) solid var(--md-border-color); - border-radius: var(--md-border-radius); - color: #9a9a9a; - padding: 1em 0.6rem; - gap: 8px; - display: flex; - flex-direction: column; + .md-sidebar--primary { + margin-left: -0.5rem; } - .md-nav--secondary .md-nav__title { - font-size: 24px; - line-height: 130%; - font-weight: 600; - border-bottom: var(--md-border-width) solid var(--md-border-color); + .md-nav--secondary .md-nav__title[for="__toc"] { + padding-left: 1.1rem; } - [dir='ltr'] .md-nav--secondary .md-nav__list[data-md-component='toc'] { - padding: 0; + .md-nav__item.md-nav__item--nested + > .md-nav[data-md-level="3"] + > .md-nav__list + > * { + border-left: var(--border); } +} - .md-nav--secondary .md-nav__list { - padding-bottom: 0; +@media screen and (max-width: 76.25em) { + .nav__icon.plus, + .nav__icon.minus { + display: none; } - .md-nav--secondary li.md-nav__item { - margin: 0.3em 0; + .md-nav__icon.md-icon.mobile { + display: block; } +} - [dir='ltr'] .md-nav--secondary .md-nav__item > .md-nav__link { - margin-right: 0; - font-size: var(--body-xs-text-size); +/* Right nav (TOC) styling */ +@media screen and (min-width: 60em) { + .md-nav--secondary .md-nav__title[for="__toc"] { + text-transform: var(--label-text-style); + font-size: 0.6rem; + line-height: 0.9rem; } - .md-nav--secondary .md-nav__link { - padding: 0.4em 0; + .md-nav--secondary .md-nav__title { + box-shadow: none; } - [dir='ltr'] .md-nav--secondary .md-nav__item > a.md-nav__link:hover { - padding-left: 0; - margin-left: 0; + .md-sidebar--secondary { + margin-left: -0.5rem; } - [dir='ltr'] .md-nav--secondary a.md-nav__link.md-nav__link--active, - [dir='ltr'] .md-nav--secondary a.md-nav__link.md-nav__link--active:hover { - padding: 0.4em 0; + .md-sidebar__scrollwrap { + display: flex; + flex-direction: column; + gap: 3em; } } -/* Hides section permalink hash for H1 sections */ -.md-typeset h1 .headerlink { - display: none; +/* Button styling */ +.md-typeset a:has(.md-button) { + background-color: var(--md-default-bg-color); + border-radius: var(--border-radius); } -/* Custom admonition styling */ -.md-typeset .admonition { - border-width: var(--md-border-width); +.md-typeset .md-button { + border: var(--border); + border-radius: var(--border-radius); + padding: 0.75em 1.5em; + color: var(--dark); + background-color: var(--plum); + font-weight: 400; } -.md-typeset .admonition.code, -.md-typeset details.code, -.md-typeset .admonition.note, -.md-typeset details.note { - border-color: var(--plum); +.md-typeset .md-button:focus, +.md-typeset .md-button:hover { + opacity: 1; + border-color: var(--border-color); + border-radius: var(--border-radius); + background-color: var(--md-accent-fg-color--active); + color: var(--md-default-fg-color); } -.md-typeset .code > .admonition-title:before, -.md-typeset .code > summary:before, -.md-typeset .note > .admonition-title:before, -.md-typeset .note > summary:before { - background-color: var(--plum); +/* Code element styling */ +code.md-code__content { + border-radius: var(--border-radius); } -.md-typeset .code > .admonition-title:before, -.md-typeset .code > summary:before { - -webkit-mask-image: var(--md-admonition-icon--code); - mask-image: var(--md-admonition-icon--code); +.md-typeset .admonition-title code, +.md-typeset summary code { + box-shadow: none; } -.md-typeset .code > .admonition-title, -.md-typeset .code > summary, -.md-typeset .note > .admonition-title, -.md-typeset .note > summary { - background-color: var(--grey); +.md-typeset a:focus code, +.md-typeset a:hover code { + background-color: var(--md-accent-fg-color--active); } -.md-typeset .admonition.warning, -.md-typeset details.warning { - border-color: var(--coral); +.md-typeset code:not(.focus-visible) { + white-space: break-spaces; } -.md-typeset .warning > .admonition-title:before, -.md-typeset .warning > summary:before { - background-color: var(--coral); +.highlight span.filename { + border-color: var(--code-filename-divider); } -.md-typeset .warning > .admonition-title, -.md-typeset .warning > summary { - background-color: var(--coral-transparent-12); +/* Admonition styling */ +details.interface > summary::before { + display: none; } -/* Styling for the Copy to Clipboard */ -/* Clipboard icon */ -.md-clipboard { - color: var(--plum); +.md-typeset details.interface { + border: var(--border); + box-shadow: none; + width: auto; } -/* Hovering over the clipboard */ -:hover > .md-clipboard { - color: var(--plum); +[dir="ltr"] .md-typeset details.interface > summary { + padding: 1em 0 1em 1em; + background-color: var(--table-header-bg-color); } -.md-clipboard:focus, -.md-clipboard:hover { - color: var(--plum-transparent-70); +.md-typeset details.interface > summary:after { + top: auto; } -/* Center copy to clipboard text in pop-up */ -.md-dialog { - text-align: center; +.md-typeset details.interface:has(~ details.interface), +.md-typeset details.interface ~ details.interface { + margin-top: 0; + margin-bottom: 0.5em; } -/* Prevent code blocks from overlapping the Copy to Clipboard button */ -.md-typeset pre > code { - white-space: break-spaces; - padding: 1.5em; - padding-right: 3em; +/* Child admonition styling */ +details.child summary::before { + display: none; } -.highlighttable .linenos { - padding-top: 1.5em; +details.child { + width: fit-content; } -pre .md-clipboard { - margin-top: 0.5em; +[dir='ltr'] .md-typeset details.child summary { + width: fit-content; + padding-left: 1em; } -/* Styling for Tables */ -.md-typeset__table { - min-width: 75%; +[dir='ltr'] .md-typeset details.child[open] { + width: auto; } -.md-typeset table:not([class]) { - border-color: var(--grey); - border-radius: var(--md-border-radius); - display: inline-table; +.md-typeset details.child summary { + background-color: unset; } -.md-typeset .md-typeset__table table th { - background-color: var(--grey); - color: var(--light); - text-transform: var(--label-text-style); - font-weight: 500; -} +.md-typeset details.child { + width: fit-content; + border: var(--border); + box-shadow: none; +} + +/* Tabbed element styling */ +.md-typeset .tabbed-labels { + border-top-left-radius: 0.5em; + border-top-right-radius: 0.5em; + border: var(--border); + box-shadow: none; +} + +.md-typeset .tabbed-labels > label > [href]:first-child { + color: var(--md-default-fg-color); + font-weight: 400; +} + +.js .md-typeset .tabbed-labels:before { + background-color: var(--md-default-fg-color); + height: 1.2px; +} + +.md-typeset .tabbed-content { + border: var(--border); + border-top: none; + border-bottom-left-radius: 0.5em; + border-bottom-right-radius: 0.5em; +} + +.md-typeset .tabbed-block p, +.md-typeset .tabbed-block ul, +.md-typeset .tabbed-block ol, +.md-typeset .tabbed-block p ~ div, +.md-typeset .tabbed-block details { + margin: 1em; +} + +.md-typeset + .tabbed-block:has(.md-typeset__scrollwrap > .md-typeset__table) + p + ~ div, +.md-typeset .tabbed-block ul p, +.md-typeset .tabbed-block ol p { + margin: 0; +} + +@media screen and (max-width: 44.9844em) { + .md-content__inner > .tabbed-set .tabbed-labels { + margin: 0; + scroll-padding-inline-start: 0; + } +} + +/* Tables */ +.md-typeset__table { + min-width: 75%; + border-collapse: separate; + border-spacing: 0; + width: 100%; +} + +.md-typeset table:not([class]) { + border-radius: var(--border-radius); + display: inline-table; + border: none; +} + +.md-typeset .md-typeset__table table th { + background-color: var(--table-header-bg-color); +} .md-typeset table:not([class]) td, .md-typeset table:not([class]) th { @@ -779,13 +764,43 @@ pre .md-clipboard { padding: .9375em; } +/* Apply borders at a table cell level */ +table tr > * { + border-top: var(--border); +} + +table tr > *:first-child { + border-left: var(--border); +} + +table tr > *:last-child { + border-right: var(--border); +} + +table thead tr > *, +table tbody tr:last-child > * { + border-bottom: var(--border); +} + +.md-typeset table:not([class]) tbody tr:first-child > * { + border-top: none; +} + /* Round table corners */ -.md-typeset .md-typeset__table table th:first-child { - border-top-left-radius: var(--md-border-radius); +table tbody tr:last-child > *:first-child { + border-bottom-left-radius: var(--border-radius); +} + +table tbody tr:last-child > *:last-child { + border-bottom-right-radius: var(--border-radius); } -.md-typeset .md-typeset__table table th:last-child { - border-top-right-radius: var(--md-border-radius); +table th:first-child { + border-top-left-radius: var(--border-radius); +} + +table th:last-child { + border-top-right-radius: var(--border-radius); } /* Tables centered */ @@ -793,7 +808,7 @@ pre .md-clipboard { text-align: center; } -/* Supported Blockchains Tables */ +/* Supported blockchains tables */ .full-width .md-typeset__scrollwrap .md-typeset__table { width: 100%; } @@ -814,7 +829,7 @@ pre .md-clipboard { z-index: 3; } - .md-typeset table:not([class])+* { + .md-typeset table:not([class]) + * { margin-top: 0; } @@ -827,8 +842,8 @@ pre .md-clipboard { right: 0; background-color: var(--md-default-bg-color); z-index: 2; - height: .5em; - max-width: 61rem; + height: 1.5em; + max-width: 1536px; margin: auto; } } @@ -838,7 +853,7 @@ pre .md-clipboard { max-height: 82vh; overflow: auto; } - + thead { position: sticky; top: -1px !important; @@ -846,6 +861,11 @@ pre .md-clipboard { } } +/** LLMs table **/ +.md-typeset table:not([class]) td:has(a.llms) > *:not(:last-child) { + margin-right: 1em; +} + /* Tables in tabs */ .tabbed-content .md-typeset__scrollwrap { margin: 0; @@ -854,340 +874,166 @@ pre .md-clipboard { .tabbed-content .md-typeset__table { display: inline-table; margin-bottom: 0; - padding: 0.5em; + padding: 0 0.5em; width: 100%; } -/* Tabbed Styling */ -.md-typeset .tabbed-labels { - padding: 0.2em; - text-transform: var(--label-text-style); -} - -.md-typeset .tabbed-set { - background: var(--grey); - border-radius: var(--md-border-radius); +/* Clipboard */ +.md-clipboard { + color: var(--md-default-fg-color); } -.md-typeset .tabbed-content { - background: var(--md-default-bg-color); - border: var(--md-border-width) solid var(--grey); - border-bottom-left-radius: var(--md-border-radius); - border-bottom-right-radius: var(--md-border-radius); +/* Type styling */ +.md-typeset kbd { + border-radius: 1em; + vertical-align: baseline; + box-shadow: none; } -/* To override mkdocs styling for tab colors */ -.md-typeset - .tabbed-set - > input:first-child:checked - ~ .tabbed-labels - > :first-child, -.md-typeset - .tabbed-set - > input:nth-child(10):checked - ~ .tabbed-labels - > :nth-child(10), -.md-typeset - .tabbed-set - > input:nth-child(11):checked - ~ .tabbed-labels - > :nth-child(11), -.md-typeset - .tabbed-set - > input:nth-child(12):checked - ~ .tabbed-labels - > :nth-child(12), -.md-typeset - .tabbed-set - > input:nth-child(13):checked - ~ .tabbed-labels - > :nth-child(13), -.md-typeset - .tabbed-set - > input:nth-child(14):checked - ~ .tabbed-labels - > :nth-child(14), -.md-typeset - .tabbed-set - > input:nth-child(15):checked - ~ .tabbed-labels - > :nth-child(15), -.md-typeset - .tabbed-set - > input:nth-child(16):checked - ~ .tabbed-labels - > :nth-child(16), -.md-typeset - .tabbed-set - > input:nth-child(17):checked - ~ .tabbed-labels - > :nth-child(17), -.md-typeset - .tabbed-set - > input:nth-child(18):checked - ~ .tabbed-labels - > :nth-child(18), -.md-typeset - .tabbed-set - > input:nth-child(19):checked - ~ .tabbed-labels - > :nth-child(19), -.md-typeset - .tabbed-set - > input:nth-child(2):checked - ~ .tabbed-labels - > :nth-child(2), -.md-typeset - .tabbed-set - > input:nth-child(20):checked - ~ .tabbed-labels - > :nth-child(20), -.md-typeset - .tabbed-set - > input:nth-child(3):checked - ~ .tabbed-labels - > :nth-child(3), -.md-typeset - .tabbed-set - > input:nth-child(4):checked - ~ .tabbed-labels - > :nth-child(4), -.md-typeset - .tabbed-set - > input:nth-child(5):checked - ~ .tabbed-labels - > :nth-child(5), -.md-typeset - .tabbed-set - > input:nth-child(6):checked - ~ .tabbed-labels - > :nth-child(6), -.md-typeset - .tabbed-set - > input:nth-child(7):checked - ~ .tabbed-labels - > :nth-child(7), -.md-typeset - .tabbed-set - > input:nth-child(8):checked - ~ .tabbed-labels - > :nth-child(8), -.md-typeset - .tabbed-set - > input:nth-child(9):checked - ~ .tabbed-labels - > :nth-child(9) { - color: var(--plum); +/* Page actions */ +.page-actions .md-nav__title { + text-transform: var(--label-text-style); + font-size: 0.6rem; + line-height: 0.9rem; + padding-left: 1.1rem; } -/* Keep inactive tabs visible */ -.md-typeset .tabbed-labels > label { - color: var(--plum-transparent-50); +.actions-container { + display: flex; + flex-direction: column; + margin: 0 calc(100% - 11.5rem) 0 1.1rem; + font-size: 0.64rem; + align-items: flex-start; } -/* Hover styling */ -.md-typeset .tabbed-labels > label:hover { - color: var(--plum); +/* Edit this page button styling */ +a.md-content__button.md-icon { + display: flex; + gap: 5px; + padding: 0; + align-items: center; + margin-left: 0; } -.md-typeset .tabbed-labels > label a:hover { - opacity: 1; +.actions-container .md-icon svg { + height: 1rem; + width: 1rem; } -/* Underline under active tabs */ -.js .md-typeset .tabbed-labels:before { - background: var(--plum); - height: 3px; +a.md-content__button.md-icon:hover { + color: var(--md-typeset-a-color); } -.md-typeset .tabbed-block p, -.md-typeset .tabbed-block ul, -.md-typeset .tabbed-block ol, -.md-typeset .tabbed-block p ~ div, -.md-typeset .tabbed-block details { - margin: 1em; +/* Feedback */ +.md-feedback { + margin: 0.2em 0; + text-align: left !important; } -.md-typeset .tabbed-block ul p, -.md-typeset .tabbed-block ol p { - margin: 0; +.md-feedback__title { + width: 100%; + min-width: 100%; + font-weight: 400; + margin: 0.5em auto; } -/* Document date styling */ -.md-source-file small { +.md-feedback__list { display: flex; - align-items: end; - justify-content: center; -} - -/* Separate label and date */ -.source-file-label { - margin-right: 0.5em; -} - -/* Separate created and updated dates */ -.source-file-seperator { - margin: 0 0.5em; -} - -/* Disclaimer styling */ -.disclaimer, -.page-disclaimer { - margin-top: auto; - margin-bottom: 1em; - font-size: x-small; - font-style: italic; -} - -.page-disclaimer { - margin-top: 3em; + gap: 1em; + justify-content: left; + background: var(--md-accent-fg-color--transparent); + border: var(--border); + border-radius: 2em; + width: fit-content; + padding: 0.2em 0.6em; } -/** Badge styling **/ -.md-typeset span.badge { - border-radius: var(--md-border-radius); - font-size: 0.8em; - padding: 0.4em 0.8em; - margin-right: 0.5em; +.md-feedback__note { + margin-top: 0.2em; } -.md-typeset span.badge.product { - background-color: var(--plum); - color: var(--dark); +:disabled .md-feedback__list { + min-height: unset; } -@media screen and (max-width: 30em) { - /* Stack dates in two lines */ - .md-source-file small { - display: block; - text-align: center; - margin-top: 1em; +@keyframes fadeInOut { + 0% { + opacity: 0; + visibility: hidden; } - - /* No need for separator */ - .source-file-seperator { - display: none; + 10% { + opacity: 1; + visibility: visible; } - - .disclaimer { - margin: 2em auto; + 90% { + opacity: 1; + visibility: visible; } - - .md-content__inner { - margin: 0 1.2rem 1.2rem; + 100% { + opacity: 0; + display: none; + visibility: hidden; } } -/* Tooltip styling */ -.md-tooltip { - border: var(--md-border-width) solid var(--light-transparent-12); +:disabled .md-feedback__note { + animation: fadeInOut 10s ease-in-out forwards; } -/* Feedback widget styling */ -.feedback-actions-container { - display: flex; - flex-direction: column; - align-items: center; - border: var(--md-border-width) solid var(--md-border-color); - border-radius: var(--md-border-radius); - background-color: var(--grey); - padding: 1.5em; - margin: 3em calc(100% - 11.5rem) 0 auto; - color: #9a9a9a; - font-size: var(--body-xs-text-size); -} - -.feedback__section { - width: 100%; +.md-feedback__note a { + color: var(--md-typeset-a-color); } -.md-feedback { - margin-top: 0; - margin-bottom: 0.75em; +.md-feedback__note a:hover { + background-color: var(--md-accent-fg-color--active); } -.md-feedback__title { - margin: 0; - font-weight: 400; - text-wrap-mode: nowrap; +/* Grid cards */ +.md-typeset .grid.cards > ol > li, +.md-typeset .grid.cards > ul > li, +.md-typeset .grid > .card, +.md-typeset hr { + border-color: var(--border-color); } -.md-feedback__list { - gap: 1.5em; - margin-top: 0.75em; - margin-bottom: 0.75em; +.md-typeset .grid.cards .twemoji.lg { + --md-icon-size: 1.2em; } -.md-feedback__icon:hover svg { - fill: var(--md-typeset-a-color--hover); +/* Mermaid diagram styling */ +div.mermaid { + display: flex !important; + justify-content: center !important; } -/* Divider Styling */ -.divider { - height: 1px; - background-color: var(--light-transparent-20); - margin: 0.75em auto 0; +/* Footer */ +.md-footer { + border-top: var(--border); + border-bottom: var(--border); } -/* Edit this page button Styling */ -a.md-content__button.md-icon { +.md-footer-meta__inner, +.md-footer-meta__inner.md-grid { display: flex; - gap: 10px; - padding: 0; - align-items: center; -} - -.feedback-actions-container - .feedback-section - ~ .edit-section - a.md-content__button.md-icon { - margin: 0.75em auto 0; -} - -.feedback-actions-container - .feedback-section:has(.md-feedback[hidden]) - ~ .edit-section - a.md-content__button.md-icon { - margin: auto; -} - -.feedback-actions-container .md-icon svg { - height: 1.2rem; - width: 1.2rem; -} - -/* Footer Prev and Next Styling */ -.md-footer__link { - align-items: center; + align-items: end; + padding: 1.5rem 5.75em; + color: var(--md-default-fg-color); + font-weight: 700; + text-transform: var(--label-text-style); + gap: 3em; + font-size: 0.7em; } -.md-footer__title { - display: flex; - flex-direction: column; - font-size: var(--body-s-text-size); - margin-bottom: 0; +.md-footer-meta__inner.md-grid > * { + min-width: calc(33% - 3em); } -.md-footer__direction { - text-transform: var(--label-text-style); - font-size: var(--label-size); - font-family: var(--md-nav-labels-font); +.md-footer-meta__inner.md-grid > *:nth-child(2) { + justify-items: center; } -.md-footer-meta__inner, -.md-footer-meta__inner.md-grid { - display: flex; - align-items: start; - padding: 1.5rem 1em; - border-top: var(--md-border-width) solid var(--md-border-color); - border-bottom: var(--md-border-width) solid var(--md-border-color); - font-size: var(--label-size); - font-family: var(--md-nav-labels-font); - letter-spacing: 1.44px; - line-height: 1.25rem; - font-weight: 700; - text-transform: var(--label-text-style); - gap: 3em; +.md-footer-meta__inner.md-grid > *:last-child { + justify-content: end; } .md-footer__button svg { @@ -1206,25 +1052,32 @@ a.md-content__button.md-icon { gap: 0.75em; flex-wrap: wrap; padding: 0.5em 0 0; - font-size: var(--body-text-size); + margin: 0; } .md-social a { - background: hsl(0 0% 7.1%); - border: var(--md-border-width) solid var(--md-border-color); + background: var(--md-default-bg-color); + border: var(--border); border-radius: 100%; - width: 3em; - height: 3em; + width: 4em; + height: 4em; box-sizing: border-box; display: flex; align-items: center; justify-content: center; } +.md-social a:hover { + background: var(--md-default-fg-color--lightest); +} + .md-social__link svg { - width: 1.5em; - height: 1.5em; - fill: var(--md-default-fg-color); + width: auto; + max-height: 1.5em; +} + +.md-social__link svg path { + fill: var(--md-default-fg-color) !important; } /* Newsletter styling */ @@ -1242,8 +1095,6 @@ a.md-content__button.md-icon { } .hs-email > label { - letter-spacing: 1.44px; - line-height: 1.25rem; font-weight: 700; } @@ -1253,32 +1104,34 @@ a.md-content__button.md-icon { .hs-email .hs-form-required { display: none; -} +} .hs-input { - border: var(--md-border-width) solid var(--md-border-color); - border-radius: var(--md-border-radius); + border: var(--border); + border-radius: var(--border-radius); padding: 1em !important; background-color: var(--md-default-bg-color); } +.hs-custom-style .hs-input:focus, +.hs-custom-style .hs-input:hover, +.hs-custom-style .hs-input:active { + background-color: var(--md-default-fg-color--lightest); +} + .hs-submit .actions .hs-button { - color: var(--plum); - font-family: var(--md-cta-font); - text-transform: var(--label-text-style); - font-size: var(--caption-size); vertical-align: middle; cursor: pointer; background-color: var(--md-default-bg-color); padding: 1em 1.5em; margin: 1em 0 0; - border: var(--md-border-width) solid var(--plum); - border-radius: var(--md-border-radius); + border: var(--border); + border-radius: var(--border-radius); height: 44.66px; } .hs-submit .actions .hs-button:hover { - opacity: var(--md-hover-opacity); + background-color: var(--md-default-fg-color--lightest); } .hs_error_rollup .no-list.hs-error-msgs.inputs-list { @@ -1286,8 +1139,9 @@ a.md-content__button.md-icon { } .no-list.hs-error-msgs.inputs-list { - background-color: var(--grey); - border-radius: var(--md-border-radius); + background-color: var(--border-color); + border-radius: var(--border-radius); + margin-left: 0; } .hs-error-msgs { @@ -1317,33 +1171,34 @@ a.md-content__button.md-icon { } } -.submitted-message { - text-transform: var(--label-text-style); - font-size: var(--label-size); -} - html .md-footer-meta.md-typeset .llms button.md-clipboard--inline { display: flex; align-items: center; gap: 1em; - padding: 1em 1.5em; + color: var(--md-default-fg-color); + background-color: var(--md-default-bg-color); + font-weight: 400; + font-size: 1.1em; + margin-top: 0.4em; +} + +html .md-footer-meta.md-typeset .llms button.md-clipboard--inline:hover { + background-color: var(--md-default-fg-color--lightest); } -.llms svg { - height: auto; - width: 1.2rem; - fill: var(--dark); +/* Bottom of footer styling (i.e. copyright, terms of use, etc.) */ +.copyright-wrapper { + width: 100vw; + border-top: var(--border); } -/* Bottom of footer styling (i.e. copyright, terms of use, etc. */ .md-footer-copyright { display: flex; justify-content: space-between; - font-size: var(--body-xs-text-size); + font-size: 1.1em; font-family: var(--md-text-font-family); height: 48px; align-items: center; - padding: 0 1em; flex-wrap: wrap; } @@ -1356,7 +1211,7 @@ html .md-footer-meta.md-typeset .llms button.md-clipboard--inline { } .md-footer-copyright__highlight { - color: var(--light-transparent-40); + color: var(--md-primary-bg-color--light); } .policy-links { @@ -1366,11 +1221,30 @@ html .md-footer-meta.md-typeset .llms button.md-clipboard--inline { } html .md-footer-meta.md-typeset .md-footer-copyright a { - color: var(--light); + color: var(--md-primary-bg-color--light); } /* Footer styling on small screens */ -@media screen and (max-width: 1060px) { +@media screen and (max-width: 76.2344em) { + .md-footer-meta__inner, + .md-footer-meta__inner.md-grid { + padding: 1.5rem 2em; + margin-left: 0.8rem; + margin-right: 0.8rem; + } +} + +@media screen and (max-width: 1200px) { + .md-footer-meta__inner.md-grid > *:nth-child(2) { + justify-items: end; + } +} + +@media screen and (max-width: 1060px) { + .md-footer-copyright { + margin: 1em auto; + } + .md-footer-copyright > * { flex: 1 1 100%; margin: auto; @@ -1382,574 +1256,62 @@ html .md-footer-meta.md-typeset .md-footer-copyright a { } } -@media screen and (max-width: 51.5em) { +@media screen and (max-width: 642px) { + .md-footer .column { + align-items: center; + } + + .md-footer-meta__inner.md-grid > * { + width: 100%; + } + .md-footer-meta__inner, .md-footer-meta__inner.md-grid { - justify-content: center; + gap: 1.5em; + margin: 0; } - .md-footer .column { - align-items: center; + .md-footer-meta__inner.md-grid > *:nth-child(2) { + justify-items: start; + } + + .md-footer-meta__inner.md-grid > *:last-child { + justify-content: start; } } @media screen and (max-width: 30em) { .hs-form { flex-direction: column; - align-items: center; + align-items: start; } - .md-social { - gap: .5em; + .hs-submit .actions .hs-button { + margin-top: 0; } } -/* 404 page */ -.not-found { - display: flex; - justify-content: center; -} - -/* Reference page styling */ -.api-referece { - width: 90%; -} +@media screen and (max-width: 400px) { + .md-social a { + width: 2.3em; + height: 2.3em; + } -/* Grid styling */ -.grid > div:last-child { - max-height: 1000px; - overflow: auto; + .md-socal { + gap: 0.5em; + } } -.md-typeset .grid { - grid-gap: 1rem; +/* Cookie consent */ +.md-consent__inner { + z-index: 206; } -.md-typeset .grid > div:first-child > p:first-child { - margin-top: 0; +/* Images */ +@media screen and (min-width: 45em) { + .md-typeset img.half { + width: 50%; + display: flex; + justify-self: center; + } } - -.grid .highlight span.filename { - margin-top: 0; -} - -.md-typeset .grid.cards > ol > li, -.md-typeset .grid.cards > ul > li, -.md-typeset .grid > .card { - background-color: var(--grey); - border: var(--md-border-width) solid var(--md-border-color); - display: flex; - flex-direction: column; -} - -.md-typeset .grid.cards > ol > li:focus-within, -.md-typeset .grid.cards > ol > li:hover, -.md-typeset .grid.cards > ul > li:focus-within, -.md-typeset .grid.cards > ul > li:hover, -.md-typeset .grid > .card:focus-within, -.md-typeset .grid > .card:hover { - border: var(--md-border-width) solid var(--md-border-color); -} - -.md-typeset .grid.cards > ol > li > :last-child, -.md-typeset .grid.cards > ul > li > :last-child, -.md-typeset .grid > .card > :last-child { - margin-top: auto; -} - -.md-typeset .grid.cards > ol > li > p:first-child, -.md-typeset .grid.cards > ul > li > p:first-child { - font-family: var(--md-header-font); - line-height: var(--header-line-height); - font-weight: var(--header-font-weight); - font-size: 24px; - display: flex; - margin-bottom: 0; -} - -.md-typeset .grid.half { - grid-template-columns: repeat(auto-fit, minmax(50%, 0fr)); - margin: 1em 1.4em 1em 0; -} - -.md-typeset .grid.cards > ol > li > p:last-child a, -.md-typeset .grid.cards > ul > li > p:last-child a { - text-decoration: none; - font-family: var(--md-cta-font); - text-transform: var(--label-text-style); - font-size: 10px; - line-height: 12px; - display: flex; - gap: 0.5em; - margin-top: 1.5em; -} - -/* For icons in the title */ -.md-typeset .grid.cards p .lg.twemoji { - --md-icon-size: unset; -} - -.md-typeset .grid.cards p .twemoji svg { - margin-right: 0.5em; - fill: var(--plum); - height: 24px; - max-width: 24px; -} - -/* For icons in the footer/CTA */ -.md-typeset .grid.cards p > a .twemoji { - width: 24px; -} - -.md-typeset .grid.cards p > a .twemoji svg { - width: 100%; -} - -/* Type styling */ -.md-typeset kbd { - border-radius: 1em; - vertical-align: baseline; - box-shadow: none; -} - -/* For links to definitions on reference pages */ -.md-typeset .twemoji { - vertical-align: middle; -} - -/* Button styling */ -.md-header__option .md-header__button:not([hidden]), -.md-typeset.md-button, -.md-typeset .md-button { - border: var(--md-border-width) solid var(--plum); - border-radius: var(--md-border-radius); - background: var(--plum); - color: var(--md-default-bg-color); - font-family: var(--md-cta-font); - text-transform: var(--label-text-style); - font-size: var(--caption-size); - letter-spacing: 0.04em; - padding: 1.6em 2.35em; -} - -.md-typeset .md-button:focus, -.md-typeset .md-button:hover { - color: var(--md-default-bg-color); -} - -.md-typeset .md-button.secondary { - background: transparent; - border-color: var(--plum); - color: var(--plum); -} - -.md-typeset .md-button.secondary:hover { - color: var(--plum); -} - -/* Header buttons */ -.md-header__buttons { - display: flex; - margin-left: auto; -} - -.md-header__buttons > * { - align-self: center; -} - -.md-header__inner.md-grid .md-tabs__link { - font-size: var(--body-s-text-size); - margin-top: 0; - opacity: unset; -} - -label[for='__drawer'] svg { - height: 40px; - width: 40px; -} - -.md-header__buttons .cookbook-container, -.md-header__buttons .search { - margin-left: 1em; -} - -/* Dropdown menu styling */ -.md-tabs__list { - display: flex; - contain: none; -} - -.md-tabs__item--custom { - padding: 1em 1.25em; - display: inline-block; - min-height: 5.5em; - align-content: space-around; - transition: border 0.3s ease; - letter-spacing: 0.12em; - font-weight: 700; -} - -.md-tab__list { - display: none; - position: absolute; - background: var(--grey); - border: var(--md-border-width) solid var(--md-border-color); - border-radius: var(--md-border-radius); - z-index: 3; - list-style: none; - padding: 0; - margin: 1.5em -1em; - transform: translateZ(0); - will-change: transform; -} - -.md-tabs__item--custom:hover .md-tab__list, -.md-tab__list:hover { - display: block; -} - -.md-tabs__item--custom:hover { - cursor: pointer; -} - -.md-tabs__item--custom:hover > .md-tabs__link { - opacity: var(--md-hover-opacity); -} - -.md-tab__item { - font-size: var(--body-s-text-size); - padding: 1.25em 1.25em 0.5em; -} - -.md-tab__item:last-child { - padding-bottom: 1.25em; -} - -.md-tab__item:hover, -.md-tab__item:active { - opacity: var(--md-hover-opacity); -} - -.md-tab__item:hover:first-child, -.md-tab__item:active:first-child { - border-top-left-radius: 0.2em; - border-top-right-radius: 0.2em; -} - -.md-tab__item:hover:last-child, -.md-tab__item:active:last-child { - border-bottom-left-radius: 0.2em; - border-bottom-right-radius: 0.2em; -} - - -.md-tabs__link a { - display: flex; -} - -.md-tabs__link svg { - margin-left: 0.5rem; -} - -.md-tab__item a { - display: flex; -} - -.dropdown-icon { - width: 2em; - height: 2em; -} - -.text-col { - margin-left: 1.5em; - align-content: center; -} - -.icon-col { - display: flex; - align-items: center; -} - -@media screen and (max-width: 76.234375em) { - .md-tabs { - display: none; - } - - .md-nav--primary .md-nav__title { - padding: 3rem 0.8rem 0.2rem; - } - - .md-nav--primary .md-nav__list { - margin-bottom: 0; - } -} - -/* Search styling */ -.md-search__form { - display: flex; -} - -.md-search__options, -.md-search__icon[for='__search'] { - top: 0.5rem; -} - -label[for='__search'] span:first-child { - border: var(--md-border-width) solid var(--plum); - border-radius: var(--md-border-radius); - font-family: var(--md-cta-font); - color: var(--plum); - display: flex; - padding: 0.8em 1.5em; - align-items: center; - gap: 0.5em; - font-size: var(--caption-size); -} - -label[for='__search'] span:first-child:hover { - opacity: var(--md-hover-opacity); -} - -label[for='__search'] svg { - fill: var(--plum); - width: 1.2rem; - height: auto; -} - -label[for='__search']:hover { - cursor: pointer; -} - -.md-search { - visibility: hidden; - width: 0; -} - -.md-search__input { - font-size: var(--body-s-text-size); -} - -.md-search-result__item { - font-family: var(--md-text-font-family); -} - -.md-search-result__icon { - color: var(--plum); -} - -.md-search-result__meta { - background-color: var(--md-default-bg-color); - color: var(--md-default-fg-color); -} - -.md-search-result .md-typeset { - color: var(--light-transparent-60); - text-transform: none; -} - -.md-search-result .md-typeset h1 { - font-size: 24px; -} - -.md-search-result__link:focus, -.md-search-result__link:hover { - background-color: var(--light-transparent-10); -} - -[data-md-toggle='search']:checked ~ .md-header .md-search { - visibility: visible; - width: unset; - height: auto; - padding-right: 0.3em; - position: absolute; - right: 20px; - z-index: 100; - background: var(--md-default-bg-color); -} - -@media screen and (min-width: 60em) { - [data-md-toggle='search']:checked ~ .md-header .md-search__form { - border: var(--md-border-width) solid var(--plum); - border-radius: var(--md-border-radius); - background-color: transparent; - } - - [data-md-toggle='search']:checked ~ .md-header .md-search__output { - margin-top: 1.5em; - border-radius: var(--md-border-radius); - border: var(--md-border-width) solid var(--plum); - } - - [data-md-toggle='search']:checked - ~ .md-header - .md-search__input:valid - ~ .md-search__options - > .md-icon, - [data-md-toggle='search']:checked ~ .md-header .md-search__input, - [data-md-toggle='search']:checked - ~ .md-header - .md-search__input - + .md-search__icon { - margin-left: 1em; - } - - .md-search__form { - height: 2.3rem; - } -} - -@media screen and (min-width: 60em) and (max-width: 76.1875em) { - [data-md-toggle='search']:checked ~ .md-header .md-search__inner, - .md-search__scrollwrap { - width: 34.4rem; - } -} - -@media screen and (max-width: 30em) { - label.search span.search-text { - display: none; - } -} - -/* Code styling on smaller screens */ -@media screen and (max-width: 44.984375em) { - .md-content__inner > .highlight { - margin: 1em auto; - } - - .md-content__inner > .highlight > pre > code { - word-break: break-word; - } -} - -/** Cookbook styling **/ -.cookbook-container { - /* Specifically needed for Safari */ - width: max-content; -} - - -::part(ask-cookbook-button) { - padding: 11px 1.5em; - border-radius: var(--md-border-radius); - gap: .5em; -} - -::part(ask-cookbook-button):hover { - opacity: var(--md-hover-opacity); -} - -/* Cookie consent styling */ -.md-consent__inner { - box-shadow: 0 0 0.2rem #ffffff1a, 0 0.2rem 0.4rem #fff3; -} - -/* Interface admonition styling */ -details.interface > summary::before { - display: none; -} - -.md-typeset details.interface { - border: 1px solid var(--light-transparent-20); - box-shadow: none; - width: auto; -} - -[dir='ltr'] .md-typeset details.interface > summary { - padding: 1em 0 1em 1em; - background-color: var(--light-transparent-07); -} - -.md-typeset details.interface > summary:after { - top: auto; -} - -/* Child admonition styling */ -details.child summary::before { - display: none; -} - -details.child { - width: fit-content; -} - -[dir='ltr'] .md-typeset details.child summary { - width: fit-content; - padding-left: 1em; -} - -[dir='ltr'] .md-typeset details.child[open] { - width: auto; -} - -.md-typeset details.child summary { - background-color: unset; -} - -.md-typeset details.child { - width: fit-content; - border: 1px solid var(--light-transparent-20); - box-shadow: none; -} - -/** Use Case Cards */ -.use-case-card { - display: flex; - flex-direction: column; - background-color: var(--grey); - border: var(--md-border-width) solid var(--md-border-color); - border-radius: var(--md-border-radius); - margin: 2em 0; - gap: .25em; - padding-bottom: .25em; -} - -.use-case-card .title { - display: flex; - flex-direction: column; - gap: .25em; - background-color: #2E2E2E; - border-radius: var(--md-border-radius); - padding: 24px; -} - -.use-case-card h2 { - font-size: 24px; - margin: 0; -} - -.use-case-card .title p { - padding: 0; - margin: 0; -} - -.use-case-card p, -.use-case-card ul, -.use-case-card ol { - padding-left: 24px; - padding-right: 24px; -} - -.md-typeset .use-case-card hr { - margin: 0; - border-color: #343434; -} - -.use-case-card li::marker { - color: var(--plum); -} - -/** External Link Styling **/ -.md-nav__link .external-link svg { - height: 1em; -} - -.md-nav__list .md-nav__link { - gap: .5em; -} - -/** LLMs table styling **/ -.md-typeset table:not([class]) td:has(a.llms) { - display: flex; - gap: 1em; -} \ No newline at end of file diff --git a/material-overrides/home.html b/material-overrides/home.html index fc3cdd761..5e507ca54 100644 --- a/material-overrides/home.html +++ b/material-overrides/home.html @@ -12,86 +12,79 @@ {% block content %}
-
-

Build Multichain

-

Access all the information you need to develop secure multichain applications powered by Wormhole. -

- -
- +

Wormhole Documentation

+

Access all the information and resources you need to develop secure multichain applications powered by Wormhole.

+
-
-

How can you integrate Wormhole into your projects?

-
- -

Settlement

-

Intent-based protocol for fast multichain transfers with optimized liquidity.

+
-
- Explore Products -
-

Not sure which product to choose?

- -
-
-
- {% endblock %} diff --git a/material-overrides/main-index-page.html b/material-overrides/main-index-page.html deleted file mode 100644 index 6b90e1ab1..000000000 --- a/material-overrides/main-index-page.html +++ /dev/null @@ -1,62 +0,0 @@ -{% extends "main.html" %} - -{% block styles %} - {{ super() }} - -{% endblock %} - -{% block content %} -
- {% if nav|length>1 %} - {% for nav_item in nav %} - {% if nav_item.is_section and nav_item.active %} -

{{ nav_item.title }}

-
- {% for nav_item in nav_item.children %} - {% if nav_item.is_section %} - {% set subsection_path = nav_item.children[0].url %} - {% set description = nav_item.children[0].meta.description %} - {% if subsection_path.startswith(page.url) %} - {% set href_path = subsection_path|replace(page.url, '') %} - - {% endif %} - {% endif %} - {% endfor %} -
- {% endif %} - {% endfor %} - {% endif %} - -{% endblock %} - -{% block site_nav %} - {% if nav %} - {% if page.meta and page.meta.hide %} - {% set hidden = "hidden" if "navigation" in page.meta.hide %} - {% endif %} - - {% endif %} - {% if "toc.integrate" not in features %} - {% if page.meta and page.meta.hide %} - {% set hidden = "hidden" if "toc" in page.meta.hide %} - {% endif %} - - {% endif %} -{% endblock %} \ No newline at end of file diff --git a/material-overrides/main.html b/material-overrides/main.html index 31d2113bf..06c662b5b 100644 --- a/material-overrides/main.html +++ b/material-overrides/main.html @@ -36,6 +36,100 @@ {%- endblock -%} {% block libs %} + + {{ super() }} @@ -103,23 +197,26 @@ {{ hidden }} >
+
+ +
+ {#- Edit this Page Section -#} +
+ {% include "partials/actions.html" %} +
+ {#- Feedback Section -#} + +
+
+
{#- TOC -#} {% include "partials/toc.html" %}
- - {#- Feedback and Edit this page container -#} -
{% endif %} @@ -143,18 +240,17 @@ document.addEventListener('DOMContentLoaded', () => { function setTableHeaderOffset(navbarSelector, tableSelector) { const navbar = document.querySelector(navbarSelector); - const navbarHeight = navbar ? navbar.offsetHeight : 0; + const navbarHeight = navbar ? navbar.offsetHeight - 1 : 0; // Loop through each table document.querySelectorAll(tableSelector).forEach((tableWrapper) => { const thead = tableWrapper.querySelector('thead'); - const tbody = tableWrapper.querySelector('tbody'); const table = tableWrapper.querySelector('table'); // This blocking div is used to prevent the left and right borders from // sticking out of the top of the table const blockingDiv = tableWrapper.querySelector('.header-blocker'); - thead.style.top = `${navbarHeight}px`; + thead.style.top = `${navbarHeight + 20}px`; if (blockingDiv) { // If the blocker div already exists, modify the styles blockingDiv.style.top = `${navbarHeight}px`; @@ -232,15 +328,3 @@ }); {% endblock %} - -{%- block container -%} -
- {% set class = "index-page" if not page.content and not page.is_homepage %} -
- {% block content %} - {% include "partials/content.html" %} - {% endblock %} -
-
-{%- endblock -%} - diff --git a/material-overrides/partials/content.html b/material-overrides/partials/content.html index a504fd001..53d383573 100644 --- a/material-overrides/partials/content.html +++ b/material-overrides/partials/content.html @@ -1,12 +1,41 @@ -{#- - This file was automatically generated - do not edit --#} -{% if "material/tags" in config.plugins and tags %} - {% include "partials/tags.html" %} -{% endif %} + + + +{% include "partials/tags.html" %} + + {% if "\x3ch1" not in page.content %} -

{{ page.title | d(config.site_name, true)}}

+

{{ page.title | d(config.site_name, true)}}

{% endif %} + + {{ page.content }} + + {% include "partials/source-file.html" %} + + {% include "partials/comments.html" %} \ No newline at end of file diff --git a/material-overrides/partials/feedback.html b/material-overrides/partials/feedback.html index 0e480390b..2537a87de 100644 --- a/material-overrides/partials/feedback.html +++ b/material-overrides/partials/feedback.html @@ -1,43 +1,84 @@ -{#- - This file was automatically generated - do not edit - -#} - {% if config.extra.analytics %} - {% set feedback = config.extra.analytics.feedback %} + + + +{% if config.extra.analytics %} + {% set feedback = config.extra.analytics.feedback %} +{% endif %} + + +{% if page.meta and page.meta.hide %} + {% if "feedback" in page.meta.hide %} + {% set feedback = None %} {% endif %} - {% if page.meta and page.meta.hide %} - {% if "feedback" in page.meta.hide %} - {% set feedback = None %} - {% endif %} - {% endif %} - {% if feedback %} - + +{% endif %} \ No newline at end of file diff --git a/material-overrides/partials/footer.html b/material-overrides/partials/footer.html index af7386b60..6a953a73a 100644 --- a/material-overrides/partials/footer.html +++ b/material-overrides/partials/footer.html @@ -3,69 +3,74 @@ -#} {% import "partials/language.html" as lang with context %}