init
This commit is contained in:
commit
1ae85edc1f
|
|
@ -0,0 +1,54 @@
|
|||
{
|
||||
"presets": ["babel-preset-gatsby"],
|
||||
"plugins": [
|
||||
[
|
||||
"module-resolver",
|
||||
{
|
||||
"@": ["./src"],
|
||||
"alias": {
|
||||
"@components": "./src/components",
|
||||
"@config": "./src/config",
|
||||
"@features": "./src/features",
|
||||
"@images": "./src/images",
|
||||
"@libs": "./src/libs",
|
||||
"@utils": "./src/utils"
|
||||
}
|
||||
}
|
||||
],
|
||||
[
|
||||
"babel-plugin-transform-imports",
|
||||
{
|
||||
"@material-ui/core": {
|
||||
// Use "transform: '@material-ui/core/${member}'," if your bundler does not support ES modules
|
||||
"transform": "@material-ui/core/${member}",
|
||||
"preventFullImport": true
|
||||
},
|
||||
"@material-ui/lab": {
|
||||
// Use "transform: '@material-ui/lab/${member}'," if your bundler does not support ES modules
|
||||
"transform": "@material-ui/lab/${member}",
|
||||
"preventFullImport": true
|
||||
},
|
||||
"@material-ui/icons": {
|
||||
// Use "transform: '@material-ui/icons/${member}'," if your bundler does not support ES modules
|
||||
"transform": "@material-ui/icons/${member}",
|
||||
"preventFullImport": true
|
||||
},
|
||||
"lodash": {
|
||||
// Use "transform: 'lodash/${member}'," if your bundler does not support ES modules
|
||||
"transform": "lodash/${member}",
|
||||
"preventFullImport": true
|
||||
},
|
||||
"date-fns": {
|
||||
// Use "transform: 'date-fns/${member}'," if your bundler does not support ES modules
|
||||
"transform": "date-fns/${member}",
|
||||
"preventFullImport": true
|
||||
},
|
||||
"validator": {
|
||||
// Use "transform: 'validator/${member}'," if your bundler does not support ES modules
|
||||
"transform": "validator/lib/${member}",
|
||||
"preventFullImport": true
|
||||
}
|
||||
}
|
||||
]
|
||||
]
|
||||
}
|
||||
|
|
@ -0,0 +1,69 @@
|
|||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
|
||||
# Runtime data
|
||||
pids
|
||||
*.pid
|
||||
*.seed
|
||||
*.pid.lock
|
||||
|
||||
# Directory for instrumented libs generated by jscoverage/JSCover
|
||||
lib-cov
|
||||
|
||||
# Coverage directory used by tools like istanbul
|
||||
coverage
|
||||
|
||||
# nyc test coverage
|
||||
.nyc_output
|
||||
|
||||
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
|
||||
.grunt
|
||||
|
||||
# Bower dependency directory (https://bower.io/)
|
||||
bower_components
|
||||
|
||||
# node-waf configuration
|
||||
.lock-wscript
|
||||
|
||||
# Compiled binary addons (http://nodejs.org/api/addons.html)
|
||||
build/Release
|
||||
|
||||
# Dependency directories
|
||||
node_modules/
|
||||
jspm_packages/
|
||||
|
||||
# Typescript v1 declaration files
|
||||
typings/
|
||||
|
||||
# Optional npm cache directory
|
||||
.npm
|
||||
|
||||
# Optional eslint cache
|
||||
.eslintcache
|
||||
|
||||
# Optional REPL history
|
||||
.node_repl_history
|
||||
|
||||
# Output of 'npm pack'
|
||||
*.tgz
|
||||
|
||||
# dotenv environment variable files
|
||||
.env*
|
||||
|
||||
# gatsby files
|
||||
.cache/
|
||||
public
|
||||
|
||||
# Mac files
|
||||
.DS_Store
|
||||
|
||||
# Yarn
|
||||
yarn-error.log
|
||||
.pnp/
|
||||
.pnp.js
|
||||
# Yarn Integrity file
|
||||
.yarn-integrity
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
.cache
|
||||
package.json
|
||||
package-lock.json
|
||||
public
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"arrowParens": "avoid",
|
||||
"semi": true
|
||||
}
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
FROM node:14.1.0-alpine as build-deps
|
||||
|
||||
ENV NODE_ENV=production
|
||||
|
||||
RUN npm install --global gatsby-cli
|
||||
WORKDIR /usr/src/app
|
||||
COPY package.json yarn.lock ./
|
||||
RUN yarn
|
||||
COPY . ./
|
||||
RUN yarn build
|
||||
|
||||
#Stage 2
|
||||
|
||||
FROM nginx:1.17.5-alpine
|
||||
COPY --from=build-deps /usr/src/app/build /var/www
|
||||
COPY nginx.conf /etc/nginx/nginx.conf
|
||||
EXPOSE 80
|
||||
CMD ["nginx", "-g", "daemon off;"]
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2015 gatsbyjs
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
|
||||
|
|
@ -0,0 +1,99 @@
|
|||
<!-- AUTO-GENERATED-CONTENT:START (STARTER) -->
|
||||
<p align="center">
|
||||
<a href="https://www.gatsbyjs.org">
|
||||
<img alt="Gatsby" src="https://www.gatsbyjs.org/monogram.svg" width="60" />
|
||||
</a>
|
||||
</p>
|
||||
<h1 align="center">
|
||||
Gatsby's default starter
|
||||
</h1>
|
||||
|
||||
Kick off your project with this default boilerplate. This starter ships with the main Gatsby configuration files you might need to get up and running blazing fast with the blazing fast app generator for React.
|
||||
|
||||
_Have another more specific idea? You may want to check out our vibrant collection of [official and community-created starters](https://www.gatsbyjs.org/docs/gatsby-starters/)._
|
||||
|
||||
## 🚀 Quick start
|
||||
|
||||
1. **Create a Gatsby site.**
|
||||
|
||||
Use the Gatsby CLI to create a new site, specifying the default starter.
|
||||
|
||||
```shell
|
||||
# create a new Gatsby site using the default starter
|
||||
gatsby new my-default-starter https://github.com/gatsbyjs/gatsby-starter-default
|
||||
```
|
||||
|
||||
1. **Start developing.**
|
||||
|
||||
Navigate into your new site’s directory and start it up.
|
||||
|
||||
```shell
|
||||
cd my-default-starter/
|
||||
gatsby develop
|
||||
```
|
||||
|
||||
1. **Open the source code and start editing!**
|
||||
|
||||
Your site is now running at `http://localhost:8000`!
|
||||
|
||||
_Note: You'll also see a second link: _`http://localhost:8000/___graphql`_. This is a tool you can use to experiment with querying your data. Learn more about using this tool in the [Gatsby tutorial](https://www.gatsbyjs.org/tutorial/part-five/#introducing-graphiql)._
|
||||
|
||||
Open the `my-default-starter` directory in your code editor of choice and edit `src/pages/index.js`. Save your changes and the browser will update in real time!
|
||||
|
||||
## 🧐 What's inside?
|
||||
|
||||
A quick look at the top-level files and directories you'll see in a Gatsby project.
|
||||
|
||||
.
|
||||
├── node_modules
|
||||
├── src
|
||||
├── .gitignore
|
||||
├── .prettierrc
|
||||
├── gatsby-browser.js
|
||||
├── gatsby-config.js
|
||||
├── gatsby-node.js
|
||||
├── gatsby-ssr.js
|
||||
├── LICENSE
|
||||
├── package-lock.json
|
||||
├── package.json
|
||||
└── README.md
|
||||
|
||||
1. **`/node_modules`**: This directory contains all of the modules of code that your project depends on (npm packages) are automatically installed.
|
||||
|
||||
2. **`/src`**: This directory will contain all of the code related to what you will see on the front-end of your site (what you see in the browser) such as your site header or a page template. `src` is a convention for “source code”.
|
||||
|
||||
3. **`.gitignore`**: This file tells git which files it should not track / not maintain a version history for.
|
||||
|
||||
4. **`.prettierrc`**: This is a configuration file for [Prettier](https://prettier.io/). Prettier is a tool to help keep the formatting of your code consistent.
|
||||
|
||||
5. **`gatsby-browser.js`**: This file is where Gatsby expects to find any usage of the [Gatsby browser APIs](https://www.gatsbyjs.org/docs/browser-apis/) (if any). These allow customization/extension of default Gatsby settings affecting the browser.
|
||||
|
||||
6. **`gatsby-config.js`**: This is the main configuration file for a Gatsby site. This is where you can specify information about your site (metadata) like the site title and description, which Gatsby plugins you’d like to include, etc. (Check out the [config docs](https://www.gatsbyjs.org/docs/gatsby-config/) for more detail).
|
||||
|
||||
7. **`gatsby-node.js`**: This file is where Gatsby expects to find any usage of the [Gatsby Node APIs](https://www.gatsbyjs.org/docs/node-apis/) (if any). These allow customization/extension of default Gatsby settings affecting pieces of the site build process.
|
||||
|
||||
8. **`gatsby-ssr.js`**: This file is where Gatsby expects to find any usage of the [Gatsby server-side rendering APIs](https://www.gatsbyjs.org/docs/ssr-apis/) (if any). These allow customization of default Gatsby settings affecting server-side rendering.
|
||||
|
||||
9. **`LICENSE`**: Gatsby is licensed under the MIT license.
|
||||
|
||||
10. **`package-lock.json`** (See `package.json` below, first). This is an automatically generated file based on the exact versions of your npm dependencies that were installed for your project. **(You won’t change this file directly).**
|
||||
|
||||
11. **`package.json`**: A manifest file for Node.js projects, which includes things like metadata (the project’s name, author, etc). This manifest is how npm knows which packages to install for your project.
|
||||
|
||||
12. **`README.md`**: A text file containing useful reference information about your project.
|
||||
|
||||
## 🎓 Learning Gatsby
|
||||
|
||||
Looking for more guidance? Full documentation for Gatsby lives [on the website](https://www.gatsbyjs.org/). Here are some places to start:
|
||||
|
||||
- **For most developers, we recommend starting with our [in-depth tutorial for creating a site with Gatsby](https://www.gatsbyjs.org/tutorial/).** It starts with zero assumptions about your level of ability and walks through every step of the process.
|
||||
|
||||
- **To dive straight into code samples, head [to our documentation](https://www.gatsbyjs.org/docs/).** In particular, check out the _Guides_, _API Reference_, and _Advanced Tutorials_ sections in the sidebar.
|
||||
|
||||
## 💫 Deploy
|
||||
|
||||
[](https://app.netlify.com/start/deploy?repository=https://github.com/gatsbyjs/gatsby-starter-default)
|
||||
|
||||
[](https://vercel.com/import/project?template=https://github.com/gatsbyjs/gatsby-starter-default)
|
||||
|
||||
<!-- AUTO-GENERATED-CONTENT:END -->
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
/**
|
||||
* Implement Gatsby's Browser APIs in this file.
|
||||
*
|
||||
* See: https://www.gatsbyjs.org/docs/browser-apis/
|
||||
*/
|
||||
|
||||
// You can delete this file if you're not using it
|
||||
|
|
@ -0,0 +1,40 @@
|
|||
module.exports = {
|
||||
siteMetadata: {
|
||||
title: `Tribal Wars Bot`,
|
||||
description: `Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce
|
||||
condimentum finibus finibus. In blandit at sapien sit amet pellentesque.
|
||||
Integer a massa et nulla posuere volutpat vitae et diam. Praesent eget
|
||||
libero quis sapien accumsan interdum. Ut in blandit dui.`,
|
||||
author: `@gatsbyjs`,
|
||||
siteUrl: "https://bot.tribalwarshelp.com",
|
||||
twhelpUrl: "https://tribalwarshelp.com",
|
||||
botInviteUrl:
|
||||
"https://discord.com/oauth2/authorize?client_id=707859810900508703&scope=bot&permissions=8",
|
||||
},
|
||||
plugins: [
|
||||
`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: `Tribal Wars Bot`,
|
||||
short_name: `twdcbot`,
|
||||
start_url: `/`,
|
||||
background_color: `#330033`,
|
||||
theme_color: `#330033`,
|
||||
display: `minimal-ui`,
|
||||
icon: `src/images/icon.svg`, // This path is relative to the root of the site.
|
||||
},
|
||||
},
|
||||
`gatsby-theme-material-ui`,
|
||||
`gatsby-plugin-sitemap`,
|
||||
],
|
||||
};
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
/**
|
||||
* Implement Gatsby's Node APIs in this file.
|
||||
*
|
||||
* See: https://www.gatsbyjs.org/docs/node-apis/
|
||||
*/
|
||||
|
||||
// You can delete this file if you're not using it
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
/**
|
||||
* Implement Gatsby's SSR (Server Side Rendering) APIs in this file.
|
||||
*
|
||||
* See: https://www.gatsbyjs.org/docs/ssr-apis/
|
||||
*/
|
||||
|
||||
// You can delete this file if you're not using it
|
||||
|
|
@ -0,0 +1,62 @@
|
|||
# auto detects a good number of processes to run
|
||||
worker_processes auto;
|
||||
|
||||
#Provides the configuration file context in which the directives that affect connection processing are specified.
|
||||
events {
|
||||
# Sets the maximum number of simultaneous connections that can be opened by a worker process.
|
||||
worker_connections 8000;
|
||||
# Tells the worker to accept multiple connections at a time
|
||||
multi_accept on;
|
||||
}
|
||||
|
||||
|
||||
http {
|
||||
# what times to include
|
||||
include /etc/nginx/mime.types;
|
||||
# what is the default one
|
||||
default_type application/octet-stream;
|
||||
|
||||
# Sets the path, format, and configuration for a buffered log write
|
||||
log_format compression '$remote_addr - $remote_user [$time_local] '
|
||||
'"$request" $status $upstream_addr '
|
||||
'"$http_referer" "$http_user_agent"';
|
||||
|
||||
server {
|
||||
# listen on port 80
|
||||
listen 80;
|
||||
# save logs here
|
||||
access_log /var/log/nginx/access.log compression;
|
||||
|
||||
# where the root here
|
||||
root /var/www;
|
||||
# what file to server as index
|
||||
index index.html index.htm;
|
||||
error_page 404 /404/index.html;
|
||||
|
||||
# Media: images, icons, video, audio, HTC
|
||||
location ~* \.(?:jpg|jpeg|gif|png|ico|cur|gz|svg|svgz|mp4|ogg|ogv|webm|htc)$ {
|
||||
expires 1M;
|
||||
access_log off;
|
||||
add_header Cache-Control "public";
|
||||
}
|
||||
|
||||
# Javascript and CSS files
|
||||
location ~* \.(?:css|js)$ {
|
||||
try_files $uri =404;
|
||||
expires 1y;
|
||||
access_log off;
|
||||
add_header Cache-Control "public";
|
||||
}
|
||||
|
||||
location / {
|
||||
# First attempt to serve request as file, then
|
||||
# as directory, then fall back to redirecting to index.html
|
||||
try_files $uri $uri/ /index.html;
|
||||
}
|
||||
|
||||
# Any route containing a file extension (e.g. /devicesfile.js)
|
||||
location ~ ^.+\..+$ {
|
||||
try_files $uri =404;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,49 @@
|
|||
{
|
||||
"name": "gatsby-starter-default",
|
||||
"private": true,
|
||||
"description": "A simple starter to get up and developing quickly with Gatsby",
|
||||
"version": "0.1.0",
|
||||
"author": "Kyle Mathews <mathews.kyle@gmail.com>",
|
||||
"dependencies": {
|
||||
"@material-ui/core": "^4.10.2",
|
||||
"@material-ui/styles": "^4.10.0",
|
||||
"gatsby": "^2.23.10",
|
||||
"gatsby-image": "^2.4.8",
|
||||
"gatsby-plugin-manifest": "^2.4.13",
|
||||
"gatsby-plugin-offline": "^3.2.12",
|
||||
"gatsby-plugin-react-helmet": "^3.3.5",
|
||||
"gatsby-plugin-sharp": "^2.6.13",
|
||||
"gatsby-plugin-sitemap": "^2.4.7",
|
||||
"gatsby-source-filesystem": "^2.3.13",
|
||||
"gatsby-theme-material-ui": "^1.0.10",
|
||||
"gatsby-transformer-sharp": "^2.5.6",
|
||||
"prop-types": "^15.7.2",
|
||||
"react": "^16.12.0",
|
||||
"react-dom": "^16.12.0",
|
||||
"react-helmet": "^6.1.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"babel-plugin-module-resolver": "^4.0.0",
|
||||
"babel-plugin-transform-imports": "^2.0.0",
|
||||
"prettier": "2.0.5"
|
||||
},
|
||||
"keywords": [
|
||||
"gatsby"
|
||||
],
|
||||
"license": "MIT",
|
||||
"scripts": {
|
||||
"build": "gatsby build",
|
||||
"develop": "gatsby develop",
|
||||
"format": "prettier --write \"**/*.{js,jsx,ts,tsx,json,md}\"",
|
||||
"start": "npm run develop",
|
||||
"serve": "gatsby serve",
|
||||
"clean": "gatsby clean"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/gatsbyjs/gatsby-starter-default"
|
||||
},
|
||||
"bugs": {
|
||||
"url": "https://github.com/gatsbyjs/gatsby/issues"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
import React from "react";
|
||||
|
||||
import { makeStyles } from "@material-ui/core/styles";
|
||||
import { AppBar, Toolbar, Typography, Container } from "@material-ui/core";
|
||||
import { Link } from "gatsby-theme-material-ui";
|
||||
|
||||
const useStyles = makeStyles(() => ({
|
||||
appBar: {
|
||||
backgroundColor: "transparent",
|
||||
color: "#fff",
|
||||
boxShadow: "none",
|
||||
},
|
||||
copyright: {
|
||||
width: "100%",
|
||||
},
|
||||
}));
|
||||
|
||||
function Footer({ title }) {
|
||||
const classes = useStyles();
|
||||
|
||||
return (
|
||||
<AppBar component="footer" position="static" className={classes.appBar}>
|
||||
<Container>
|
||||
<Toolbar disableGutters variant="dense">
|
||||
<Typography align="center" className={classes.copyright}>
|
||||
I customized the wicked cool background at{" "}
|
||||
<Link color="secondary" href="https://svgbackgrounds.com">
|
||||
svgbackgrounds.com
|
||||
</Link>
|
||||
. <br /> © {new Date().getFullYear()} {title}
|
||||
</Typography>
|
||||
</Toolbar>
|
||||
</Container>
|
||||
</AppBar>
|
||||
);
|
||||
}
|
||||
|
||||
export default Footer;
|
||||
|
|
@ -0,0 +1,40 @@
|
|||
import React from "react";
|
||||
import { makeStyles } from "@material-ui/core/styles";
|
||||
import { AppBar, Toolbar, Typography, Container } from "@material-ui/core";
|
||||
import { Link } from "gatsby-theme-material-ui";
|
||||
|
||||
const useStyles = makeStyles(() => ({
|
||||
title: {
|
||||
flexGrow: 1,
|
||||
},
|
||||
appBar: {
|
||||
backgroundColor: "transparent",
|
||||
color: "#fff",
|
||||
boxShadow: "none",
|
||||
},
|
||||
}));
|
||||
|
||||
function Header({ title, twhelpUrl }) {
|
||||
const classes = useStyles();
|
||||
const twhelpText = twhelpUrl.replace("http://", "").replace("https://", "");
|
||||
return (
|
||||
<AppBar position="static" className={classes.appBar}>
|
||||
<Container>
|
||||
<Toolbar disableGutters>
|
||||
<Typography variant="h4" className={classes.title}>
|
||||
<Link to="/" underline="none" color="inherit">
|
||||
{title}
|
||||
</Link>
|
||||
</Typography>
|
||||
<div>
|
||||
<Link title={twhelpText} color="inherit" href={twhelpUrl}>
|
||||
{twhelpText}
|
||||
</Link>
|
||||
</div>
|
||||
</Toolbar>
|
||||
</Container>
|
||||
</AppBar>
|
||||
);
|
||||
}
|
||||
|
||||
export default Header;
|
||||
|
|
@ -0,0 +1,60 @@
|
|||
import React from "react";
|
||||
import PropTypes from "prop-types";
|
||||
import { useStaticQuery, graphql } from "gatsby";
|
||||
|
||||
import { ThemeProvider, makeStyles } from "@material-ui/core/styles";
|
||||
import { CssBaseline } from "@material-ui/core";
|
||||
import Header from "./Header";
|
||||
import Footer from "./Footer";
|
||||
import theme from "./theme";
|
||||
|
||||
const useStyles = makeStyles(theme => ({
|
||||
main: {
|
||||
display: "flex",
|
||||
},
|
||||
mainChild: {
|
||||
display: "flex",
|
||||
width: "100%",
|
||||
minHeight: "calc(100vh - 140px)",
|
||||
paddingTop: theme.spacing(2),
|
||||
paddingBottom: theme.spacing(3),
|
||||
},
|
||||
}));
|
||||
|
||||
const Layout = ({ children, className }) => {
|
||||
const classes = useStyles();
|
||||
const { site } = useStaticQuery(
|
||||
graphql`
|
||||
query {
|
||||
site {
|
||||
siteMetadata {
|
||||
title
|
||||
twhelpUrl
|
||||
}
|
||||
}
|
||||
}
|
||||
`
|
||||
);
|
||||
|
||||
return (
|
||||
<ThemeProvider theme={theme}>
|
||||
<Header
|
||||
title={site.siteMetadata.title}
|
||||
twhelpUrl={site.siteMetadata.twhelpUrl}
|
||||
/>
|
||||
<main
|
||||
className={className ? classes.main + " " + className : classes.main}
|
||||
>
|
||||
<div className={classes.mainChild}>{children}</div>
|
||||
</main>
|
||||
<Footer title={site.siteMetadata.title} />
|
||||
<CssBaseline />
|
||||
</ThemeProvider>
|
||||
);
|
||||
};
|
||||
|
||||
Layout.propTypes = {
|
||||
children: PropTypes.node.isRequired,
|
||||
};
|
||||
|
||||
export default Layout;
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
import { createMuiTheme, responsiveFontSizes } from "@material-ui/core/styles";
|
||||
|
||||
const theme = createMuiTheme({
|
||||
palette: {
|
||||
type: "dark",
|
||||
},
|
||||
overrides: {
|
||||
MuiCssBaseline: {
|
||||
"@global": {
|
||||
body: {
|
||||
backgroundColor: "#330033",
|
||||
backgroundImage: `url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400' viewBox='0 0 800 800'%3E%3Cg fill='none' stroke='%23404' stroke-width='1'%3E%3Cpath d='M769 229L1037 260.9M927 880L731 737 520 660 309 538 40 599 295 764 126.5 879.5 40 599-197 493 102 382-31 229 126.5 79.5-69-63'/%3E%3Cpath d='M-31 229L237 261 390 382 603 493 308.5 537.5 101.5 381.5M370 905L295 764'/%3E%3Cpath d='M520 660L578 842 731 737 840 599 603 493 520 660 295 764 309 538 390 382 539 269 769 229 577.5 41.5 370 105 295 -36 126.5 79.5 237 261 102 382 40 599 -69 737 127 880'/%3E%3Cpath d='M520-140L578.5 42.5 731-63M603 493L539 269 237 261 370 105M902 382L539 269M390 382L102 382'/%3E%3Cpath d='M-222 42L126.5 79.5 370 105 539 269 577.5 41.5 927 80 769 229 902 382 603 493 731 737M295-36L577.5 41.5M578 842L295 764M40-201L127 80M102 382L-261 269'/%3E%3C/g%3E%3Cg fill='%23505'%3E%3Ccircle cx='769' cy='229' r='5'/%3E%3Ccircle cx='539' cy='269' r='5'/%3E%3Ccircle cx='603' cy='493' r='5'/%3E%3Ccircle cx='731' cy='737' r='5'/%3E%3Ccircle cx='520' cy='660' r='5'/%3E%3Ccircle cx='309' cy='538' r='5'/%3E%3Ccircle cx='295' cy='764' r='5'/%3E%3Ccircle cx='40' cy='599' r='5'/%3E%3Ccircle cx='102' cy='382' r='5'/%3E%3Ccircle cx='127' cy='80' r='5'/%3E%3Ccircle cx='370' cy='105' r='5'/%3E%3Ccircle cx='578' cy='42' r='5'/%3E%3Ccircle cx='237' cy='261' r='5'/%3E%3Ccircle cx='390' cy='382' r='5'/%3E%3C/g%3E%3C/svg%3E")`,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
export default responsiveFontSizes(theme);
|
||||
|
|
@ -0,0 +1,88 @@
|
|||
/**
|
||||
* 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({ description, lang, meta, title }) {
|
||||
const { site } = useStaticQuery(
|
||||
graphql`
|
||||
query {
|
||||
site {
|
||||
siteMetadata {
|
||||
title
|
||||
description
|
||||
author
|
||||
}
|
||||
}
|
||||
}
|
||||
`
|
||||
)
|
||||
|
||||
const metaDescription = description || site.siteMetadata.description
|
||||
|
||||
return (
|
||||
<Helmet
|
||||
htmlAttributes={{
|
||||
lang,
|
||||
}}
|
||||
title={title}
|
||||
titleTemplate={`%s | ${site.siteMetadata.title}`}
|
||||
meta={[
|
||||
{
|
||||
name: `description`,
|
||||
content: metaDescription,
|
||||
},
|
||||
{
|
||||
property: `og:title`,
|
||||
content: title,
|
||||
},
|
||||
{
|
||||
property: `og:description`,
|
||||
content: metaDescription,
|
||||
},
|
||||
{
|
||||
property: `og:type`,
|
||||
content: `website`,
|
||||
},
|
||||
{
|
||||
name: `twitter:card`,
|
||||
content: `summary`,
|
||||
},
|
||||
{
|
||||
name: `twitter:creator`,
|
||||
content: site.siteMetadata.author,
|
||||
},
|
||||
{
|
||||
name: `twitter:title`,
|
||||
content: title,
|
||||
},
|
||||
{
|
||||
name: `twitter:description`,
|
||||
content: metaDescription,
|
||||
},
|
||||
].concat(meta)}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
SEO.defaultProps = {
|
||||
lang: `en`,
|
||||
meta: [],
|
||||
description: ``,
|
||||
}
|
||||
|
||||
SEO.propTypes = {
|
||||
description: PropTypes.string,
|
||||
lang: PropTypes.string,
|
||||
meta: PropTypes.arrayOf(PropTypes.object),
|
||||
title: PropTypes.string.isRequired,
|
||||
}
|
||||
|
||||
export default SEO
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<svg width="512" height="512" xmlns="http://www.w3.org/2000/svg">
|
||||
|
||||
<g>
|
||||
<title>background</title>
|
||||
<rect fill="none" id="canvas_background" height="402" width="582" y="-1" x="-1"/>
|
||||
</g>
|
||||
<g>
|
||||
<title>Layer 1</title>
|
||||
<path id="XMLID_13814_" d="m190.101,250.133l26.359,-26.359l-83.811,-83.811c-1.82,-1.82 -1.82,-4.771 0,-6.59c1.82,-1.819 4.77,-1.819 6.59,0l83.811,83.811l26.359,-26.359l-89.495,-89.495l-75.625,-19.19l16.393,78.575l89.419,89.418z"/>
|
||||
<rect y="300.187" x="279.477" width="37.278" transform="matrix(0.7071,-0.7071,0.7071,0.7071,-147.2936,307.9705) " id="XMLID_13815_" height="63.204"/>
|
||||
<path id="XMLID_13816_" d="m90.43,389.344c-4.709,4.709 -7.394,10.863 -7.558,17.326c-0.163,6.375 2.153,12.291 6.522,16.66c4.211,4.211 9.908,6.529 16.042,6.529c6.692,0 13.065,-2.686 17.943,-7.566l22.029,-22.029l-32.949,-32.949l-22.029,22.029z"/>
|
||||
<path id="XMLID_13817_" d="m429.129,406.67c-0.165,-6.463 -2.85,-12.617 -7.559,-17.324l-22.029,-22.031l-32.949,32.949l22.029,22.029c4.879,4.881 11.251,7.566 17.942,7.566c6.135,0 11.832,-2.318 16.043,-6.529c4.369,-4.369 6.685,-10.285 6.523,-16.66z"/>
|
||||
<rect y="361.29" x="118.815" width="46.597" transform="matrix(-0.7071,-0.7071,0.7071,-0.7071,-19.4581,733.1609) " id="XMLID_13818_" height="18.641"/>
|
||||
<rect y="341.523" x="138.585" width="46.596" transform="matrix(-0.7071,-0.7071,0.7071,-0.7071,28.2824,713.3979) " id="XMLID_13819_" height="18.638"/>
|
||||
<path fill="#000000" id="XMLID_13820_" d="m427.711,82.14l-75.627,19.189l-92.79,92.79l-65.898,65.898l-47.988,47.988l26.36,26.359l200.994,-200.993c1.818,-1.819 4.771,-1.819 6.589,0c1.82,1.82 1.82,4.771 0,6.59l-200.993,200.994l26.36,26.359l206.601,-206.599l16.392,-78.575z"/>
|
||||
<rect y="341.521" x="326.819" width="46.599" transform="matrix(0.7071,-0.7071,0.7071,0.7071,-145.5347,350.3372) " id="XMLID_13821_" height="18.64"/>
|
||||
<rect y="361.29" x="346.589" width="46.597" transform="matrix(0.7071,-0.7071,0.7071,0.7071,-153.7236,370.099) " id="XMLID_13822_" height="18.641"/>
|
||||
<rect y="267.237" x="312.427" width="37.278" transform="matrix(-0.7071,0.7071,-0.7071,-0.7071,776.4762,276.0517) " id="XMLID_13823_" height="63.205"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 51 KiB |
|
|
@ -0,0 +1,14 @@
|
|||
import React from "react"
|
||||
|
||||
import Layout from "../components/Layout/Layout"
|
||||
import SEO from "../components/SEO"
|
||||
|
||||
const NotFoundPage = () => (
|
||||
<Layout>
|
||||
<SEO title="404: Not found" />
|
||||
<h1>NOT FOUND</h1>
|
||||
<p>You just hit a route that doesn't exist... the sadness.</p>
|
||||
</Layout>
|
||||
)
|
||||
|
||||
export default NotFoundPage
|
||||
|
|
@ -0,0 +1,98 @@
|
|||
import React from "react";
|
||||
import { graphql, useStaticQuery } from "gatsby";
|
||||
|
||||
import { makeStyles } from "@material-ui/core/styles";
|
||||
import Image from "gatsby-image";
|
||||
import {
|
||||
Container,
|
||||
Typography,
|
||||
Button,
|
||||
Divider,
|
||||
ButtonGroup,
|
||||
Grid,
|
||||
} from "@material-ui/core";
|
||||
import { Link } from "gatsby-theme-material-ui";
|
||||
import Layout from "../components/Layout/Layout";
|
||||
import SEO from "../components/SEO";
|
||||
|
||||
const useStyles = makeStyles(theme => ({
|
||||
divider: {
|
||||
margin: theme.spacing(2, 0),
|
||||
backgroundColor: "#fff",
|
||||
},
|
||||
container: {
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
},
|
||||
image: {
|
||||
margin: "auto",
|
||||
borderRadius: "6px",
|
||||
maxWidth: "593px",
|
||||
},
|
||||
}));
|
||||
|
||||
const IndexPage = () => {
|
||||
const classes = useStyles();
|
||||
const data = useStaticQuery(graphql`
|
||||
query {
|
||||
site {
|
||||
siteMetadata {
|
||||
title
|
||||
botInviteUrl
|
||||
}
|
||||
}
|
||||
ss: file(relativePath: { eq: "ss.png" }) {
|
||||
childImageSharp {
|
||||
fluid(maxWidth: 593, quality: 100) {
|
||||
...GatsbyImageSharpFluid
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
`);
|
||||
|
||||
return (
|
||||
<Layout className={classes.layout}>
|
||||
<SEO title="Home" />
|
||||
<Container className={classes.container}>
|
||||
<Grid container spacing={3} alignItems="center">
|
||||
<Grid item xs={12} md={7}>
|
||||
<Typography variant="h2" component="h1" gutterBottom>
|
||||
Watch your tribe conquers!
|
||||
</Typography>
|
||||
<Typography gutterBottom>
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce
|
||||
condimentum finibus finibus. In blandit at sapien sit amet
|
||||
pellentesque. Integer a massa et nulla posuere volutpat vitae et
|
||||
diam. Praesent eget libero quis sapien accumsan interdum. Ut in
|
||||
blandit dui.
|
||||
</Typography>
|
||||
<Divider variant="fullWidth" className={classes.divider} />
|
||||
<ButtonGroup variant="contained" color="secondary">
|
||||
<Button>
|
||||
<Link
|
||||
href={data.site.siteMetadata.botInviteUrl}
|
||||
color="inherit"
|
||||
underline="none"
|
||||
title={`Invite ${data.site.siteMetadata.title}`}
|
||||
>
|
||||
Invite {data.site.siteMetadata.title}
|
||||
</Link>
|
||||
</Button>
|
||||
<Button>Commands</Button>
|
||||
</ButtonGroup>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={5}>
|
||||
<Image
|
||||
className={classes.image}
|
||||
fluid={data.ss.childImageSharp.fluid}
|
||||
alt={data.site.siteMetadata.title}
|
||||
/>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Container>
|
||||
</Layout>
|
||||
);
|
||||
};
|
||||
|
||||
export default IndexPage;
|
||||
Reference in New Issue