From 9ab0eb3ecb8be9b83f2b84afbd266df2c5153bb9 Mon Sep 17 00:00:00 2001
From: kaankacar <kaankacar02@gmail.com>
Date: Mon, 1 Dec 2025 17:54:54 +0300
Subject: [PATCH 1/2] feat: add Google Translate integration

---
 docusaurus.config.ts | 26 ++++++++++++++++++++++++++
 1 file changed, 26 insertions(+)

diff --git a/docusaurus.config.ts b/docusaurus.config.ts
index 6dc69df0f9..7cffea9462 100644
--- a/docusaurus.config.ts
+++ b/docusaurus.config.ts
@@ -31,7 +31,27 @@ const config: Config = {
     defaultLocale: DEFAULT_LOCALE,
     locales: ["en", "es"],
   },
+  scripts: [
+    'https://buttons.github.io/buttons.js',
+    'https://use.fontawesome.com/221fd444f5.js',
+    'https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit',
+  ],
   plugins: [
+    () => ({
+      name: 'google-translate-init',
+      injectHtmlTags() {
+        return {
+          headTags: [
+            {
+              tagName: 'script',
+              innerHTML: `
+                function googleTranslateElementInit() {}
+              `,
+            },
+          ],
+        };
+      },
+    }),
     "docusaurus-plugin-sass",
     [
       "docusaurus-plugin-sentry",
@@ -161,6 +181,12 @@ const config: Config = {
           className: "header-github-link",
           'aria-label': "GitHub",
         },
+        {
+          type: 'html',
+          position: 'right',
+          value:
+            '<div id="google_translate_element" style="display:inline-block"></div><a class="navbar__link false" href="#" onclick="new google.translate.TranslateElement({pageLanguage: \'en\', includedLanguages: \'af,sq,am,en,fa,ar,ps,ja,zh-CN,hy,az,eu,be,bn,bs,bg,ca,ceb,ny,zh-TW,co,hr,cs,da,nl,eo,et,tl,fi,fr,fy,gl,ka,de,el,gu,ht,ha,haw,iw,hi,hmn,hu,is,ig,id,ga,it,jw,kn,kk,km,ko,ku,ky,lo,la,lv,lt,lb,mk,mg,ms,ml,mt,mi,mr,mn,my,ne,no,pl,pt,pa,ro,ru,sm,gd,sr,st,sn,sd,si,sk,sl,so,es,su,sw,sv,tg,ta,te,th,tr,uk,ur,uz,vi,cy,xh,yi,yo,zu\'}, \'google_translate_element\'); return false;"><svg viewBox="0 0 24 24" width="20" height="20" aria-hidden="true" style="vertical-align: text-bottom"><path fill="currentColor" d="M12.87 15.07l-2.54-2.51.03-.03c1.74-1.94 2.98-4.17 3.71-6.53H17V4h-7V2H8v2H1v1.99h11.17C11.5 7.92 10.44 9.75 9 11.35 8.07 10.32 7.3 9.19 6.69 8h-2c.73 1.63 1.73 3.17 2.98 4.56l-5.09 5.02L4 19l5-5 3.11 3.11.76-2.04zM18.5 10h-2L12 22h2l1.12-3h4.75L21 22h2l-4.5-12zm-2.62 7l1.62-4.33L19.12 17h-3.24z"></path></svg></a>',
+        },
       ],
     },
     algolia: {

From 37c791c69722c65b235e5fb2f1683dc0629c992e Mon Sep 17 00:00:00 2001
From: kaankacar <kaankacar02@gmail.com>
Date: Wed, 3 Dec 2025 17:53:43 +0300
Subject: [PATCH 2/2] Fix Google Translate header visibility and navbar overlap

---
 src/css/custom.scss | 60 ++++++++++++++++++++++++---------------------
 1 file changed, 32 insertions(+), 28 deletions(-)

diff --git a/src/css/custom.scss b/src/css/custom.scss
index 8442d2d706..a7368369d4 100644
--- a/src/css/custom.scss
+++ b/src/css/custom.scss
@@ -66,12 +66,10 @@ html[data-theme="dark"] {
   --ifm-background-color: var(--ifm-color-black);
 }
 
-.markdown > h4 {
+.markdown>h4 {
   --ifm-h4-font-size: 1.25rem;
 
-  margin-bottom: calc(
-    var(--ifm-heading-vertical-rhythm-bottom) * var(--ifm-leading)
-  );
+  margin-bottom: calc(var(--ifm-heading-vertical-rhythm-bottom) * var(--ifm-leading));
   margin-top: calc(var(--ifm-h4-vertical-rhythm-top) * var(--ifm-leading));
 }
 
@@ -93,8 +91,7 @@ html[data-theme="dark"] {
   svg {
     height: 1.5rem;
     width: 1.5rem;
-    transition: color var(--ifm-transition-fast)
-      var(--ifm-transition-timing-default);
+    transition: color var(--ifm-transition-fast) var(--ifm-transition-timing-default);
 
     &:hover,
     &:focus {
@@ -126,20 +123,14 @@ html[data-theme="dark"] {
 div[class^="announcementBar_"] {
   font-size: 18px;
 
-  --site-announcement-bar-stripe-color1: hsl(
-    var(--site-primary-hue-saturation) 85%
-  );
-  --site-announcement-bar-stripe-color2: hsl(
-    var(--site-primary-hue-saturation) 95%
-  );
-
-  background: repeating-linear-gradient(
-    35deg,
-    var(--site-announcement-bar-stripe-color1),
-    var(--site-announcement-bar-stripe-color1) 20px,
-    var(--site-announcement-bar-stripe-color2) 10px,
-    var(--site-announcement-bar-stripe-color2) 40px
-  );
+  --site-announcement-bar-stripe-color1: hsl(var(--site-primary-hue-saturation) 85%);
+  --site-announcement-bar-stripe-color2: hsl(var(--site-primary-hue-saturation) 95%);
+
+  background: repeating-linear-gradient(35deg,
+      var(--site-announcement-bar-stripe-color1),
+      var(--site-announcement-bar-stripe-color1) 20px,
+      var(--site-announcement-bar-stripe-color2) 10px,
+      var(--site-announcement-bar-stripe-color2) 40px);
 
   height: fit-content;
 }
@@ -162,7 +153,7 @@ div[class^="announcementBar_"] {
   }
 }
 
-.navbar .dropdown > a.active {
+.navbar .dropdown>a.active {
   color: var(--ifm-color-primary);
 }
 
@@ -210,15 +201,15 @@ select[data-testid="example-pairing-select"] {
   max-width: 135%;
 
   thead {
-      color: var(--ifm-color-primary-darker);
-      background-color: var(--ifm-color-gray-300);
-      font-size: large;
-      text-align: left;
-      text-wrap: nowrap;
+    color: var(--ifm-color-primary-darker);
+    background-color: var(--ifm-color-gray-300);
+    font-size: large;
+    text-align: left;
+    text-wrap: nowrap;
   }
 
   td {
-      font-size: small;
+    font-size: small;
   }
 }
 
@@ -231,8 +222,21 @@ select[data-testid="example-pairing-select"] {
 
 .dropdown__link.has-nested-items::after {
   content: '➜';
-  margin-left: 10px;    // spacing (use margin instead of padding when using flex)
+  margin-left: 10px; // spacing (use margin instead of padding when using flex)
   font-size: 1em;
   line-height: 1;
   display: inline-block;
+}
+
+/* Fix for Google Translate making headers invisible */
+html.translated-ltr .hash-link,
+html.translated-rtl .hash-link {
+  opacity: 1 !important;
+  visibility: visible !important;
+}
+
+/* Fix for Google Translate bar overlapping the navbar */
+html.translated-ltr .navbar,
+html.translated-rtl .navbar {
+  top: 40px;
 }
\ No newline at end of file