diff --git a/_resource/overrides/main.html b/_resource/overrides/main.html
index 9c460e04b..0e26dca6f 100644
--- a/_resource/overrides/main.html
+++ b/_resource/overrides/main.html
@@ -6,12 +6,6 @@
{# Import the theme's layout. #}
{% extends "base.html" %}
-
-{% block scripts %}
-
-{{ super() }}
-{% endblock %}
-
{% block extrahead %}
{{ super() }}
{% set title = config.site_name %}
diff --git a/_resourcepdf/overrides/main.html b/_resourcepdf/overrides/main.html
index fbe74877b..baea178da 100644
--- a/_resourcepdf/overrides/main.html
+++ b/_resourcepdf/overrides/main.html
@@ -7,8 +7,8 @@
{% extends "base.html" %}
{% block scripts %}
-
{{ super() }}
+
{% endblock %}
{% block extrahead %}
diff --git a/docs/_static/percona-logomark-one-color-dark.png b/docs/_static/percona-logomark-one-color-dark.png
new file mode 100644
index 000000000..28fbf02e9
Binary files /dev/null and b/docs/_static/percona-logomark-one-color-dark.png differ
diff --git a/docs/css/kapa.css b/docs/css/kapa.css
new file mode 100644
index 000000000..c7875bff9
--- /dev/null
+++ b/docs/css/kapa.css
@@ -0,0 +1,64 @@
+button#ask-percona-ai {
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+
+ gap: 0.45rem;
+
+ /* Match MkDocs Material search field */
+ height: 1.8rem;
+ padding: 0 0.9rem;
+ margin-left: 0.5rem;
+
+ border: none;
+ border-radius: 0.1rem;
+
+ background: #05469F;
+ color: #B8C8E2;
+
+ box-shadow: var(--md-shadow-z1);
+
+ cursor: pointer;
+
+ font-family: inherit;
+ font-size: 0.8rem;
+ font-weight: 400;
+ line-height: 1;
+
+ white-space: nowrap;
+
+ transition:
+ background-color 0.25s ease,
+ box-shadow 0.25s ease;
+}
+
+button#ask-percona-ai:hover {
+ background: #2E73DC;
+}
+
+button#ask-percona-ai:focus-visible {
+ outline: none;
+ box-shadow:
+ 0 0 0 0.1rem rgba(46, 115, 220, 0.35),
+ var(--md-shadow-z2);
+}
+
+button#ask-percona-ai .percona-star,
+button#ask-percona-ai .percona-text {
+ color: inherit;
+}
+
+button#ask-percona-ai .percona-star {
+ font-size: 0.85rem;
+ line-height: 1;
+}
+
+@media screen and (max-width: 768px) {
+ button#ask-percona-ai {
+ padding: 0 0.75rem;
+ }
+
+ button#ask-percona-ai .percona-text {
+ display: none;
+ }
+}
\ No newline at end of file
diff --git a/docs/css/landing.css b/docs/css/landing.css
deleted file mode 100644
index df69386e8..000000000
--- a/docs/css/landing.css
+++ /dev/null
@@ -1,301 +0,0 @@
-
-/* Type */
-
-.landing h1,
-.landing h2 {
- font-size: calc(1.5em + 1vw);
- line-height: 1.125;
- text-transform: uppercase;
- letter-spacing: 0;
- margin: 0.5em 0;
-}
-
-/* Layout adjustments */
-
-.md-header, .md-tabs {
- background-color: var(--stone800);
-}
-.landing > :not(:last-child) {
- margin-bottom: 2em;
-}
-/* .md-content__inner {
- display: flex;
- flex-direction: column;
-}
-.md-content__inner > :not(.landing) {
- width: 100%;
- max-width: calc(34.3rem);
- max-width: calc(34.3rem + 1.2rem + 12.1rem);
- align-self: center;
-} */
-[data-grid] [data-banner] {
- flex: 0 1 calc(50% - 1rem);
-}
-
-/* Splash Box */
-
-.splash {
- display: flex;
- position: relative;
- justify-content: space-between;
- line-height: 1.25;
- padding: calc(0.5em + 3%);
- border: 1px solid var(--md-default-fg-color--lightest);
- border-radius: calc(0.5rem + 0.75vw);
- background: linear-gradient(110deg, var(--md-default-bg-color) 33%, var(--md-footer-bg-color--dark) 95%);
- overflow: hidden;
- background-repeat: no-repeat;
-}
-.splash.dark {
- color: var(--white);
- --md-primary-fg-color: var(--stone50);
- --md-accent-fg-color: var(--white);
-}
-.splash.highlight {
- background:
- linear-gradient(
- 110deg,
- rgba(44,50,62,0.9) 10%,
- rgba(44,50,62,0.1) 90%
- ),
- url(../assets/highlight.jpg) center / cover var(--stone800);
- border: none;
- background-repeat: no-repeat;
-}
-.splash.mysql {
- background:
- linear-gradient(
- 110deg,
- rgba(0,0,0,0.2) 33%,
- rgba(0,0,0,0.1) 95%
- ),
- linear-gradient(
- 110deg,
- rgb(14,95,181) 33%,
- rgb(48,209,178) 95%
- );
-}
-.splash.postgresql {
- background:
- linear-gradient(
- 110deg,
- rgba(0,0,0,0.4) 33%,
- rgba(0,0,0,0.1) 95%
- ),
- linear-gradient(
- 110deg,
- rgb(78,91,150) 33%,
- rgb(67,158,255) 95%
- );
-}
-.splash.mongodb {
- background:
- linear-gradient(
- 110deg,
- rgba(0,0,0,0.4) 33%,
- rgba(0,0,0,0.1) 95%
- ),
- linear-gradient(
- 110deg,
- rgb(24,109,73) 33%,
- rgb(48,209,190) 95%
- );
-}
-.splash.operators {
- background:
- linear-gradient(
- 110deg,
- transparent 33%,
- rgba(0,0,0,0.1) 95%
- ),
- linear-gradient(
- 110deg,
- rgb(11,39,140) 33%,
- rgb(20,142,255) 95%
- );
-}
-.splash.header {
- flex-direction: column;
- align-items: flex-start;
- border: none;
- background-repeat: no-repeat;
-}
-
-/* Splash Contents */
-
-.splash > * {
- flex: 0 1 45%;
-}
-.splash h1,
-.splash h2 {
- margin-top: 0;
- margin-bottom: -0.125em;
-}
-.splash > :last-child {
- margin-bottom: 0;
-}
-.splash-intro {
- margin: 0.5rem 0.75rem;
-}
-.splash-links > :not(:last-child) {
- margin-bottom: 1em;
-}
-.splash.dark .md-button {
- border-color: rgba(255, 255, 255, 0.4)
-}
-.splash.dark .md-button:hover {
- border-color: var(--white)
-}
-.splash.dark .md-button--primary,
-.splash.dark .md-button--primary:hover {
- color: var(--stone700);
-}
-.splash.dark .md-button--primary:hover {
- color: var(--stone900);
-}
-.splash.header > * {
- max-width: 30rem;
- z-index: 1;
-}
-.splash.header > :first-child {
- margin: 0;
-}
-.splash.header img {
- display: block;
- position: absolute;
- top: 50%;
- right: 1rem;
- width: 12rem;
- height: 12rem;
- margin: 0;
- transform: translateY(-50%);
- z-index: 0;
-}
-
-/* Splash Card */
-
-a.splash-card {
- display: flex;
- flex-direction: column;
- justify-content: center;
- min-height: 6.75em;
- padding: 0.75rem 0.375rem 0.5rem 4.75rem;
- border: 1px solid var(--md-default-fg-color--lightest);
- border-radius: calc(0.25rem + 0.375vw);
- cursor: pointer;
- text-decoration: none !important;
- color: var(--md-typeset-color);
- position: relative;
- background-color: var(--md-default-bg-color);
- transition: all 0.2s ease-out;
-}
-.splash.highlight a.splash-card {
- color: var(--white);
- background-color: rgba(255, 255, 255, 0.2);
- backdrop-filter: blur(0.75rem);
- border-color: rgba(255,255,255,0.1);
-}
-a.splash-card:hover {
- box-shadow: 0px 1px 10px 0px rgba(0, 0, 0, 0.12), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 2px 4px -1px rgba(0, 0, 0, 0.20);
- color: var(--md-typeset-color);
-}
-.splash.highlight a.splash-card:hover {
- background-color: rgba(255, 255, 255, 0.4);
- border-color: rgba(255,255,255,0.2);
- backdrop-filter: blur(1.5rem);
-}
-a.splash-card img {
- display: block;
- position: absolute;
- top: 0.75rem;
- left: 0.75rem;
- width: 3.5rem;
- height: 3.5rem;
- border-radius: 0.25rem;
- float: left;
-}
-.splash-card > * {
- margin: 0 0.25rem 0.25rem 0 !important;
-}
-.splash-card > h3 {
- font-size: 0.875rem;
- margin-bottom: 0.0625rem !important;
-}
-
-/* News elements */
-
-[data-news] {
- display: flex;
- flex-wrap: wrap;
- margin-right: -1rem;
-}
-[data-news] [data-article] {
- flex: 0 1 calc(50% - 1rem);
- display: flex;
- flex-direction: column;
- margin: 0 1rem 1rem 0;
- padding: 0 1rem 1rem 0;
- border-bottom: 1px solid var(--md-default-fg-color--lightest);
-}
-[data-article] > * {
- margin: 0.25rem 0;
-}
-[data-article] > :first-child {
- font-family: var(--fHeading);
- font-size: 0.8rem;
- /* flex-grow: 1; */
-}
-[data-article] > :nth-child(2):not(:last-child) {
- font-size: 0.875em;
- line-height: 1.4;
- display: -webkit-box;
- -webkit-line-clamp: 3;
- -webkit-box-orient: vertical;
- overflow: hidden;
- text-overflow: ellipsis;
- max-height: 2.8em;
- position: relative;
-}
-[data-article] > :nth-child(2):not(:last-child)::after {
- content: "";
- position: absolute;
- display: block;
- right: 0;
- bottom: 0;
- width: 4rem;
- height: 1.4em;
- background: linear-gradient(to right, transparent 0%, var(--md-default-bg-color) 50%);
-}
-[data-article] > :last-child > * {
- margin-right: 1em;
-}
-[data-article] a:link {
- font-family: var(--fHeading);
- font-size: 0.6818rem;
- font-weight: bold;
- text-decoration: none;
-}
-
-/* Conditionals */
-
-@media screen and (max-width: 76.1875em) {
- .md-nav--primary .md-nav__title[for=__drawer],
- .md-nav--primary .md-nav__title {
- background-color: var(--stone800);
- }
-}
-@media screen and (max-width: 55em) {
- .splash.header img {
- right: -2rem;
- opacity: 0.2;
- }
-}
-@media screen and (max-width: 45em) {
- .splash {
- flex-direction: column;
- }
- [data-grid] [data-banner],
- [data-news] [data-article] {
- flex: 1 1 100%;
- }
-}
\ No newline at end of file
diff --git a/docs/css/percona.css b/docs/css/percona.css
index d0d0e2cd6..2cbe41b45 100644
--- a/docs/css/percona.css
+++ b/docs/css/percona.css
@@ -66,4 +66,4 @@ margin: 1em 0 .54em;
/*.git-revision-date-localized-plugin:before {
content: url('https://api.iconify.design/mdi/clock-edit-outline.svg');
-}*/
+}*/
\ No newline at end of file
diff --git a/docs/js/kapa.js b/docs/js/kapa.js
new file mode 100644
index 000000000..b3459eb64
--- /dev/null
+++ b/docs/js/kapa.js
@@ -0,0 +1,98 @@
+(function () {
+ function createAIButton() {
+ if (document.getElementById("ask-percona-ai")) {
+ return;
+ }
+
+ const search = document.querySelector(".md-search");
+
+ if (!search || !search.parentNode) {
+ return;
+ }
+
+ const button = document.createElement("button");
+
+ button.id = "ask-percona-ai";
+ button.type = "button";
+
+ button.innerHTML = `
+ ✨
+ Ask Percona AI
+ `;
+
+ // Place button AFTER search component
+ search.parentNode.insertBefore(button, search.nextSibling);
+ }
+
+ function loadKapa() {
+ // Prevent duplicate loading
+ if (document.getElementById("kapa-widget-script")) {
+ return;
+ }
+
+ const script = document.createElement("script");
+
+ script.id = "kapa-widget-script";
+
+ script.src = "https://widget.kapa.ai/kapa-widget.bundle.js";
+
+ script.async = true;
+
+ // REQUIRED CONFIG
+ script.setAttribute(
+ "data-website-id",
+ "0e0d55cf-6370-4a6d-a987-96670a7fe935"
+ );
+
+ script.setAttribute(
+ "data-modal-override-open-selector",
+ "#ask-percona-ai"
+ );
+
+ script.setAttribute(
+ "data-button-hide",
+ "true"
+ );
+
+ script.setAttribute(
+ "data-project-name",
+ "Percona"
+ );
+
+ script.setAttribute(
+ "data-modal-title",
+ "Percona AI Assistant"
+ );
+
+ script.setAttribute(
+ "font-size",
+ "0.875rem"
+ );
+
+ // MODAL CONTENT
+ script.setAttribute(
+ "data-modal-disclaimer",
+ "The **Percona AI Assistant** helps you find simple, clear answers to your Percona questions using [official documentation](https://docs.percona.com/), resolved [forum posts](https://forums.percona.com/) and [blog posts](https://www.percona.com/blog/). Note, do not enter personal or confidential information. Before using Percona AI assistant, read the [Legal Notice](https://docs.percona.com/postgresql/18/legal-notice.html)."
+ );
+
+ script.setAttribute(
+ "data-modal-example-questions",
+ "How do I get started with Percona PostgreSQL 17?, How do I configure backups in Percona PostgreSQL 17?, How do I enable data encryption in Percona PostgreSQL 17?, How do I monitor the health of a PostgreSQL 17 deployment?"
+ );
+
+ script.setAttribute(
+ "data-project-logo",
+ "https://docs.percona.com/postgresql/17/_static/percona-logomark-one-color-dark.png"
+ );
+
+ document.head.appendChild(script);
+ }
+
+ createAIButton();
+ loadKapa();
+
+ document.addEventListener("navigation.instant", () => {
+ createAIButton();
+ loadKapa();
+ });
+})();
\ No newline at end of file
diff --git a/docs/legal-notice.md b/docs/legal-notice.md
new file mode 100644
index 000000000..0f99583b8
--- /dev/null
+++ b/docs/legal-notice.md
@@ -0,0 +1,3 @@
+# Legal Notice
+
+You are interacting with an AI-powered chatbot that provides automated responses for general information about our IT services and software. Responses may be inaccurate or incomplete and do not constitute professional or contractual advice. Do not submit personal data, confidential information, credentials, or other sensitive information through this chat. Conversations may be logged and processed to improve our services in accordance with our [Privacy Policy](https://www.percona.com/privacy-policy#h.c033wws8ytgb) and applicable laws, including the GDPR. If you require assistance, please contact a [human representative](https://www.percona.com/about/contact).
diff --git a/mkdocs-base.yml b/mkdocs-base.yml
index 7e4bda138..1c9f77a6b 100644
--- a/mkdocs-base.yml
+++ b/mkdocs-base.yml
@@ -66,12 +66,14 @@ extra_css:
- css/landing.css
- css/postgresql.css
- css/rating.css
+ - css/kapa.css
extra_javascript:
- js/version-select.js
- js/promptremover.js
- js/consent.js
- js/rating.js
+ - js/kapa.js
markdown_extensions:
attr_list: {}
diff --git a/mkdocs.yml b/mkdocs.yml
index 629386c40..e13aa7715 100644
--- a/mkdocs.yml
+++ b/mkdocs.yml
@@ -96,3 +96,4 @@ nav:
- Licensing: licensing.md
- Versioning: versioning.md
- Trademark policy: trademark-policy.md
+ - Legal notice: legal-notice.md