diff --git a/docs/css/extra.css b/docs/css/extra.css
index 6ce7fc703..bf4db2a36 100644
--- a/docs/css/extra.css
+++ b/docs/css/extra.css
@@ -1,124 +1,128 @@
-@import url('https://fonts.googleapis.com/css?family=Rubik');
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6
-{
+h1, h2, h3, h4, h5, h6 {
font-family: 'Rubik', sans-serif;
}
-[data-md-color-scheme="testcontainers"]
-{
- --md-primary-fg-color: #291a3f;
- --md-accent-fg-color: #291a3f;
- --md-typeset-a-color: #0c94aa;
+[data-md-color-scheme="testcontainers"] {
+ --md-primary-fg-color: #00bac2;
+ --md-accent-fg-color: #361E5B;
+ --md-typeset-a-color: #0C94AA;
+ --md-primary-fg-color--dark: #291A3F;
+ --md-default-fg-color--lightest: #F2F4FE;
+ --md-footer-fg-color: #361E5B;
+ --md-footer-fg-color--light: #746C8F;
+ --md-footer-fg-color--lighter: #C3BEDE;
+ --md-footer-bg-color: #F7F9FD;
+ --md-footer-bg-color--dark: #F7F9FD;
+}
+
+.card-grid {
+ display: grid;
+ gap: 10px;
+}
+
+.tc-version {
+ font-size: 1.1em;
+ text-align: center;
+ margin: 0;
+}
+
+@media (min-width: 680px) {
+ .card-grid {
+ grid-template-columns: repeat(3, 1fr);
+ }
}
body .card-grid-item {
display: flex;
align-items: center;
gap: 20px;
- border: 1px solid #c3bede;
+ border: 1px solid #C3BEDE;
border-radius: 6px;
padding: 16px;
font-weight: 600;
- color: #9991b5;
- background: #f2f4fe;
+ color: #9991B5;
+ background: #F2F4FE;
}
body .card-grid-item:hover,
body .card-grid-item:focus {
- color: #9991b5;
-}
-
-.card-grid {
- display: grid;
- gap: 10px;
-}
-
-@media (min-width: 680px) {
- .card-grid {
- grid-template-columns: repeat(3, 1fr);
- }
+ color: #9991B5;
}
.card-grid-item[href] {
- color: var(--md-primary-fg-color);
+ color: var(--md-primary-fg-color--dark);
background: transparent;
}
.card-grid-item[href]:hover,
.card-grid-item[href]:focus {
- color: var(--md-primary-fg-color);
- background: #f2f4fe;
+ background: #F2F4FE;
+ color: var(--md-primary-fg-color--dark);
}
-@media (min-width: 1220px) {
- .community-callout-wrapper {
- padding: 40px 0 0;
- }
-
- @media (min-width: 1600px) {
- .community-callout h2 {
- font-size: 1.15em;
- }
- }
+.community-callout-wrapper {
+ padding: 30px 10px 0 10px;
}
.community-callout {
+ color: #F2F4FE;
background: linear-gradient(10.88deg, rgba(102, 56, 242, 0.4) 9.56%, #6638F2 100%), #291A3F;
- border-radius: 10px;
box-shadow: 0px 20px 45px rgba(#9991B5, 0.75);
- color: #F2F4FE;
+ border-radius: 10px;
padding: 20px;
}
-.community-callout a {
- transition: opacity 0.2s ease;
+.community-callout h2 {
+ font-size: 1.15em;
+ margin: 0 0 20px 0;
+ color: #F2F4FE;
+ text-align: center;
}
-.community-callout a img {
- height: 1.75em;
+.community-callout ul {
+ list-style: none;
+ padding: 0;
+ display: flex;
+ justify-content: space-between;
+ gap: 10px;
+ margin-top: 20px;
+ margin-bottom: 0;
}
-.community-callout a img {
- height: 2em;
+.community-callout a {
+ transition: opacity 0.2s ease;
+}
+
+.community-callout a:hover {
+ opacity: 0.5;
}
.community-callout a img {
- aspect-ratio: 1;
height: 1.75em;
width: auto;
+ aspect-ratio: 1;
}
-.community-callout a:hover {
- opacity: 0.5;
-}
+@media (min-width: 1220px) {
+ .community-callout-wrapper {
+ padding: 40px 0 0;
+ }
-.community-callout h2 {
- font-size: 1.25em;
-}
+ .community-callout h2 {
+ font-size: 1.25em;
+ }
-.community-callout h2 {
- color: #F2F4FE;
- font-size: 1.15em;
- margin: 0 0 20px 0;
- text-align: center;
+ .community-callout a img {
+ height: 2em;
+ }
}
-.community-callout ul {
- display: flex;
- gap: 10px;
- justify-content: space-between;
- list-style: none;
- margin-bottom: 0;
- margin-top: 20px;
- padding: 0;
-}
+@media (min-width: 1600px) {
+ .community-callout h2 {
+ font-size: 1.15em;
+ }
-.community-callout-wrapper {
- padding: 30px 10px 0 10px;
+ .community-callout a img {
+ height: 1.75em;
+ }
}
\ No newline at end of file
diff --git a/docs/css/tc-header.css b/docs/css/tc-header.css
new file mode 100644
index 000000000..122102bb4
--- /dev/null
+++ b/docs/css/tc-header.css
@@ -0,0 +1,375 @@
+
+:root {
+ --color-catskill: #F2F4FE;
+ --color-catskill-45: rgba(242, 244, 254, 0.45);
+ --color-mist: #E7EAFB;
+ --color-fog: #C3C7E6;
+ --color-smoke: #9991B5;
+ --color-smoke-75: rgba(153, 145, 181, 0.75);
+ --color-storm: #746C8F;
+ --color-topaz: #00BAC2;
+ --color-pacific: #17A6B2;
+ --color-teal: #027F9E;
+ --color-eggplant: #291A3F;
+ --color-plum: #361E5B;
+
+}
+
+#site-header {
+ color: var(--color-storm);
+ background: #fff;
+ font-family: 'Rubik', Arial, Helvetica, sans-serif;
+ font-size: 12px;
+ line-height: 1.5;
+ position: relative;
+ width: 100%;
+ z-index: 4;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 20px;
+ padding: 20px;
+}
+
+body.tc-header-active #site-header {
+ z-index: 5;
+}
+
+#site-header .brand {
+ display: flex;
+ justify-content: space-between;
+ gap: 20px;
+ width: 100%;
+}
+
+#site-header .logo {
+ display: flex;
+}
+
+#site-header .logo img,
+#site-header .logo svg {
+ height: 30px;
+ width: auto;
+ max-width: 100%;
+}
+
+#site-header #mobile-menu-toggle {
+ background: none;
+ border: none;
+ display: flex;
+ align-items: center;
+ gap: 10px;
+ cursor: pointer;
+ color: var(--color-eggplant);
+ padding: 0;
+ margin: 0;
+ font-weight: 500;
+}
+
+body.mobile-menu #site-header #mobile-menu-toggle {
+ color: var(--color-topaz);
+}
+
+#site-header ul {
+ list-style: none;
+ padding: 0;
+ margin: 0;
+}
+
+#site-header nav {
+ display: none;
+}
+
+#site-header .menu-item {
+ display: flex;
+}
+
+#site-header .menu-item button,
+#site-header .menu-item a {
+ min-height: 30px;
+ display: flex;
+ gap: 6px;
+ align-items: center;
+ border: none;
+ background: none;
+ cursor: pointer;
+ padding: 0;
+ font-weight: 500;
+ color: var(--color-eggplant);
+ text-decoration: none;
+ font-size: 14px;
+ transition: color 0.2s ease;
+ white-space: nowrap;
+}
+
+#site-header .menu-item button:hover,
+#site-header .menu-item a:hover {
+ color: var(--color-topaz);
+}
+
+#site-header .menu-item button .icon-external,
+#site-header .menu-item a .icon-externa {
+ margin-left: auto;
+ opacity: .3;
+ flex-shrink: 0;
+}
+
+#site-header .menu-item button .icon-caret,
+#site-header .menu-item a .icon-caret {
+ opacity: .3;
+ height: 8px;
+}
+
+#site-header .menu-item button .icon-slack,
+#site-header .menu-item a .icon-slack,
+#site-header .menu-item button .icon-github,
+#site-header .menu-item a .icon-github {
+ height: 18px;
+}
+
+#site-header .menu-item .menu-dropdown {
+ flex-direction: column;
+}
+
+body #site-header .menu-item .menu-dropdown {
+ display: none;
+}
+
+#site-header .menu-item.has-children.active .menu-dropdown {
+ display: flex;
+ z-index: 10;
+}
+
+#site-header .menu-dropdown-item + .menu-dropdown-item {
+ border-top: 1px solid var(--color-mist);
+}
+
+#site-header .menu-dropdown-item a {
+ display: flex;
+ gap: 10px;
+ align-items: center;
+ padding: 10px 20px;
+ font-weight: 500;
+ color: var(--color-eggplant);
+ text-decoration: none;
+ transition:
+ color 0.2s ease,
+ background 0.2s ease;
+}
+
+#site-header .menu-dropdown-item a .icon-external {
+ margin-left: auto;
+ color: var(--color-fog);
+ flex-shrink: 0;
+ opacity: 1;
+}
+
+#site-header .menu-dropdown-item a:hover {
+ background-color: var(--color-catskill-45);
+}
+
+#site-header .menu-dropdown-item a:hover .icon-external {
+ color: var(--color-topaz);
+}
+
+#site-header .menu-dropdown-item a img {
+ height: 24px;
+}
+
+.md-header {
+ background-color: var(--color-catskill);
+ color: var(--color-eggplant);
+}
+
+.md-header.md-header--shadow {
+ box-shadow: none;
+}
+
+.md-header__inner.md-grid {
+ max-width: 100%;
+ padding: 1.5px 20px;
+}
+
+[dir=ltr] .md-header__title {
+ margin: 0;
+}
+
+.md-header__topic:first-child {
+ font-size: 16px;
+ font-weight: 500;
+ font-family: 'Rubik', Arial, Helvetica, sans-serif;
+}
+
+.md-header__title.md-header__title--active .md-header__topic,
+.md-header__title[data-md-state=active] .md-header__topic {
+ opacity: 1;
+ pointer-events: all;
+ transform: translateX(0);
+ transition: none;
+ z-index: 0;
+}
+
+.md-header__topic a {
+ max-width: 100%;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ transition: color .2s ease;
+}
+
+.md-header__topic a:hover {
+ color: var(--color-topaz);
+}
+
+div.md-header__source {
+ width: auto;
+}
+
+div.md-source__repository {
+ max-width: 100%;
+}
+
+.md-main {
+ padding: 0 12px;
+}
+
+@media screen and (min-width: 60em) {
+ form.md-search__form {
+ background-color: #FBFBFF;
+ color: var(--color-storm);
+ }
+
+ form.md-search__form:hover {
+ background-color: #fff;
+ }
+
+ .md-search__input + .md-search__icon {
+ color: var(--color-plum);
+ }
+
+ .md-search__input::placeholder {
+ color: var(--color-smoke);
+ }
+}
+
+@media (min-width: 500px) {
+ #site-header {
+ font-size: 16px;
+ padding: 20px 40px;
+ }
+ #site-header .logo img,
+ #site-header .logo svg {
+ height: 48px;
+ }
+
+ #site-header .menu-item button .icon-caret,
+ #site-header .menu-item a .icon-caret {
+ height: 10px;
+ }
+
+ #site-header .menu-item button .icon-slack,
+ #site-header .menu-item a .icon-slack,
+ #site-header .menu-item button .icon-github,
+ #site-header .menu-item a .icon-github {
+ height: 24px;
+ }
+
+ .md-header__inner.md-grid {
+ padding: 5px 40px;
+ }
+
+ .md-main {
+ padding: 0 32px;
+ }
+}
+
+@media (min-width: 1024px) {
+ #site-header #mobile-menu-toggle {
+ display: none;
+ }
+
+ #site-header nav {
+ display: block;
+ }
+
+ #site-header .menu {
+ display: flex;
+ justify-content: center;
+ gap: 30px;
+ }
+
+ #site-header .menu-item {
+ align-items: center;
+ position: relative;
+ }
+
+ #site-header .menu-item button,
+ #site-header .menu-item a {
+ min-height: 48px;
+ gap: 8px;
+ font-size: 16px;
+ }
+
+ #site-header .menu-item .menu-dropdown {
+ position: absolute;
+ top: 100%;
+ right: -8px;
+ border: 1px solid var(--color-mist);
+ border-radius: 6px;
+ background: #fff;
+ box-shadow: 0px 30px 35px var(--color-smoke-75);
+ min-width: 200px;
+ }
+}
+
+
+@media (max-width: 1023px) {
+ #site-header {
+ flex-direction: column;
+ }
+
+ body.mobile-tc-header-active #site-header {
+ z-index: 5;
+ }
+
+ body.mobile-menu #site-header nav {
+ display: flex;
+ }
+
+ #site-header nav {
+ position: absolute;
+ top: calc(100% - 5px);
+ width: calc(100% - 80px);
+ flex-direction: column;
+ border: 1px solid var(--color-mist);
+ border-radius: 6px;
+ background: #fff;
+ box-shadow: 0px 30px 35px var(--color-smoke-75);
+ min-width: 200px;
+ }
+
+ #site-header .menu-item {
+ flex-direction: column;
+ }
+ #site-header .menu-item + .menu-item {
+ border-top: 1px solid var(--color-mist);
+ }
+
+ #site-header .menu-item button,
+ #site-header .menu-item a {
+ padding: 10px 20px;
+ }
+
+ #site-header .menu-item.has-children.active .menu-dropdown {
+ border-top: 1px solid var(--color-mist);
+ }
+
+ #site-header .menu-dropdown-item a {
+ padding: 10px 20px 10px 30px;
+ }
+}
+
+@media (max-width: 499px) {
+ #site-header nav {
+ width: calc(100% - 40px);
+ }
+}
\ No newline at end of file
diff --git a/docs/index.md b/docs/index.md
index 3d7a6bfac..593b526f6 100644
--- a/docs/index.md
+++ b/docs/index.md
@@ -1,6 +1,4 @@
-# Testcontainers
-
-![Testcontainers Banner](banner.png)
+# Welcome to Testcontainers for .NET!
```console title="Install the NuGet dependency"
dotnet add package Testcontainers
@@ -61,6 +59,7 @@ Debug.Assert(Guid.TryParse(guid, out _));
Haskell
+ Ruby
## About
diff --git a/docs/js/tc-header.js b/docs/js/tc-header.js
new file mode 100644
index 000000000..4186b6ca5
--- /dev/null
+++ b/docs/js/tc-header.js
@@ -0,0 +1,45 @@
+const mobileToggle = document.getElementById("mobile-menu-toggle");
+const mobileSubToggle = document.getElementById("mobile-submenu-toggle");
+function toggleMobileMenu() {
+ document.body.classList.toggle('mobile-menu');
+ document.body.classList.toggle("mobile-tc-header-active");
+}
+function toggleMobileSubmenu() {
+ document.body.classList.toggle('mobile-submenu');
+}
+if (mobileToggle)
+ mobileToggle.addEventListener("click", toggleMobileMenu);
+if (mobileSubToggle)
+ mobileSubToggle.addEventListener("click", toggleMobileSubmenu);
+
+const allParentMenuItems = document.querySelectorAll("#site-header .menu-item.has-children");
+function clearActiveMenuItem() {
+ document.body.classList.remove("tc-header-active");
+ allParentMenuItems.forEach((item) => {
+ item.classList.remove("active");
+ });
+}
+function setActiveMenuItem(e) {
+ clearActiveMenuItem();
+ e.currentTarget.closest(".menu-item").classList.add("active");
+ document.body.classList.add("tc-header-active");
+}
+allParentMenuItems.forEach((item) => {
+ const trigger = item.querySelector(":scope > a, :scope > button");
+
+ trigger.addEventListener("click", (e) => {
+ if (e.currentTarget.closest(".menu-item").classList.contains("active")) {
+ clearActiveMenuItem();
+ } else {
+ setActiveMenuItem(e);
+ }
+ });
+
+ trigger.addEventListener("mouseenter", (e) => {
+ setActiveMenuItem(e);
+ });
+
+ item.addEventListener("mouseleave", (e) => {
+ clearActiveMenuItem();
+ });
+});
\ No newline at end of file
diff --git a/docs/language-logos/ruby.svg b/docs/language-logos/ruby.svg
new file mode 100644
index 000000000..05537cedf
--- /dev/null
+++ b/docs/language-logos/ruby.svg
@@ -0,0 +1,125 @@
+
diff --git a/docs/testcontainers-logo.svg b/docs/testcontainers-logo.svg
new file mode 100644
index 000000000..4b099f34a
--- /dev/null
+++ b/docs/testcontainers-logo.svg
@@ -0,0 +1,22 @@
+
+
\ No newline at end of file
diff --git a/docs/theme/main.html b/docs/theme/main.html
index f96a2669e..b3c01a3a2 100644
--- a/docs/theme/main.html
+++ b/docs/theme/main.html
@@ -2,4 +2,9 @@
{% block analytics %}
+{% endblock %}
+
+{% block extrahead %}
+
+
{% endblock %}
\ No newline at end of file
diff --git a/docs/theme/partials/header.html b/docs/theme/partials/header.html
new file mode 100644
index 000000000..057ec4ae5
--- /dev/null
+++ b/docs/theme/partials/header.html
@@ -0,0 +1,150 @@
+
+
+
+{% set class = "md-header" %}
+{% if "navigation.tabs.sticky" in features %}
+ {% set class = class ~ " md-header--shadow md-header--lifted" %}
+{% elif "navigation.tabs" not in features %}
+ {% set class = class ~ " md-header--shadow" %}
+{% endif %}
+
+{% include "partials/tc-header.html" %}
+
+
+
+
+
+
+ {% if "navigation.tabs.sticky" in features %}
+ {% if "navigation.tabs" in features %}
+ {% include "partials/tabs.html" %}
+ {% endif %}
+ {% endif %}
+
\ No newline at end of file
diff --git a/docs/theme/partials/nav.html b/docs/theme/partials/nav.html
index 6098055d1..87a254e30 100644
--- a/docs/theme/partials/nav.html
+++ b/docs/theme/partials/nav.html
@@ -31,11 +31,7 @@
diff --git a/docs/theme/partials/tc-header.html b/docs/theme/partials/tc-header.html
new file mode 100644
index 000000000..73500c640
--- /dev/null
+++ b/docs/theme/partials/tc-header.html
@@ -0,0 +1,157 @@
+{% set header = ({
+ "siteUrl": "https://testcontainers.com/",
+ "menuItems": [
+ {
+ "label": "Desktop",
+ "url": "https://testcontainers.com/desktop/"
+ },
+ {
+ "label": "Cloud",
+ "url": "https://testcontainers.com/cloud/"
+ },
+ {
+ "label": "Getting Started",
+ "url": "https://testcontainers.com/getting-started/"
+ },
+ {
+ "label": "Guides",
+ "url": "https://testcontainers.com/guides/"
+ },
+ {
+ "label": "Modules",
+ "url": "https://testcontainers.com/modules/"
+ },
+ {
+ "label": "Docs",
+ "children": [
+ {
+ "label": "Testcontainers for Java",
+ "url": "https://java.testcontainers.org/",
+ "image": "/language-logos/java.svg",
+ },
+ {
+ "label": "Testcontainers for Go",
+ "url": "https://golang.testcontainers.org/",
+ "image": "/language-logos/go.svg",
+ },
+ {
+ "label": "Testcontainers for .NET",
+ "url": "https://dotnet.testcontainers.org/",
+ "image": "/language-logos/dotnet.svg",
+ },
+ {
+ "label": "Testcontainers for Node.js",
+ "url": "https://node.testcontainers.org/",
+ "image": "/language-logos/nodejs.svg",
+ },
+ {
+ "label": "Testcontainers for Python",
+ "url": "https://testcontainers-python.readthedocs.io/en/latest/",
+ "image": "/language-logos/python.svg",
+ "external": true,
+ },
+ {
+ "label": "Testcontainers for Rust",
+ "url": "https://docs.rs/testcontainers/latest/testcontainers/",
+ "image": "/language-logos/rust.svg",
+ "external": true,
+ },
+ {
+ "label": "Testcontainers for Haskell",
+ "url": "https://github.com/testcontainers/testcontainers-hs",
+ "image": "/language-logos/haskell.svg",
+ "external": true,
+ },
+ {
+ "label": "Testcontainers for Ruby",
+ "url": "https://github.com/testcontainers/testcontainers-ruby",
+ "image": "/language-logos/ruby.svg",
+ "external": true,
+ },
+ ]
+ },
+ {
+ "label": "Slack",
+ "url": "https://slack.testcontainers.org/",
+ "icon": "icon-slack",
+ },
+ {
+ "label": "GitHub",
+ "url": "https://github.com/testcontainers",
+ "icon": "icon-github",
+ },
+ ]
+}) %}
+
+
\ No newline at end of file
diff --git a/mkdocs.yml b/mkdocs.yml
index d0d2397d8..78f930aa6 100644
--- a/mkdocs.yml
+++ b/mkdocs.yml
@@ -15,6 +15,7 @@ theme:
logo: logo.svg
extra_css:
- css/extra.css
+ - css/tc-header.css
plugins:
- codeinclude
- markdownextradata