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 %}