diff --git a/landing/footer.react.js b/landing/footer.react.js --- a/landing/footer.react.js +++ b/landing/footer.react.js @@ -32,6 +32,9 @@ Team + + Investors + Terms of Use diff --git a/landing/investors.css b/landing/investors.css new file mode 100644 --- /dev/null +++ b/landing/investors.css @@ -0,0 +1,41 @@ +.wrapper { + padding: 16px 0; + margin: 0 auto 48px auto; + max-width: 1200px; +} + +.header { + font-family: 'iA Writer Duo S', monospace; + font-weight: 500; + line-height: 1.35; + text-align: center; + --scale: calc(0.75rem + 2vw); + --smallest-font-size: 30px; + --largest-font-size: 50px; + --smallest-padding-size: 32px; + --largest-padding-size: 64px; + + padding-bottom: clamp( + var(--smallest-padding-size), + var(--scale), + var(--largest-padding-size) + ); + + font-size: clamp( + var(--smallest-font-size), + var(--scale), + var(--largest-font-size) + ); +} + +div.headingContainer { + text-align: center; + padding-bottom: 72px; +} + +p.subtitle { + max-width: 60ch; + margin: 0 auto; + padding: 0 16px 36px 16px; + font-size: 1.6rem; +} diff --git a/landing/investors.react.js b/landing/investors.react.js new file mode 100644 --- /dev/null +++ b/landing/investors.react.js @@ -0,0 +1,24 @@ +// @flow + +import * as React from 'react'; + +import css from './investors.css'; + +function Investors(): React.Node { + return ( +
+

Investors

+ +
+
+

+ Comm is proud to count over 80 individuals & organizations from + our community as investors. +

+
+
+
+ ); +} + +export default Investors; diff --git a/landing/landing.react.js b/landing/landing.react.js --- a/landing/landing.react.js +++ b/landing/landing.react.js @@ -6,6 +6,7 @@ import AppLanding from './app-landing.react'; import Footer from './footer.react'; import Header from './header.react'; +import Investors from './investors.react'; import Keyservers from './keyservers.react'; import Privacy from './privacy.react'; import QR from './qr.react'; @@ -25,6 +26,7 @@ const onKeyservers = useRouteMatch({ path: '/keyservers' }); const onQR = useRouteMatch({ path: '/qr' }); const onTeam = useRouteMatch({ path: '/team' }); + const onInvestors = useRouteMatch({ path: '/investors' }); const onSIWE = useRouteMatch({ path: '/siwe' }); const activePage = React.useMemo(() => { @@ -42,10 +44,21 @@ return ; } else if (onTeam) { return ; + } else if (onInvestors) { + return ; } else { return ; } - }, [onKeyservers, onPrivacy, onSupport, onTerms, onTeam, onQR, onSIWE]); + }, [ + onKeyservers, + onPrivacy, + onSupport, + onTerms, + onTeam, + onInvestors, + onQR, + onSIWE, + ]); let header =
; if (onQR || onSIWE) {