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"
|
||||
---
|
||||
|
||||
**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.
|
||||
|
||||
|
|
|
@ -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.
|
||||
|
||||
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
|
||||
|
||||
|
|
|
@ -90,4 +90,3 @@
|
|||
github: https://github.com/dghelm
|
||||
linkedin: https://www.linkedin.com/in/dghelm/
|
||||
twitter: https://twitter.com/danielgileshelm
|
||||
|
||||
|
|
|
@ -1,16 +1,16 @@
|
|||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import './button.css';
|
||||
import React from "react";
|
||||
import PropTypes from "prop-types";
|
||||
import "./button.css";
|
||||
|
||||
/**
|
||||
* Primary UI component for user interaction
|
||||
*/
|
||||
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 (
|
||||
<button
|
||||
type="button"
|
||||
className={['storybook-button', `storybook-button--${size}`, mode].join(' ')}
|
||||
className={["storybook-button", `storybook-button--${size}`, mode].join(" ")}
|
||||
style={backgroundColor && { backgroundColor }}
|
||||
{...props}
|
||||
>
|
||||
|
@ -31,7 +31,7 @@ Button.propTypes = {
|
|||
/**
|
||||
* How large should the button be?
|
||||
*/
|
||||
size: PropTypes.oneOf(['small', 'medium', 'large']),
|
||||
size: PropTypes.oneOf(["small", "medium", "large"]),
|
||||
/**
|
||||
* Button contents
|
||||
*/
|
||||
|
@ -45,6 +45,6 @@ Button.propTypes = {
|
|||
Button.defaultProps = {
|
||||
backgroundColor: null,
|
||||
primary: false,
|
||||
size: 'medium',
|
||||
size: "medium",
|
||||
onClick: undefined,
|
||||
};
|
||||
|
|
|
@ -1,12 +1,12 @@
|
|||
import React from 'react';
|
||||
import React from "react";
|
||||
|
||||
import { Button } from './Button';
|
||||
import { Button } from "./Button";
|
||||
|
||||
export default {
|
||||
title: 'Example/Button',
|
||||
title: "Example/Button",
|
||||
component: Button,
|
||||
argTypes: {
|
||||
backgroundColor: { control: 'color' },
|
||||
backgroundColor: { control: "color" },
|
||||
},
|
||||
};
|
||||
|
||||
|
@ -15,22 +15,22 @@ const Template = (args) => <Button {...args} />;
|
|||
export const Primary = Template.bind({});
|
||||
Primary.args = {
|
||||
primary: true,
|
||||
label: 'Button',
|
||||
label: "Button",
|
||||
};
|
||||
|
||||
export const Secondary = Template.bind({});
|
||||
Secondary.args = {
|
||||
label: 'Button',
|
||||
label: "Button",
|
||||
};
|
||||
|
||||
export const Large = Template.bind({});
|
||||
Large.args = {
|
||||
size: 'large',
|
||||
label: 'Button',
|
||||
size: "large",
|
||||
label: "Button",
|
||||
};
|
||||
|
||||
export const Small = Template.bind({});
|
||||
Small.args = {
|
||||
size: 'small',
|
||||
label: 'Button',
|
||||
size: "small",
|
||||
label: "Button",
|
||||
};
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import React from "react";
|
||||
import PropTypes from "prop-types";
|
||||
|
||||
import { Button } from './Button';
|
||||
import './header.css';
|
||||
import { Button } from "./Button";
|
||||
import "./header.css";
|
||||
|
||||
export const Header = ({ user, onLogin, onLogout, onCreateAccount }) => (
|
||||
<header>
|
||||
|
@ -10,18 +10,9 @@ export const Header = ({ user, onLogin, onLogout, onCreateAccount }) => (
|
|||
<div>
|
||||
<svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
|
||||
<g fill="none" fillRule="evenodd">
|
||||
<path
|
||||
d="M10 0h12a10 10 0 0110 10v12a10 10 0 01-10 10H10A10 10 0 010 22V10A10 10 0 0110 0z"
|
||||
fill="#FFF"
|
||||
/>
|
||||
<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"
|
||||
/>
|
||||
<path d="M10 0h12a10 10 0 0110 10v12a10 10 0 01-10 10H10A10 10 0 010 22V10A10 10 0 0110 0z" fill="#FFF" />
|
||||
<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>
|
||||
</svg>
|
||||
<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 {
|
||||
title: 'Example/Header',
|
||||
title: "Example/Header",
|
||||
component: Header,
|
||||
};
|
||||
|
||||
|
|
|
@ -1,12 +1,12 @@
|
|||
import { Meta } from '@storybook/addon-docs/blocks';
|
||||
import Code from './assets/code-brackets.svg';
|
||||
import Colors from './assets/colors.svg';
|
||||
import Comments from './assets/comments.svg';
|
||||
import Direction from './assets/direction.svg';
|
||||
import Flow from './assets/flow.svg';
|
||||
import Plugin from './assets/plugin.svg';
|
||||
import Repo from './assets/repo.svg';
|
||||
import StackAlt from './assets/stackalt.svg';
|
||||
import { Meta } from "@storybook/addon-docs/blocks";
|
||||
import Code from "./assets/code-brackets.svg";
|
||||
import Colors from "./assets/colors.svg";
|
||||
import Comments from "./assets/comments.svg";
|
||||
import Direction from "./assets/direction.svg";
|
||||
import Flow from "./assets/flow.svg";
|
||||
import Plugin from "./assets/plugin.svg";
|
||||
import Repo from "./assets/repo.svg";
|
||||
import StackAlt from "./assets/stackalt.svg";
|
||||
|
||||
<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="link-list">
|
||||
<a
|
||||
className="link-item"
|
||||
href="https://storybook.js.org/docs/react/addons/addon-types"
|
||||
target="_blank"
|
||||
>
|
||||
<a className="link-item" href="https://storybook.js.org/docs/react/addons/addon-types" target="_blank">
|
||||
<img src={Plugin} alt="plugin" />
|
||||
<span>
|
||||
<strong>Presets for popular tools</strong>
|
||||
Easy setup for TypeScript, SCSS and more.
|
||||
</span>
|
||||
</a>
|
||||
<a
|
||||
className="link-item"
|
||||
href="https://storybook.js.org/docs/react/configure/webpack"
|
||||
target="_blank"
|
||||
>
|
||||
<a className="link-item" href="https://storybook.js.org/docs/react/configure/webpack" target="_blank">
|
||||
<img src={StackAlt} alt="Build" />
|
||||
<span>
|
||||
<strong>Build configuration</strong>
|
||||
How to customize webpack and Babel
|
||||
</span>
|
||||
</a>
|
||||
<a
|
||||
className="link-item"
|
||||
href="https://storybook.js.org/docs/react/configure/styling-and-css"
|
||||
target="_blank"
|
||||
>
|
||||
<a className="link-item" href="https://storybook.js.org/docs/react/configure/styling-and-css" target="_blank">
|
||||
<img src={Colors} alt="colors" />
|
||||
<span>
|
||||
<strong>Styling</strong>
|
||||
|
@ -206,6 +194,5 @@ We recommend building UIs with a [**component-driven**](https://componentdriven.
|
|||
</div>
|
||||
|
||||
<div className="tip-wrapper">
|
||||
<span className="tip">Tip</span>Edit the Markdown in{' '}
|
||||
<code>src/stories/Introduction.stories.mdx</code>
|
||||
<span className="tip">Tip</span>Edit the Markdown in <code>src/stories/Introduction.stories.mdx</code>
|
||||
</div>
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import React from "react";
|
||||
import PropTypes from "prop-types";
|
||||
|
||||
import { Header } from './Header';
|
||||
import './page.css';
|
||||
import { Header } from "./Header";
|
||||
import "./page.css";
|
||||
|
||||
export const Page = ({ user, onLogin, onLogout, onCreateAccount }) => (
|
||||
<article>
|
||||
|
@ -11,40 +11,38 @@ export const Page = ({ user, onLogin, onLogout, onCreateAccount }) => (
|
|||
<section>
|
||||
<h2>Pages in Storybook</h2>
|
||||
<p>
|
||||
We recommend building UIs with a{' '}
|
||||
We recommend building UIs with a{" "}
|
||||
<a href="https://componentdriven.org" target="_blank" rel="noopener noreferrer">
|
||||
<strong>component-driven</strong>
|
||||
</a>{' '}
|
||||
</a>{" "}
|
||||
process starting with atomic components and ending with pages.
|
||||
</p>
|
||||
<p>
|
||||
Render pages with mock data. This makes it easy to build and review page states without
|
||||
needing to navigate to them in your app. Here are some handy patterns for managing page data
|
||||
in Storybook:
|
||||
Render pages with mock data. This makes it easy to build and review page states without needing to navigate to
|
||||
them in your app. Here are some handy patterns for managing page data in Storybook:
|
||||
</p>
|
||||
<ul>
|
||||
<li>
|
||||
Use a higher-level connected component. Storybook helps you compose such data from the
|
||||
"args" of child component stories
|
||||
Use a higher-level connected component. Storybook helps you compose such data from the "args" of child
|
||||
component stories
|
||||
</li>
|
||||
<li>
|
||||
Assemble data in the page component from your services. You can mock these services out
|
||||
using Storybook.
|
||||
Assemble data in the page component from your services. You can mock these services out using Storybook.
|
||||
</li>
|
||||
</ul>
|
||||
<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">
|
||||
Learn Storybook
|
||||
</a>
|
||||
. Read more in the{' '}
|
||||
. Read more in the{" "}
|
||||
<a href="https://storybook.js.org/docs" target="_blank" rel="noopener noreferrer">
|
||||
docs
|
||||
</a>
|
||||
.
|
||||
</p>
|
||||
<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">
|
||||
<g fill="none" fillRule="evenodd">
|
||||
<path
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
import React from 'react';
|
||||
import React from "react";
|
||||
|
||||
import { Page } from './Page';
|
||||
import * as HeaderStories from './Header.stories';
|
||||
import { Page } from "./Page";
|
||||
import * as HeaderStories from "./Header.stories";
|
||||
|
||||
export default {
|
||||
title: 'Example/Page',
|
||||
title: "Example/Page",
|
||||
component: Page,
|
||||
};
|
||||
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
.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;
|
||||
border: 0;
|
||||
border-radius: 3em;
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
.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);
|
||||
padding: 15px 20px;
|
||||
display: flex;
|
||||
|
|
Reference in New Issue