chore: Remove marketing material from OSS project (#941)
* changes to support Plainhome * changes to env sample * changes to env variable names * formatter fixes * remove the content pages * test fix * lint fixes * minor fixes * removed unnesscary routes * Apply suggestions from code review Co-Authored-By: Tom Moor <tom.moor@gmail.com> * removed team name from env
This commit is contained in:
Himanshu Agarwal
Tom Moor
parent
dce0c4ac73
commit
f06097d9e8
|
|
@ -55,4 +55,6 @@ SMTP_PORT=
|
|||
SMTP_USERNAME=
|
||||
SMTP_PASSWORD=
|
||||
SMTP_FROM_EMAIL=
|
||||
SMTP_REPLY_EMAIL=
|
||||
SMTP_REPLY_EMAIL=
|
||||
|
||||
TEAM_LOGO=https://example.com/images/logo.png
|
||||
|
|
|
|||
4
app.json
4
app.json
|
|
@ -142,6 +142,10 @@
|
|||
"GITHUB_ACCESS_TOKEN": {
|
||||
"description": "An API token for GitHub, optional for self hosted (optional)",
|
||||
"required": false
|
||||
},
|
||||
"TEAM_LOGO": {
|
||||
"description": "A logo that will be displayed on the signed out home page",
|
||||
"required": false
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,122 +0,0 @@
|
|||
// @flow
|
||||
import * as React from 'react';
|
||||
import styled from 'styled-components';
|
||||
import Grid from 'styled-components-grid';
|
||||
import PageTitle from './components/PageTitle';
|
||||
import Header from './components/Header';
|
||||
import Content from './components/Content';
|
||||
|
||||
const List = styled('ul')`
|
||||
padding-left: 1em;
|
||||
`;
|
||||
|
||||
export default function About() {
|
||||
return (
|
||||
<Grid>
|
||||
<PageTitle title="About" />
|
||||
|
||||
<Header background="#F4F7FA">
|
||||
<h1>About</h1>
|
||||
<p>The ideas behind Outline</p>
|
||||
</Header>
|
||||
<Content>
|
||||
<p>
|
||||
Outline is a wiki and knowledge base built for growing teams. We’re
|
||||
focused on speed, usability and extensibility.
|
||||
</p>
|
||||
<p>
|
||||
The project consists of an{' '}
|
||||
<a
|
||||
href="https://github.com/outline/outline"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
Open Source core
|
||||
</a>{' '}
|
||||
which can be hosted on your own infrastructure and a paid, hosted,
|
||||
service (you’re looking at it!) that provides income for continued
|
||||
feature development and maintenance.
|
||||
</p>
|
||||
|
||||
<Grid>
|
||||
<Grid.Unit size={{ tablet: 3 / 7 }}>
|
||||
<h2>Open Source</h2>
|
||||
<p>
|
||||
Most software products today are built to be closed source, so why
|
||||
make the code public? We believe there are many advantages to
|
||||
doing so:
|
||||
</p>
|
||||
<List>
|
||||
<li>
|
||||
<strong>Accountability.</strong> Being open source helps to keep
|
||||
the team accountable for progress, code quality, communication,
|
||||
and roadmap.
|
||||
</li>
|
||||
<li>
|
||||
<strong>Community.</strong> We’re building a community of
|
||||
like-minded people that can contribute plugins, integrations,
|
||||
and fixes to the project that will benefit everyone.
|
||||
</li>
|
||||
<li>
|
||||
<strong>Marketing.</strong> Every product needs a wedge into the
|
||||
market. Being open source offers many opportunities to spread
|
||||
the project.
|
||||
</li>
|
||||
<li>
|
||||
<strong>Security.</strong> We take privacy of your data
|
||||
extremely seriously. Getting more eyes on the code makes us more
|
||||
confident that Outline is as secure as possible.
|
||||
</li>
|
||||
<li>
|
||||
<strong>Peace of Mind.</strong> A lot of software products are
|
||||
shut down and disappear, in the worst case scenario you’ll
|
||||
always be able to run your own copy of Outline.
|
||||
</li>
|
||||
</List>
|
||||
</Grid.Unit>
|
||||
<Grid.Unit size={{ tablet: 1 / 7 }} />
|
||||
<Grid.Unit size={{ tablet: 3 / 7 }}>
|
||||
<h2>FAQ</h2>
|
||||
<p>
|
||||
<h3>Why would I pay you if I can run Outline myself?</h3>
|
||||
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
|
||||
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 by supporting us financially.
|
||||
</p>
|
||||
<p>
|
||||
<h3>Can I use X to signin to Outline?</h3>
|
||||
We started with Slack and Google as many teams are already using
|
||||
these services for team identity. We’ll consider 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"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
here
|
||||
</a>.
|
||||
</p>
|
||||
<p>
|
||||
<h3>How can I export my data if you go away?</h3>
|
||||
Outline includes the ability to export individual documents,
|
||||
collections or your entire knowledge base to markdown with a
|
||||
single click so you’re never locked in. We also have an extensive{' '}
|
||||
<a href="/developers">API</a> that can be used for accessing
|
||||
documents programatically.
|
||||
</p>
|
||||
<p>
|
||||
<h3>How can I get in touch with you?</h3>
|
||||
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>.
|
||||
</p>
|
||||
</Grid.Unit>
|
||||
</Grid>
|
||||
</Content>
|
||||
</Grid>
|
||||
);
|
||||
}
|
||||
|
|
@ -3,16 +3,11 @@ import * as React from 'react';
|
|||
import { Helmet } from 'react-helmet';
|
||||
import styled from 'styled-components';
|
||||
import Grid from 'styled-components-grid';
|
||||
import breakpoint from 'styled-components-breakpoint';
|
||||
import AuthErrors from './components/AuthErrors';
|
||||
import Hero from './components/Hero';
|
||||
import HeroText from './components/HeroText';
|
||||
import Centered from './components/Centered';
|
||||
import SigninButtons from './components/SigninButtons';
|
||||
import SlackLogo from '../../shared/components/SlackLogo';
|
||||
import GithubLogo from '../../shared/components/GithubLogo';
|
||||
import Flex from '../../shared/components/Flex';
|
||||
import { githubUrl, slackAppStoreUrl } from '../../shared/utils/routeHelpers';
|
||||
import { githubUrl } from '../../shared/utils/routeHelpers';
|
||||
|
||||
type Props = {
|
||||
notice?: 'google-hd' | 'auth-error' | 'hd-not-allowed',
|
||||
|
|
@ -30,7 +25,8 @@ function Home(props: Props) {
|
|||
<Grid>
|
||||
<Hero id="signin">
|
||||
<AuthErrors notice={props.notice} />
|
||||
<h1>Your team’s knowledge base</h1>
|
||||
{process.env.TEAM_LOGO && <Logo src={process.env.TEAM_LOGO} />}
|
||||
<h1>Our team’s knowledge base</h1>
|
||||
<HeroText>
|
||||
Team wiki, documentation, meeting notes, playbooks, onboarding, work
|
||||
logs, brainstorming, & more…
|
||||
|
|
@ -38,186 +34,18 @@ function Home(props: Props) {
|
|||
<p>
|
||||
<SigninButtons {...props} />
|
||||
</p>
|
||||
<p>
|
||||
<a href={githubUrl()}>Powered by Outline</a>
|
||||
</p>
|
||||
</Hero>
|
||||
<Mask>
|
||||
<Features>
|
||||
<Centered>
|
||||
<Grid reverse={{ mobile: true, tablet: false, desktop: false }}>
|
||||
<Grid.Unit size={{ tablet: 1 / 3 }}>
|
||||
<Feature>
|
||||
<h2>Improve Communication</h2>
|
||||
<p>
|
||||
Easily structure your team’s information in one central,
|
||||
structured location. No more hunting through folders or
|
||||
scanning pages of search results and chat conversations.
|
||||
</p>
|
||||
</Feature>
|
||||
<Feature>
|
||||
<h2>Safe & Secure</h2>
|
||||
<p>
|
||||
Outline provides a secure place for your team’s
|
||||
documentation on our hosted platform, stored in portable
|
||||
Markdown format. Or, you can run your own copy – it’s open
|
||||
source!
|
||||
</p>
|
||||
</Feature>
|
||||
</Grid.Unit>
|
||||
<Feature size={{ tablet: 2 / 3 }}>
|
||||
<Screenshot
|
||||
srcSet="screenshot.png, screenshot@2x.png 2x"
|
||||
src="/screenshot@2x.png"
|
||||
alt="Outline Screenshot"
|
||||
/>
|
||||
</Feature>
|
||||
</Grid>
|
||||
</Centered>
|
||||
</Features>
|
||||
</Mask>
|
||||
<Centered id="features">
|
||||
<Grid>
|
||||
<Feature size={{ desktop: 1 / 3 }}>
|
||||
<h2>Blazing Fast</h2>
|
||||
<p>
|
||||
Outline is fast, really fast. We’ve worked hard to ensure
|
||||
millisecond response times – documents load instantly, search is
|
||||
speedy and navigating the UI is delightful.
|
||||
</p>
|
||||
</Feature>
|
||||
<Feature size={{ desktop: 1 / 3 }} />
|
||||
<Feature size={{ desktop: 1 / 3 }}>
|
||||
<h2>Markdown Support</h2>
|
||||
<p>
|
||||
Documents are stored in plain Markdown making editing, import
|
||||
and export painless. Shortcuts are also built right into the
|
||||
editor so you can easily format using **markdown syntax** if you
|
||||
like.
|
||||
</p>
|
||||
</Feature>
|
||||
<Feature size={{ desktop: 1 / 3 }}>
|
||||
<h2>
|
||||
<SlackLogo fill="#000" size={30} /> Slack & API
|
||||
</h2>
|
||||
<p>
|
||||
Get Slack notifications about changes and search Outline
|
||||
directly within Slack using the{' '}
|
||||
<code>/outline <keyword></code> command. Access your
|
||||
information programatically through the modern API.
|
||||
</p>
|
||||
<p>
|
||||
<a href={slackAppStoreUrl()}>Slack App</a>
|
||||
</p>
|
||||
</Feature>
|
||||
<Feature size={{ desktop: 1 / 3 }} />
|
||||
<Feature size={{ desktop: 1 / 3 }}>
|
||||
<h2>
|
||||
<GithubLogo fill="#000" size={30} /> Open Source
|
||||
</h2>
|
||||
<p>
|
||||
Outline is open source, so the community can help improve it
|
||||
too. You get new features, interface improvements, bug fixes,
|
||||
and a transparent roadmap for free.
|
||||
</p>
|
||||
<p>
|
||||
<a href={githubUrl()}>GitHub</a>
|
||||
</p>
|
||||
</Feature>
|
||||
</Grid>
|
||||
</Centered>
|
||||
<Footer>
|
||||
<Centered>
|
||||
<Grid>
|
||||
<Grid.Unit size={{ desktop: 1 / 3 }}>
|
||||
<h2>Create an account</h2>
|
||||
<p>
|
||||
On the same page as us? Create a free account to give Outline
|
||||
a try with your team.
|
||||
</p>
|
||||
</Grid.Unit>
|
||||
<Grid.Unit size={{ desktop: 2 / 3 }}>
|
||||
<Flex justify="center" align="center">
|
||||
<SigninButtons {...props} />
|
||||
</Flex>
|
||||
</Grid.Unit>
|
||||
</Grid>
|
||||
</Centered>
|
||||
</Footer>
|
||||
</Grid>
|
||||
</span>
|
||||
);
|
||||
}
|
||||
|
||||
const Screenshot = styled.img`
|
||||
width: 100%;
|
||||
box-shadow: 0 0 80px 0 rgba(124, 124, 124, 0.5),
|
||||
0 0 10px 0 rgba(237, 237, 237, 0.5);
|
||||
border-radius: 5px;
|
||||
|
||||
${breakpoint('desktop')`
|
||||
margin-top: -120px;
|
||||
margin-left: 120px;
|
||||
width: 135%;
|
||||
`};
|
||||
`;
|
||||
|
||||
const Mask = styled.div`
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
padding: 8em 0;
|
||||
`;
|
||||
|
||||
const Features = styled.div`
|
||||
background: #00adff;
|
||||
padding: 0 2em;
|
||||
width: 100%;
|
||||
`;
|
||||
|
||||
const Feature = styled(Grid.Unit)`
|
||||
padding: 2em 0;
|
||||
|
||||
p {
|
||||
font-weight: 500;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
h2 {
|
||||
display: flex;
|
||||
font-size: 1.8em;
|
||||
align-items: center;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
color: ${props => props.theme.black};
|
||||
text-decoration: underline;
|
||||
text-transform: uppercase;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
${breakpoint('tablet')`
|
||||
padding: 4em 0;
|
||||
`};
|
||||
`;
|
||||
|
||||
const Footer = styled.div`
|
||||
background: #aa34f0;
|
||||
text-align: left;
|
||||
width: 100%;
|
||||
padding: 4em 2em;
|
||||
|
||||
h2 {
|
||||
font-size: 1.8em;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
${breakpoint('tablet')`
|
||||
margin: 2em 0;
|
||||
padding: 6em 4em;
|
||||
`};
|
||||
const Logo = styled.img`
|
||||
height: 60px;
|
||||
border-radius: 4px;
|
||||
`;
|
||||
|
||||
export default Home;
|
||||
|
|
|
|||
|
|
@ -1,203 +0,0 @@
|
|||
// @flow
|
||||
import * as React from 'react';
|
||||
import styled from 'styled-components';
|
||||
import breakpoint from 'styled-components-breakpoint';
|
||||
import Grid from 'styled-components-grid';
|
||||
import PageTitle from './components/PageTitle';
|
||||
import Header from './components/Header';
|
||||
import Content from './components/Content';
|
||||
import Button from './components/Button';
|
||||
import Notice from '../../shared/components/Notice';
|
||||
import { mailToUrl, githubUrl } from '../../shared/utils/routeHelpers';
|
||||
|
||||
export default function Pricing() {
|
||||
return (
|
||||
<Grid>
|
||||
<PageTitle title="Pricing" />
|
||||
<Header background="#00adff">
|
||||
<h1>Our Pricing</h1>
|
||||
<p>Our pricing is simple. You’ll only pay for what you use.</p>
|
||||
</Header>
|
||||
<Content>
|
||||
<Grid>
|
||||
<Plan
|
||||
size={{ desktop: 1 / 2 }}
|
||||
itemScope
|
||||
itemType="http://schema.org/Product"
|
||||
>
|
||||
<div>
|
||||
<Name itemProp="name">Free</Name>
|
||||
<Price>
|
||||
<span itemProp="priceCurrency" content="USD">
|
||||
$
|
||||
</span>
|
||||
<span itemProp="price">0</span>
|
||||
</Price>
|
||||
</div>
|
||||
<div itemProp="description">
|
||||
<h4>Top features:</h4>
|
||||
<ul>
|
||||
<li>Upto 5 team members</li>
|
||||
<li>Unlimited documents</li>
|
||||
<li>All integrations</li>
|
||||
<li>API access</li>
|
||||
</ul>
|
||||
</div>
|
||||
</Plan>
|
||||
<Plan
|
||||
size={{ desktop: 1 / 2 }}
|
||||
itemScope
|
||||
itemType="http://schema.org/Product"
|
||||
>
|
||||
<div>
|
||||
<Name itemProp="name">Standard</Name>
|
||||
<Price>
|
||||
<span itemProp="priceCurrency" content="USD">
|
||||
$
|
||||
</span>
|
||||
<span itemProp="price">5</span>{' '}
|
||||
<Period>
|
||||
<strong>per seat</strong> per month
|
||||
</Period>
|
||||
</Price>
|
||||
</div>
|
||||
<div itemProp="description">
|
||||
<h4>Top features:</h4>
|
||||
<ul>
|
||||
<li>Unlimited team members</li>
|
||||
<li>Unlimited documents</li>
|
||||
<li>Unlimited version history</li>
|
||||
<li>Email support</li>
|
||||
</ul>
|
||||
</div>
|
||||
<Notice>
|
||||
Note: Outline is in Beta. This plan is currently free until public
|
||||
release in Q1 2019.
|
||||
</Notice>
|
||||
</Plan>
|
||||
</Grid>
|
||||
</Content>
|
||||
<Content>
|
||||
<Centered>
|
||||
<br />
|
||||
<h2>Self Hosted</h2>
|
||||
<p>Host your own instance on-premise or in the cloud.</p>
|
||||
</Centered>
|
||||
<Grid>
|
||||
<Plan
|
||||
size={{ desktop: 1 / 2 }}
|
||||
itemScope
|
||||
itemType="http://schema.org/Product"
|
||||
>
|
||||
<div>
|
||||
<Name itemProp="name">Open Source</Name>
|
||||
<Price>
|
||||
<span itemProp="priceCurrency" content="USD">
|
||||
$
|
||||
</span>
|
||||
<span itemProp="price">0</span>
|
||||
</Price>
|
||||
</div>
|
||||
<p itemProp="description">
|
||||
Outline’s codebase is open source. If you wish to run the service
|
||||
on your own infrastructure you can do so.
|
||||
</p>
|
||||
<Centered>
|
||||
<Button href={githubUrl()} target="_blank">
|
||||
Source Code
|
||||
</Button>
|
||||
</Centered>
|
||||
</Plan>
|
||||
<Plan
|
||||
size={{ desktop: 1 / 2 }}
|
||||
itemScope
|
||||
itemType="http://schema.org/Product"
|
||||
>
|
||||
<div>
|
||||
<Name itemProp="name">Enterprise</Name>
|
||||
<Price>
|
||||
<span itemProp="priceCurrency" content="USD">
|
||||
$
|
||||
</span>
|
||||
<span itemProp="price">199</span> <Period>per month</Period>
|
||||
</Price>
|
||||
</div>
|
||||
|
||||
<p itemProp="description">
|
||||
Support continued development of Outline. Get dedicated support
|
||||
with setup, maintainence, and product issues.
|
||||
</p>
|
||||
<Centered>
|
||||
<Button href={mailToUrl()}>Contact Us</Button>
|
||||
</Centered>
|
||||
</Plan>
|
||||
</Grid>
|
||||
</Content>
|
||||
</Grid>
|
||||
);
|
||||
}
|
||||
|
||||
const Plan = styled(Grid.Unit)`
|
||||
padding: 2em 0;
|
||||
position: relative;
|
||||
|
||||
&:before {
|
||||
display: none;
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: ${props => props.theme.smoke};
|
||||
transform: skewX(2deg);
|
||||
z-index: -1;
|
||||
margin: 0 2em;
|
||||
|
||||
${breakpoint('tablet')`
|
||||
display: block;
|
||||
`};
|
||||
}
|
||||
|
||||
${breakpoint('tablet')`
|
||||
padding: 2em 6em;
|
||||
`};
|
||||
|
||||
ul {
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
|
||||
li {
|
||||
&:before {
|
||||
content: '✓';
|
||||
margin-right: 6px;
|
||||
font-weight: 600;
|
||||
color: ${props => props.theme.primary};
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const Centered = styled.div`
|
||||
text-align: center;
|
||||
`;
|
||||
|
||||
const Name = styled.h3`
|
||||
text-align: center;
|
||||
`;
|
||||
|
||||
const Price = styled.h2`
|
||||
text-align: center;
|
||||
font-size: 2.5em;
|
||||
min-height: 90px;
|
||||
margin-top: 0;
|
||||
|
||||
span {
|
||||
font-size: 1em;
|
||||
}
|
||||
`;
|
||||
|
||||
const Period = styled.p`
|
||||
font-size: 13px;
|
||||
color: ${props => props.theme.slateDark};
|
||||
`;
|
||||
|
|
@ -1,172 +0,0 @@
|
|||
// @flow
|
||||
import * as React from 'react';
|
||||
import Grid from 'styled-components-grid';
|
||||
import PageTitle from './components/PageTitle';
|
||||
import Header from './components/Header';
|
||||
import Content from './components/Content';
|
||||
|
||||
export default function Privacy() {
|
||||
return (
|
||||
<Grid>
|
||||
<PageTitle title="Privacy Policy" />
|
||||
<Header background="#F4F7FA">
|
||||
<h1>Privacy Policy</h1>
|
||||
<p>How we collect and use your information</p>
|
||||
</Header>
|
||||
<Content>
|
||||
<p>
|
||||
Your privacy is critically important to us. At Outline we have a few
|
||||
fundamental principles:
|
||||
</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
We don’t ask you for personal information unless we truly need it.
|
||||
</li>
|
||||
<li>
|
||||
We don’t share your personal information with anyone except to
|
||||
comply with the law, develop our products, or protect our rights.
|
||||
</li>
|
||||
<li>
|
||||
We don’t store personal information on our servers unless required
|
||||
for the on-going operation of one of our services.
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<p>
|
||||
If you have questions about deleting or correcting your personal data
|
||||
please contact our support team.
|
||||
</p>
|
||||
|
||||
<p>
|
||||
Outline operates website getoutline.com. It is Outline’s policy to
|
||||
respect your privacy regarding any information we may collect while
|
||||
operating our websites.
|
||||
</p>
|
||||
|
||||
<h3>Website Visitors</h3>
|
||||
<p>
|
||||
Like most website operators, Outline collects
|
||||
non-personally-identifying information of the sort that web browsers
|
||||
and servers typically make available, such as the browser type,
|
||||
language preference, referring site, and the date and time of each
|
||||
visitor request. Outline’s purpose in collecting non-personally
|
||||
identifying information is to better understand how Outline’s visitors
|
||||
use its website. From time to time, Outline may release
|
||||
non-personally-identifying information in the aggregate, e.g., by
|
||||
publishing a report on trends in the usage of its website. Outline
|
||||
also collects potentially personally-identifying information like
|
||||
Internet Protocol (IP) addresses for logged in users.
|
||||
</p>
|
||||
|
||||
<h3>Gathering of Personally-Identifying Information</h3>
|
||||
|
||||
<p>
|
||||
Certain visitors to Outline’s websites choose to interact with Outline
|
||||
in ways that require Outline to gather personally-identifying
|
||||
information. The amount and type of information that Outline gathers
|
||||
depends on the nature of the interaction. For example, we ask visitors
|
||||
who sign up to provide an email address or get it with authentication
|
||||
partner. Those who engage in transactions with Outline are asked to
|
||||
provide additional information, including as necessary the personal
|
||||
and financial information required to process those transactions. In
|
||||
each case, Outline collects such information only insofar as is
|
||||
necessary or appropriate to fulfill the purpose of the visitor’s
|
||||
interaction with Outline. Outline does not disclose
|
||||
personally-identifying information other than as described below. And
|
||||
visitors can always refuse to supply personally-identifying
|
||||
information, with the caveat that it may prevent them from engaging in
|
||||
certain website-related activities.
|
||||
</p>
|
||||
|
||||
<h3>Aggregated Statistics</h3>
|
||||
|
||||
<p>
|
||||
Outline may collect statistics about the behavior of visitors to its
|
||||
websites. For instance, Outline may monitor the most popular links or
|
||||
screen the links help identify spam. Outline may display this
|
||||
information publicly or provide it to others. However, Outline does
|
||||
not disclose personally-identifying information other than as
|
||||
described below.
|
||||
</p>
|
||||
|
||||
<h3>Protection of Certain Personally-Identifying Information</h3>
|
||||
|
||||
<p>
|
||||
Outline discloses potentially personally-identifying and
|
||||
personally-identifying information only to those of its employees,
|
||||
contractors and affiliated organizations that (i) need to know that
|
||||
information in order to process it on Outline’s behalf or to provide
|
||||
services available at Outline’s websites, and (ii) that have agreed
|
||||
not to disclose it to others. Some of those employees, contractors and
|
||||
affiliated organizations may be located outside of your home country;
|
||||
by using Outline’s websites, you consent to the transfer of such
|
||||
information to them. Outline will not rent or sell potentially
|
||||
personally-identifying and personally-identifying information to
|
||||
anyone. Other than to its employees, contractors and affiliated
|
||||
organizations, as described above, Outline discloses potentially
|
||||
personally-identifying and personally-identifying information only in
|
||||
response to a subpoena, court order or other governmental request, or
|
||||
when Outline believes in good faith that disclosure is reasonably
|
||||
necessary to protect the property or rights of Outline, third parties
|
||||
or the public at large.
|
||||
</p>
|
||||
<p>
|
||||
If you are a registered user of an Outline website and have supplied
|
||||
your email address, Outline may occasionally send you an email to tell
|
||||
you about new features, solicit your feedback, or just keep you up to
|
||||
date with what’s going on with Outline and our products. We primarily
|
||||
use our various product blogs to communicate this type of information,
|
||||
so we expect to keep this type of email to a minimum. If you send us a
|
||||
request (for example via a support email or via one of our feedback
|
||||
mechanisms), we reserve the right to publish it in order to help us
|
||||
clarify or respond to your request or to help us support other users.
|
||||
Outline takes all measures reasonably necessary to protect against the
|
||||
unauthorized access, use, alteration or destruction of potentially
|
||||
personally-identifying and personally-identifying information.
|
||||
</p>
|
||||
|
||||
<h3>Cookies</h3>
|
||||
<p>
|
||||
A cookie is a string of information that a website stores on a
|
||||
visitor’s computer, and that the visitor’s browser provides to the
|
||||
website each time the visitor returns. Outline uses cookies to help
|
||||
Outline identify and track visitors, their usage of Outline website,
|
||||
and their website access preferences. Outline visitors who do not wish
|
||||
to have cookies placed on their computers should set their browsers to
|
||||
refuse cookies before using Outline’s websites, with the drawback that
|
||||
certain features of Outline’s websites may not function properly
|
||||
without the aid of cookies.
|
||||
</p>
|
||||
|
||||
<h3>Business Transfers</h3>
|
||||
<p>
|
||||
If Outline, or substantially all of its assets, were acquired, or in
|
||||
the unlikely event that Outline goes out of business or enters
|
||||
bankruptcy, user information would be one of the assets that is
|
||||
transferred or acquired by a third party. You acknowledge that such
|
||||
transfers may occur, and that any acquirer of Outline may continue to
|
||||
use your personal information as set forth in this policy.
|
||||
</p>
|
||||
|
||||
<h3>Privacy Policy Changes</h3>
|
||||
<p>
|
||||
Although most changes are likely to be minor, Outline may change its
|
||||
Privacy Policy from time to time, and in Outline’s sole discretion.
|
||||
Outline encourages visitors to frequently check this page for any
|
||||
changes to its Privacy Policy. Your continued use of this site after
|
||||
any change in this Privacy Policy will constitute your acceptance of
|
||||
such change.
|
||||
</p>
|
||||
|
||||
<hr />
|
||||
<p>
|
||||
<small>
|
||||
CC BY-SA 2.5. Modified from{' '}
|
||||
<a href="http://www.automattic.com">Automattic</a> Privacy Policy
|
||||
</small>
|
||||
</p>
|
||||
</Content>
|
||||
</Grid>
|
||||
);
|
||||
}
|
||||
|
|
@ -3,7 +3,6 @@ import * as React from 'react';
|
|||
import { Helmet } from 'react-helmet';
|
||||
import styled from 'styled-components';
|
||||
import breakpoint from 'styled-components-breakpoint';
|
||||
import { TopNavigation, BottomNavigation } from './Navigation';
|
||||
import Analytics from './Analytics';
|
||||
import GlobalStyles from '../../../shared/styles/globals';
|
||||
import prefetchTags from '../../utils/prefetchTags';
|
||||
|
|
@ -66,11 +65,7 @@ function Layout({ children, loggedIn, sessions }: Props) {
|
|||
{'{{HEAD}}'}
|
||||
{'{{CSS}}'}
|
||||
</head>
|
||||
<Body>
|
||||
<TopNavigation sessions={sessions} loggedIn={loggedIn} />
|
||||
{children}
|
||||
<BottomNavigation />
|
||||
</Body>
|
||||
<Body>{children}</Body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,263 +0,0 @@
|
|||
// @flow
|
||||
import * as React from 'react';
|
||||
import { sortBy } from 'lodash';
|
||||
import styled from 'styled-components';
|
||||
import breakpoint from 'styled-components-breakpoint';
|
||||
import Centered from './Centered';
|
||||
import OutlineLogo from '../../../shared/components/OutlineLogo';
|
||||
import TeamLogo from '../../../shared/components/TeamLogo';
|
||||
import { fadeAndScaleIn } from '../../../shared/styles/animations';
|
||||
import {
|
||||
developers,
|
||||
changelog,
|
||||
pricing,
|
||||
about,
|
||||
integrations,
|
||||
privacy,
|
||||
githubUrl,
|
||||
twitterUrl,
|
||||
spectrumUrl,
|
||||
} from '../../../shared/utils/routeHelpers';
|
||||
|
||||
type Sessions = {
|
||||
[subdomain: string]: {
|
||||
name: string,
|
||||
logoUrl: string,
|
||||
expires: string,
|
||||
url: string,
|
||||
},
|
||||
};
|
||||
|
||||
type Props = {
|
||||
sessions: ?Sessions,
|
||||
loggedIn: boolean,
|
||||
};
|
||||
|
||||
function TopNavigation({ sessions, loggedIn }: Props) {
|
||||
const orderedSessions = sortBy(sessions, 'name');
|
||||
|
||||
return (
|
||||
<Nav>
|
||||
<Brand href={process.env.URL}>
|
||||
<OutlineLogo size={18} fill="#000" /> Outline
|
||||
</Brand>
|
||||
<Menu>
|
||||
<MenuItemDesktop>
|
||||
<a href={integrations()}>Integrations</a>
|
||||
</MenuItemDesktop>
|
||||
{process.env.DEPLOYMENT === 'hosted' && (
|
||||
<MenuItem>
|
||||
<a href={pricing()}>Pricing</a>
|
||||
</MenuItem>
|
||||
)}
|
||||
<MenuItemDesktop>
|
||||
<a href={changelog()}>Changelog</a>
|
||||
</MenuItemDesktop>
|
||||
<MenuItemDesktop>
|
||||
<a href={developers()}>API</a>
|
||||
</MenuItemDesktop>
|
||||
{loggedIn ? (
|
||||
<React.Fragment>
|
||||
{process.env.SUBDOMAINS_ENABLED === 'true' &&
|
||||
orderedSessions.length ? (
|
||||
<MenuItem highlighted>
|
||||
<a>Your Teams</a>
|
||||
<ol>
|
||||
{orderedSessions.map(session => {
|
||||
const url = decodeURIComponent(session.url);
|
||||
|
||||
return (
|
||||
<MenuItem key={url}>
|
||||
<a href={`${url}/dashboard`}>
|
||||
<TeamLogo
|
||||
src={session.logoUrl}
|
||||
width={20}
|
||||
height={20}
|
||||
/>
|
||||
{decodeURIComponent(session.name)}
|
||||
</a>
|
||||
</MenuItem>
|
||||
);
|
||||
})}
|
||||
</ol>
|
||||
</MenuItem>
|
||||
) : (
|
||||
<MenuItem highlighted>
|
||||
<a href="/dashboard">Dashboard</a>
|
||||
</MenuItem>
|
||||
)}
|
||||
</React.Fragment>
|
||||
) : (
|
||||
<MenuItem>
|
||||
<a href="/#signin">Sign In</a>
|
||||
</MenuItem>
|
||||
)}
|
||||
</Menu>
|
||||
</Nav>
|
||||
);
|
||||
}
|
||||
|
||||
function BottomNavigation() {
|
||||
return (
|
||||
<BottomNav>
|
||||
<div>
|
||||
<a href={githubUrl()}>GitHub</a>
|
||||
</div>
|
||||
<div>
|
||||
<a href={twitterUrl()}>Twitter</a>
|
||||
</div>
|
||||
<div>
|
||||
<a href={spectrumUrl()}>Spectrum</a>
|
||||
</div>
|
||||
<div>
|
||||
<a href={privacy()}>Privacy</a>
|
||||
</div>
|
||||
<div>
|
||||
<a href={about()}>About</a>
|
||||
</div>
|
||||
</BottomNav>
|
||||
);
|
||||
}
|
||||
|
||||
const MenuLinkStyle = props => `
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
|
||||
a {
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: rgba(0, 0, 0, 0.4);
|
||||
text-decoration: underline;
|
||||
}
|
||||
`;
|
||||
|
||||
const MenuItem = styled.li`
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
margin: 0 0 0 40px;
|
||||
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
${MenuLinkStyle};
|
||||
|
||||
${props =>
|
||||
props.highlighted &&
|
||||
`
|
||||
position: relative;
|
||||
border: 2px solid rgba(0, 0, 0, 0.6);
|
||||
border-radius: 4px;
|
||||
padding: 6px 8px;
|
||||
margin-top: -6px;
|
||||
margin-bottom: -6px;
|
||||
|
||||
&:hover {
|
||||
border: 2px solid rgba(0, 0, 0, 0.4);
|
||||
|
||||
> a {
|
||||
color: rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
> a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
`};
|
||||
|
||||
&:hover ol {
|
||||
animation: ${fadeAndScaleIn} 200ms ease;
|
||||
display: block;
|
||||
}
|
||||
`;
|
||||
|
||||
const MenuItemDesktop = styled(MenuItem)`
|
||||
display: none;
|
||||
|
||||
${breakpoint('tablet')`
|
||||
display: inline-block;
|
||||
`};
|
||||
`;
|
||||
|
||||
const Menu = styled.ul`
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
|
||||
ol {
|
||||
display: none;
|
||||
position: absolute;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
right: 0;
|
||||
top: 34px;
|
||||
|
||||
background: #fff;
|
||||
border-radius: 4px;
|
||||
min-width: 160px;
|
||||
padding: 0 0.5em;
|
||||
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 4px 8px rgba(0, 0, 0, 0.08),
|
||||
0 2px 4px rgba(0, 0, 0, 0.08);
|
||||
|
||||
${MenuItem} {
|
||||
padding: 0.5em 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
${MenuItem} a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
${TeamLogo} {
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const Nav = styled(Centered)`
|
||||
display: flex;
|
||||
padding: 20px 0;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
`;
|
||||
|
||||
const BottomNav = styled.nav`
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
margin: 4em 0;
|
||||
|
||||
> div {
|
||||
display: flex;
|
||||
margin: 0 0 40px 0;
|
||||
${MenuLinkStyle};
|
||||
}
|
||||
|
||||
${breakpoint('tablet')`
|
||||
flex-direction: row;
|
||||
margin: 0 0 4em;
|
||||
|
||||
> div {
|
||||
margin: 0 0 0 40px;
|
||||
|
||||
&:first-child {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
`};
|
||||
`;
|
||||
|
||||
const Brand = styled.a`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-weight: 600;
|
||||
font-size: 20px;
|
||||
text-decoration: none;
|
||||
color: ${props => props.theme.black};
|
||||
`;
|
||||
|
||||
export { TopNavigation, BottomNavigation };
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
// @flow
|
||||
import * as React from 'react';
|
||||
import Grid from 'styled-components-grid';
|
||||
import PageTitle from '../components/PageTitle';
|
||||
import Markdown from '../components/Markdown';
|
||||
import Header from '../components/Header';
|
||||
import Content from '../components/Content';
|
||||
import Menu from './Menu';
|
||||
import integrations from './content';
|
||||
|
||||
type TIntegration = {
|
||||
slug: string,
|
||||
name: string,
|
||||
url: string,
|
||||
description: string,
|
||||
};
|
||||
|
||||
type Props = {
|
||||
integration: TIntegration,
|
||||
content: string,
|
||||
};
|
||||
|
||||
export default function Integration({ integration, content }: Props) {
|
||||
return (
|
||||
<Grid>
|
||||
<PageTitle title={`${integration.name} Integration`} />
|
||||
<Header background="#F4F7FA">
|
||||
<h1>{integration.name} Integration</h1>
|
||||
<p>{integration.description}</p>
|
||||
</Header>
|
||||
<Content>
|
||||
<Grid>
|
||||
<Grid.Unit
|
||||
size={{ tablet: 1 / 4 }}
|
||||
visible={{ mobile: false, tablet: true }}
|
||||
>
|
||||
<Menu integrations={integrations} active={integration.slug} />
|
||||
</Grid.Unit>
|
||||
<Grid.Unit size={{ tablet: 3 / 4 }}>
|
||||
<Markdown source={content} />
|
||||
</Grid.Unit>
|
||||
</Grid>
|
||||
</Content>
|
||||
</Grid>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,57 +0,0 @@
|
|||
// @flow
|
||||
import * as React from 'react';
|
||||
import styled from 'styled-components';
|
||||
import { map, groupBy } from 'lodash';
|
||||
|
||||
type Props = {
|
||||
integrations: *,
|
||||
active: string,
|
||||
};
|
||||
|
||||
export default function IntegrationMenu({ integrations, active }: Props) {
|
||||
const categories = groupBy(integrations, i => i.category);
|
||||
|
||||
return (
|
||||
<nav>
|
||||
{map(categories, (integrations, category) => (
|
||||
<React.Fragment key={category}>
|
||||
<h3>{category}</h3>
|
||||
<List>
|
||||
{integrations.map(i => (
|
||||
<li key={i.slug}>
|
||||
<MenuItem
|
||||
href={`/integrations/${i.slug}`}
|
||||
active={i.slug === active}
|
||||
>
|
||||
<Logo src={`/images/${i.slug}.png`} alt={i.name} />
|
||||
<span>{i.name}</span>
|
||||
</MenuItem>
|
||||
</li>
|
||||
))}
|
||||
</List>
|
||||
</React.Fragment>
|
||||
))}
|
||||
</nav>
|
||||
);
|
||||
}
|
||||
|
||||
const MenuItem = styled.a`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 16px;
|
||||
font-weight: ${props => (props.active ? '600' : 'inherit')};
|
||||
color: ${props => props.theme.text};
|
||||
`;
|
||||
|
||||
const Logo = styled.img`
|
||||
user-select: none;
|
||||
height: 18px;
|
||||
border-radius: 2px;
|
||||
margin-right: 8px;
|
||||
`;
|
||||
|
||||
const List = styled.ul`
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
`;
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
In an Outline document, paste a share link to an [Airtable](https://airtable.com) table and it will be immediately converted into an interactive, live embed.
|
||||
|
||||
Embedding a table in your knowledge base will stay upto date with your original data source automatically.
|
||||
|
||||
|
||||
|
||||
> This integration works without any additional settings or authentication.
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
In an Outline document, paste a share link to a [Codepen](https://codepen.io) card and it will be immediately converted into an embedded version where you can view the source or the result.
|
||||
|
||||
Pen's can be anything from a simple code snippet, to an embedded 3D graphic, visualization and more.
|
||||
|
||||
> This integration works without any additional settings or authentication.
|
||||
|
|
@ -1,128 +0,0 @@
|
|||
[
|
||||
{
|
||||
"slug": "abstract",
|
||||
"name": "Abstract",
|
||||
"url": "https://abstract.com",
|
||||
"category": "Design",
|
||||
"description": "One place to version, manage, and collaborate"
|
||||
},
|
||||
{
|
||||
"slug": "figma",
|
||||
"name": "Figma",
|
||||
"url": "https://figma.com",
|
||||
"category": "Design",
|
||||
"description": "Figma is a collaborative interface design tool"
|
||||
},
|
||||
{
|
||||
"slug": "framer",
|
||||
"name": "Framer",
|
||||
"url": "https://framer.com",
|
||||
"category": "Design",
|
||||
"description": "Framer is an interactive design and prototyping tool"
|
||||
},
|
||||
{
|
||||
"slug": "invision",
|
||||
"name": "InVision",
|
||||
"url": "https://invision.com",
|
||||
"category": "Design",
|
||||
"description": "InVision is an online design and prototyping tool"
|
||||
},
|
||||
{
|
||||
"slug": "marvel",
|
||||
"name": "Marvel",
|
||||
"url": "https://marvelapp.com",
|
||||
"category": "Design",
|
||||
"description": "The all-in-one platform powering design"
|
||||
},
|
||||
{
|
||||
"slug": "airtable",
|
||||
"name": "Airtable",
|
||||
"url": "https://airtable.com",
|
||||
"category": "Collaboration",
|
||||
"description": "Part spreadsheet, part database, and entirely flexible"
|
||||
},
|
||||
{
|
||||
"slug": "lucidchart",
|
||||
"name": "Lucidchart",
|
||||
"url": "https://lucidchart.com",
|
||||
"category": "Collaboration",
|
||||
"description": "Create flowcharts and technical diagrams with ease"
|
||||
},
|
||||
{
|
||||
"slug": "mindmeister",
|
||||
"name": "Mindmeister",
|
||||
"url": "https://mindmeister.com",
|
||||
"category": "Collaboration",
|
||||
"description": "Interactive and embeddable mind maps"
|
||||
},
|
||||
{
|
||||
"slug": "miro",
|
||||
"name": "Miro",
|
||||
"url": "https://miro.com",
|
||||
"category": "Collaboration",
|
||||
"description": "Simple whiteboarding for cross-functional team collaboration"
|
||||
},
|
||||
{
|
||||
"slug": "slack",
|
||||
"name": "Slack",
|
||||
"url": "https://slack.com",
|
||||
"category": "Collaboration",
|
||||
"description": "Chat, collaboration, and file sharing for teams"
|
||||
},
|
||||
{
|
||||
"slug": "trello",
|
||||
"name": "Trello",
|
||||
"url": "https://trello.com",
|
||||
"category": "Collaboration",
|
||||
"description": "Boards, lists, and cards to organize your projects"
|
||||
},
|
||||
{
|
||||
"slug": "typeform",
|
||||
"name": "Typeform",
|
||||
"url": "https://typeform.com",
|
||||
"category": "Collaboration",
|
||||
"description": "Data collection tool and surveys, for professionals"
|
||||
},
|
||||
{
|
||||
"slug": "prezi",
|
||||
"name": "Prezi",
|
||||
"url": "https://prezi.com",
|
||||
"category": "Collaboration",
|
||||
"description": "Easy presentations for people who aren't designers"
|
||||
},
|
||||
{
|
||||
"slug": "codepen",
|
||||
"name": "Codepen",
|
||||
"url": "https://codepen.io",
|
||||
"category": "Developers",
|
||||
"description": "A social development environment and editor"
|
||||
},
|
||||
{
|
||||
"slug": "github-gist",
|
||||
"name": "GitHub Gist",
|
||||
"url": "https://gist.github.com",
|
||||
"category": "Developers",
|
||||
"description": "Sharable code snippets, hosted by GitHub"
|
||||
},
|
||||
{
|
||||
"slug": "mode-analytics",
|
||||
"name": "Mode Analytics",
|
||||
"url": "https://modeanalytics.com",
|
||||
"category": "Developers",
|
||||
"description": "Connect and analyze data from any data source"
|
||||
},
|
||||
{
|
||||
"slug": "numeracy",
|
||||
"name": "Numeracy",
|
||||
"url": "https://numeracy.io",
|
||||
"category": "Developers",
|
||||
"description": "A SQL pad for writing, iterating, and exploring data"
|
||||
},
|
||||
{
|
||||
"slug": "zapier",
|
||||
"name": "Zapier",
|
||||
"url": "https://zapier.com",
|
||||
"category": "Developers",
|
||||
"description": "Connect apps and automate workflows"
|
||||
}
|
||||
]
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
In an Outline document, paste a link to a [Figma](https://figma.com) design and we will instantly convert it to an interactive, live preview.
|
||||
|
||||
Because Figma is an online design tool you can see design work happening in realtime, right within Outline. Embed design specs, product designs, or marketing materials easily.
|
||||
|
||||
|
||||
|
||||
> This integration works without any additional settings or authentication.
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
In an Outline document, paste a link to a [Framer](https://framer.com) design or prototype hosted on Framer Cloud and it will be instantly turned into an interactive, live preview.
|
||||
|
||||
Host your prototypes, designs, and mocks inside Outline to document your product or design system. [Learn more about sharing links](https://blog.framer.com/framer-cloud-access-d6bdb192510d) with Framer cloud.
|
||||
|
||||
|
||||
|
||||
> This integration works without any additional settings or authentication.
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
In an Outline document, paste a link to a public [Gist](https://gist.github.com) and it will be immediately converted into an embedded version. Embedding code in your knowledge base is a great way to document best practices.
|
||||
|
||||
Outline also supports native code blocks, simply start a line with three backticks (```) to create a code block with syntax highlighting.
|
||||
|
||||
> This integration works without any additional settings or authentication.
|
||||
|
|
@ -1,75 +0,0 @@
|
|||
// @flow
|
||||
import * as React from 'react';
|
||||
import { map, groupBy } from 'lodash';
|
||||
import styled from 'styled-components';
|
||||
import Grid from 'styled-components-grid';
|
||||
import PageTitle from '../components/PageTitle';
|
||||
import Header from '../components/Header';
|
||||
import Content from '../components/Content';
|
||||
import integrations from './content';
|
||||
|
||||
const categories = groupBy(integrations, i => i.category);
|
||||
|
||||
function Integrations() {
|
||||
return (
|
||||
<Grid>
|
||||
<PageTitle title="Integrations" />
|
||||
<Header background="#FFB500">
|
||||
<h1>Integrations</h1>
|
||||
<p>
|
||||
Outline is designed to integrate with your existing workflow and
|
||||
tools.
|
||||
</p>
|
||||
</Header>
|
||||
<Content>
|
||||
{map(categories, (integrations, category) => (
|
||||
<div key={category}>
|
||||
<h2>{category}</h2>
|
||||
<Category>
|
||||
{integrations.map(i => (
|
||||
<Grid.Unit size={{ desktop: 1 / 4 }} key={i.slug}>
|
||||
<Integration href={`/integrations/${i.slug}`}>
|
||||
<Logo src={`/images/${i.slug}.png`} alt={i.name} />
|
||||
<h3>{i.name}</h3>
|
||||
<p>{i.description}</p>
|
||||
</Integration>
|
||||
</Grid.Unit>
|
||||
))}
|
||||
</Category>
|
||||
</div>
|
||||
))}
|
||||
</Content>
|
||||
</Grid>
|
||||
);
|
||||
}
|
||||
|
||||
const Logo = styled.img`
|
||||
height: 60px;
|
||||
border-radius: 4px;
|
||||
`;
|
||||
|
||||
const Category = styled(Grid)`
|
||||
margin: 0 -1em;
|
||||
`;
|
||||
|
||||
const Integration = styled.a`
|
||||
display: block;
|
||||
padding: 2em 2em 1em;
|
||||
margin: 1em;
|
||||
border-radius: 4px;
|
||||
border: 2px solid ${props => props.theme.slateLight};
|
||||
color: ${props => props.theme.text};
|
||||
font-size: 16px;
|
||||
transition: background 200ms ease-in-out;
|
||||
|
||||
h3,
|
||||
p {
|
||||
margin: 0.5em 0;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: ${props => props.theme.slateLight};
|
||||
}
|
||||
`;
|
||||
|
||||
export default Integrations;
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
In an Outline document, paste a share link to an [InVision](https://invision.com) prototype and it will be immediately converted into an interactive, live embed.
|
||||
|
||||
Embedding prototypes in your knowledge base is a great way to create product specs or document user feedback. [Learn more about sharing links](https://support.invisionapp.com/hc/en-us/sections/200697249-Sharing-Prototypes) from InVision.
|
||||
|
||||
|
||||
|
||||
> This integration works without any additional settings or authentication.
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
In an Outline document, paste a share link to a [Lucidchart](https://lucidchart.com) diagram or chart and it will be immediately converted into an interactive embedded version.
|
||||
|
||||
Embed diagrams in your knowledge base to commuicate flows, technical diagrams, and more alongside your written documentation
|
||||
|
||||
|
||||
|
||||
> This integration works without any additional settings or authentication.
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
In an Outline document, paste a share link to a [Marvel](https://marvelapp.com) prototype and it will be immediately converted into an interactive, live embed.
|
||||
|
||||
Embedding prototypes in your knowledge base is a great way to create product specs with engineers or document user feedback.
|
||||
|
||||
|
||||
|
||||
> This integration works without any additional settings or authentication.
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
In an Outline document, paste a link to a public [Mindmeister](https://mindmeister.com) mind map or embed link and it will be converted into an interactive, embedded map – right inside your document.
|
||||
|
||||
|
||||
|
||||
> This integration works without any additional settings or authentication.
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
In an Outline document, paste a link to a public [Mode Analytics](https://modeanalytics.com) report and it will be converted into an interactive, embedded graph or table. Embedded graphs are perfect for communicating business metrics and KPI's.
|
||||
|
||||
> This integration works without any additional settings or authentication.
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
In an Outline document, paste a link to any [Numeracy](https://numeracy.co) chart and it will be converted into an interactive, embedded chart or table. Embedding graphs are perfect for communicating business metrics and KPI's.
|
||||
|
||||
|
||||
|
||||
> This integration works without any additional settings or authentication.
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
In an Outline document, paste a link to a shared [Prezi](https://prezi.com) presentation and it will be automatically converted into an embedded preview like the one below…
|
||||
|
||||
[Learn more about sharing a Prezi](https://support.prezi.com/hc/en-us/articles/360003498633).
|
||||
|
||||
|
||||
|
||||
> This integration works without any additional settings or authentication.
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
## Sign In with Slack
|
||||
|
||||
Sign In with Slack means your team doesn't have to worry about invites, passwords, or managing new team members. Everyone on your team can login with their existing Slack account and will automatically join your private knowledgebase.
|
||||
|
||||
> Note: Your team will also get a matching custom subdomain that you can link to from elsewhere.
|
||||
|
||||
|
||||
## Search your Knowledgebase
|
||||
|
||||
Optionally [Connect to Slack](https://www.getoutline.com/settings/integrations/slack) to enable the `/outline` slack command. Once enabled, team members can easily search your wiki from within Slack by typing `/outline search term`, and post results directly back to the Slack channel.
|
||||
|
||||
|
||||
|
||||
## Notifications
|
||||
|
||||
Outline can optionally post into any Slack #channel when documents are created or edited. You can also choose to route notifications based on the Collection.
|
||||
|
||||
|
||||
|
||||
> To setup channel notifications head to [your integration settings](https://www.getoutline.com/settings/integrations/slack) in the Outline admin
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
In an Outline document, paste a share link to a [Trello](https://trello.com) card and it will be immediately converted into an embedded preview.
|
||||
|
||||
Embed trello cards in your knowledge base to commuicate roadmap items, ideas, and more alongside your written documentation. Not sure how? [Learn more about sharing from Trello](https://help.trello.com/article/824-sharing-links-to-cards-and-boards).
|
||||
|
||||
> This integration works without any additional settings or authentication.
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
In an Outline document, paste a share link to a [Typeform survey](https://typeform.com) and it will be immediately converted into an embedded version of the survey. All you have to do is share the doc and wait for responses to roll in.
|
||||
|
||||
|
||||
|
||||
> This integration works without any additional settings or authentication.
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
[Zapier](https://zapier.com) allows easy integration with hundreds of other business services and tools – hook into events from Outline such as document creation to trigger actions elsewhere. Or automatically create documents in Outline from events in other tools your team uses.
|
||||
|
||||
**The Zapier integration is currently in early access**, to use the integration and hook up to your knowledge base simply accept the public invite below. All configuration is done within Zapier itself.
|
||||
|
||||
> Setup on Zapier here: [Public Zapier Invite](https://zapier.com/platform/public-invite/5927/a0b2747dbb017723b55fc54f4f0cdcae)
|
||||
|
||||
|
|
@ -1,7 +1,5 @@
|
|||
// @flow
|
||||
import * as React from 'react';
|
||||
import fs from 'fs-extra';
|
||||
import { find } from 'lodash';
|
||||
import path from 'path';
|
||||
import Koa from 'koa';
|
||||
import Router from 'koa-router';
|
||||
|
|
@ -16,13 +14,7 @@ import { NotFoundError } from './errors';
|
|||
import { Team } from './models';
|
||||
|
||||
import Home from './pages/Home';
|
||||
import About from './pages/About';
|
||||
import Changelog from './pages/Changelog';
|
||||
import Privacy from './pages/Privacy';
|
||||
import Pricing from './pages/Pricing';
|
||||
import Integrations from './pages/integrations';
|
||||
import integrations from './pages/integrations/content';
|
||||
import Integration from './pages/integrations/Integration';
|
||||
import Developers from './pages/developers';
|
||||
import Api from './pages/developers/Api';
|
||||
import SubdomainSignin from './pages/SubdomainSignin';
|
||||
|
|
@ -62,28 +54,8 @@ if (process.env.NODE_ENV === 'production') {
|
|||
}
|
||||
|
||||
// static pages
|
||||
router.get('/about', ctx => renderpage(ctx, <About />));
|
||||
router.get('/pricing', ctx => renderpage(ctx, <Pricing />));
|
||||
router.get('/developers', ctx => renderpage(ctx, <Developers />));
|
||||
router.get('/developers/api', ctx => renderpage(ctx, <Api />));
|
||||
router.get('/privacy', ctx => renderpage(ctx, <Privacy />));
|
||||
router.get('/integrations/:slug', async ctx => {
|
||||
const slug = ctx.params.slug;
|
||||
const integration = find(integrations, i => i.slug === slug);
|
||||
if (!integration) {
|
||||
return ctx.redirect(`${process.env.URL}/integrations`);
|
||||
}
|
||||
|
||||
const content = await fs.readFile(
|
||||
path.resolve(__dirname, `pages/integrations/${slug}.md`)
|
||||
);
|
||||
|
||||
return renderpage(
|
||||
ctx,
|
||||
<Integration integration={integration} content={content} />
|
||||
);
|
||||
});
|
||||
router.get('/integrations', ctx => renderpage(ctx, <Integrations />));
|
||||
router.get('/changelog', async ctx => {
|
||||
const data = await fetch(
|
||||
`https://api.github.com/repos/outline/outline/releases?access_token=${process
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ describe('#index', async () => {
|
|||
const res = await server.get('/');
|
||||
const html = await res.text();
|
||||
expect(res.status).toEqual(200);
|
||||
expect(html.includes('Your team’s knowledge base')).toEqual(true);
|
||||
expect(html.includes('Our team’s knowledge base')).toEqual(true);
|
||||
});
|
||||
|
||||
it('should render app if there is an accessToken', async () => {
|
||||
|
|
|
|||
|
|
@ -57,10 +57,6 @@ export function features(): string {
|
|||
return `${process.env.URL}/#features`;
|
||||
}
|
||||
|
||||
export function pricing(): string {
|
||||
return `${process.env.URL}/pricing`;
|
||||
}
|
||||
|
||||
export function developers(): string {
|
||||
return `${process.env.URL}/developers`;
|
||||
}
|
||||
|
|
@ -73,18 +69,6 @@ export function signin(service: string = 'slack'): string {
|
|||
return `${process.env.URL}/auth/${service}`;
|
||||
}
|
||||
|
||||
export function about(): string {
|
||||
return `${process.env.URL}/about`;
|
||||
}
|
||||
|
||||
export function integrations(): string {
|
||||
return `${process.env.URL}/integrations`;
|
||||
}
|
||||
|
||||
export function privacy(): string {
|
||||
return `${process.env.URL}/privacy`;
|
||||
}
|
||||
|
||||
export function settings(): string {
|
||||
return `/settings`;
|
||||
}
|
||||
|
|
|
|||
Reference in New Issue