Differential D7911 Diff 29744 landing/hero-content.react.js

Changeset View

Standalone View

landing/hero-content.react.js

	// @flow			// @flow

				import classNames from 'classnames';
	import * as React from 'react';			import * as React from 'react';
	import TextLoop from 'react-text-loop';

	import { assetMetaData } from './asset-meta-data.js';			import { assetMetaData } from './asset-meta-data.js';
	import css from './hero-content.css';			import css from './hero-content.css';
	import SubscriptionForm from './subscription-form.react.js';			import SubscriptionForm from './subscription-form.react.js';
				import typography from './typography.css';

	function HeroContent(): React.Node {			function HeroContent(): React.Node {
	const [hero] = assetMetaData;			const [hero] = assetMetaData;

				const headerClassName = classNames([typography.display3, css.header]);
				const subheaderClassName = classNames([
				typography.subheading2,
				css.subHeader,
				]);

	return (			return (
	<section className={hero.infoStyle}>			<section className={hero.infoStyle}>
	<div className={css.contentWrapper}>			<div className={css.contentWrapper}>
	<h1 className={css.cycling_header}>			<h1 className={headerClassName}>
	{'Comm is crypto-native\nchat for '}			Comm is an encrypted messaging app for <span>communities</span>
	<TextLoop
	interval={1750}
	springConfig={{ stiffness: 180, damping: 16 }}
	>
	<span className={css.cycling_content}>DAOs</span>
	<span className={css.cycling_content}>venture funds</span>
	<span className={css.cycling_content}>open source</span>
	<span className={css.cycling_content}>gaming guilds</span>
	<span className={css.cycling_content}>social clubs</span>
	</TextLoop>
	</h1>			</h1>
	<p className={css.sub_heading}>(think "Web3 Discord")</p>			<p className={subheaderClassName}>
				We extend Signal’s model of E2E encryption with personal servers
				to enable richer functionality.
				</p>
	<SubscriptionForm />			<SubscriptionForm />
	</div>			</div>
	</section>			</section>
	);			);
	}			}

	export default HeroContent;			export default HeroContent;