run prettier
This commit is contained in:
parent
0548ab6560
commit
beebe03f32
|
@ -8,7 +8,7 @@ avatar: "../images/skynet-avatar.png"
|
||||||
thumbnail: "../images/press-release.png"
|
thumbnail: "../images/press-release.png"
|
||||||
---
|
---
|
||||||
|
|
||||||
**Boston, MA – September 22nd, 2020** — Nebulous, the company building the Sia decentralized cloud storage platform and the Skynet application hosting platform, today announced it has closed a $3M funding round led by Paradigm with participation from Bain Capital Ventures, Bessemer Venture Partners, A.Capital, Collaborative Fund, Dragonfly Capital Partners, Hack VC, INBlockchain, First Star Ventures, and other notable investors. The round will help the company scale and accelerate the development and adoption of Skynet.
|
**Boston, MA – September 22nd, 2020** — Nebulous, the company building the Sia decentralized cloud storage platform and the Skynet application hosting platform, today announced it has closed a \$3M funding round led by Paradigm with participation from Bain Capital Ventures, Bessemer Venture Partners, A.Capital, Collaborative Fund, Dragonfly Capital Partners, Hack VC, INBlockchain, First Star Ventures, and other notable investors. The round will help the company scale and accelerate the development and adoption of Skynet.
|
||||||
|
|
||||||
Today’s internet monopolized by tech giants struggles with fundamental challenges in privacy, reliability, and has excessive control over our data and the way we interact with the world. Skynet enables high speed, low cost, and superior infrastructure to serve as the storage foundation for a free Internet. Where data is globally accessible, user-controlled, censorship-resistant, and not fragmented in walled gardens.
|
Today’s internet monopolized by tech giants struggles with fundamental challenges in privacy, reliability, and has excessive control over our data and the way we interact with the world. Skynet enables high speed, low cost, and superior infrastructure to serve as the storage foundation for a free Internet. Where data is globally accessible, user-controlled, censorship-resistant, and not fragmented in walled gardens.
|
||||||
|
|
||||||
|
|
|
@ -16,7 +16,7 @@ Application developers will also benefit from content monetization. Like content
|
||||||
|
|
||||||
Skynet Labs has always been committed to the freedom of expression, information, and importantly, access. Therefore, Skynet’s Free account tier supporting up to 100 GB of data, seeks to ensure that financial barriers never prohibit users and developers from participating in the Skynet ecosystem. Once a user meets their data cap, service on Skynet will continue but at reduced speeds, in a way similar to data plans for smartphones.
|
Skynet Labs has always been committed to the freedom of expression, information, and importantly, access. Therefore, Skynet’s Free account tier supporting up to 100 GB of data, seeks to ensure that financial barriers never prohibit users and developers from participating in the Skynet ecosystem. Once a user meets their data cap, service on Skynet will continue but at reduced speeds, in a way similar to data plans for smartphones.
|
||||||
|
|
||||||
Overall, users can opt for one of three paid tiers: $5/month with 1 TB, $20/month with 4 TB, or $80/month with 20 TB of data. Skynet Premium also comes with significant performance boosts: users will be able to pin content and browse Skynet faster, in particular any pages with monetized content. The benefits of a premium account are not purely in performance—these users are actively fueling a new creator economy, and a revolution that gives creators everywhere the power they deserve.
|
Overall, users can opt for one of three paid tiers: $5/month with 1 TB, $20/month with 4 TB, or \$80/month with 20 TB of data. Skynet Premium also comes with significant performance boosts: users will be able to pin content and browse Skynet faster, in particular any pages with monetized content. The benefits of a premium account are not purely in performance—these users are actively fueling a new creator economy, and a revolution that gives creators everywhere the power they deserve.
|
||||||
|
|
||||||
## About Skynet Labs
|
## About Skynet Labs
|
||||||
|
|
||||||
|
|
|
@ -90,4 +90,3 @@
|
||||||
github: https://github.com/dghelm
|
github: https://github.com/dghelm
|
||||||
linkedin: https://www.linkedin.com/in/dghelm/
|
linkedin: https://www.linkedin.com/in/dghelm/
|
||||||
twitter: https://twitter.com/danielgileshelm
|
twitter: https://twitter.com/danielgileshelm
|
||||||
|
|
||||||
|
|
|
@ -1,16 +1,16 @@
|
||||||
import React from 'react';
|
import React from "react";
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from "prop-types";
|
||||||
import './button.css';
|
import "./button.css";
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Primary UI component for user interaction
|
* Primary UI component for user interaction
|
||||||
*/
|
*/
|
||||||
export const Button = ({ primary, backgroundColor, size, label, ...props }) => {
|
export const Button = ({ primary, backgroundColor, size, label, ...props }) => {
|
||||||
const mode = primary ? 'storybook-button--primary' : 'storybook-button--secondary';
|
const mode = primary ? "storybook-button--primary" : "storybook-button--secondary";
|
||||||
return (
|
return (
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
className={['storybook-button', `storybook-button--${size}`, mode].join(' ')}
|
className={["storybook-button", `storybook-button--${size}`, mode].join(" ")}
|
||||||
style={backgroundColor && { backgroundColor }}
|
style={backgroundColor && { backgroundColor }}
|
||||||
{...props}
|
{...props}
|
||||||
>
|
>
|
||||||
|
@ -31,7 +31,7 @@ Button.propTypes = {
|
||||||
/**
|
/**
|
||||||
* How large should the button be?
|
* How large should the button be?
|
||||||
*/
|
*/
|
||||||
size: PropTypes.oneOf(['small', 'medium', 'large']),
|
size: PropTypes.oneOf(["small", "medium", "large"]),
|
||||||
/**
|
/**
|
||||||
* Button contents
|
* Button contents
|
||||||
*/
|
*/
|
||||||
|
@ -45,6 +45,6 @@ Button.propTypes = {
|
||||||
Button.defaultProps = {
|
Button.defaultProps = {
|
||||||
backgroundColor: null,
|
backgroundColor: null,
|
||||||
primary: false,
|
primary: false,
|
||||||
size: 'medium',
|
size: "medium",
|
||||||
onClick: undefined,
|
onClick: undefined,
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,12 +1,12 @@
|
||||||
import React from 'react';
|
import React from "react";
|
||||||
|
|
||||||
import { Button } from './Button';
|
import { Button } from "./Button";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
title: 'Example/Button',
|
title: "Example/Button",
|
||||||
component: Button,
|
component: Button,
|
||||||
argTypes: {
|
argTypes: {
|
||||||
backgroundColor: { control: 'color' },
|
backgroundColor: { control: "color" },
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -15,22 +15,22 @@ const Template = (args) => <Button {...args} />;
|
||||||
export const Primary = Template.bind({});
|
export const Primary = Template.bind({});
|
||||||
Primary.args = {
|
Primary.args = {
|
||||||
primary: true,
|
primary: true,
|
||||||
label: 'Button',
|
label: "Button",
|
||||||
};
|
};
|
||||||
|
|
||||||
export const Secondary = Template.bind({});
|
export const Secondary = Template.bind({});
|
||||||
Secondary.args = {
|
Secondary.args = {
|
||||||
label: 'Button',
|
label: "Button",
|
||||||
};
|
};
|
||||||
|
|
||||||
export const Large = Template.bind({});
|
export const Large = Template.bind({});
|
||||||
Large.args = {
|
Large.args = {
|
||||||
size: 'large',
|
size: "large",
|
||||||
label: 'Button',
|
label: "Button",
|
||||||
};
|
};
|
||||||
|
|
||||||
export const Small = Template.bind({});
|
export const Small = Template.bind({});
|
||||||
Small.args = {
|
Small.args = {
|
||||||
size: 'small',
|
size: "small",
|
||||||
label: 'Button',
|
label: "Button",
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,8 +1,8 @@
|
||||||
import React from 'react';
|
import React from "react";
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from "prop-types";
|
||||||
|
|
||||||
import { Button } from './Button';
|
import { Button } from "./Button";
|
||||||
import './header.css';
|
import "./header.css";
|
||||||
|
|
||||||
export const Header = ({ user, onLogin, onLogout, onCreateAccount }) => (
|
export const Header = ({ user, onLogin, onLogout, onCreateAccount }) => (
|
||||||
<header>
|
<header>
|
||||||
|
@ -10,18 +10,9 @@ export const Header = ({ user, onLogin, onLogout, onCreateAccount }) => (
|
||||||
<div>
|
<div>
|
||||||
<svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
|
<svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
|
||||||
<g fill="none" fillRule="evenodd">
|
<g fill="none" fillRule="evenodd">
|
||||||
<path
|
<path d="M10 0h12a10 10 0 0110 10v12a10 10 0 01-10 10H10A10 10 0 010 22V10A10 10 0 0110 0z" fill="#FFF" />
|
||||||
d="M10 0h12a10 10 0 0110 10v12a10 10 0 01-10 10H10A10 10 0 010 22V10A10 10 0 0110 0z"
|
<path d="M5.3 10.6l10.4 6v11.1l-10.4-6v-11zm11.4-6.2l9.7 5.5-9.7 5.6V4.4z" fill="#555AB9" />
|
||||||
fill="#FFF"
|
<path d="M27.2 10.6v11.2l-10.5 6V16.5l10.5-6zM15.7 4.4v11L6 10l9.7-5.5z" fill="#91BAF8" />
|
||||||
/>
|
|
||||||
<path
|
|
||||||
d="M5.3 10.6l10.4 6v11.1l-10.4-6v-11zm11.4-6.2l9.7 5.5-9.7 5.6V4.4z"
|
|
||||||
fill="#555AB9"
|
|
||||||
/>
|
|
||||||
<path
|
|
||||||
d="M27.2 10.6v11.2l-10.5 6V16.5l10.5-6zM15.7 4.4v11L6 10l9.7-5.5z"
|
|
||||||
fill="#91BAF8"
|
|
||||||
/>
|
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
<h1>Acme</h1>
|
<h1>Acme</h1>
|
||||||
|
|
|
@ -1,9 +1,9 @@
|
||||||
import React from 'react';
|
import React from "react";
|
||||||
|
|
||||||
import { Header } from './Header';
|
import { Header } from "./Header";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
title: 'Example/Header',
|
title: "Example/Header",
|
||||||
component: Header,
|
component: Header,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -1,12 +1,12 @@
|
||||||
import { Meta } from '@storybook/addon-docs/blocks';
|
import { Meta } from "@storybook/addon-docs/blocks";
|
||||||
import Code from './assets/code-brackets.svg';
|
import Code from "./assets/code-brackets.svg";
|
||||||
import Colors from './assets/colors.svg';
|
import Colors from "./assets/colors.svg";
|
||||||
import Comments from './assets/comments.svg';
|
import Comments from "./assets/comments.svg";
|
||||||
import Direction from './assets/direction.svg';
|
import Direction from "./assets/direction.svg";
|
||||||
import Flow from './assets/flow.svg';
|
import Flow from "./assets/flow.svg";
|
||||||
import Plugin from './assets/plugin.svg';
|
import Plugin from "./assets/plugin.svg";
|
||||||
import Repo from './assets/repo.svg';
|
import Repo from "./assets/repo.svg";
|
||||||
import StackAlt from './assets/stackalt.svg';
|
import StackAlt from "./assets/stackalt.svg";
|
||||||
|
|
||||||
<Meta title="Example/Introduction" />
|
<Meta title="Example/Introduction" />
|
||||||
|
|
||||||
|
@ -126,33 +126,21 @@ We recommend building UIs with a [**component-driven**](https://componentdriven.
|
||||||
<div className="subheading">Configure</div>
|
<div className="subheading">Configure</div>
|
||||||
|
|
||||||
<div className="link-list">
|
<div className="link-list">
|
||||||
<a
|
<a className="link-item" href="https://storybook.js.org/docs/react/addons/addon-types" target="_blank">
|
||||||
className="link-item"
|
|
||||||
href="https://storybook.js.org/docs/react/addons/addon-types"
|
|
||||||
target="_blank"
|
|
||||||
>
|
|
||||||
<img src={Plugin} alt="plugin" />
|
<img src={Plugin} alt="plugin" />
|
||||||
<span>
|
<span>
|
||||||
<strong>Presets for popular tools</strong>
|
<strong>Presets for popular tools</strong>
|
||||||
Easy setup for TypeScript, SCSS and more.
|
Easy setup for TypeScript, SCSS and more.
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a className="link-item" href="https://storybook.js.org/docs/react/configure/webpack" target="_blank">
|
||||||
className="link-item"
|
|
||||||
href="https://storybook.js.org/docs/react/configure/webpack"
|
|
||||||
target="_blank"
|
|
||||||
>
|
|
||||||
<img src={StackAlt} alt="Build" />
|
<img src={StackAlt} alt="Build" />
|
||||||
<span>
|
<span>
|
||||||
<strong>Build configuration</strong>
|
<strong>Build configuration</strong>
|
||||||
How to customize webpack and Babel
|
How to customize webpack and Babel
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a className="link-item" href="https://storybook.js.org/docs/react/configure/styling-and-css" target="_blank">
|
||||||
className="link-item"
|
|
||||||
href="https://storybook.js.org/docs/react/configure/styling-and-css"
|
|
||||||
target="_blank"
|
|
||||||
>
|
|
||||||
<img src={Colors} alt="colors" />
|
<img src={Colors} alt="colors" />
|
||||||
<span>
|
<span>
|
||||||
<strong>Styling</strong>
|
<strong>Styling</strong>
|
||||||
|
@ -206,6 +194,5 @@ We recommend building UIs with a [**component-driven**](https://componentdriven.
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="tip-wrapper">
|
<div className="tip-wrapper">
|
||||||
<span className="tip">Tip</span>Edit the Markdown in{' '}
|
<span className="tip">Tip</span>Edit the Markdown in <code>src/stories/Introduction.stories.mdx</code>
|
||||||
<code>src/stories/Introduction.stories.mdx</code>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,8 +1,8 @@
|
||||||
import React from 'react';
|
import React from "react";
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from "prop-types";
|
||||||
|
|
||||||
import { Header } from './Header';
|
import { Header } from "./Header";
|
||||||
import './page.css';
|
import "./page.css";
|
||||||
|
|
||||||
export const Page = ({ user, onLogin, onLogout, onCreateAccount }) => (
|
export const Page = ({ user, onLogin, onLogout, onCreateAccount }) => (
|
||||||
<article>
|
<article>
|
||||||
|
@ -11,40 +11,38 @@ export const Page = ({ user, onLogin, onLogout, onCreateAccount }) => (
|
||||||
<section>
|
<section>
|
||||||
<h2>Pages in Storybook</h2>
|
<h2>Pages in Storybook</h2>
|
||||||
<p>
|
<p>
|
||||||
We recommend building UIs with a{' '}
|
We recommend building UIs with a{" "}
|
||||||
<a href="https://componentdriven.org" target="_blank" rel="noopener noreferrer">
|
<a href="https://componentdriven.org" target="_blank" rel="noopener noreferrer">
|
||||||
<strong>component-driven</strong>
|
<strong>component-driven</strong>
|
||||||
</a>{' '}
|
</a>{" "}
|
||||||
process starting with atomic components and ending with pages.
|
process starting with atomic components and ending with pages.
|
||||||
</p>
|
</p>
|
||||||
<p>
|
<p>
|
||||||
Render pages with mock data. This makes it easy to build and review page states without
|
Render pages with mock data. This makes it easy to build and review page states without needing to navigate to
|
||||||
needing to navigate to them in your app. Here are some handy patterns for managing page data
|
them in your app. Here are some handy patterns for managing page data in Storybook:
|
||||||
in Storybook:
|
|
||||||
</p>
|
</p>
|
||||||
<ul>
|
<ul>
|
||||||
<li>
|
<li>
|
||||||
Use a higher-level connected component. Storybook helps you compose such data from the
|
Use a higher-level connected component. Storybook helps you compose such data from the "args" of child
|
||||||
"args" of child component stories
|
component stories
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
Assemble data in the page component from your services. You can mock these services out
|
Assemble data in the page component from your services. You can mock these services out using Storybook.
|
||||||
using Storybook.
|
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
<p>
|
<p>
|
||||||
Get a guided tutorial on component-driven development at{' '}
|
Get a guided tutorial on component-driven development at{" "}
|
||||||
<a href="https://www.learnstorybook.com" target="_blank" rel="noopener noreferrer">
|
<a href="https://www.learnstorybook.com" target="_blank" rel="noopener noreferrer">
|
||||||
Learn Storybook
|
Learn Storybook
|
||||||
</a>
|
</a>
|
||||||
. Read more in the{' '}
|
. Read more in the{" "}
|
||||||
<a href="https://storybook.js.org/docs" target="_blank" rel="noopener noreferrer">
|
<a href="https://storybook.js.org/docs" target="_blank" rel="noopener noreferrer">
|
||||||
docs
|
docs
|
||||||
</a>
|
</a>
|
||||||
.
|
.
|
||||||
</p>
|
</p>
|
||||||
<div className="tip-wrapper">
|
<div className="tip-wrapper">
|
||||||
<span className="tip">Tip</span> Adjust the width of the canvas with the{' '}
|
<span className="tip">Tip</span> Adjust the width of the canvas with the{" "}
|
||||||
<svg width="10" height="10" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
|
<svg width="10" height="10" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
|
||||||
<g fill="none" fillRule="evenodd">
|
<g fill="none" fillRule="evenodd">
|
||||||
<path
|
<path
|
||||||
|
|
|
@ -1,10 +1,10 @@
|
||||||
import React from 'react';
|
import React from "react";
|
||||||
|
|
||||||
import { Page } from './Page';
|
import { Page } from "./Page";
|
||||||
import * as HeaderStories from './Header.stories';
|
import * as HeaderStories from "./Header.stories";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
title: 'Example/Page',
|
title: "Example/Page",
|
||||||
component: Page,
|
component: Page,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
.storybook-button {
|
.storybook-button {
|
||||||
font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
font-family: "Nunito Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
border: 0;
|
border: 0;
|
||||||
border-radius: 3em;
|
border-radius: 3em;
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
.wrapper {
|
.wrapper {
|
||||||
font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
font-family: "Nunito Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||||
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
||||||
padding: 15px 20px;
|
padding: 15px 20px;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
Reference in New Issue