footer update

impresso · Mar 19, 2024 · a079d8e · a079d8e
1 parent 83901eb
commit a079d8e
Show file tree

Hide file tree

Showing 7 changed files with 271 additions and 30 deletions.
diff --git a/src/components/Footer.css b/src/components/Footer.css
@@ -0,0 +1,28 @@
+.footer-logo > span {
+  display: block;
+  margin-top: 1rem;
+  line-height: 1rem;
+  font-size: var(--font-small);
+  opacity: 0.7;
+}
+
+.git-hub {
+  justify-content: center;
+  flex-direction: row;
+  align-items: center;
+  margin-bottom: 1.5rem;
+}
+
+.git-hub a,
+.git-hub span,
+.git-hub p {
+  display: flex;
+  width: auto;
+  font-size: var(--font-small);
+  align-items: center;
+  margin: 0 !important;
+}
+
+.git-hub a {
+  padding-left: 0 !important;
+}
diff --git a/src/components/Footer.js b/src/components/Footer.js
@@ -1,10 +1,14 @@
 import React from "react"
-import { Link } from "gatsby"
 import { Container, Row, Col } from "react-bootstrap"
 import { useSiteMetadata } from "../hooks"
-import { Github } from "iconoir-react"
 import LogoFnr from "./_svg/LogoFnr"
 import LogoSnsf from "./_svg/LogoSnsf"
+import LogoUni from "./_svg/LogoUni"
+import LogoUnil from "./_svg/LogoUnil"
+import LogoEpfl from "./_svg/LogoEpfl"
+import LogoDofcl from "./_svg/LogoDofcl"
+import "./Footer.css"
+import LogoGitHub from "./_svg/LogoGitHub"
 
 const getGithubRepoUrl = (gitRepo, gitRevision) => {
   if (gitRepo.startsWith("https")) {
@@ -31,43 +35,80 @@ const Footer = () => {
   return (
     <footer className="mt-5">
       <Container>
+        <Row className="border-top border-dark">
+          <Col>
+            <h3 className="mt-2">Partners</h3>
+          </Col>
+        </Row>
+        <Row>
+          <Col className="footer-logo py-4">
+            <LogoEpfl width={180} />
+            <span>
+              Digital Humanities Laboratory (DHLAB) Ecole Polytechnique Federale
+              de Lausanne, Switzerland
+            </span>
+          </Col>
+          <Col className="footer-logo py-4">
+            <LogoDofcl width={200} />
+            <span>
+              Institute of Computational Linguistics Zurich University,
+              Switzerland
+            </span>
+          </Col>
+        </Row>
         <Row>
-          <Col className=" py-4">{site.title}</Col>
-          <Col className=" py-4">
-            <ul>
-              <li>
-                <Link to="/">impresso-datalab</Link>
-              </li>
-              <li>
-                <Link to="/about">about!</Link>
-              </li>
-            </ul>
+          <Col className="footer-logo py-4">
+            <LogoUni width={200} />
+            <span>
+              Center for Contemporary and Digital History (C²DH) University of
+              Luxembourg, Luxembourg
+            </span>
           </Col>
-          <Col className="py-4">
-            Current version:
-            <br />
-            <a
-              href={gitRepoUrl}
-              target="_blank"
-              rel="noreferrer"
-              title="check github repo"
-            >
-              <Github />
-              <span className="ms-2">
-                {site.gitBuildTag} / {site.gitRevision}
-              </span>
-            </a>
+          <Col className="footer-logo py-4">
+            <LogoUnil width={200} />
+            <span>History department, University of Lausanne, Switzerland</span>
           </Col>
         </Row>
         <Row className="border-top border-dark">
-          <Col className=" py-4">
-            <LogoSnsf width={200} className="mx-auto" />
+          <Col>
+            <h3 className="mt-2">Funding agencies</h3>
+          </Col>
+        </Row>
+        <Row>
+          <Col className="footer-logo py-4">
+            <LogoSnsf width={200} />
+            <span>
+              The Swiss National Science Foundation (SNSF) funds excellent
+              research at universities and other institutions – from chemistry
+              to medicine to sociology
+            </span>
           </Col>
-          <Col className="py-4">
-            <LogoFnr width={200} className="mx-auto" />
+          <Col className="footer-logo py-4">
+            <LogoFnr width={200} />
+            <span>
+              The Luxembourg National Research Fund (FNR) is the main funder of
+              research activities in Luxembourg
+            </span>
           </Col>
         </Row>
       </Container>
+      <Container fluid>
+        <Row className="git-hub">
+          <span className="pe-2">Current version:</span>
+          <a
+            href={gitRepoUrl}
+            target="_blank"
+            rel="noreferrer"
+            title="check github repo"
+            aria-label="GitHub logo"
+          >
+            <LogoGitHub width={24} />
+            <p className="ps-2">
+              {site.gitBuildTag} / {site.gitRevision}
+            </p>
+          </a>
+        </Row>
+      </Container>
     </footer>
   )
 }

diff --git a/src/components/_svg/LogoDofcl.js b/src/components/_svg/LogoDofcl.js
diff --git a/src/components/_svg/LogoEpfl.js b/src/components/_svg/LogoEpfl.js
@@ -0,0 +1,35 @@
+import React from "react"
+
+const LogoEpfl = ({
+  color = "var(--impresso-color-black)",
+  width = 160,
+  className = "",
+}) => {
+  const ratio = 200 / 58.22
+  const height = width / ratio
+
+  return (
+    <div
+      className={`LogoEpfl SVG ${className}`}
+      style={{ height: height + "px", width: width + "px" }}
+    >
+      <a
+        href="https://www.epfl.ch/en/"
+        target="_blank"
+        rel="noopener noreferrer"
+        aria-label="EPFL logo"
+        alt="EPFL is one of Europe’s most vibrant and cosmopolitan science and technology institutions"
+      >
+        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 58.22">
+          <path
+            data-name="Epfl logo"
+            d="M0 23.68h12.5V10.74H42V0H0v23.68Zm0 34.43h42V47.36H12.5V34.42H0V58.1Zm39.47-23.68V23.68H12.5v10.75h26.97ZM94.3 5.37c-1.75-1.75-3.95-3.07-6.25-3.84C85.09.44 81.91 0 78.73.11H52.74v58.11h12.5V34.43h13.38c3.18.11 6.25-.44 9.32-1.43 2.3-.88 4.5-2.19 6.25-3.84a15.2 15.2 0 0 0 3.51-5.48c1.43-4.17 1.43-8.66 0-12.72-.66-2.19-1.86-4.06-3.4-5.59ZM85.53 20.5c-.66.88-1.54 1.54-2.52 1.97-1.1.44-2.3.77-3.62.99-1.43.22-2.85.22-4.28.22h-9.87V10.74h9.98c1.43 0 2.85.11 4.28.22 1.21.11 2.41.44 3.62.99.99.44 1.86 1.1 2.41 1.97.66.99.99 2.08.99 3.29s-.33 2.3-.99 3.29Zm84.97 26.87V0h-12.61v58.11h42.1V47.36h-29.5Zm-63.7-23.69h12.5V10.74h29.61V0H106.8v23.68Zm0 34.43h12.5V34.43h-12.5v23.68Zm39.47-23.68V23.68H119.3v10.75h26.97Z"
+            fill={color}
+          />
+        </svg>
+      </a>
+    </div>
+  )
+}
+
+export default LogoEpfl
diff --git a/src/components/_svg/LogoGitHub.js b/src/components/_svg/LogoGitHub.js
@@ -0,0 +1,28 @@
+import React from "react"
+
+const LogoGitHub = ({
+  color = "var(--impresso-color-black)",
+  width = 160,
+  className = "",
+}) => {
+  const ratio = 98 / 96
+  const height = width / ratio
+
+  return (
+    <div
+      className={`LogoGitHub SVG ${className}`}
+      style={{ height: height + "px", width: width + "px" }}
+    >
+      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 98 96">
+        <path
+          fill-rule="evenodd"
+          clip-rule="evenodd"
+          d="M48.854 0C21.839 0 0 22 0 49.217c0 21.756 13.993 40.172 33.405 46.69 2.427.49 3.316-1.059 3.316-2.362 0-1.141-.08-5.052-.08-9.127-13.59 2.934-16.42-5.867-16.42-5.867-2.184-5.704-5.42-7.17-5.42-7.17-4.448-3.015.324-3.015.324-3.015 4.934.326 7.523 5.052 7.523 5.052 4.367 7.496 11.404 5.378 14.235 4.074.404-3.178 1.699-5.378 3.074-6.6-10.839-1.141-22.243-5.378-22.243-24.283 0-5.378 1.94-9.778 5.014-13.2-.485-1.222-2.184-6.275.486-13.038 0 0 4.125-1.304 13.426 5.052a46.97 46.97 0 0 1 12.214-1.63c4.125 0 8.33.571 12.213 1.63 9.302-6.356 13.427-5.052 13.427-5.052 2.67 6.763.97 11.816.485 13.038 3.155 3.422 5.015 7.822 5.015 13.2 0 18.905-11.404 23.06-22.324 24.283 1.78 1.548 3.316 4.481 3.316 9.126 0 6.6-.08 11.897-.08 13.526 0 1.304.89 2.853 3.316 2.364 19.412-6.52 33.405-24.935 33.405-46.691C97.707 22 75.788 0 48.854 0z"
+          fill={color}
+        />
+      </svg>
+    </div>
+  )
+}
+
+export default LogoGitHub
diff --git a/src/components/_svg/LogoUni.js b/src/components/_svg/LogoUni.js
diff --git a/src/components/_svg/LogoUnil.js b/src/components/_svg/LogoUnil.js