mirror of
https://github.com/filecoin-project/slate.git
synced 2024-09-11 22:07:08 +03:00
page rounting
This commit is contained in:
parent
37f164f4cc
commit
15294fb41d
@ -63,6 +63,8 @@ const REJECT_LIST = [
|
|||||||
"data",
|
"data",
|
||||||
"timeout",
|
"timeout",
|
||||||
"please-dont-use-timeout",
|
"please-dont-use-timeout",
|
||||||
|
"faqs",
|
||||||
|
"about",
|
||||||
];
|
];
|
||||||
|
|
||||||
export const userRoute = (text) => {
|
export const userRoute = (text) => {
|
||||||
|
1
package-lock.json
generated
1
package-lock.json
generated
@ -5,7 +5,6 @@
|
|||||||
"requires": true,
|
"requires": true,
|
||||||
"packages": {
|
"packages": {
|
||||||
"": {
|
"": {
|
||||||
"name": "slate",
|
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
@ -1,120 +0,0 @@
|
|||||||
import * as React from "react";
|
|
||||||
import * as Constants from "~/common/constants";
|
|
||||||
import * as SVGLogo from "~/common/logo";
|
|
||||||
import * as SVG from "~/common/svg";
|
|
||||||
import * as System from "~/components/system";
|
|
||||||
import * as Validations from "~/common/validations";
|
|
||||||
import * as Strings from "~/common/strings";
|
|
||||||
|
|
||||||
import WebsitePrototypeWrapper from "~/components/core/WebsitePrototypeWrapper";
|
|
||||||
import WebsiteHeader from "~/components/core/WebsiteHeader";
|
|
||||||
import WebsiteFooter from "~/components/core/WebsiteFooter";
|
|
||||||
|
|
||||||
import { css } from "@emotion/react";
|
|
||||||
|
|
||||||
const STYLES_ROOT = css`
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
position: -webkit-sticky;
|
|
||||||
position: sticky;
|
|
||||||
top: 52px;
|
|
||||||
overflow: hidden;
|
|
||||||
height: calc(100vh - 113px);
|
|
||||||
background-color: ${Constants.semantic.bgLight};
|
|
||||||
color: ${Constants.semantic.textBlack};
|
|
||||||
`;
|
|
||||||
|
|
||||||
const STYLES_CONTAINER = css`
|
|
||||||
max-width: 700px;
|
|
||||||
margin: 0 auto;
|
|
||||||
padding: 80px 0;
|
|
||||||
|
|
||||||
@media (max-width: ${Constants.sizes.mobile}px) {
|
|
||||||
max-width: 480px;
|
|
||||||
padding: 96px 16px;
|
|
||||||
}
|
|
||||||
`;
|
|
||||||
|
|
||||||
const STYLES_HEADING = css`
|
|
||||||
flex-shrink: 0;
|
|
||||||
color: ${Constants.semantic.textBlack};
|
|
||||||
flex-shrink: 0;
|
|
||||||
min-width: 50%;
|
|
||||||
max-width: 100%;
|
|
||||||
`;
|
|
||||||
|
|
||||||
const STYLES_HEADING1 = css`
|
|
||||||
${STYLES_HEADING};
|
|
||||||
font-family: ${Constants.font.bold};
|
|
||||||
font-size: 88px;
|
|
||||||
line-height: 88px;
|
|
||||||
letter-spacing: -0.05em;
|
|
||||||
margin-bottom: 25px;
|
|
||||||
|
|
||||||
@media (max-width: ${Constants.sizes.tablet}px) {
|
|
||||||
font-size: 64px;
|
|
||||||
line-height: 68px;
|
|
||||||
letter-spacing: -0.04em;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: ${Constants.sizes.mobile}px) {
|
|
||||||
font-size: 48px;
|
|
||||||
line-height: 52px;
|
|
||||||
letter-spacing: -0.04em;
|
|
||||||
}
|
|
||||||
`;
|
|
||||||
|
|
||||||
const STYLES_HEADING2 = css`
|
|
||||||
${STYLES_HEADING};
|
|
||||||
font-family: ${Constants.font.semiBold};
|
|
||||||
font-size: 40px;
|
|
||||||
line-height: 40px;
|
|
||||||
letter-spacing: -0.035em;
|
|
||||||
margin: 40px 0;
|
|
||||||
|
|
||||||
@media (max-width: ${Constants.sizes.tablet}px) {
|
|
||||||
font-size: 48px;
|
|
||||||
line-height: 56px;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: ${Constants.sizes.mobile}px) {
|
|
||||||
font-size: 40px;
|
|
||||||
line-height: 48px;
|
|
||||||
margin-bottom: 32px;
|
|
||||||
}
|
|
||||||
`;
|
|
||||||
|
|
||||||
const STYLES_BODY = css`
|
|
||||||
font-family: ${Constants.font.text};
|
|
||||||
font-size: 20px;
|
|
||||||
line-height: 28px;
|
|
||||||
letter-spacing: -0.01em;
|
|
||||||
margin-bottom: 16px;
|
|
||||||
`;
|
|
||||||
|
|
||||||
export default function AboutUsPage() {
|
|
||||||
const title = `About Us - Slate`;
|
|
||||||
const description = "Your personal search engine";
|
|
||||||
const url = "https://slate.host/about-us";
|
|
||||||
const image =
|
|
||||||
"https://slate.textile.io/ipfs/bafkreifww37ypduoi5pvj2cuikz7iycp7l5h7czke6lcboukkaqkoab3t4";
|
|
||||||
|
|
||||||
return (
|
|
||||||
<WebsitePrototypeWrapper title={title} description={description} url={url} image={image}>
|
|
||||||
<WebsiteHeader />
|
|
||||||
<div css={STYLES_ROOT}>
|
|
||||||
<div css={STYLES_CONTAINER}>
|
|
||||||
<div css={STYLES_HEADING1}>About Us</div>
|
|
||||||
<div css={STYLES_BODY}>
|
|
||||||
Slate is a Chrome extension that helps you save, organize and search stuff you care
|
|
||||||
about on the web. It’s a lightweight tool designed to make the internet feel a little
|
|
||||||
more personal.
|
|
||||||
</div>
|
|
||||||
<div css={STYLES_HEADING2}>The team</div>
|
|
||||||
<div css={STYLES_HEADING2}>Special thanks to</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<WebsiteFooter />
|
|
||||||
</WebsitePrototypeWrapper>
|
|
||||||
);
|
|
||||||
}
|
|
110
pages/faq.js
110
pages/faq.js
@ -1,110 +0,0 @@
|
|||||||
import * as React from "react";
|
|
||||||
import * as Constants from "~/common/constants";
|
|
||||||
import * as SVGLogo from "~/common/logo";
|
|
||||||
import * as SVG from "~/common/svg";
|
|
||||||
import * as System from "~/components/system";
|
|
||||||
import * as Validations from "~/common/validations";
|
|
||||||
import * as Strings from "~/common/strings";
|
|
||||||
|
|
||||||
import WebsitePrototypeWrapper from "~/components/core/WebsitePrototypeWrapper";
|
|
||||||
import WebsiteHeader from "~/components/core/WebsiteHeader";
|
|
||||||
import WebsiteFooter from "~/components/core/WebsiteFooter";
|
|
||||||
|
|
||||||
import { css } from "@emotion/react";
|
|
||||||
|
|
||||||
const STYLES_ROOT = css`
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
position: -webkit-sticky;
|
|
||||||
position: sticky;
|
|
||||||
top: 52px;
|
|
||||||
overflow: hidden;
|
|
||||||
height: calc(100vh - 113px);
|
|
||||||
background-color: ${Constants.semantic.bgLight};
|
|
||||||
color: ${Constants.semantic.textBlack};
|
|
||||||
`;
|
|
||||||
|
|
||||||
const STYLES_CONTAINER = css`
|
|
||||||
max-width: 700px;
|
|
||||||
margin: 0 auto;
|
|
||||||
padding: 80px 0;
|
|
||||||
|
|
||||||
@media (max-width: ${Constants.sizes.mobile}px) {
|
|
||||||
max-width: 480px;
|
|
||||||
padding: 96px 16px;
|
|
||||||
}
|
|
||||||
`;
|
|
||||||
|
|
||||||
const STYLES_HEADING = css`
|
|
||||||
flex-shrink: 0;
|
|
||||||
color: ${Constants.semantic.textBlack};
|
|
||||||
flex-shrink: 0;
|
|
||||||
min-width: 50%;
|
|
||||||
max-width: 100%;
|
|
||||||
`;
|
|
||||||
|
|
||||||
const STYLES_HEADING1 = css`
|
|
||||||
${STYLES_HEADING};
|
|
||||||
font-family: ${Constants.font.bold};
|
|
||||||
font-size: 88px;
|
|
||||||
line-height: 88px;
|
|
||||||
letter-spacing: -0.05em;
|
|
||||||
margin-bottom: 25px;
|
|
||||||
|
|
||||||
@media (max-width: ${Constants.sizes.tablet}px) {
|
|
||||||
font-size: 64px;
|
|
||||||
line-height: 68px;
|
|
||||||
letter-spacing: -0.04em;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: ${Constants.sizes.mobile}px) {
|
|
||||||
font-size: 48px;
|
|
||||||
line-height: 52px;
|
|
||||||
letter-spacing: -0.04em;
|
|
||||||
}
|
|
||||||
`;
|
|
||||||
|
|
||||||
const STYLES_HEADING2 = css`
|
|
||||||
${STYLES_HEADING};
|
|
||||||
font-family: ${Constants.font.medium};
|
|
||||||
font-size: 20px;
|
|
||||||
line-height: 28px;
|
|
||||||
letter-spacing: -0.02em;
|
|
||||||
margin: 40px 0 4px 0;
|
|
||||||
`;
|
|
||||||
|
|
||||||
const STYLES_BODY = css`
|
|
||||||
font-family: ${Constants.font.text};
|
|
||||||
font-size: 18px;
|
|
||||||
line-height: 28px;
|
|
||||||
letter-spacing: -0.01em;
|
|
||||||
margin-bottom: 16px;
|
|
||||||
`;
|
|
||||||
|
|
||||||
export default function FAQPage() {
|
|
||||||
const title = `FAQ - Slate`;
|
|
||||||
const description = "Your personal search engine";
|
|
||||||
const url = "https://slate.host/faqs";
|
|
||||||
const image =
|
|
||||||
"https://slate.textile.io/ipfs/bafkreifww37ypduoi5pvj2cuikz7iycp7l5h7czke6lcboukkaqkoab3t4";
|
|
||||||
|
|
||||||
return (
|
|
||||||
<WebsitePrototypeWrapper title={title} description={description} url={url} image={image}>
|
|
||||||
<WebsiteHeader />
|
|
||||||
<div css={STYLES_ROOT}>
|
|
||||||
<div css={STYLES_CONTAINER}>
|
|
||||||
<div css={STYLES_HEADING1}>FAQs</div>
|
|
||||||
<div css={STYLES_HEADING2}>What is a personal search engine?</div>
|
|
||||||
<div css={STYLES_BODY}>
|
|
||||||
Slate is a Chrome extension that helps you save, organize and search stuff you care
|
|
||||||
about on the web. It’s a lightweight tool designed to make the internet feel a little
|
|
||||||
more personal.
|
|
||||||
</div>
|
|
||||||
<div css={STYLES_HEADING2}>How will Slate protect my privacy?</div>
|
|
||||||
<div css={STYLES_HEADING2}>How much does Slate cost?</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<WebsiteFooter />
|
|
||||||
</WebsitePrototypeWrapper>
|
|
||||||
);
|
|
||||||
}
|
|
Loading…
Reference in New Issue
Block a user