Publish 2024-07-03

darkreader · Jul 3, 2024 · 266dcb0 · 266dcb0
1 parent 02c9bc4
commit 266dcb0
Show file tree

Hide file tree

Showing 19 changed files with 240 additions and 45 deletions.
diff --git a/elements/sponsors-top-short.js b/elements/sponsors-top-short.js
@@ -38,14 +38,18 @@ const htmlText = `
 </section>`;
 
 const cssText = `
+.container {
+    padding-top: 0.625rem;
+}
 .top {
     height: 2rem;
+    white-space: nowrap;
 }
 .h-heading {
     font-size: 1.5rem;
 }
 .h-heading-1 {
-    color: var(--color-highlight);
+    color: var(--color-honey-text);
     font-weight: bold;
     -webkit-text-stroke: 0.0625rem;
 }

diff --git a/help/be/index.html b/help/be/index.html
@@ -151,7 +151,7 @@ <h2 id="contacts">Кантакты</h2>
         <script type="module" src="/elements/sponsors-bottom.js"></script>
     </article>
     <aside class="page-grid-inside">
-        <darkreader-pay-tiers small></darkreader-pay-tiers>
+        <darkreader-pay-tiers></darkreader-pay-tiers>
         <script type="module" src="/elements/pay-tiers.js"></script>
         <darkreader-backers-top-short></darkreader-backers-top-short>
         <script type="module" src="/elements/sponsors-top-short.js"></script>
@@ -161,6 +161,19 @@ <h2 id="contacts">Кантакты</h2>
     <aside class="page-grid-side">
         <darkreader-backers-side></darkreader-backers-side>
         <script type="module" src="/elements/sponsors-right.js"></script>
+        <script defer>
+            (() => {
+                const check = () => {
+                    const box = document.querySelector('.page-grid-inside').getBoundingClientRect();
+                    document.querySelector('.page-grid-side').classList.toggle('page-grid-side--visible', box.top < 0);
+                };
+
+                check();
+
+                addEventListener('scroll', check);
+                addEventListener('resize', check);
+            })();
+        </script>
     </aside>
     <aside class="page-grid-left">
         <ul></ul>

diff --git a/help/cs/index.html b/help/cs/index.html
@@ -151,7 +151,7 @@ <h2 id="contacts">Kontakt</h2>
         <script type="module" src="/elements/sponsors-bottom.js"></script>
     </article>
     <aside class="page-grid-inside">
-        <darkreader-pay-tiers small></darkreader-pay-tiers>
+        <darkreader-pay-tiers></darkreader-pay-tiers>
         <script type="module" src="/elements/pay-tiers.js"></script>
         <darkreader-backers-top-short></darkreader-backers-top-short>
         <script type="module" src="/elements/sponsors-top-short.js"></script>
@@ -161,6 +161,19 @@ <h2 id="contacts">Kontakt</h2>
     <aside class="page-grid-side">
         <darkreader-backers-side></darkreader-backers-side>
         <script type="module" src="/elements/sponsors-right.js"></script>
+        <script defer>
+            (() => {
+                const check = () => {
+                    const box = document.querySelector('.page-grid-inside').getBoundingClientRect();
+                    document.querySelector('.page-grid-side').classList.toggle('page-grid-side--visible', box.top < 0);
+                };
+
+                check();
+
+                addEventListener('scroll', check);
+                addEventListener('resize', check);
+            })();
+        </script>
     </aside>
     <aside class="page-grid-left">
         <ul></ul>

diff --git a/help/de/index.html b/help/de/index.html
@@ -150,7 +150,7 @@ <h2 id="contacts">Kontakt</h2>
         <script type="module" src="/elements/sponsors-bottom.js"></script>
     </article>
     <aside class="page-grid-inside">
-        <darkreader-pay-tiers small></darkreader-pay-tiers>
+        <darkreader-pay-tiers></darkreader-pay-tiers>
         <script type="module" src="/elements/pay-tiers.js"></script>
         <darkreader-backers-top-short></darkreader-backers-top-short>
         <script type="module" src="/elements/sponsors-top-short.js"></script>
@@ -160,6 +160,19 @@ <h2 id="contacts">Kontakt</h2>
     <aside class="page-grid-side">
         <darkreader-backers-side></darkreader-backers-side>
         <script type="module" src="/elements/sponsors-right.js"></script>
+        <script defer>
+            (() => {
+                const check = () => {
+                    const box = document.querySelector('.page-grid-inside').getBoundingClientRect();
+                    document.querySelector('.page-grid-side').classList.toggle('page-grid-side--visible', box.top < 0);
+                };
+
+                check();
+
+                addEventListener('scroll', check);
+                addEventListener('resize', check);
+            })();
+        </script>
     </aside>
     <aside class="page-grid-left">
         <ul></ul>

diff --git a/help/en/index.html b/help/en/index.html
@@ -180,7 +180,7 @@ <h2 id="contacts">Contacts</h2>
         <script type="module" src="/elements/sponsors-bottom.js"></script>
     </article>
     <aside class="page-grid-inside">
-        <darkreader-pay-tiers small></darkreader-pay-tiers>
+        <darkreader-pay-tiers></darkreader-pay-tiers>
         <script type="module" src="/elements/pay-tiers.js"></script>
         <darkreader-backers-top-short></darkreader-backers-top-short>
         <script type="module" src="/elements/sponsors-top-short.js"></script>
@@ -190,6 +190,19 @@ <h2 id="contacts">Contacts</h2>
     <aside class="page-grid-side">
         <darkreader-backers-side></darkreader-backers-side>
         <script type="module" src="/elements/sponsors-right.js"></script>
+        <script defer>
+            (() => {
+                const check = () => {
+                    const box = document.querySelector('.page-grid-inside').getBoundingClientRect();
+                    document.querySelector('.page-grid-side').classList.toggle('page-grid-side--visible', box.top < 0);
+                };
+
+                check();
+
+                addEventListener('scroll', check);
+                addEventListener('resize', check);
+            })();
+        </script>
     </aside>
     <aside class="page-grid-left">
         <ul></ul>

diff --git a/help/es/index.html b/help/es/index.html
@@ -152,7 +152,7 @@ <h2 id="contacts">Contactos</h2>
         <script type="module" src="/elements/sponsors-bottom.js"></script>
     </article>
     <aside class="page-grid-inside">
-        <darkreader-pay-tiers small></darkreader-pay-tiers>
+        <darkreader-pay-tiers></darkreader-pay-tiers>
         <script type="module" src="/elements/pay-tiers.js"></script>
         <darkreader-backers-top-short></darkreader-backers-top-short>
         <script type="module" src="/elements/sponsors-top-short.js"></script>
@@ -162,6 +162,19 @@ <h2 id="contacts">Contactos</h2>
     <aside class="page-grid-side">
         <darkreader-backers-side></darkreader-backers-side>
         <script type="module" src="/elements/sponsors-right.js"></script>
+        <script defer>
+            (() => {
+                const check = () => {
+                    const box = document.querySelector('.page-grid-inside').getBoundingClientRect();
+                    document.querySelector('.page-grid-side').classList.toggle('page-grid-side--visible', box.top < 0);
+                };
+
+                check();
+
+                addEventListener('scroll', check);
+                addEventListener('resize', check);
+            })();
+        </script>
     </aside>
     <aside class="page-grid-left">
         <ul></ul>

diff --git a/help/fr/index.html b/help/fr/index.html
@@ -151,7 +151,7 @@ <h2 id="contacts">Contacts</h2>
         <script type="module" src="/elements/sponsors-bottom.js"></script>
     </article>
     <aside class="page-grid-inside">
-        <darkreader-pay-tiers small></darkreader-pay-tiers>
+        <darkreader-pay-tiers></darkreader-pay-tiers>
         <script type="module" src="/elements/pay-tiers.js"></script>
         <darkreader-backers-top-short></darkreader-backers-top-short>
         <script type="module" src="/elements/sponsors-top-short.js"></script>
@@ -161,6 +161,19 @@ <h2 id="contacts">Contacts</h2>
     <aside class="page-grid-side">
         <darkreader-backers-side></darkreader-backers-side>
         <script type="module" src="/elements/sponsors-right.js"></script>
+        <script defer>
+            (() => {
+                const check = () => {
+                    const box = document.querySelector('.page-grid-inside').getBoundingClientRect();
+                    document.querySelector('.page-grid-side').classList.toggle('page-grid-side--visible', box.top < 0);
+                };
+
+                check();
+
+                addEventListener('scroll', check);
+                addEventListener('resize', check);
+            })();
+        </script>
     </aside>
     <aside class="page-grid-left">
         <ul></ul>

diff --git a/help/it/index.html b/help/it/index.html
@@ -151,7 +151,7 @@ <h2 id="contacts">Contatti</h2>
         <script type="module" src="/elements/sponsors-bottom.js"></script>
     </article>
     <aside class="page-grid-inside">
-        <darkreader-pay-tiers small></darkreader-pay-tiers>
+        <darkreader-pay-tiers></darkreader-pay-tiers>
         <script type="module" src="/elements/pay-tiers.js"></script>
         <darkreader-backers-top-short></darkreader-backers-top-short>
         <script type="module" src="/elements/sponsors-top-short.js"></script>
@@ -161,6 +161,19 @@ <h2 id="contacts">Contatti</h2>
     <aside class="page-grid-side">
         <darkreader-backers-side></darkreader-backers-side>
         <script type="module" src="/elements/sponsors-right.js"></script>
+        <script defer>
+            (() => {
+                const check = () => {
+                    const box = document.querySelector('.page-grid-inside').getBoundingClientRect();
+                    document.querySelector('.page-grid-side').classList.toggle('page-grid-side--visible', box.top < 0);
+                };
+
+                check();
+
+                addEventListener('scroll', check);
+                addEventListener('resize', check);
+            })();
+        </script>
     </aside>
     <aside class="page-grid-left">
         <ul></ul>

diff --git a/help/ja/index.html b/help/ja/index.html
@@ -166,7 +166,7 @@ <h2 id="contacts">問い合わせ先</h2>
         <script type="module" src="/elements/sponsors-bottom.js"></script>
     </article>
     <aside class="page-grid-inside">
-        <darkreader-pay-tiers small></darkreader-pay-tiers>
+        <darkreader-pay-tiers></darkreader-pay-tiers>
         <script type="module" src="/elements/pay-tiers.js"></script>
         <darkreader-backers-top-short></darkreader-backers-top-short>
         <script type="module" src="/elements/sponsors-top-short.js"></script>
@@ -176,6 +176,19 @@ <h2 id="contacts">問い合わせ先</h2>
     <aside class="page-grid-side">
         <darkreader-backers-side></darkreader-backers-side>
         <script type="module" src="/elements/sponsors-right.js"></script>
+        <script defer>
+            (() => {
+                const check = () => {
+                    const box = document.querySelector('.page-grid-inside').getBoundingClientRect();
+                    document.querySelector('.page-grid-side').classList.toggle('page-grid-side--visible', box.top < 0);
+                };
+
+                check();
+
+                addEventListener('scroll', check);
+                addEventListener('resize', check);
+            })();
+        </script>
     </aside>
     <aside class="page-grid-left">
         <ul></ul>

diff --git a/help/nl/index.html b/help/nl/index.html
@@ -152,7 +152,7 @@ <h2 id="contacts">Contacten</h2>
         <script type="module" src="/elements/sponsors-bottom.js"></script>
     </article>
     <aside class="page-grid-inside">
-        <darkreader-pay-tiers small></darkreader-pay-tiers>
+        <darkreader-pay-tiers></darkreader-pay-tiers>
         <script type="module" src="/elements/pay-tiers.js"></script>
         <darkreader-backers-top-short></darkreader-backers-top-short>
         <script type="module" src="/elements/sponsors-top-short.js"></script>
@@ -162,6 +162,19 @@ <h2 id="contacts">Contacten</h2>
     <aside class="page-grid-side">
         <darkreader-backers-side></darkreader-backers-side>
         <script type="module" src="/elements/sponsors-right.js"></script>
+        <script defer>
+            (() => {
+                const check = () => {
+                    const box = document.querySelector('.page-grid-inside').getBoundingClientRect();
+                    document.querySelector('.page-grid-side').classList.toggle('page-grid-side--visible', box.top < 0);
+                };
+
+                check();
+
+                addEventListener('scroll', check);
+                addEventListener('resize', check);
+            })();
+        </script>
     </aside>
     <aside class="page-grid-left">
         <ul></ul>

diff --git a/help/pt/index.html b/help/pt/index.html
@@ -151,7 +151,7 @@ <h2 id="contacts">Contatos</h2>
         <script type="module" src="/elements/sponsors-bottom.js"></script>
     </article>
     <aside class="page-grid-inside">
-        <darkreader-pay-tiers small></darkreader-pay-tiers>
+        <darkreader-pay-tiers></darkreader-pay-tiers>
         <script type="module" src="/elements/pay-tiers.js"></script>
         <darkreader-backers-top-short></darkreader-backers-top-short>
         <script type="module" src="/elements/sponsors-top-short.js"></script>
@@ -161,6 +161,19 @@ <h2 id="contacts">Contatos</h2>
     <aside class="page-grid-side">
         <darkreader-backers-side></darkreader-backers-side>
         <script type="module" src="/elements/sponsors-right.js"></script>
+        <script defer>
+            (() => {
+                const check = () => {
+                    const box = document.querySelector('.page-grid-inside').getBoundingClientRect();
+                    document.querySelector('.page-grid-side').classList.toggle('page-grid-side--visible', box.top < 0);
+                };
+
+                check();
+
+                addEventListener('scroll', check);
+                addEventListener('resize', check);
+            })();
+        </script>
     </aside>
     <aside class="page-grid-left">
         <ul></ul>

diff --git a/help/ru/index.html b/help/ru/index.html
@@ -151,7 +151,7 @@ <h2 id="contacts">Контакты</h2>
         <script type="module" src="/elements/sponsors-bottom.js"></script>
     </article>
     <aside class="page-grid-inside">
-        <darkreader-pay-tiers small></darkreader-pay-tiers>
+        <darkreader-pay-tiers></darkreader-pay-tiers>
         <script type="module" src="/elements/pay-tiers.js"></script>
         <darkreader-backers-top-short></darkreader-backers-top-short>
         <script type="module" src="/elements/sponsors-top-short.js"></script>
@@ -161,6 +161,19 @@ <h2 id="contacts">Контакты</h2>
     <aside class="page-grid-side">
         <darkreader-backers-side></darkreader-backers-side>
         <script type="module" src="/elements/sponsors-right.js"></script>
+        <script defer>
+            (() => {
+                const check = () => {
+                    const box = document.querySelector('.page-grid-inside').getBoundingClientRect();
+                    document.querySelector('.page-grid-side').classList.toggle('page-grid-side--visible', box.top < 0);
+                };
+
+                check();
+
+                addEventListener('scroll', check);
+                addEventListener('resize', check);
+            })();
+        </script>
     </aside>
     <aside class="page-grid-left">
         <ul></ul>

diff --git a/help/sr/index.html b/help/sr/index.html
@@ -151,7 +151,7 @@ <h2 id="contacts">Kontakti</h2>
         <script type="module" src="/elements/sponsors-bottom.js"></script>
     </article>
     <aside class="page-grid-inside">
-        <darkreader-pay-tiers small></darkreader-pay-tiers>
+        <darkreader-pay-tiers></darkreader-pay-tiers>
         <script type="module" src="/elements/pay-tiers.js"></script>
         <darkreader-backers-top-short></darkreader-backers-top-short>
         <script type="module" src="/elements/sponsors-top-short.js"></script>
@@ -161,6 +161,19 @@ <h2 id="contacts">Kontakti</h2>
     <aside class="page-grid-side">
         <darkreader-backers-side></darkreader-backers-side>
         <script type="module" src="/elements/sponsors-right.js"></script>
+        <script defer>
+            (() => {
+                const check = () => {
+                    const box = document.querySelector('.page-grid-inside').getBoundingClientRect();
+                    document.querySelector('.page-grid-side').classList.toggle('page-grid-side--visible', box.top < 0);
+                };
+
+                check();
+
+                addEventListener('scroll', check);
+                addEventListener('resize', check);
+            })();
+        </script>
     </aside>
     <aside class="page-grid-left">
         <ul></ul>

diff --git a/help/tr/index.html b/help/tr/index.html
@@ -151,7 +151,7 @@ <h2 id="contacts">İletişim</h2>
         <script type="module" src="/elements/sponsors-bottom.js"></script>
     </article>
     <aside class="page-grid-inside">
-        <darkreader-pay-tiers small></darkreader-pay-tiers>
+        <darkreader-pay-tiers></darkreader-pay-tiers>
         <script type="module" src="/elements/pay-tiers.js"></script>
         <darkreader-backers-top-short></darkreader-backers-top-short>
         <script type="module" src="/elements/sponsors-top-short.js"></script>
@@ -161,6 +161,19 @@ <h2 id="contacts">İletişim</h2>
     <aside class="page-grid-side">
         <darkreader-backers-side></darkreader-backers-side>
         <script type="module" src="/elements/sponsors-right.js"></script>
+        <script defer>
+            (() => {
+                const check = () => {
+                    const box = document.querySelector('.page-grid-inside').getBoundingClientRect();
+                    document.querySelector('.page-grid-side').classList.toggle('page-grid-side--visible', box.top < 0);
+                };
+
+                check();
+
+                addEventListener('scroll', check);
+                addEventListener('resize', check);
+            })();
+        </script>
     </aside>
     <aside class="page-grid-left">
         <ul></ul>