Merge pull request #521 from outline/tom/about-page

About page

server/pages/About.js

@@ -36,30 +36,29 @@ export default function About() {
   return (
     <Grid>
       <Helmet>
-        <title>About</title>
+        <title>About Us</title>
       </Helmet>
       <Header>
         <h1>About Us</h1>
-        <p>Lets get to know each others</p>
+        <p>The team behind Outline</p>
       </Header>
       <Content>
         <p>
-          Outline is a wiki and knowledge base built for growing teams. We`re
+          Outline is a wiki and knowledge base built for growing teams. We’re
           focused on speed, usability and extensibility.
         </p>
         <p>
-          The project is maintained by Jori Lallo and Tom Moor. Outline is a
+          The open source project is maintained by Jori Lallo and Tom Moor.
-          open source sideproject for both us which we`re developing along our
+          Having both run venture-backed software startups previously and seeing
-          day jobs. After running both have run venture-backed software startups
+          many similar VC-funded products try and fail while the market need
-          previously and seeing many similar traditional VC-funded products try
+          remained we decided to try a different approach. So don’t worry,
-          and fail whilst the market need remained we decided to try a different
+          Outline is here to last.
-          approach. So don`t worry, Outline is here to last.
         </p>
         <p>
           <i>
-            Outline is currently in public beta. The service will stay free
+            Outline is currently in public beta. The hosted service will stay
-            during this period. After that we will offer Outline free for teams
+            free during this period. After that we will offer Outline free for
-            up to 5 people and have reasonable plans for larger teams.
+            teams up to 5 people and have reasonable plans for larger teams.
           </i>
         </p>
         <Authors>
@@ -69,7 +68,9 @@ export default function About() {
               <strong>Jori Lallo</strong>
             </div>
             <div>
-              <a href="https://twitter.com/jorilallo">@jorilallo</a>
+              <a href="https://twitter.com/jorilallo" target="_blank">
+                @jorilallo
+              </a>
             </div>
           </Author>
 
@@ -79,15 +80,22 @@ export default function About() {
               <strong>Tom Moor</strong>
             </div>
             <div>
-              <a href="https://twitter.com/tommoor">@tommoor</a>
+              <a href="https://twitter.com/tommoor" target="_blank">
+                @tommoor
+              </a>
             </div>
           </Author>
         </Authors>
 
         <h2>Open Source</h2>
         <p>
-          Outline is built by a group of core maintainers, we believe in being
+          Outline is built by a group of core{' '}
-          honest and transparent.
+          <a
+            href="https://github.com/outline/outline/graphs/contributors"
+            target="_blank"
+          >
+            maintainers
+          </a>, we believe in being honest and transparent.
         </p>
         <ul>
           <li>
@@ -113,24 +121,22 @@ export default function About() {
           </li>
         </ul>
         <p>
-          You can view Outline`s source code on{' '}
+          You can view Outline’s source code on{' '}
           <a href="https://github.com/outline/outline">GitHub</a>.
         </p>
         <h2>FAQ</h2>
         <p>
-          <strong>Why would I pay you if I can run Outline myself?</strong>
+          <h3>Why would I pay you if I can run Outline myself?</h3>
-          <br />
+          You don’t have to but you might have better things to do with your
-          You don`t have to but you might have better things to do with your
+          time. When you sign up for Outline, you’ll always be running the
-          time. When you sign up for Outline, you`ll always be running the
+          latest version, have all the features and we’ll answer the questions
-          latest version, have all the features and we`ll answer the questions
+          your team might have. You’ll also help to keep Outline getting better
-          your team might have. And you`ll help us keep Outline getting better
           by supporting us financially.
         </p>
         <p>
-          <strong>Can I use Google/GitHub/etc to signup for Outline?</strong>
+          <h3>Can I use Google/GitHub/etc to signup for Outline?</h3>
-          <br />
           We started with Slack as many teams are already using it and benefit
-          from the integrations. We`ll be adding more login methods soon. Please
+          from the integrations. We’ll be adding more login methods soon. Please
           let us know which one you would like to see next{' '}
           <a
             href="https://spectrum.chat/outline/feature-requests?thread=a851c20d-251a-4c7b-8977-e1438894db51"
@@ -140,20 +146,18 @@ export default function About() {
           </a>.
         </p>
         <p>
-          <strong>How can I export my data if you go away?</strong>
+          <h3>How can I export my data if you go away?</h3>
-          <br />
+          We’re committed on making your data portable. We’ll soon add better
-          We`re committed on making your data portable. We`ll soon add better
           import and export options so you which will let you take your data and
           view it in HTML form or upload to self-hosted Outline. Until then, you
           can do this through our <a href="/developers">API</a>.
         </p>
         <p>
-          <strong>How can I get in touch with you?</strong>
+          <h3>How can I get in touch with you?</h3>
-          <br />
           You can drop us a note on our{' '}
           <a href="https://spectrum.chat/outline">Spectrum</a> community or
           email us at{' '}
-          <a href="mailto://hello@getoutline.com">hello@getoutline.com</a>.
+          <a href="mailto:hello@getoutline.com">hello@getoutline.com</a>.
         </p>
       </Content>
     </Grid>

server/pages/components/Content.js

@@ -4,6 +4,6 @@ import styled from 'styled-components';
 export default styled.div`
   width: 100%;
   max-width: 720px;
-  margin: 0 auto;
+  margin: 0 auto 2em;
   padding: 0 2em;
 `;

shared/styles/base.js

@@ -69,6 +69,10 @@ export default `
     margin-bottom: 1em;
   }
 
+  li {
+    padding: .2em 0;
+  }
+
   hr {
     border: 0;
   height: 0;