From c4f41a1d0eab49d883b805a891ea4df1756c6c66 Mon Sep 17 00:00:00 2001 From: Alina Derkach Date: Wed, 15 Oct 2025 18:56:02 +0200 Subject: [PATCH 1/6] DOCS-217 Test and implement the feedback form new file: docs/js/feedback.js modified: mkdocs-base.yml modified: mkdocs.yml --- docs/js/feedback.js | 94 +++++++++++++++++++++++++++++++++++++++++++++ mkdocs-base.yml | 1 + mkdocs.yml | 26 ++++++------- 3 files changed, 108 insertions(+), 13 deletions(-) create mode 100644 docs/js/feedback.js diff --git a/docs/js/feedback.js b/docs/js/feedback.js new file mode 100644 index 00000000000..e7b3e2730c5 --- /dev/null +++ b/docs/js/feedback.js @@ -0,0 +1,94 @@ +document.addEventListener("DOMContentLoaded", function () { + // Check if widget was closed before + const closedUntil = localStorage.getItem("feedbackWidgetClosedUntil"); + if (closedUntil && new Date().getTime() < parseInt(closedUntil, 10)) { + return; // Don't show widget if closed and timer not expired + } + + const container = document.createElement("div"); + container.style.position = "fixed"; + container.style.bottom = "20px"; + container.style.right = "20px"; + container.style.background = "#fff"; + container.style.border = "1px solid #ddd"; + container.style.padding = "10px 15px"; + container.style.borderRadius = "8px"; + container.style.boxShadow = "0 2px 6px rgba(0,0,0,0.15)"; + container.style.zIndex = 9999; + container.style.fontFamily = '"Poppins", "Roboto", Arial, Helvetica, sans-serif'; + container.style.textAlign = "center"; + container.style.width = "250px"; + + // Close button + const closeBtn = document.createElement("button"); + closeBtn.innerText = "×"; + closeBtn.style.position = "absolute"; + closeBtn.style.top = "-2px"; // push close button slightly above the container edge + closeBtn.style.right = "-2px"; // push close button slightly outside right edge + closeBtn.style.border = "none"; + closeBtn.style.background = "transparent"; + closeBtn.style.fontSize = "24px"; + closeBtn.style.cursor = "pointer"; + closeBtn.style.color = "#999"; + closeBtn.style.fontWeight = "bold"; + closeBtn.style.lineHeight = "1"; + closeBtn.style.padding = "0"; + closeBtn.style.width = "30px"; + closeBtn.style.height = "30px"; + + closeBtn.addEventListener("click", () => { + container.style.display = "none"; + // Hide for 4 hours + const fourHoursFromNow = new Date().getTime() + 4 * 60 * 60 * 1000; + localStorage.setItem("feedbackWidgetClosedUntil", fourHoursFromNow.toString()); + }); + + container.appendChild(closeBtn); + + const title = document.createElement("div"); + title.innerText = "Do you like Percona docs?"; + title.style.marginBottom = "8px"; + title.style.fontSize = "14px"; + title.style.fontWeight = "bold"; + title.style.color = "#0E5FB5"; + title.style.fontFamily = '"Poppins", "Roboto", Arial, Helvetica, sans-serif'; + container.appendChild(title); + + const stars = document.createElement("div"); + stars.style.position = "relative"; + + for (let i = 1; i <= 5; i++) { + const star = document.createElement("span"); + star.innerHTML = "☆"; + star.style.fontSize = "24px"; + star.style.cursor = "pointer"; + star.style.margin = "0 3px"; + star.style.color = "#000"; + + star.addEventListener("mouseover", () => { + [...stars.children].forEach((s, index) => { + s.innerHTML = index < i ? "★" : "☆"; + s.style.color = index < i ? "#0E5FB5" : "#000"; + }); + }); + + star.addEventListener("mouseleave", () => { + [...stars.children].forEach((s) => { + s.innerHTML = "☆"; + s.style.color = "#000"; + }); + }); + + star.addEventListener("click", () => { + const formURL = "https://docs.google.com/forms/d/e/1FAIpQLSfhscELpzoXB4uyh9pXNmXSeqKc10IH_DxmAoaVGID85sO0Aw/viewform"; + const ratingURL = `${formURL}?entry.303027158=${i}`; + window.open(ratingURL, "_blank"); + }); + + stars.appendChild(star); + } + + container.appendChild(stars); + document.body.appendChild(container); + }); + \ No newline at end of file diff --git a/mkdocs-base.yml b/mkdocs-base.yml index 76864d36bd2..dbf341d57e4 100644 --- a/mkdocs-base.yml +++ b/mkdocs-base.yml @@ -70,6 +70,7 @@ extra_javascript: - js/version-select.js - js/promptremover.js - js/consent.js + - js/feedback.js markdown_extensions: attr_list: {} diff --git a/mkdocs.yml b/mkdocs.yml index 56b715faf30..7121975df51 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -14,17 +14,17 @@ extra: analytics: provider: google property: G-J4J70BNH0G - feedback: - title: Was this page helpful? - ratings: - - icon: material/emoticon-happy-outline - name: This page was helpful - data: 1 - note: >- - Thank you for your feedback! - - icon: material/emoticon-sad-outline - name: This page could be improved - data: 0 - note: >- - Thanks for your feedback! Want to improve this page? Click Edit this page on GitHub above to submit a pull request. +# feedback: +# title: Was this page helpful? +# ratings: +# - icon: material/emoticon-happy-outline +# name: This page was helpful +# data: 1 +# note: >- +# Thank you for your feedback! +# - icon: material/emoticon-sad-outline +# name: This page could be improved +# data: 0 +# note: >- +# Thanks for your feedback! Want to improve this page? Click Edit this page on GitHub above to submit a pull request. From 15302fa1ef2abe71eaccd186ca6302755c7f516a Mon Sep 17 00:00:00 2001 From: Alina Derkach Date: Tue, 21 Oct 2025 20:06:08 +0200 Subject: [PATCH 2/6] Move the feedback banner to the top --- _resourcepdf/overrides/main.html | 3 + _resourcepdf/overrides/partials/rating.html | 55 ++++++++++++ docs/css/extra.css | 7 ++ docs/js/feedback.js | 94 --------------------- mkdocs-base.yml | 1 - mkdocs.yml | 14 +-- 6 files changed, 66 insertions(+), 108 deletions(-) create mode 100644 _resourcepdf/overrides/partials/rating.html delete mode 100644 docs/js/feedback.js diff --git a/_resourcepdf/overrides/main.html b/_resourcepdf/overrides/main.html index 53919b23090..c6b96f6405a 100644 --- a/_resourcepdf/overrides/main.html +++ b/_resourcepdf/overrides/main.html @@ -49,6 +49,9 @@ {% endif %}