mirror of
https://github.com/filecoin-project/slate.git
synced 2024-11-23 22:12:19 +03:00
marketing page test
This commit is contained in:
tarafanlin
commit
ef4eff8a4b
128
pages/_/test_mark/community.js
Normal file
128
pages/_/test_mark/community.js
Normal file
@ -0,0 +1,128 @@
|
||||
import * as React from "react";
|
||||
import * as Constants from "~/common/constants";
|
||||
import * as Actions from "~/common/actions";
|
||||
import * as System from "~/components/system";
|
||||
import CodeBlock from "~/components/system/CodeBlock";
|
||||
|
||||
import { css } from "@emotion/react";
|
||||
|
||||
import WebsitePrototypeWrapper from "~/components/core/WebsitePrototypeWrapper";
|
||||
import WebsitePrototypeHeader from "~/components/core/WebsitePrototypeHeader";
|
||||
import WebsitePrototypeFooter from "~/components/core/NewWebsitePrototypeFooter";
|
||||
|
||||
const STYLES_ROOT = css`
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
h1{
|
||||
font-size: 4.768rem;
|
||||
padding: 0px 0px 32px 0px;
|
||||
width: 100%;
|
||||
}
|
||||
h2{
|
||||
font-size: 1.953rem;
|
||||
width: 48%;
|
||||
}
|
||||
p{
|
||||
font-size: 1rem;
|
||||
color: ${Constants.system.black};
|
||||
}
|
||||
@media (max-width: ${Constants.sizes.mobile}px) {
|
||||
h1{
|
||||
font-size: 2.441rem;
|
||||
}
|
||||
h2{
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
p{
|
||||
font-size: 0.78rem;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const STYLES_MIDDLE = css`
|
||||
position: relative;
|
||||
min-height: 10%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
padding: 24px;
|
||||
`;
|
||||
|
||||
|
||||
export const getServerSideProps = async (context) => {
|
||||
return {
|
||||
props: { ...context.query },
|
||||
};
|
||||
};
|
||||
|
||||
export default class IndexPage extends React.Component {
|
||||
async componentDidMount() {
|
||||
const response = await Actions.health();
|
||||
console.log("HEALTH_CHECK", response);
|
||||
}
|
||||
|
||||
render() {
|
||||
const title = `Slate`;
|
||||
const description = "The place for all of your assets. Powered by Textile and Filecoin.";
|
||||
const url = "https://slate.host/community";
|
||||
|
||||
return (
|
||||
<WebsitePrototypeWrapper title={title} description={description} url={url}>
|
||||
<div css={STYLES_ROOT}>
|
||||
<WebsitePrototypeHeader />
|
||||
|
||||
<section>
|
||||
<System.H1>Open source</System.H1>
|
||||
<System.P>Slate is designed and built by a growing community of hackers, artists, and creatives on the web. </System.P>
|
||||
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<System.H1>Contribute</System.H1>
|
||||
<System.P>Get involved with the project and contribute.</System.P>
|
||||
<a>
|
||||
<button>Contribute on Github</button>
|
||||
</a>
|
||||
|
||||
<img src="" alt="" />
|
||||
<div></div>
|
||||
<System.P>“Maybe put here an interesting quote about collaboration?”
|
||||
<span>–Albert Einstein</span></System.P>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<System.H1>Contact</System.H1>
|
||||
<System.P>Reach out to any of the core contributors, reach us on Twitter, or join our Slack.</System.P>
|
||||
<a>
|
||||
<button>Join Slack Discussions</button>
|
||||
</a>
|
||||
<a>
|
||||
<button>Twitter @_slate</button>
|
||||
</a>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<System.H1>Integrate</System.H1>
|
||||
<System.P>Explore our API and SDK and build on top of Slate</System.P>
|
||||
<CodeBlock>npm install --save slate-react-system</CodeBlock>
|
||||
|
||||
<img src="" alt="" />
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<System.H1>Design System</System.H1>
|
||||
<System.P>Check out our open source design system. You can use these components, experiences, and constants in your own React projects. First, install the npm module: </System.P>
|
||||
<CodeBlock>npm install --save slate-react-system</CodeBlock>
|
||||
<img src="" alt="" />
|
||||
</section>
|
||||
|
||||
|
||||
<WebsitePrototypeFooter />
|
||||
</div>
|
||||
</WebsitePrototypeWrapper>
|
||||
);
|
||||
}
|
||||
}
|
||||
108
pages/_/test_mark/download.js
Normal file
108
pages/_/test_mark/download.js
Normal file
@ -0,0 +1,108 @@
|
||||
import * as React from "react";
|
||||
import * as Constants from "~/common/constants";
|
||||
import * as Actions from "~/common/actions";
|
||||
import * as System from "~/components/system";
|
||||
|
||||
import { css } from "@emotion/react";
|
||||
|
||||
import WebsitePrototypeWrapper from "~/components/core/WebsitePrototypeWrapper";
|
||||
import WebsitePrototypeHeader from "~/components/core/WebsitePrototypeHeader";
|
||||
import WebsitePrototypeFooter from "~/components/core/NewWebsitePrototypeFooter";
|
||||
|
||||
const STYLES_ROOT = css`
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
h1{
|
||||
font-size: 4.768rem;
|
||||
padding: 0px 0px 32px 0px;
|
||||
width: 100%;
|
||||
}
|
||||
h2{
|
||||
font-size: 1.953rem;
|
||||
width: 48%;
|
||||
}
|
||||
p{
|
||||
font-size: 1rem;
|
||||
color: ${Constants.system.black};
|
||||
}
|
||||
@media (max-width: ${Constants.sizes.mobile}px) {
|
||||
h1{
|
||||
font-size: 2.441rem;
|
||||
}
|
||||
h2{
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
p{
|
||||
font-size: 0.78rem;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const STYLES_MIDDLE = css`
|
||||
position: relative;
|
||||
min-height: 10%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
padding: 24px;
|
||||
`;
|
||||
|
||||
|
||||
export const getServerSideProps = async (context) => {
|
||||
return {
|
||||
props: { ...context.query },
|
||||
};
|
||||
};
|
||||
|
||||
export default class IndexPage extends React.Component {
|
||||
async componentDidMount() {
|
||||
const response = await Actions.health();
|
||||
console.log("HEALTH_CHECK", response);
|
||||
}
|
||||
|
||||
render() {
|
||||
const title = `Slate`;
|
||||
const description = "The place for all of your assets. Powered by Textile and Filecoin.";
|
||||
const url = "https://slate.host/download";
|
||||
|
||||
return (
|
||||
<WebsitePrototypeWrapper title={title} description={description} url={url}>
|
||||
<div css={STYLES_ROOT}>
|
||||
<WebsitePrototypeHeader />
|
||||
|
||||
<section>
|
||||
<System.H1>Slate client for Mac, Windows and Linux</System.H1>
|
||||
<System.P>Local folder and offline client for seamless filesharing between your machine and the network</System.P>
|
||||
<a>
|
||||
<button>Download Slate for <span>Mac</span></button>
|
||||
</a>
|
||||
<System.P>Also avaible for <a>Windows</a> and <a>Linux</a></System.P>
|
||||
|
||||
<img src="" alt="" />
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<System.H1>Slate Chrome Extensions</System.H1>
|
||||
<System.P>Take any image on the web and save it to Slate right from your browser tab</System.P>
|
||||
<a>
|
||||
<button>Get Chrome Extension</button>
|
||||
</a>
|
||||
|
||||
<img src="" alt="" />
|
||||
</section>
|
||||
<section>
|
||||
<System.H1>Changelog</System.H1>
|
||||
<System.P>List of releases</System.P>
|
||||
|
||||
|
||||
<img src="" alt="" />
|
||||
</section>
|
||||
<WebsitePrototypeFooter />
|
||||
</div>
|
||||
</WebsitePrototypeWrapper>
|
||||
);
|
||||
}
|
||||
}
|
||||
142
pages/_/test_mark/privacy.js
Normal file
142
pages/_/test_mark/privacy.js
Normal file
@ -0,0 +1,142 @@
|
||||
import * as React from "react";
|
||||
import * as Constants from "~/common/constants";
|
||||
import * as Actions from "~/common/actions";
|
||||
import * as System from "~/components/system";
|
||||
import CodeBlock from "~/components/system/CodeBlock";
|
||||
|
||||
import { css } from "@emotion/react";
|
||||
|
||||
import WebsitePrototypeWrapper from "~/components/core/WebsitePrototypeWrapper";
|
||||
import WebsitePrototypeHeader from "~/components/core/WebsitePrototypeHeader";
|
||||
import WebsitePrototypeFooter from "~/components/core/NewWebsitePrototypeFooter";
|
||||
|
||||
const STYLES_ROOT = css`
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
h1{
|
||||
font-size: 4.768rem;
|
||||
padding: 0px 0px 32px 0px;
|
||||
width: 100%;
|
||||
}
|
||||
h2{
|
||||
font-size: 1.953rem;
|
||||
width: 48%;
|
||||
}
|
||||
p{
|
||||
font-size: 1rem;
|
||||
color: ${Constants.system.black};
|
||||
}
|
||||
@media (max-width: ${Constants.sizes.mobile}px) {
|
||||
h1{
|
||||
font-size: 2.441rem;
|
||||
}
|
||||
h2{
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
p{
|
||||
font-size: 0.78rem;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const STYLES_MIDDLE = css`
|
||||
position: relative;
|
||||
min-height: 10%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
padding: 24px;
|
||||
`;
|
||||
|
||||
|
||||
export const getServerSideProps = async (context) => {
|
||||
return {
|
||||
props: { ...context.query },
|
||||
};
|
||||
};
|
||||
|
||||
export default class IndexPage extends React.Component {
|
||||
async componentDidMount() {
|
||||
const response = await Actions.health();
|
||||
console.log("HEALTH_CHECK", response);
|
||||
}
|
||||
|
||||
render() {
|
||||
const title = `Slate`;
|
||||
const description = "The place for all of your assets. Powered by Textile and Filecoin.";
|
||||
const url = "https://slate.host/privacy";
|
||||
|
||||
return (
|
||||
<WebsitePrototypeWrapper title={title} description={description} url={url}>
|
||||
<div css={STYLES_ROOT}>
|
||||
<WebsitePrototypeHeader />
|
||||
|
||||
<section>
|
||||
<System.H1>Slate Guidelines and Terms of Service</System.H1>
|
||||
<System.P>Slate is designed and built by a growing community of hackers, artists, and creatives on the web. </System.P>
|
||||
<System.P>We believe that our mission is best served in an environment that is friendly, safe, and accepting; free from intimidation or harassment. Towards this end, certain behaviors and practices will not be tolerated.</System.P>
|
||||
<System.Ul>
|
||||
<System.Li>Be respectful.</System.Li>
|
||||
<System.Li>We're here to help: abuse@filecoin.io</System.Li>
|
||||
<System.Li>Abusive behavior is never tolerated.</System.Li>
|
||||
<System.Li>Violations of this code may result in swift and permanent expulsion from the Slate community.</System.Li>
|
||||
<System.Li>"Too long, didn't read" is not a valid excuse for not knowing what is in this document.</System.Li>
|
||||
</System.Ul>
|
||||
<System.P>We expect all members of the Slate community to abide by this Code of Conduct at all times in all Slate community venues, online and in person, and in one-on-one
|
||||
communications pertaining to Slate affairs.</System.P>
|
||||
<System.P>This policy covers the usage of Filecoin public infrastructure, as well as other Filecoin websites, Filecoin related events, and any other services offered by or on behalf of the Filecoin community. It also applies to behavior in the context of the Filecoin Open Source project communities, including but not limited to public GitHub repositories, IRC channels, social media, mailing lists, and public events.</System.P>
|
||||
|
||||
<System.P>The definitions of various subjective terms such as "discriminatory", "hateful", or "confusing" will be decided at the sole discretion of the Filecoin abuse team.</System.P>
|
||||
|
||||
<System.H2>Friendly Harassment-Free Space</System.H2>Friendly Harassment-Free Space
|
||||
<System.P>We are committed to providing a friendly, safe and welcoming environment for all, regardless of gender identity, sexual orientation, disability, ethnicity, religion, age, physical appearance, body size, race, or similar personal characteristics.We ask that you please respect that people have differences of opinion regarding technical choices, and that every design or implementation choice carries a trade-off and numerous costs. There is seldom a single right answer. A difference of technology preferences is not a license to be rude.
|
||||
|
||||
Any spamming, trolling, flaming, baiting, or other attention-stealing behavior is not welcome, and will not be tolerated. Harassing other users is never tolerated, whether via public or private media. Avoid using offensive or harassing nicknames, or other identifiers that might detract from a friendly, safe, and welcoming environment for all.
|
||||
|
||||
Harassment includes, but is not limited to: harmful or prejudicial verbal or written comments related to gender identity, sexual orientation, disability, ethnicity, religion, age, physical appearance, body size, race, or similar personal characteristics; inappropriate use of nudity, sexual images, and/or sexually explicit language in public spaces; threats of physical or non-physical harm; deliberate intimidation, stalking or following; harassing photography or recording; sustained disruption of talks or other events; inappropriate physical contact; and unwelcome sexual attention.
|
||||
|
||||
Media shared through public infrastructure run by the Filecoin team must not contain illegal or infringing content. You should only publish content via Filecoin public infrastructure if you have the right to do so. This include complying with all software license agreements or other intellectual property restrictions. You will be solely responsible for any violation of laws or others' intellectual property rights.</System.P>
|
||||
|
||||
<System.H2>Avoid Marketing or Soliciting</System.H2>
|
||||
<System.P>You are welcome to post endorsements of tools, products or services that you personally find useful, but please refrain from blatant advertising, marketing or any kind of spam. Selling commercial services or fundraising is not allowed.</System.P>
|
||||
|
||||
|
||||
<System.H2>Reporting Violations of this Code of Conduct</System.H2>
|
||||
<System.P>If you believe someone is harassing you or has otherwise violated this Code of Conduct, please contact us at abuse@filecoin.io to send us an abuse report. If this is the initial report of a problem, please include as much detail as possible. It is easiest for us to address issues when we have more context.</System.P>
|
||||
|
||||
|
||||
<System.H2>Copyright Violations</System.H2>
|
||||
<System.P>We respect the intellectual property of others and ask that you do too. If you believe any content or other materials available through public Filecoin infrastructure violates a copyright held by you and you would like to submit a notice pursuant to the Digital Millennium Copyright Act or other similar international law, you can submit a notice to our agent for service of notice to: abuse@filecoin.io. Please make sure your notice meets the Digital Millennium Copyright Act requirements.</System.P>
|
||||
|
||||
|
||||
<System.H2>Consequences</System.H2>
|
||||
<System.P>All content published to public Filecoin infrastructure is hosted at the sole discretion of the Filecoin team. Unacceptable behavior from any community member will not be tolerated. Anyone asked to stop unacceptable behavior is expected to comply immediately. If a community member engages in unacceptable behavior, the Filecoin team may take any action they deem appropriate, up to and including a temporary ban or permanent expulsion from the community without warning (and without refund in the case of a paid event or service).</System.P>
|
||||
|
||||
<System.H2>Addressing Grievances</System.H2>
|
||||
<System.P>Please contact abuse@filecoin.io if you need to report a problem or address a grievance related to an abuse report. If you feel you have been falsely or unfairly accused of violating this Code of Conduct, you should contact abuse@filecoin.io. We will do our best to ensure that your grievance is handled appropriately. In general, we will choose the course of action that we judge as being most in the interest of fostering a safe and friendly community.</System.P>
|
||||
|
||||
<System.H2>Contact Info</System.H2>
|
||||
<System.P>Please contact abuse@filecoin.io if you need to report a problem or address a grievance related to an abuse report. You are also encouraged to contact us if you are curious about something that might be "on the line" between appropriate and inappropriate content. We are happy to provide guidance to help you be a successful part of our community.
|
||||
</System.P>
|
||||
|
||||
|
||||
<System.H2>Changes</System.H2>
|
||||
<System.P>This is a living document and may be updated from time to time. Please refer to the git history for this document to view the changes.
|
||||
</System.P>
|
||||
|
||||
<System.H2>Credit and License</System.H2>
|
||||
<System.P>This Code of Conduct is based on the [npm Code of Conduct](https://www.npmjs.com/policies/conduct). This document may be reused under a [Creative Commons Attribution-ShareAlike License](http://creativecommons.org/licenses/by-sa/4.0/).
|
||||
</System.P>
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
<WebsitePrototypeFooter />
|
||||
</div>
|
||||
</WebsitePrototypeWrapper>
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -259,26 +259,29 @@ const STYLES_SIMPLE_FLOW_CONTAINER = css `
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
width: 100vw;
|
||||
justify-content: space-around;
|
||||
justify-content: center;
|
||||
padding-top: 20vh;
|
||||
align-items: center;
|
||||
`;
|
||||
|
||||
const STYLES_SIMPLE_ITEM = css `
|
||||
text-align: center;
|
||||
font-style: italic;
|
||||
|
||||
`;
|
||||
|
||||
const STYLES_ARROW_CONTAINER = css `
|
||||
width: 200px;
|
||||
width: 100px;
|
||||
`;
|
||||
|
||||
const STYLES_SECTION_TEXT = css`
|
||||
display: block;
|
||||
max-width: 980px;
|
||||
`;
|
||||
|
||||
const STYLES_SECTION_SVG_CONTAINER = css`
|
||||
const STYLES_OS_CONTAINER = css `
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
right: 24px;
|
||||
bottom: 24px;
|
||||
flex-direction: row;
|
||||
`;
|
||||
|
||||
const STYLES_SECTION_SVG_CONTAINER = css `
|
||||
height: 350px;
|
||||
width: auto;
|
||||
`;
|
||||
|
||||
const STYLES_STROKE_KF = keyframes`
|
||||
@ -296,36 +299,36 @@ const STYLES_CONTR_CONTAINER = css `
|
||||
const STYLES_CONTR_LIST = css `
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
width: 100vw;
|
||||
width: 100%;
|
||||
list-style: none;
|
||||
li {
|
||||
font-size: 1rem;
|
||||
text-decoration: none;
|
||||
color: ${Constants.system.black};
|
||||
text-decoration: none;
|
||||
padding: 1.5rem 0;
|
||||
}
|
||||
li:nth-child(n+5) {
|
||||
display: none;
|
||||
}
|
||||
`;
|
||||
|
||||
const STYLES_CONTR_LI0 = css `
|
||||
font-size: 1.953rem;
|
||||
color: ${Constants.system.black};
|
||||
text-decoration: none;
|
||||
padding-bottom: 1.5rem;
|
||||
order: 0;
|
||||
`;
|
||||
const STYLES_CONTR_LI1 = css `
|
||||
font-size: 1.953rem;
|
||||
color: ${Constants.system.black};
|
||||
text-decoration: none;
|
||||
order: 1;
|
||||
opacity: .76;
|
||||
padding-bottom: 1.5rem;
|
||||
|
||||
`;
|
||||
const STYLES_CONTR_LI2 = css `
|
||||
font-size: 1.953rem;
|
||||
color: ${Constants.system.black};
|
||||
text-decoration: none;
|
||||
order: 2;
|
||||
opacity: .56;
|
||||
padding-bottom: 1.5rem;
|
||||
|
||||
`;
|
||||
const STYLES_CONTR_LI3 = css `
|
||||
font-size: 1.953rem;
|
||||
color: ${Constants.system.black};
|
||||
text-decoration: none;
|
||||
order: 3;
|
||||
opacity: .26;
|
||||
padding-bottom: 1.5rem;
|
||||
`;
|
||||
const STYLES_MEDIA_LEFT = css`
|
||||
position: absolute;
|
||||
@ -394,7 +397,7 @@ export default class IndexPage extends React.Component {
|
||||
<div css={STYLES_SLATE_CARD_TITLE}>Green</div>
|
||||
<div css={STYLES_SLATE_CARD_EXPLAINER}>
|
||||
<div css={STYLES_SLATE_CARD_PARAGRAPH}>@internetjim</div>
|
||||
<div css={STYLES_SLATE_CARD_PARAGRAPH}>-></div>
|
||||
<div css={STYLES_SLATE_CARD_PARAGRAPH}>-></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -406,7 +409,7 @@ export default class IndexPage extends React.Component {
|
||||
<div css={STYLES_SLATE_CARD_TITLE}>Green</div>
|
||||
<div css={STYLES_SLATE_CARD_EXPLAINER}>
|
||||
<div css={STYLES_SLATE_CARD_PARAGRAPH}>@internetjim</div>
|
||||
<div css={STYLES_SLATE_CARD_PARAGRAPH}>-></div>
|
||||
<div css={STYLES_SLATE_CARD_PARAGRAPH}>-></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -418,7 +421,7 @@ export default class IndexPage extends React.Component {
|
||||
<div css={STYLES_SLATE_CARD_TITLE}>Green</div>
|
||||
<div css={STYLES_SLATE_CARD_EXPLAINER}>
|
||||
<div css={STYLES_SLATE_CARD_PARAGRAPH}>@internetjim</div>
|
||||
<div css={STYLES_SLATE_CARD_PARAGRAPH}>-></div>
|
||||
<div css={STYLES_SLATE_CARD_PARAGRAPH}>-></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -436,7 +439,10 @@ export default class IndexPage extends React.Component {
|
||||
<h1>Simple, intuitive</h1>
|
||||
<h2>Break away from abstract visualizations of your files.<br/>Securely organize your data in a relatable way</h2>
|
||||
<div css={STYLES_SIMPLE_FLOW_CONTAINER}>
|
||||
<div>{/*<ButtonPrimary>Upload File</ButtonPrimary> Figure out hoiw to pull in correctly*/}<button>Upload File</button></div>
|
||||
<div css={STYLES_SIMPLE_ITEM}>
|
||||
<System.SVG.BandwidthUp height='88px' />
|
||||
<p>Upload Your File</p>
|
||||
</div>
|
||||
<div css={STYLES_ARROW_CONTAINER}>
|
||||
<svg viewBox="0 0 350 100">
|
||||
<defs>
|
||||
@ -449,7 +455,10 @@ export default class IndexPage extends React.Component {
|
||||
stroke-width="8" marker-end="url(#arrowhead)" />
|
||||
</svg>
|
||||
</div>
|
||||
<div><p>Slate securely stores your file</p></div>
|
||||
<div css={STYLES_SIMPLE_ITEM}>
|
||||
<System.OldSVG.Peers height='88px' />
|
||||
<p>Slate securely stores your file</p>
|
||||
</div>
|
||||
<div css={STYLES_ARROW_CONTAINER}>
|
||||
<svg viewBox="0 0 350 100">
|
||||
<defs>
|
||||
@ -462,7 +471,10 @@ export default class IndexPage extends React.Component {
|
||||
stroke-width="8" marker-end="url(#arrowhead)" />
|
||||
</svg>
|
||||
</div>
|
||||
<div><p>Share!</p></div>
|
||||
<div css={STYLES_SIMPLE_ITEM}>
|
||||
<System.OldSVG.Deals height='88px' />
|
||||
<p>Share!</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@ -570,9 +582,9 @@ export default class IndexPage extends React.Component {
|
||||
colors={['#0047FF', '#ff0000', '#28a745', '#FFC940']}
|
||||
/> */}
|
||||
<h1>Open Source</h1>
|
||||
<h2 css={STYLES_SECTION_TEXT}>"Collaboration makes better software". <br/><br/>Pair that with Filecoin's transparent marketplace as Slates's foundation. And you got yourself real nice power couple right there.</h2>
|
||||
<div css={STYLES_SECTION_SVG_CONTAINER}>
|
||||
<svg viewBox="-15 125 750 750" width="800" height="800">
|
||||
<div css={STYLES_OS_CONTAINER}>
|
||||
<h2 css={{marginRight: "10%"}}>"Collaboration makes better software". <br/><br/>Pair that with Filecoin's transparent marketplace as Slates's foundation. And you got yourself real nice power couple right there.</h2>
|
||||
<svg viewBox="-15 125 750 750" css={STYLES_SECTION_SVG_CONTAINER}>
|
||||
<path css={STYLES_SVG_AN} stroke="#b2b2b2" fill="none" strokeWidth="3" strokeDasharray="1 1" pathLength="1"
|
||||
d="m 398.40437,595.27818 c 40.32082,-14.97419 61.36968,-43.81349 61.36968,-93.44762 0,-49.63413 -41.82527,-93.37059 -94.0866,-93.45552 -55.14896,-0.0896 -96.75182,43.64 -96.0866,93.45552 0.66523,49.81551 24.42164,82.95509 62.44642,94.93898 L 264.68924,762.47972 C 174.536,739.14196 82.84508,632.78774 82.84508,501.83056 c 0,-155.10914 124.63284,-280.84993 280.84238,-280.84993 156.20954,0 282.84239,125.74079 282.84239,280.84993 0,132.99462 -90.82075,237.8649 -182.89748,261.11527 z"
|
||||
/>
|
||||
@ -584,8 +596,18 @@ export default class IndexPage extends React.Component {
|
||||
<li css={STYLES_CONTR_LI1}>Martinalong<br/>github.com/martinalong</li>
|
||||
<li css={STYLES_CONTR_LI2}>William Felker<br/>github.com/gndclouds</li>
|
||||
<li css={STYLES_CONTR_LI3}>Uonai<br/>github.com/uonai</li>
|
||||
<li>Tara Lin<br/>github.com/tarafanlin</li>
|
||||
<li>JasonLeyser<br/>github.com/jasonleyser</li>
|
||||
<li>Akuoko Daniel Jnr<br/>github.com/akuokojnr</li>
|
||||
<li>Tommy Tran<br/>github.com/tmytrn</li>
|
||||
<li>Oluwaseun Oyebade<br/>github.com/motdde</li>
|
||||
<li>Harisbutt<br/>github.com/harisbutt</li>
|
||||
<li>Jordan Booker<br/>github.com/jordattebayo</li>
|
||||
<li>Jhannes-jp<br/>github.com/johannes-jp</li>
|
||||
<li>Anish Agnihotri<br/>github.com/Anish-Agnihotri</li>
|
||||
<li>Aminejvm<br/>github.com/Aminejvm</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<WebsitePrototypeFooter />
|
||||
</div>
|
||||
@ -1,96 +0,0 @@
|
||||
import * as React from "react";
|
||||
import * as Constants from "~/common/constants";
|
||||
import * as Actions from "~/common/actions";
|
||||
import * as System from "~/components/system";
|
||||
|
||||
import { css } from "@emotion/react";
|
||||
|
||||
import WebsitePrototypeWrapper from "~/components/core/WebsitePrototypeWrapper";
|
||||
import WebsitePrototypeHeader from "~/components/core/WebsitePrototypeHeader";
|
||||
import WebsitePrototypeFooter from "~/components/core/WebsitePrototypeFooter";
|
||||
|
||||
const STYLES_ROOT = css`
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 100vh;
|
||||
text-align: center;
|
||||
font-size: 1rem;
|
||||
|
||||
h1{
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
@media (max-width: ${Constants.sizes.mobile}px) {
|
||||
font-size: 0.78rem;
|
||||
}
|
||||
`;
|
||||
|
||||
const STYLES_MIDDLE = css`
|
||||
position: relative;
|
||||
min-height: 10%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
padding: 24px;
|
||||
`;
|
||||
|
||||
|
||||
export const getServerSideProps = async (context) => {
|
||||
return {
|
||||
props: { ...context.query },
|
||||
};
|
||||
};
|
||||
|
||||
export default class IndexPage extends React.Component {
|
||||
async componentDidMount() {
|
||||
const response = await Actions.health();
|
||||
console.log("HEALTH_CHECK", response);
|
||||
}
|
||||
|
||||
render() {
|
||||
const title = `Slate`;
|
||||
const description = "The place for all of your assets. Powered by Textile and Filecoin.";
|
||||
const url = "https://slate.host";
|
||||
|
||||
return (
|
||||
<WebsitePrototypeWrapper title={title} description={description} url={url}>
|
||||
<div css={STYLES_ROOT}>
|
||||
<WebsitePrototypeHeader />
|
||||
<div>
|
||||
<System.H1>Get involved</System.H1>
|
||||
|
||||
|
||||
<System.P>We’d love for you to join us! Getting involved is simple:</System.P>
|
||||
<System.UL>
|
||||
<System.LI>Creating an open source design system</System.LI>
|
||||
<System.LI>Building a dynamic component library for open source projects</System.LI>
|
||||
<System.LI>Learning how to write front-end code</System.LI>
|
||||
</System.UL>
|
||||
<System.P>Slate is built by a growing community of collaborators and contributors. If you’re interested in…</System.P>
|
||||
<System.UL>
|
||||
<System.LI>Find something cool you to work on and file an issue</System.LI>
|
||||
<System.LI>If you see something you want to fix or change, <a>submit a PR</a></System.LI>
|
||||
<System.LI>Reach out to us any time. We're always available on Twitter to answer your questions: <a>@_slate</a></System.LI>
|
||||
</System.UL>
|
||||
|
||||
</div>
|
||||
|
||||
<div css={STYLES_MIDDLE}>
|
||||
<System.H1>Code of Conduct</System.H1>
|
||||
<System.P>All participants of Slate are expected to abide by our Code of Conduct, both online and during in-person events that are hosted and/or associated with Slate.</System.P>
|
||||
|
||||
<System.H1>Code of Conduct</System.H1>
|
||||
<System.P>All participants of Slate are expected to abide by our Code of Conduct, both online and during in-person events that are hosted and/or associated with Slate.</System.P>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<WebsitePrototypeFooter />
|
||||
</div>
|
||||
</WebsitePrototypeWrapper>
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -1,71 +0,0 @@
|
||||
import * as React from "react";
|
||||
import * as Constants from "~/common/constants";
|
||||
import * as Actions from "~/common/actions";
|
||||
import * as System from "~/components/system";
|
||||
|
||||
import { css } from "@emotion/react";
|
||||
|
||||
import WebsitePrototypeWrapper from "~/components/core/WebsitePrototypeWrapper";
|
||||
import WebsitePrototypeHeader from "~/components/core/WebsitePrototypeHeader";
|
||||
import WebsitePrototypeFooter from "~/components/core/WebsitePrototypeFooter";
|
||||
|
||||
const STYLES_ROOT = css`
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 100vh;
|
||||
text-align: center;
|
||||
font-size: 1rem;
|
||||
|
||||
@media (max-width: ${Constants.sizes.mobile}px) {
|
||||
font-size: 0.78rem;
|
||||
}
|
||||
`;
|
||||
|
||||
const STYLES_MIDDLE = css`
|
||||
position: relative;
|
||||
min-height: 10%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
padding: 24px;
|
||||
`;
|
||||
|
||||
|
||||
export const getServerSideProps = async (context) => {
|
||||
return {
|
||||
props: { ...context.query },
|
||||
};
|
||||
};
|
||||
|
||||
export default class PrivacyPage extends React.Component {
|
||||
async componentDidMount() {
|
||||
const response = await Actions.health();
|
||||
console.log("HEALTH_CHECK", response);
|
||||
}
|
||||
|
||||
render() {
|
||||
const title = `Slate`;
|
||||
const description = "The place for all of your assets. Powered by Textile and Filecoin.";
|
||||
const url = "https://slate.host/privacy";
|
||||
|
||||
return (
|
||||
<WebsitePrototypeWrapper title={title} description={description} url={url}>
|
||||
<div css={STYLES_ROOT}>
|
||||
<WebsitePrototypeHeader />
|
||||
<div css={STYLES_MIDDLE}>
|
||||
<System.P>
|
||||
|
||||
|
||||
</System.P>
|
||||
</div>
|
||||
</div>
|
||||
<WebsitePrototypeFooter />
|
||||
</div>
|
||||
</WebsitePrototypeWrapper>
|
||||
);
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user