Merge branch 'develop' into rosetta/trap-and-report-exns

frontend/website/pages/adversarial.js

@@ -0,0 +1 @@
+export { make as default } from "@reason/pages/LeadGen";

frontend/website/src/Theme.re

@@ -76,6 +76,12 @@ module Colors = {
   let jungle = jungleAlpha(1.);
 
   let tan = `hex("F1EFEA");
+
+  let minaBlack = `hex("2D2D2D");
+
+  let minaOrange = `hex("FF603B");
+
+  let minaGrey = `hex("D9D9D9");
 };
 
 module Typeface = {
@@ -95,6 +101,13 @@ module Typeface = {
   let pragmataPro = fontFamily("PragmataPro, monospace");
 
   let ddinexp = fontFamily("D-Din-Exp,Helvetica Neue, Arial, sans-serif");
+
+  let monumentGrotesk =
+    fontFamily("Monument Grotesk, Helvetica Neue, Arial, sans-serif");
+
+  let monumentGroteskMono =
+    fontFamily("Monument Grotesk mono, Helvetica Neue, Arial, sans-serif");
+
 };
 
 module MediaQuery = {

frontend/website/src/components/AnnouncementBar.re

@@ -56,7 +56,7 @@ let make = () => {
     </style>
     <a
       name="announcementbar"
-      href="/genesis"
+      href="/adversarial"
       className=Css.(
         style(
           Theme.paddingX(`rem(1.25))
@@ -87,7 +87,7 @@ let make = () => {
               ]),
             ])
           )>
-          {React.string("Token Program is live")}
+          {React.string("Adversarial Testnet is coming!")}
         </p>
       </div>
       <p
@@ -101,7 +101,7 @@ let make = () => {
             ]),
           ])
         )>
-        {React.string({j|Apply Now\u00A0→|j})}
+        {React.string({j|Sign up \u00A0→|j})}
       </p>
     </a>
   </>;

frontend/website/src/components/MinaButton.re

@@ -0,0 +1,112 @@
+/*
+   TODO: This file was copied from the website-redesign. It was copied over to use the styles
+          that the new website uses. The components that use this component should be updated
+          when they are ported over to the website-redesign.
+ */
+
+module Styles = {
+  open Css;
+
+  let buttonLabel =
+    style([
+      Theme.Typeface.monumentGrotesk,
+      fontSize(`rem(0.75)),
+      fontWeight(`num(500)),
+      lineHeight(`rem(1.)),
+      color(black),
+      textTransform(`uppercase),
+      letterSpacing(`px(1)),
+    ]);
+
+  let button =
+      (
+        bgColor,
+        borderColor,
+        dark,
+        buttonHeight,
+        buttonWidth,
+        paddingX,
+        paddingY,
+      ) =>
+    merge([
+      buttonLabel,
+      style([
+        display(`flex),
+        justifyContent(`center),
+        alignItems(`center),
+        width(buttonWidth),
+        height(buttonHeight),
+        border(`px(1), `solid, borderColor),
+        boxShadow(~x=`px(4), ~y=`px(4), black),
+        backgroundColor(bgColor),
+        borderTopLeftRadius(`px(4)),
+        borderBottomRightRadius(`px(4)),
+        borderTopRightRadius(`px(1)),
+        borderBottomLeftRadius(`px(1)),
+        textDecoration(`none),
+        fontSize(`px(12)),
+        color(
+          {
+            bgColor === Theme.Colors.white ? black : white;
+          },
+        ),
+        padding2(~v=`rem(paddingY), ~h=`rem(paddingX)),
+        textAlign(`center),
+        alignSelf(`center),
+        hover([
+          color(white),
+          boxShadow(~x=`px(0), ~y=`px(0), black),
+          unsafe(
+            "transition",
+            "box-shadow 0.2s ease-in, transform 0.5s ease-in",
+          ),
+          background(
+            {
+              dark
+                ? `url("/static/img/ButtonHoverDark.png")
+                : `url("/static/img/ButtonHoverLight.png");
+            },
+          ),
+        ]),
+      ]),
+    ]);
+};
+
+/**
+ * Button is light by default, and setting dark to true as a prop will make the background image change accordingly.
+ * Buttons have four different colors: orange, mint, black, and white.
+ *
+ */
+[@react.component]
+let make =
+    (
+      ~href="",
+      ~children=?,
+      ~height=`rem(3.25),
+      ~width=`rem(10.9),
+      ~borderColor=Theme.Colors.minaBlack,
+      ~paddingX=1.5,
+      ~paddingY=1.,
+      ~bgColor=Theme.Colors.minaOrange,
+      ~dark=false,
+      ~onClick=?,
+    ) => {
+  <Next.Link href>
+    <button
+      ?onClick
+      className={Styles.button(
+        bgColor,
+        borderColor,
+        dark,
+        height,
+        width,
+        paddingX,
+        paddingY,
+      )}>
+      {switch (children) {
+       | Some(children) => children
+       | None => React.null
+       }}
+    </button>
+  </Next.Link>;
+};

frontend/website/src/components/Nav.re

@@ -272,7 +272,11 @@ module NavWrapper = {
               width(`rem(22.25)),
               media(
                 Theme.MediaQuery.statusLift(keepAnnouncementBar),
-                [width(`rem(22.25)), margin(`auto)],
+                [
+                  width(`percent(100.)),
+                  maxWidth(`rem(28.)),
+                  margin(`auto),
+                ],
               ),
             ])
           )>

frontend/website/src/components/Page.re

@@ -134,6 +134,7 @@ let make =
       ~route=?,
       ~children,
       ~footerColor=Theme.Colors.white,
+      ~showFooter=true,
     ) => {
   let router = Next.Router.useRouter();
   let route = Option.value(route, ~default=router.route);
@@ -174,7 +175,7 @@ let make =
     </Next.Head>
     <Nav />
     <div> children </div>
-    <Footer bgcolor=footerColor />
+    {showFooter ? <Footer bgcolor=footerColor /> : React.null}
     <CookieWarning />
   </>;
 };