Merge pull request #1041 from privacy-scaling-explorations/feat/ui-ki…

…t-tweaks Feat/UI kit tweaks
privacy-scaling-explorations · Jan 17, 2024 · 55c35c9 · 55c35c9
2 parents 02aac21 + cde43cf
commit 55c35c9
Show file tree

Hide file tree

Showing 5 changed files with 11 additions and 12 deletions.
diff --git a/website/src/css/custom.css b/website/src/css/custom.css
@@ -14,15 +14,15 @@
 }
 
 @font-face {
-  font-family: DMMono;
-  src: url("../../static/fonts/DM_Mono.woff2");
+  font-family: DMSans;
+  src: url("../../static/fonts/DM_Sans.woff2");
   font-weight: normal;
   font-style: normal;
 }
 
 /* You can override the default Infima variables here. */
 :root {
-  --ifm-color-primary: #5e5e5e;
+  --ifm-color-primary: #0b0b0b;
   --ifm-background-color: #ffffff;
   --ifm-navbar-background-color: #ffffff;
   --ifm-footer-background-color: #020203;
@@ -31,9 +31,8 @@
   --ifm-footer-link-hover-color: #ffffff;
   --ifm-link-color: #579bea;
   --ifm-color-hero: #fcfcfc;
-  /* TODO: discuss if we want to use this or not */
-  /* --ifm-font-family-base: DMMono; */
-  --ifm-font-color-base: #0b0b0b;
+  --ifm-font-family-base: DMSans;
+  --ifm-font-color-base: #5e5e5e;
   --ifm-code-font-size: 95%;
   --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1);
 }
@@ -48,15 +47,13 @@
 }
 
 h1 {
-  /* TODO: discuss if we want to use this or not */
-  /* font-family: ShareTechMono; */
+  font-family: ShareTechMono;
   font-size: 4rem;
   color: var(--ifm-color-primary);
 }
 
 h2 {
-  /* TODO: discuss if we want to use this or not */
-  /* font-family: ShareTechMono; */
+  font-family: ShareTechMono;
   font-size: 3rem;
   margin: 0;
   color: var(--ifm-color-primary);

diff --git a/website/src/pages/index.module.css b/website/src/pages/index.module.css
@@ -7,7 +7,8 @@
   position: relative;
   height: 427px;
   overflow: hidden;
-  background-image: url("../../static/img/hero.svg");
+  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%),
+    url("../../static/img/hero.svg");
   background-position: center;
   background-repeat: no-repeat;
   background-size: cover;
@@ -48,6 +49,7 @@
   width: max-content;
   border-bottom: 3px solid var(--ifm-link-color);
   box-sizing: content-box;
+  margin-bottom: 1rem;
 }
 
 @media screen and (max-width: 996px) {

diff --git a/website/src/pages/index.tsx b/website/src/pages/index.tsx
@@ -38,7 +38,7 @@ const Home = (): JSX.Element => {
       <main>
         <section className={styles.introduction}>
           <div className="container">
-            <h1 className={styles.borderBlue}>What is MACI?</h1>
+            <h2 className={styles.borderBlue}>What is MACI?</h2>
 
             <p>Minimal Anti-Collusion Infrastructure (MACI) is a private, on-chain, voting system.</p>
 

diff --git a/website/static/fonts/DM_Mono.woff2 b/website/static/fonts/DM_Mono.woff2
diff --git a/website/static/fonts/DM_Sans.woff2 b/website/static/fonts/DM_Sans.woff2