diff --git a/splash/src/components/header.js b/splash/src/components/header.js
index e36ebc5c646787210ede59820f66af48f448303d..fd965caa76c3903af8050d08feac85007b24d53a 100644
--- a/splash/src/components/header.js
+++ b/splash/src/components/header.js
@@ -1,64 +1,29 @@
import React from 'react'
import PropTypes from 'prop-types'
-import { Link } from 'gatsby'
-import { slide as Menu } from 'react-burger-menu'
import './header.css'
+/**
+ * NOTE: this version of the header corresponds to the version of the site showing
+ * only the shutdown notice posted on 2021-08-20. To see the earlier version of the nav
+ * that we used for actual content, see `components/headerLegacy.js`
+ **/
+
class Header extends React.Component {
constructor(props) {
super(props)
- this.state = {
- menuOpen: true,
- }
- }
-
- handleStateChange(state) {
- this.setState({ menuOpen: state.isOpen })
}
render() {
return (
<header>
- <nav className="nav">
- <Link to="/">
- <h1 className="title">{this.props.siteTitle}</h1>
- </Link>
- <div className="nav__desktop">
- <NavItems />
- </div>
- <div className="nav__mobile">
- <Menu
- itemListElement="div"
- pageWrapId={'container'}
- isOpen={this.state.menuOpen}
- onStateChange={state => this.handleStateChange(state)}
- >
- <NavItems />
- </Menu>
- </div>
+ <nav style={{ justifyContent: 'center' }} className="nav">
+ <h1 className="title">{this.props.siteTitle}</h1>
</nav>
</header>
)
}
}
-const NavItems = () => (
- <React.Fragment>
- <Link to="/about" className="nav__link" activeClassName="active">
- About
- </Link>
- <Link to="/how-to" className="nav__link" activeClassName="active">
- How-to
- </Link>
- <Link to="/donate" className="nav__link" activeClassName="active">
- Donate
- </Link>
- <Link to="/privacy" className="nav__link" activeClassName="active">
- Privacy
- </Link>
- </React.Fragment>
-)
-
Header.propTypes = {
siteTitle: PropTypes.string,
}
diff --git a/splash/src/components/headerLegacy.js b/splash/src/components/headerLegacy.js
new file mode 100644
index 0000000000000000000000000000000000000000..e36ebc5c646787210ede59820f66af48f448303d
--- /dev/null
+++ b/splash/src/components/headerLegacy.js
@@ -0,0 +1,70 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+import { Link } from 'gatsby'
+import { slide as Menu } from 'react-burger-menu'
+import './header.css'
+
+class Header extends React.Component {
+ constructor(props) {
+ super(props)
+ this.state = {
+ menuOpen: true,
+ }
+ }
+
+ handleStateChange(state) {
+ this.setState({ menuOpen: state.isOpen })
+ }
+
+ render() {
+ return (
+ <header>
+ <nav className="nav">
+ <Link to="/">
+ <h1 className="title">{this.props.siteTitle}</h1>
+ </Link>
+ <div className="nav__desktop">
+ <NavItems />
+ </div>
+ <div className="nav__mobile">
+ <Menu
+ itemListElement="div"
+ pageWrapId={'container'}
+ isOpen={this.state.menuOpen}
+ onStateChange={state => this.handleStateChange(state)}
+ >
+ <NavItems />
+ </Menu>
+ </div>
+ </nav>
+ </header>
+ )
+ }
+}
+
+const NavItems = () => (
+ <React.Fragment>
+ <Link to="/about" className="nav__link" activeClassName="active">
+ About
+ </Link>
+ <Link to="/how-to" className="nav__link" activeClassName="active">
+ How-to
+ </Link>
+ <Link to="/donate" className="nav__link" activeClassName="active">
+ Donate
+ </Link>
+ <Link to="/privacy" className="nav__link" activeClassName="active">
+ Privacy
+ </Link>
+ </React.Fragment>
+)
+
+Header.propTypes = {
+ siteTitle: PropTypes.string,
+}
+
+Header.defaultProps = {
+ siteTitle: ``,
+}
+
+export default Header
diff --git a/splash/src/pages/index.js b/splash/src/pages/index.js
index 42ba808cae1fe6976268a883662452e7afb5bdc0..e1e0699f15a4f8a77ec839ac8bad338a581482ab 100644
--- a/splash/src/pages/index.js
+++ b/splash/src/pages/index.js
@@ -1,134 +1,53 @@
import React from 'react'
import Layout from '../components/layout'
import SEO from '../components/seo'
-import { Link } from '@reach/router'
-import indexStyles from '../components/index.module.css'
-import {
- spyIcon,
- selfieIcon,
- moneyIcon,
- calyxLogo,
- mozillaLogo,
-} from '../images/'
+
+/**
+ * NOTE: this version of the index page features the shutdown notice we published
+ * when shutting down the service on 2021-08-20. To view the index page as originally
+ * written, see `pages/indexLegacy.js`
+ **/
const IndexPage = () => (
<Layout>
<SEO title="Signalboost: communicate with mass audiences securely and directly via message broadcasts and hotlines" />
- {/*<p className={indexStyles.outageAlert}>*/}
- {/* ********************************************/}
- {/*</p>*/}
- {/*<h2 className={indexStyles.outageAlert}>OUTAGE ALERT</h2>*/}
- {/*<p>*/}
- {/* (REASON FOR OUTAGE HERE)*/}
- {/*</p>*/}
- {/*<p className={indexStyles.outageAlert}>*/}
- {/* ********************************************/}
- {/*</p>*/}
-
- <div className={indexStyles.personas}>
- <img
- className={indexStyles.icon__left}
- src={selfieIcon}
- alt="Venmo QR code"
- height="150"
- />
- <div className={indexStyles.text__right}>
- <h3>Mass alerts for emergency rapid response</h3>
- <p>
- Our democracy is under attack. Mobilize thousands of people to protect
- our civil rights by sending alerts directly to their phones.
- </p>
- </div>
- <div className={indexStyles.text__left}>
- <h3>
- Anonymous<Link to="/privacy">*</Link> tiplines
- </h3>
- <p>
- Empower journalists, legal observers, and human rights defenders with
- a safe and lightweight way to receive sensitive tips and requests for
- aid without exposing anyone's identity.
- </p>
- </div>
- <img
- className={indexStyles.icon__right}
- src={spyIcon}
- alt="Venmo QR code"
- height="150"
- />
- <img
- className={indexStyles.icon__left}
- src={moneyIcon}
- alt="Venmo QR code"
- height="150"
- />
- <div className={indexStyles.text__right}>
- <h3>Donation and resource coordination</h3>
- <p>
- In the time of Covid-19 and environmental disaster, give organizers on
- the ground a tool to move resources quickly and safely.
- </p>
- </div>
- </div>
+ <blockquote className="command blockquote-skinny">
+ <p>August 20, 2021</p>
+ <p>
+ We regret to inform you that Signalboost as it currently exists is
+ shutting down.
+ </p>
+ <p>
+ Since its inception, serving our users with integrity has been one of
+ Signalboost's most important core values. It's never been easy to be a
+ part of the rapidly changing ecosystem of encrypted messaging, in which
+ the craft of building software and stewarding sensitive data deserves to
+ be handled with resources and care. Despite our best efforts, we've been
+ unable to both sustain ourselves and get the technology to the level of
+ reliability and safety we believe our users deserve. Frankly, we're
+ burnt out!
+ </p>
+ <p>
+ As of today, the Signalboost service has been permanently shut down and,
+ in the interest of privacy, all user data has been permanently
+ destroyed. We remain deeply inspired by the many innovative ways that
+ thousands of dedicated activists have used this tool to push for a more
+ just world, and we apologize for having to bow out when there is so much
+ important work left to do. Toward that end, we are seeking out a
+ better-resourced, movement-aligned organization to adopt the project.
+ You can check for updates on the status of that effort on this page.
+ </p>
+ <p>Thank you so much for your support.</p>
+ <p>✨ 🖤 ✨</p>
+ <p>The Signalboost Team</p>
+ </blockquote>
- <h2 className={indexStyles.why__signalboost}>Why use Signalboost?</h2>
- <p>
- Signalboost gives grassroots organizers the power to communicate with mass
- audiences <span className="purple">securely</span> and{' '}
- <span className="purple">directly</span> via message broadcasts and
- hotlines.
+ <p style={{ textAlign: 'center' }}>
+ You can view an archived version of this site on the{' '}
+ <a href="https://web.archive.org/web/20210416110700/https://signalboost.info/">
+ Wayback Machine
+ </a>
</p>
- <h3>Reach thousands of people directly</h3>
- <ul>
- <li>
- Organizers need quick and direct ways to disseminate information.
- However, on social media platforms, important info is often obscured by
- algorithms and other posts. Signalboost messages go directly to
- subscribers' message inboxes.
- </li>
- <li>
- Organizing in big group chats gets messy quickly and unnecessarily
- exposes strangers' phone numbers to each other. Broadcasts offer a quick
- way disseminate information directly to thousands of people.
- </li>
- </ul>
- <h3>Respond to people individually and privately</h3>
- <ul>
- <li>
- Subscribers to Signalboost channels can send in anonymous messages to
- the hotline and admins can respond directly and privately to that
- subscriber.
- </li>
- <li>
- Subscribers do not see other subscribers' messages to the hotline. Only
- admins can see them.
- </li>
- </ul>
- <h3>Stay safe from surveillance</h3>
- <ul>
- <li>
- Signalboost sends messages over <a href="https://signal.org">Signal</a>,
- the most secure encrypted messaging service for phones.
- </li>
- <li>
- By obscuring personal phone numbers, enforcing disappearing messages,
- and controlling who is allowed to join their channel, Signalboost
- empowers organizers to stay safe while speaking freely.
- </li>
- </ul>
- <div className={indexStyles.getting__started}>
- <Link className={indexStyles.getting__started__link} to="/how-to">
- Try it out →
- </Link>
- </div>
- <h3>Signalboost is supported by:</h3>
- <div className={indexStyles.funders}>
- <img
- className={indexStyles.funder__logo_moz}
- src={mozillaLogo}
- alt="mozilla logo"
- />
- <img src={calyxLogo} height="130" alt="calyx logo" />
- </div>
</Layout>
)
diff --git a/splash/src/pages/indexLegacy.js b/splash/src/pages/indexLegacy.js
new file mode 100644
index 0000000000000000000000000000000000000000..42ba808cae1fe6976268a883662452e7afb5bdc0
--- /dev/null
+++ b/splash/src/pages/indexLegacy.js
@@ -0,0 +1,135 @@
+import React from 'react'
+import Layout from '../components/layout'
+import SEO from '../components/seo'
+import { Link } from '@reach/router'
+import indexStyles from '../components/index.module.css'
+import {
+ spyIcon,
+ selfieIcon,
+ moneyIcon,
+ calyxLogo,
+ mozillaLogo,
+} from '../images/'
+
+const IndexPage = () => (
+ <Layout>
+ <SEO title="Signalboost: communicate with mass audiences securely and directly via message broadcasts and hotlines" />
+ {/*<p className={indexStyles.outageAlert}>*/}
+ {/* ********************************************/}
+ {/*</p>*/}
+ {/*<h2 className={indexStyles.outageAlert}>OUTAGE ALERT</h2>*/}
+ {/*<p>*/}
+ {/* (REASON FOR OUTAGE HERE)*/}
+ {/*</p>*/}
+ {/*<p className={indexStyles.outageAlert}>*/}
+ {/* ********************************************/}
+ {/*</p>*/}
+
+ <div className={indexStyles.personas}>
+ <img
+ className={indexStyles.icon__left}
+ src={selfieIcon}
+ alt="Venmo QR code"
+ height="150"
+ />
+ <div className={indexStyles.text__right}>
+ <h3>Mass alerts for emergency rapid response</h3>
+ <p>
+ Our democracy is under attack. Mobilize thousands of people to protect
+ our civil rights by sending alerts directly to their phones.
+ </p>
+ </div>
+ <div className={indexStyles.text__left}>
+ <h3>
+ Anonymous<Link to="/privacy">*</Link> tiplines
+ </h3>
+ <p>
+ Empower journalists, legal observers, and human rights defenders with
+ a safe and lightweight way to receive sensitive tips and requests for
+ aid without exposing anyone's identity.
+ </p>
+ </div>
+ <img
+ className={indexStyles.icon__right}
+ src={spyIcon}
+ alt="Venmo QR code"
+ height="150"
+ />
+ <img
+ className={indexStyles.icon__left}
+ src={moneyIcon}
+ alt="Venmo QR code"
+ height="150"
+ />
+ <div className={indexStyles.text__right}>
+ <h3>Donation and resource coordination</h3>
+ <p>
+ In the time of Covid-19 and environmental disaster, give organizers on
+ the ground a tool to move resources quickly and safely.
+ </p>
+ </div>
+ </div>
+
+ <h2 className={indexStyles.why__signalboost}>Why use Signalboost?</h2>
+ <p>
+ Signalboost gives grassroots organizers the power to communicate with mass
+ audiences <span className="purple">securely</span> and{' '}
+ <span className="purple">directly</span> via message broadcasts and
+ hotlines.
+ </p>
+ <h3>Reach thousands of people directly</h3>
+ <ul>
+ <li>
+ Organizers need quick and direct ways to disseminate information.
+ However, on social media platforms, important info is often obscured by
+ algorithms and other posts. Signalboost messages go directly to
+ subscribers' message inboxes.
+ </li>
+ <li>
+ Organizing in big group chats gets messy quickly and unnecessarily
+ exposes strangers' phone numbers to each other. Broadcasts offer a quick
+ way disseminate information directly to thousands of people.
+ </li>
+ </ul>
+ <h3>Respond to people individually and privately</h3>
+ <ul>
+ <li>
+ Subscribers to Signalboost channels can send in anonymous messages to
+ the hotline and admins can respond directly and privately to that
+ subscriber.
+ </li>
+ <li>
+ Subscribers do not see other subscribers' messages to the hotline. Only
+ admins can see them.
+ </li>
+ </ul>
+ <h3>Stay safe from surveillance</h3>
+ <ul>
+ <li>
+ Signalboost sends messages over <a href="https://signal.org">Signal</a>,
+ the most secure encrypted messaging service for phones.
+ </li>
+ <li>
+ By obscuring personal phone numbers, enforcing disappearing messages,
+ and controlling who is allowed to join their channel, Signalboost
+ empowers organizers to stay safe while speaking freely.
+ </li>
+ </ul>
+ <div className={indexStyles.getting__started}>
+ <Link className={indexStyles.getting__started__link} to="/how-to">
+ Try it out →
+ </Link>
+ </div>
+ <h3>Signalboost is supported by:</h3>
+ <div className={indexStyles.funders}>
+ <img
+ className={indexStyles.funder__logo_moz}
+ src={mozillaLogo}
+ alt="mozilla logo"
+ />
+ <img src={calyxLogo} height="130" alt="calyx logo" />
+ </div>
+ </Layout>
+)
+
+export default IndexPage