Adding region landing page for registering/signing in from jambonz.org (#37)

src/components/jambonz-ui.js

@@ -144,7 +144,7 @@ export function Hero({ data = {}, subStyle, altStyle, children }) {
         )}
         {data.cta && (
           <div className="hero__cta">
-            <Button href={data.url} target="_blank">{data.cta}</Button>
+            <Button href={data.url}>{data.cta}</Button>
           </div>
         )}
         {children}

src/components/navi.js

@@ -40,7 +40,7 @@ function NaviMobile({ active, handler, siteData }) {
     <div className={classNames(classes)}>
       <div className="navi__mobile__head">
         <div className="navi__mobile__login">
-          <Button href={siteData.navi.login.link} target="_blank" mainStyle="login" subStyle="white">
+          <Button href={siteData.navi.login.link} mainStyle="login" subStyle="white" onClick={handler}>
             {siteData.navi.login.label}
           </Button>
         </div>
@@ -103,7 +103,7 @@ export default function Navi({ siteData }) {
           <Icon mainStyle="fill" name="Menu" />
         </div>
         <div className="navi__login">
-          <Button href={siteData.navi.login.link} target="_blank" mainStyle="login">
+          <Button href={siteData.navi.login.link} mainStyle="login">
             {siteData.navi.login.label}
           </Button>
         </div>

src/styles/_layout.scss

@@ -169,6 +169,10 @@
       left: 0;
       top: 0;
     }
+
+    h1 {
+      color: $jambonz;
+    }
   }
 
   &__wrap {

src/styles/_typography.scss

@@ -107,6 +107,10 @@ em {
   @include mxs();
 }
 
+.med {
+  @include font-medium();
+}
+
 .color--teal {
   color: $teal;
 }

src/styles/global.scss

@@ -57,4 +57,5 @@
 @import 'pages/home.scss';
 @import 'pages/why.scss';
 @import 'pages/pricing.scss';
-@import 'pages/jambonz-ui.scss';
+@import 'pages/jambonz-ui.scss';
+@import 'pages/regions.scss'

src/styles/pages/_regions.scss

@@ -0,0 +1,20 @@
+/******************************************************************************
+ * Regions
+*******************************************************************************/
+.regions {
+  text-align: center;
+  margin-top: 64px;
+
+  &__wrap {
+    @include flex-cols();
+    padding-bottom: 72px;
+  }
+
+  &__icon {
+    padding-bottom: 24px;
+  }
+
+  &__text {
+    color: $black;
+  }
+}