move webpage to Gatsby (#32)
* migrate to gatsby in subfolder * move gatsby to main package * use targeted light syntax highlighter * clean up gatsby leftovers
This commit is contained in:
Karol Wypchło
GitHub
parent
8ff073a3fb
commit
ee86da1b39
|
|
@ -54,9 +54,9 @@ typings/
|
|||
# dotenv environment variable files
|
||||
.env*
|
||||
|
||||
# build files
|
||||
# gatsby files
|
||||
.cache/
|
||||
build
|
||||
public
|
||||
|
||||
# Mac files
|
||||
.DS_Store
|
||||
|
|
|
|||
|
|
@ -0,0 +1,35 @@
|
|||
module.exports = {
|
||||
siteMetadata: {
|
||||
title: `Skynet`,
|
||||
description: `Skynet is a decentralized file sharing and content distribution protocol.`,
|
||||
author: `Nebulous`
|
||||
},
|
||||
plugins: [
|
||||
`gatsby-plugin-sass`,
|
||||
`gatsby-plugin-react-helmet`,
|
||||
{
|
||||
resolve: `gatsby-source-filesystem`,
|
||||
options: {
|
||||
name: `images`,
|
||||
path: `${__dirname}/src/images`
|
||||
}
|
||||
},
|
||||
`gatsby-transformer-sharp`,
|
||||
`gatsby-plugin-sharp`,
|
||||
{
|
||||
resolve: `gatsby-plugin-manifest`,
|
||||
options: {
|
||||
name: `Skynet`,
|
||||
short_name: `Skynet`,
|
||||
start_url: `/`,
|
||||
background_color: `#f1f7f2`,
|
||||
theme_color: `#f1f7f2`,
|
||||
display: `minimal-ui`,
|
||||
icon: `src/images/logo.svg` // This path is relative to the root of the site.
|
||||
}
|
||||
}
|
||||
// this (optional) plugin enables Progressive Web App + Offline functionality
|
||||
// To learn more, visit: https://gatsby.dev/offline
|
||||
// `gatsby-plugin-offline`,
|
||||
]
|
||||
};
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
[[redirects]]
|
||||
from = "/skynet/skyfile"
|
||||
to = "https://siasky.net/skynet/skyfile"
|
||||
status = 200
|
||||
force = true
|
||||
|
||||
[[redirects]]
|
||||
from = "/file/*"
|
||||
to = "https://siasky.net/file/:splat"
|
||||
status = 200
|
||||
force = true
|
||||
|
||||
[[redirects]]
|
||||
from = "/"
|
||||
to = "/"
|
||||
status = 200
|
||||
|
||||
[[redirects]]
|
||||
from = "/*"
|
||||
to = "https://siasky.net/:splat"
|
||||
status = 200
|
||||
59
package.json
59
package.json
|
|
@ -1,13 +1,19 @@
|
|||
{
|
||||
"name": "skynet-webportal",
|
||||
"description": "Sia Skynet",
|
||||
"version": "1.0.0",
|
||||
"homepage": "https://siasky.net",
|
||||
"author": "Nebulous",
|
||||
"dependencies": {
|
||||
"@testing-library/dom": "^6.12.2",
|
||||
"@testing-library/jest-dom": "^5.1.1",
|
||||
"@testing-library/react": "^9.3.2",
|
||||
"@testing-library/user-event": "^10.0.0",
|
||||
"classnames": "^2.2.6",
|
||||
"gatsby": "^2.19.7",
|
||||
"gatsby-image": "^2.2.39",
|
||||
"gatsby-plugin-manifest": "^2.2.39",
|
||||
"gatsby-plugin-offline": "^3.0.32",
|
||||
"gatsby-plugin-react-helmet": "^3.1.21",
|
||||
"gatsby-plugin-sass": "^2.1.28",
|
||||
"gatsby-plugin-sharp": "^2.4.3",
|
||||
"gatsby-source-filesystem": "^2.1.46",
|
||||
"gatsby-transformer-sharp": "^2.3.13",
|
||||
"jsonp": "^0.2.1",
|
||||
"node-sass": "^4.13.1",
|
||||
"prop-types": "^15.7.2",
|
||||
|
|
@ -15,10 +21,10 @@
|
|||
"react-countup": "^4.3.3",
|
||||
"react-dom": "^16.12.0",
|
||||
"react-dropzone": "^10.2.1",
|
||||
"react-helmet": "^5.2.1",
|
||||
"react-mailchimp-form": "^1.0.2",
|
||||
"react-mailchimp-subscribe": "^2.1.0",
|
||||
"react-reveal": "^1.2.2",
|
||||
"react-scripts": "^3.4.0",
|
||||
"react-syntax-highlighter": "^12.2.1",
|
||||
"react-visibility-sensor": "^5.1.1",
|
||||
"shortid": "^2.2.15"
|
||||
|
|
@ -26,25 +32,28 @@
|
|||
"devDependencies": {
|
||||
"prettier": "^1.19.1"
|
||||
},
|
||||
"scripts": {
|
||||
"start": "react-scripts start",
|
||||
"build": "react-scripts build",
|
||||
"test": "react-scripts test",
|
||||
"format": "prettier --write \"**/*.{js,jsx,json,md}\""
|
||||
},
|
||||
"eslintConfig": {
|
||||
"extends": "react-app"
|
||||
},
|
||||
"browserslist": {
|
||||
"production": [
|
||||
">0.2%",
|
||||
"not dead",
|
||||
"not op_mini all"
|
||||
"keywords": [
|
||||
"sia",
|
||||
"skynet",
|
||||
"nebulous",
|
||||
"blockchain",
|
||||
"decentralized",
|
||||
"cloud storage"
|
||||
],
|
||||
"development": [
|
||||
"last 1 chrome version",
|
||||
"last 1 firefox version",
|
||||
"last 1 safari version"
|
||||
]
|
||||
"license": "MIT",
|
||||
"scripts": {
|
||||
"build": "gatsby build",
|
||||
"develop": "gatsby develop",
|
||||
"format": "prettier --write \"**/*.{js,jsx,json,md}\"",
|
||||
"start": "yarn run develop",
|
||||
"serve": "gatsby serve",
|
||||
"clean": "gatsby clean"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/NebulousLabs/skynet-webportal"
|
||||
},
|
||||
"bugs": {
|
||||
"url": "https://github.com/NebulousLabs/skynet-webportal/issues"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 37 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 15 KiB |
|
|
@ -1,13 +0,0 @@
|
|||
|
||||
<svg width="263px" height="258px" viewBox="0 0 263 258" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<g id="Homepage" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g transform="translate(-983.000000, -4278.000000)" id="Group-3">
|
||||
<g transform="translate(1114.599987, 4407.025517) rotate(10.000000) translate(-1114.599987, -4407.025517) translate(994.099987, 4276.525517)">
|
||||
<g id="Group-15" transform="translate(0.889504, 0.405409)">
|
||||
<polygon id="Path-6" fill="#343734" points="120 130 2.27373675e-13 199.666667 2.27373675e-13 200 120 260 240 200 240 199.666667"></polygon>
|
||||
<path d="M120,0 L0,66.6666667 L0,200 L120,260 L240,200 L240,66.6666667 L120,0 Z M240,66.6666667 L120,130 L0,66.6666667 M240,200 L120,130 L0,200" id="Path-9-Copy" stroke="#343734" stroke-width="2" stroke-linejoin="round"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1014 B |
|
|
@ -1 +0,0 @@
|
|||
<svg viewBox="0 0 622 151" width="622" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><filter x="-1.7%" y="-1.7%" width="103.4%" height="103.4%" filterUnits="objectBoundingBox" id="a"><feMorphology radius="1" operator="dilate" in="SourceAlpha" result="shadowSpreadOuter1"/><feOffset in="shadowSpreadOuter1" result="shadowOffsetOuter1"/><feMorphology radius="1" in="SourceAlpha" result="shadowInner"/><feOffset in="shadowInner" result="shadowInner"/><feComposite in="shadowOffsetOuter1" in2="shadowInner" operator="out" result="shadowOffsetOuter1"/><feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"/><feColorMatrix values="0 0 0 0 0.341176471 0 0 0 0 0.709803922 0 0 0 0 0.376470588 0 0 0 0.3 0" in="shadowBlurOuter1"/></filter><path d="M384 768c212.077 0 384-171.923 384-384S596.077 0 384 0 0 171.923 0 384s171.923 384 384 384zm192-51.446c-91.832 53.02-252.238-52.89-358.277-236.554C111.684 296.336 100.168 104.466 192 51.446" id="b"/></defs><g fill="none" fill-rule="evenodd"><g stroke-linejoin="round" transform="translate(-73 -626)"><use fill="#000" filter="url(#a)" xlink:href="#b"/><use stroke="#57B560" stroke-width="2" xlink:href="#b"/></g><path d="M119.706-574.998l-.78.524C27.13-521.461 38.642-329.612 144.64-145.968 250.637 37.676 410.982 143.572 502.779 90.559l.218-.052C446.488 123.254 380.859 142 310.853 142 98.857 142-73-29.904-73-241.957c0-142.44 77.542-266.765 192.706-333.04z" fill="#57B560"/></g></svg>
|
||||
|
Before Width: | Height: | Size: 1.5 KiB |
|
|
@ -1,43 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="theme-color" content="#000000" />
|
||||
<meta
|
||||
name="description"
|
||||
content="Skynet is a decentralized file sharing and content distribution protocol."
|
||||
/>
|
||||
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
|
||||
<!--
|
||||
manifest.json provides metadata used when your web app is installed on a
|
||||
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
|
||||
-->
|
||||
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
|
||||
<!--
|
||||
Notice the use of %PUBLIC_URL% in the tags above.
|
||||
It will be replaced with the URL of the `public` folder during the build.
|
||||
Only files inside the `public` folder can be referenced from the HTML.
|
||||
|
||||
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
|
||||
work correctly both with client-side routing and a non-root public URL.
|
||||
Learn how to configure a non-root public URL by running `npm run build`.
|
||||
-->
|
||||
<title>Skynet</title>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>You need to enable JavaScript to run this app.</noscript>
|
||||
<div id="root"></div>
|
||||
<!--
|
||||
This HTML file is a template.
|
||||
If you open it directly in the browser, you will see an empty page.
|
||||
|
||||
You can add webfonts, meta tags, or analytics to this file.
|
||||
The build step will place the bundled scripts into the <body> tag.
|
||||
|
||||
To begin the development, run `npm start` or `yarn start`.
|
||||
To create a production bundle, use `npm run build` or `yarn build`.
|
||||
-->
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
{
|
||||
"short_name": "Skynet",
|
||||
"name": "Skynet",
|
||||
"icons": [
|
||||
{
|
||||
"src": "favicon.ico",
|
||||
"sizes": "64x64 32x32 24x24 16x16",
|
||||
"type": "image/x-icon"
|
||||
},
|
||||
{
|
||||
"src": "android-chrome-192x192.png",
|
||||
"type": "image/png",
|
||||
"sizes": "192x192"
|
||||
},
|
||||
{
|
||||
"src": "android-chrome-512x512.png",
|
||||
"type": "image/png",
|
||||
"sizes": "512x512"
|
||||
}
|
||||
],
|
||||
"start_url": ".",
|
||||
"display": "standalone",
|
||||
"theme_color": "#000000",
|
||||
"background_color": "#ffffff"
|
||||
}
|
||||
Binary file not shown.
|
|
@ -1,3 +0,0 @@
|
|||
# https://www.robotstxt.org/robotstxt.html
|
||||
User-agent: *
|
||||
Disallow:
|
||||
BIN
public/terms.pdf
BIN
public/terms.pdf
Binary file not shown.
|
|
@ -82,4 +82,4 @@ You can check that with `node -v` and `yarn -v` commands respectively.
|
|||
- run `yarn` to build dependencies
|
||||
- run `yarn build` to build the client package
|
||||
|
||||
Client package will be outputted to `/build` and nginx configuration will pick it up automatically.
|
||||
Client package will be outputted to `/public` and nginx configuration will pick it up automatically.
|
||||
|
|
|
|||
|
|
@ -11,10 +11,10 @@ sudo cp ./ssh_config /etc/ssh/ssh_config
|
|||
mkdir -p ~/.ssh
|
||||
cat ./authorized_keys >> ~/.ssh/authorized_keys
|
||||
|
||||
# Nodejs install prerequisite. From official documentation.
|
||||
# Nodejs install prerequisite https://nodejs.org/en/download/package-manager/
|
||||
curl -sL https://deb.nodesource.com/setup_13.x | sudo -E bash -
|
||||
|
||||
# Yarn install prerequisite.
|
||||
# Yarn install prerequisite https://classic.yarnpkg.com/en/docs/install
|
||||
curl -sL https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add -
|
||||
echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list
|
||||
|
||||
|
|
@ -23,9 +23,6 @@ sudo apt-get update
|
|||
sudo apt-get -y install ufw tmux ranger htop nload nginx certbot \
|
||||
python-certbot-nginx nodejs gcc g++ make yarn git vim
|
||||
|
||||
# Install pm2
|
||||
sudo npm i -g pm2
|
||||
|
||||
# terminfo for alacritty terminal via ssh
|
||||
# If you don't use the alacritty terminal you can remove this step.
|
||||
wget -c https://raw.githubusercontent.com/alacritty/alacritty/master/extra/alacritty.info
|
||||
|
|
@ -66,3 +63,4 @@ cd Sia && git checkout viewnode && make
|
|||
cd $cwd
|
||||
cd ../
|
||||
yarn
|
||||
yarn build
|
||||
|
|
|
|||
|
|
@ -10,8 +10,10 @@ server {
|
|||
listen [::]:443 ssl http2;
|
||||
server_name siasky.net www.siasky.net; # replace with actual server names
|
||||
|
||||
# NOTE: make sure to enable any additional configuration you might need like gzip
|
||||
|
||||
location / {
|
||||
root /home/user/skynet-webportal/build; # path to root of index.html
|
||||
root /home/user/skynet-webportal/public; # path to root of index.html
|
||||
}
|
||||
|
||||
location /skynet/skyfile/ {
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
import React from "react";
|
||||
|
||||
import TopSwoosh from "../../svg/TopSwoosh";
|
||||
import "./App.scss";
|
||||
import { HomeTop, HomeUpload, HomeBuilt, HomeSamples, HomeStay, HomeNetwork, Footer } from "../";
|
||||
|
||||
function App() {
|
||||
return (
|
||||
<div className="app">
|
||||
<img className="top-swoosh" src="/images/top-swoosh.svg" alt="top swoosh" />
|
||||
<TopSwoosh className="top-swoosh" />
|
||||
|
||||
<div className="width">
|
||||
<HomeTop />
|
||||
|
|
|
|||
|
|
@ -1,53 +1,58 @@
|
|||
import React, { useState } from "react";
|
||||
import SyntaxHighlighter from "react-syntax-highlighter";
|
||||
import classNames from "classnames";
|
||||
|
||||
import "./CodeExamples.scss";
|
||||
import { Light as SyntaxHighlighter } from "react-syntax-highlighter";
|
||||
import { javascript, go, python, bash } from 'react-syntax-highlighter/dist/esm/languages/hljs';
|
||||
import Colors from "./Colors";
|
||||
import { python, curl, node, go } from "./Code";
|
||||
import * as snippets from "./Code";
|
||||
import "./CodeExamples.scss";
|
||||
|
||||
SyntaxHighlighter.registerLanguage('javascript', javascript);
|
||||
SyntaxHighlighter.registerLanguage('go', go);
|
||||
SyntaxHighlighter.registerLanguage('python', python);
|
||||
SyntaxHighlighter.registerLanguage('bash', bash);
|
||||
|
||||
export default function CodeExamples() {
|
||||
const [active, setActive] = useState(1);
|
||||
|
||||
return (
|
||||
<div className="code-examples">
|
||||
<ul className="code-examples-tabs">
|
||||
<li onClick={() => setActive(1)} className={classNames({ active: active === 1 })}>
|
||||
<div className="code-examples-tabs">
|
||||
<button type="button" onClick={() => setActive(1)} className={classNames({ active: active === 1 })}>
|
||||
CURL
|
||||
</li>
|
||||
<li onClick={() => setActive(2)} className={classNames({ active: active === 2 })}>
|
||||
</button>
|
||||
<button type="button" onClick={() => setActive(2)} className={classNames({ active: active === 2 })}>
|
||||
Python
|
||||
</li>
|
||||
<li onClick={() => setActive(3)} className={classNames({ active: active === 3 })}>
|
||||
</button>
|
||||
<button type="button" onClick={() => setActive(3)} className={classNames({ active: active === 3 })}>
|
||||
Node.js
|
||||
</li>
|
||||
<li onClick={() => setActive(4)} className={classNames({ active: active === 4 })}>
|
||||
</button>
|
||||
<button type="button" onClick={() => setActive(4)} className={classNames({ active: active === 4 })}>
|
||||
Go
|
||||
</li>
|
||||
</ul>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="code-examples-body">
|
||||
{active === 1 && (
|
||||
<SyntaxHighlighter wrapLines showLineNumbers={true} language="curl" style={Colors}>
|
||||
{curl}
|
||||
<SyntaxHighlighter wrapLines showLineNumbers={true} language="bash" style={Colors}>
|
||||
{snippets.curl}
|
||||
</SyntaxHighlighter>
|
||||
)}
|
||||
|
||||
{active === 2 && (
|
||||
<SyntaxHighlighter wrapLines showLineNumbers={true} language="python" style={Colors}>
|
||||
{python}
|
||||
{snippets.python}
|
||||
</SyntaxHighlighter>
|
||||
)}
|
||||
|
||||
{active === 3 && (
|
||||
<SyntaxHighlighter wrapLines showLineNumbers={true} language="node" style={Colors}>
|
||||
{node}
|
||||
<SyntaxHighlighter wrapLines showLineNumbers={true} language="javascript" style={Colors}>
|
||||
{snippets.node}
|
||||
</SyntaxHighlighter>
|
||||
)}
|
||||
|
||||
{active === 4 && (
|
||||
<SyntaxHighlighter wrapLines showLineNumbers={true} language="go" style={Colors}>
|
||||
{go}
|
||||
{snippets.go}
|
||||
</SyntaxHighlighter>
|
||||
)}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
align-items: flex-end;
|
||||
height: 65px;
|
||||
|
||||
li {
|
||||
button {
|
||||
display: block;
|
||||
flex: 1;
|
||||
color: $white60;
|
||||
|
|
@ -30,23 +30,23 @@
|
|||
}
|
||||
}
|
||||
|
||||
li:hover,
|
||||
li.active {
|
||||
button:hover,
|
||||
button.active {
|
||||
color: $white;
|
||||
background-color: #171917;
|
||||
line-height: 65px;
|
||||
}
|
||||
|
||||
li:first-child {
|
||||
button:first-child {
|
||||
border-top-left-radius: 12px;
|
||||
}
|
||||
|
||||
li:last-child {
|
||||
button:last-child {
|
||||
border-top-right-radius: 12px;
|
||||
}
|
||||
|
||||
li.filler,
|
||||
li.filler:hover {
|
||||
button.filler,
|
||||
button.filler:hover {
|
||||
flex: 1;
|
||||
height: 57px;
|
||||
border-top-right-radius: 12px;
|
||||
|
|
|
|||
|
|
@ -43,7 +43,7 @@
|
|||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin: -2px 8px 0 0;
|
||||
background-image: url('/images/green-check.svg');
|
||||
background-image: url('../../images/green-check.svg');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 28px;
|
||||
background-position: top -300px center;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,83 @@
|
|||
/**
|
||||
* SEO component that queries for data with
|
||||
* Gatsby's useStaticQuery React hook
|
||||
*
|
||||
* See: https://www.gatsbyjs.org/docs/use-static-query/
|
||||
*/
|
||||
|
||||
import React from "react";
|
||||
import PropTypes from "prop-types";
|
||||
import Helmet from "react-helmet";
|
||||
import { useStaticQuery, graphql } from "gatsby";
|
||||
|
||||
function SEO({ lang, meta }) {
|
||||
const { site } = useStaticQuery(
|
||||
graphql`
|
||||
query {
|
||||
site {
|
||||
siteMetadata {
|
||||
title
|
||||
author
|
||||
description
|
||||
}
|
||||
}
|
||||
}
|
||||
`
|
||||
);
|
||||
|
||||
return (
|
||||
<Helmet
|
||||
htmlAttributes={{
|
||||
lang
|
||||
}}
|
||||
title={site.siteMetadata.title}
|
||||
meta={[
|
||||
{
|
||||
name: `description`,
|
||||
content: site.siteMetadata.description
|
||||
},
|
||||
{
|
||||
property: `og:title`,
|
||||
content: site.siteMetadata.title
|
||||
},
|
||||
{
|
||||
property: `og:description`,
|
||||
content: site.siteMetadata.description
|
||||
},
|
||||
{
|
||||
property: `og:type`,
|
||||
content: `website`
|
||||
},
|
||||
{
|
||||
name: `twitter:card`,
|
||||
content: `summary`
|
||||
},
|
||||
{
|
||||
name: `twitter:creator`,
|
||||
content: site.siteMetadata.author
|
||||
},
|
||||
{
|
||||
name: `twitter:title`,
|
||||
content: site.siteMetadata.title
|
||||
},
|
||||
{
|
||||
name: `twitter:description`,
|
||||
content: site.siteMetadata.description
|
||||
}
|
||||
].concat(meta)}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
SEO.defaultProps = {
|
||||
lang: `en`,
|
||||
meta: [],
|
||||
description: ``
|
||||
};
|
||||
|
||||
SEO.propTypes = {
|
||||
lang: PropTypes.string,
|
||||
meta: PropTypes.arrayOf(PropTypes.object)
|
||||
};
|
||||
|
||||
export default SEO;
|
||||
|
|
@ -2,40 +2,40 @@
|
|||
|
||||
@font-face {
|
||||
font-family: "Haas Grot Disp";
|
||||
src: url("/fonts/hinted-subset-HaasGrotDispR-55Roman.woff2") format("woff2"),
|
||||
url("/fonts/hinted-subset-HaasGrotDispR-55Roman.woff") format("woff");
|
||||
src: url("./fonts/hinted-subset-HaasGrotDispR-55Roman.woff2") format("woff2"),
|
||||
url("./fonts/hinted-subset-HaasGrotDispR-55Roman.woff") format("woff");
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Haas Grot Disp";
|
||||
src: url("/fonts/hinted-subset-HaasGrotDispR-65Medium.woff2") format("woff2"),
|
||||
url("/fonts/hinted-subset-HaasGrotDispR-65Medium.woff") format("woff");
|
||||
src: url("./fonts/hinted-subset-HaasGrotDispR-65Medium.woff2") format("woff2"),
|
||||
url("./fonts/hinted-subset-HaasGrotDispR-65Medium.woff") format("woff");
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Haas Grot Text";
|
||||
src: url("/fonts/hinted-subset-HaasGrotTextR-75Bold.woff2") format("woff2"),
|
||||
url("/fonts/hinted-subset-HaasGrotTextR-75Bold.woff") format("woff");
|
||||
src: url("./fonts/hinted-subset-HaasGrotTextR-75Bold.woff2") format("woff2"),
|
||||
url("./fonts/hinted-subset-HaasGrotTextR-75Bold.woff") format("woff");
|
||||
font-weight: bold;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Haas Grot Text";
|
||||
src: url("/fonts/hinted-subset-HaasGrotTextR-65Medium.woff2") format("woff2"),
|
||||
url("/fonts/hinted-subset-HaasGrotTextR-65Medium.woff") format("woff");
|
||||
src: url("./fonts/hinted-subset-HaasGrotTextR-65Medium.woff2") format("woff2"),
|
||||
url("./fonts/hinted-subset-HaasGrotTextR-65Medium.woff") format("woff");
|
||||
font-weight: 600;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Haas Grot Text";
|
||||
src: url("/fonts/hinted-subset-HaasGrotTextR-55Roman.woff2") format("woff2"),
|
||||
url("/fonts/hinted-subset-HaasGrotTextR-55Roman.woff") format("woff");
|
||||
src: url("./fonts/hinted-subset-HaasGrotTextR-55Roman.woff2") format("woff2"),
|
||||
url("./fonts/hinted-subset-HaasGrotTextR-55Roman.woff") format("woff");
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 1.9 KiB |
|
|
@ -1,4 +1,4 @@
|
|||
<svg viewBox="19.88800048828125 48.90407943725586 132.07760620117188 108.50448608398438" xmlns="http://www.w3.org/2000/svg">
|
||||
<svg viewBox="19.88800048828125 37.1175193787 132.07760620117188 132.07760620117188" xmlns="http://www.w3.org/2000/svg">
|
||||
<defs>
|
||||
<style>.cls-1,.cls-2{fill:#0071bc;}.cls-1{fill-rule:evenodd;}.cls-2{font-size:87px;font-family:Karbon-Light, Karbon;font-weight:300;letter-spacing:-0.05em;}.cls-3{letter-spacing:-0.05em;}.cls-4{letter-spacing:-0.05em;}</style>
|
||||
</defs>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
|
|
@ -1,7 +0,0 @@
|
|||
import React from "react";
|
||||
import ReactDOM from "react-dom";
|
||||
|
||||
import "./global.scss";
|
||||
import { App } from "./components";
|
||||
|
||||
ReactDOM.render(<App />, document.getElementById("root"));
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
import React from "react";
|
||||
import SEO from "../components/seo";
|
||||
import { App } from "../components";
|
||||
import "../global.scss";
|
||||
|
||||
const IndexPage = () => (
|
||||
<>
|
||||
<SEO />
|
||||
<App />
|
||||
</>
|
||||
);
|
||||
|
||||
export default IndexPage;
|
||||
|
|
@ -0,0 +1,70 @@
|
|||
import React from "react";
|
||||
|
||||
export default function TopSwoosh({ ...props }) {
|
||||
return (
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlnsXlink="http://www.w3.org/1999/xlink"
|
||||
width="622"
|
||||
viewBox="0 0 622 151"
|
||||
{...props}
|
||||
>
|
||||
<defs>
|
||||
<filter
|
||||
id="a"
|
||||
width="103.4%"
|
||||
height="103.4%"
|
||||
x="-1.7%"
|
||||
y="-1.7%"
|
||||
filterUnits="objectBoundingBox"
|
||||
>
|
||||
<feMorphology
|
||||
in="SourceAlpha"
|
||||
operator="dilate"
|
||||
radius="1"
|
||||
result="shadowSpreadOuter1"
|
||||
></feMorphology>
|
||||
<feOffset
|
||||
in="shadowSpreadOuter1"
|
||||
result="shadowOffsetOuter1"
|
||||
></feOffset>
|
||||
<feMorphology
|
||||
in="SourceAlpha"
|
||||
radius="1"
|
||||
result="shadowInner"
|
||||
></feMorphology>
|
||||
<feOffset in="shadowInner" result="shadowInner"></feOffset>
|
||||
<feComposite
|
||||
in="shadowOffsetOuter1"
|
||||
in2="shadowInner"
|
||||
operator="out"
|
||||
result="shadowOffsetOuter1"
|
||||
></feComposite>
|
||||
<feGaussianBlur
|
||||
in="shadowOffsetOuter1"
|
||||
result="shadowBlurOuter1"
|
||||
stdDeviation="4"
|
||||
></feGaussianBlur>
|
||||
<feColorMatrix
|
||||
in="shadowBlurOuter1"
|
||||
values="0 0 0 0 0.341176471 0 0 0 0 0.709803922 0 0 0 0 0.376470588 0 0 0 0.3 0"
|
||||
></feColorMatrix>
|
||||
</filter>
|
||||
<path
|
||||
id="b"
|
||||
d="M384 768c212.077 0 384-171.923 384-384S596.077 0 384 0 0 171.923 0 384s171.923 384 384 384zm192-51.446c-91.832 53.02-252.238-52.89-358.277-236.554C111.684 296.336 100.168 104.466 192 51.446"
|
||||
></path>
|
||||
</defs>
|
||||
<g fill="none" fillRule="evenodd">
|
||||
<g strokeLinejoin="round" transform="translate(-73 -626)">
|
||||
<use fill="#000" filter="url(#a)" xlinkHref="#b"></use>
|
||||
<use stroke="#57B560" strokeWidth="2" xlinkHref="#b"></use>
|
||||
</g>
|
||||
<path
|
||||
fill="#57B560"
|
||||
d="M119.706-574.998l-.78.524C27.13-521.461 38.642-329.612 144.64-145.968 250.637 37.676 410.982 143.572 502.779 90.559l.218-.052C446.488 123.254 380.859 142 310.853 142 98.857 142-73-29.904-73-241.957c0-142.44 77.542-266.765 192.706-333.04z"
|
||||
></path>
|
||||
</g>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
Reference in New Issue