Page MenuHomePhabricator
Files F3407390

D8078.diff
No OneTemporary
Actions

D8078.diff
View Options

diff --git a/landing/asset-meta-data.js b/landing/asset-meta-data.js
--- a/landing/asset-meta-data.js
+++ b/landing/asset-meta-data.js
@@ -1,14 +1,94 @@
// @flow
+import classNames from 'classnames';
+import * as React from 'react';
+
+import css from './landing.css';
+import typography from './typography.css';
+
+const paragraphClassName = classNames([typography.subheading2, css.paragraph]);
+
export type ImageAsset = {
+alt: string,
+url: string,
};
+export type Asset = {
+ +containerClassName: string,
+ +colorHeader: boolean,
+ +headerTextContent: string,
+ +infoBlockContent: React.Node,
+ +navLinkDestination: string,
+ +linkTextContent: string,
+};
+
export const assetsCacheURLPrefix = 'https://dh9fld3hutpxf.cloudfront.net';
-export const imageAssetMetaData = [
+export const imageAssetMetaData: $ReadOnlyArray<ImageAsset> = [
{
alt: 'hero image showcasing Comm',
url: `${assetsCacheURLPrefix}/hero`,
},
];
+
+export const assetMetaData: $ReadOnlyArray<Asset> = [
+ {
+ containerClassName: css.keyserverInfo,
+ colorHeader: true,
+ headerTextContent: 'Own your data with keyservers',
+ infoBlockContent: (
+ <>
+ <p className={paragraphClassName}>
+ Comm&rsquo;s central innovation is the idea of the keyserver: a
+ personal, private server.
+ </p>
+ <p className={paragraphClassName}>
+ E2E-encrypted apps today are limited because they have to do
+ everything locally, on the user&rsquo;s device. In contrast,
+ unencrypted apps are able to rely on servers in the cloud to handle
+ queries and background processing, in turn allowing these apps to
+ support more sophisticated functionality.
+ </p>
+ <p className={paragraphClassName}>
+ But what if people had their own servers? Keyservers enable Comm to
+ offer the best of both worlds: Signal-level privacy with a
+ Telegram-level feature set.
+ </p>
+ </>
+ ),
+ navLinkDestination: '/keyservers',
+ linkTextContent: 'Learn more about keyservers',
+ },
+ {
+ containerClassName: css.teamInfo,
+ colorHeader: false,
+ headerTextContent: 'Our story and vision',
+ infoBlockContent: (
+ <>
+ <p className={paragraphClassName}>
+ <span>Comm was founded by&nbsp;</span>
+ <a
+ href="https://ashoat.com/"
+ target="_blank"
+ rel="noreferrer"
+ className={css.link}
+ >
+ Ashoat
+ </a>
+ <span>
+ &nbsp;after his experiences trying to add E2E encryption to a social
+ calendaring app exposed the limits of contemporary cryptographic
+ approaches. He realized why E2E apps were so limited in
+ functionality: the lack of a server layer meant that everything had
+ to be done on a phone.
+ </span>
+ </p>
+ <p className={paragraphClassName}>
+ Comm&rsquo;s vision is a world where people own their own data. We
+ believe that in the future, everybody will have a server.
+ </p>
+ </>
+ ),
+ navLinkDestination: '/team',
+ linkTextContent: 'Learn more about our team',
+ },
+];
diff --git a/landing/landing.css b/landing/landing.css
--- a/landing/landing.css
+++ b/landing/landing.css
@@ -25,3 +25,32 @@
.pageContentContainer {
position: relative;
}
+
+.keyserverInfo {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ background-color: var(--light-dark-page-background);
+}
+
+.teamInfo {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+}
+
+.paragraph {
+ color: var(--white-100);
+ margin-bottom: 40px;
+}
+
+.link {
+ color: inherit;
+ text-decoration: underline;
+ transition: color 150ms;
+}
+
+.link:hover {
+ color: var(--violet-dark-100);
+ transition: color 150ms;
+}
diff --git a/landing/use-pre-load-image-assets.react.js b/landing/use-pre-load-image-assets.react.js
--- a/landing/use-pre-load-image-assets.react.js
+++ b/landing/use-pre-load-image-assets.react.js
@@ -4,7 +4,7 @@
import { type ImageAsset } from './asset-meta-data.js';
-function usePreloadImageAssets(assets: ImageAsset[]) {
+function usePreloadImageAssets(assets: $ReadOnlyArray<ImageAsset>) {
React.useEffect(() => {
const testWEBP = 'UklGRiIAAABXRUJQVlA4IBYAAAAwAQCdASoBAAEADsD+JaQAA3AAAAAA';
const testImg = new Image();

File Metadata

Mime Type
text/plain
Expires
Thu, Dec 5, 5:56 AM (14 h, 34 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2616143
Default Alt Text
D8078.diff (4 KB)

Event Timeline