From 47ce5648ec76f4b40a95072aae6abf3edfe0de6e Mon Sep 17 00:00:00 2001
From: Outsider <outsideris@gmail.com>
Date: Tue, 30 Nov 2021 23:51:32 +0900
Subject: [PATCH 1/2] doc: move sponsorship logos into footer

Signed-off-by: Outsider <outsideris@gmail.com>
---
 docs/_includes/default.liquid | 49 +++++++--------------------
 docs/css/style.css            | 64 ++++++++++++-----------------------
 2 files changed, 35 insertions(+), 78 deletions(-)

diff --git a/docs/_includes/default.liquid b/docs/_includes/default.liquid
index 58a49edb0c..12d9df5f42 100644
--- a/docs/_includes/default.liquid
+++ b/docs/_includes/default.liquid
@@ -25,39 +25,6 @@
 
     <main id="content">{{ content }}</main>
 
-    <aside class="sponsorship">
-      <a
-        href="https://matomo.org/"
-        rel="external noopener"
-        title="Mocha is sponsored by Matomo"
-      >
-        <img src="images/matomo-logo.png?trim" loading="lazy" alt="Matomo logo" />
-      </a>
-      <a
-        title="Mocha is an OpenJS Foundation Project"
-        href="https://openjsf.org"
-        rel="external noopener"
-      >
-        <img
-          src="/images/openjsf-logo.svg"
-          loading="lazy"
-          width="300"
-          height="94"
-          alt="OpenJS Foundation Logo"
-        />
-      </a>
-      <a
-        href="https://wallabyjs.com"
-        rel="external noopener"
-        title="Mocha is sponsored by Wallaby"
-      >
-        <figure id="wallaby-logo">
-          <img src="images/wallaby-logo.png" loading="lazy" alt="Wallaby logo" />
-          <figcaption>Wallaby</figcaption>
-        </figure>
-      </a>
-    </aside>
-
     <footer>
       <div id="copyright-notice">
         <a rel="home" href="https://mochajs.org/">mochajs.org</a> is licensed
@@ -100,6 +67,18 @@
         </p>
       </div>
 
+      <div class="sponsorship">
+        <a title="Mocha is an OpenJS Foundation Project" href="https://openjsf.org" rel="external noopener" >
+          <img src="/images/openjsf-logo.svg" loading="lazy" width="120" alt="OpenJS Foundation Logo">
+        </a>
+        <a href="https://matomo.org/" rel="external noopener" title="Mocha is sponsored by Matomo">
+          <img src="images/matomo-logo.png?trim" loading="lazy" width="80" alt="Matomo logo">
+        </a>
+        <a href="https://wallabyjs.com" rel="external noopener" title="Mocha is sponsored by Wallaby" id="wallaby-logo">
+          <img src="https://wallabyjs.com/assets/img/logoWithText.svg" loading="lazy" width="120" alt="Wallaby logo">
+        </a>
+      </div>
+
       <div id="external-links">
         <ul id="openjsf-links">
           <li>
@@ -148,9 +127,7 @@
         </ul>
         <div class="netlify-badge">
           <a href="https://www.netlify.com">
-            <img
-              src="https://www.netlify.com/img/global/badges/netlify-color-accent.svg" loading="lazy"
-            />
+            <img src="https://www.netlify.com/img/global/badges/netlify-color-accent.svg" loading="lazy">
           </a>
         </div>
       </div>
diff --git a/docs/css/style.css b/docs/css/style.css
index 148c48c4ec..c566752503 100644
--- a/docs/css/style.css
+++ b/docs/css/style.css
@@ -242,31 +242,6 @@ img.screenshot {
   max-width: 100%;
 }
 
-.sponsorship a {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-
-.sponsorship a img {
-  display: block;
-  object-fit: cover;
-  width: 100%;
-  height: 100%;
-}
-
-.sponsorship {
-  display: flex;
-  justify-content: center;
-  margin-bottom: 60px;
-  align-items: center;
-}
-
-.sponsorship a {
-  padding: 0 40px;
-  text-decoration: none;
-}
-
 footer {
   background-color: #eee;
   border-top: 1px solid #ddd;
@@ -315,6 +290,28 @@ footer {
   bottom: 0;
 }
 
+.sponsorship {
+  display: flex;
+  align-items: center;
+}
+
+.sponsorship a {
+  display: inline-block;
+  margin-right: 10px;
+  margin-bottom: 0;
+}
+
+@media all and (max-width: 400px) {
+  .sponsorship {
+    display: block;
+  }
+
+  .sponsorship a {
+    display: block;
+    margin-bottom: 10px;
+  }
+}
+
 .dl-inline dt,
 .dl-inline dd {
   display: inline;
@@ -335,23 +332,6 @@ blockquote {
   padding: 10px;
 }
 
-figure#wallaby-logo {
-  vertical-align: top;
-  display: inline-block;
-  text-align: center;
-}
-figure#wallaby-logo figcaption {
-  margin-top: 10px;
-  display: block;
-  font-family: 'Open Sans', -apple-system, system-ui, 'Segoe UI', Oxygen, Ubuntu,
-    Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
-  font-weight: 400;
-  letter-spacing: 2px;
-  text-transform: uppercase;
-  color: #2c2c2c;
-  -webkit-font-smoothing: antialiased;
-}
-
 table {
   width: 100%;
 }

From bddc02e9116036982dc693b670659ebf2397e347 Mon Sep 17 00:00:00 2001
From: Outsider <outsideris@gmail.com>
Date: Fri, 4 Feb 2022 21:07:03 +0900
Subject: [PATCH 2/2] doc: move sponsorship logos into bottom of content

Signed-off-by: Outsider <outsideris@gmail.com>
---
 docs/_includes/default.liquid | 17 ++++++++++-------
 docs/css/style.css            | 23 +++++++++--------------
 2 files changed, 19 insertions(+), 21 deletions(-)

diff --git a/docs/_includes/default.liquid b/docs/_includes/default.liquid
index 12d9df5f42..7a149e8bbd 100644
--- a/docs/_includes/default.liquid
+++ b/docs/_includes/default.liquid
@@ -25,6 +25,15 @@
 
     <main id="content">{{ content }}</main>
 
+    <div class="sponsorship">
+      <a href="https://matomo.org/" rel="external noopener" title="Mocha is sponsored by Matomo">
+        <img src="images/matomo-logo.png?trim" loading="lazy" width="100" alt="Matomo logo">
+      </a>
+      <a href="https://wallabyjs.com" rel="external noopener" title="Mocha is sponsored by Wallaby" id="wallaby-logo">
+        <img src="https://wallabyjs.com/assets/img/logoWithText.svg" loading="lazy" width="140" alt="Wallaby logo">
+      </a>
+    </div>
+
     <footer>
       <div id="copyright-notice">
         <a rel="home" href="https://mochajs.org/">mochajs.org</a> is licensed
@@ -67,16 +76,10 @@
         </p>
       </div>
 
-      <div class="sponsorship">
+      <div class="openjsf-logo">
         <a title="Mocha is an OpenJS Foundation Project" href="https://openjsf.org" rel="external noopener" >
           <img src="/images/openjsf-logo.svg" loading="lazy" width="120" alt="OpenJS Foundation Logo">
         </a>
-        <a href="https://matomo.org/" rel="external noopener" title="Mocha is sponsored by Matomo">
-          <img src="images/matomo-logo.png?trim" loading="lazy" width="80" alt="Matomo logo">
-        </a>
-        <a href="https://wallabyjs.com" rel="external noopener" title="Mocha is sponsored by Wallaby" id="wallaby-logo">
-          <img src="https://wallabyjs.com/assets/img/logoWithText.svg" loading="lazy" width="120" alt="Wallaby logo">
-        </a>
       </div>
 
       <div id="external-links">
diff --git a/docs/css/style.css b/docs/css/style.css
index c566752503..79dbc261e8 100644
--- a/docs/css/style.css
+++ b/docs/css/style.css
@@ -45,7 +45,7 @@ header {
 }
 
 #content {
-  padding-bottom: 60px;
+  padding-bottom: 30px;
 }
 
 #_header h1 {
@@ -284,6 +284,10 @@ footer {
   content: ' | ';
 }
 
+.openjsf-logo {
+  margin-bottom: 10px;
+}
+
 #external-links .netlify-badge {
   position: absolute;
   right: 0;
@@ -293,23 +297,14 @@ footer {
 .sponsorship {
   display: flex;
   align-items: center;
+  justify-content: center;
+  margin-bottom: 30px;
 }
 
 .sponsorship a {
   display: inline-block;
-  margin-right: 10px;
-  margin-bottom: 0;
-}
-
-@media all and (max-width: 400px) {
-  .sponsorship {
-    display: block;
-  }
-
-  .sponsorship a {
-    display: block;
-    margin-bottom: 10px;
-  }
+  margin-right: 15px;
+  margin-left: 15px;
 }
 
 .dl-inline dt,