diff --git a/packages/dashboard-v2/.eslintrc.js b/packages/dashboard-v2/.eslintrc.js index be715fed..1b18b413 100644 --- a/packages/dashboard-v2/.eslintrc.js +++ b/packages/dashboard-v2/.eslintrc.js @@ -2,5 +2,5 @@ module.exports = { globals: { __PATH_PREFIX__: true, }, - extends: 'react-app', -} + extends: "react-app", +}; diff --git a/packages/dashboard-v2/.prettierrc.json b/packages/dashboard-v2/.prettierrc.json index 31ba22d8..963354f2 100644 --- a/packages/dashboard-v2/.prettierrc.json +++ b/packages/dashboard-v2/.prettierrc.json @@ -1,5 +1,3 @@ { - "semi": false, - "singleQuote": true, "printWidth": 120 } diff --git a/packages/dashboard-v2/gatsby-browser.js b/packages/dashboard-v2/gatsby-browser.js index 65d3a113..a71e49c3 100644 --- a/packages/dashboard-v2/gatsby-browser.js +++ b/packages/dashboard-v2/gatsby-browser.js @@ -1,13 +1,13 @@ -import * as React from 'react' -import '@fontsource/sora/300.css' // light -import '@fontsource/sora/400.css' // normal -import '@fontsource/sora/500.css' // medium -import '@fontsource/sora/600.css' // semibold -import '@fontsource/source-sans-pro/400.css' // normal -import '@fontsource/source-sans-pro/600.css' // semibold -import './src/styles/global.css' +import * as React from "react"; +import "@fontsource/sora/300.css"; // light +import "@fontsource/sora/400.css"; // normal +import "@fontsource/sora/500.css"; // medium +import "@fontsource/sora/600.css"; // semibold +import "@fontsource/source-sans-pro/400.css"; // normal +import "@fontsource/source-sans-pro/600.css"; // semibold +import "./src/styles/global.css"; export function wrapPageElement({ element, props }) { - const Layout = element.type.Layout ?? React.Fragment - return {element} + const Layout = element.type.Layout ?? React.Fragment; + return {element}; } diff --git a/packages/dashboard-v2/gatsby-config.js b/packages/dashboard-v2/gatsby-config.js index 63a85da5..f0937128 100644 --- a/packages/dashboard-v2/gatsby-config.js +++ b/packages/dashboard-v2/gatsby-config.js @@ -4,28 +4,28 @@ module.exports = { siteUrl: `https://www.yourdomain.tld`, }, plugins: [ - 'gatsby-plugin-image', - 'gatsby-plugin-react-helmet', - 'gatsby-plugin-sharp', - 'gatsby-transformer-sharp', - 'gatsby-plugin-postcss', + "gatsby-plugin-image", + "gatsby-plugin-react-helmet", + "gatsby-plugin-sharp", + "gatsby-transformer-sharp", + "gatsby-plugin-postcss", { - resolve: 'gatsby-source-filesystem', + resolve: "gatsby-source-filesystem", options: { - name: 'images', - path: './src/images/', + name: "images", + path: "./src/images/", }, - __key: 'images', + __key: "images", }, { resolve: `gatsby-plugin-alias-imports`, options: { alias: { // Allows npm link-ing skynet-storybook during development. - 'styled-components': './node_modules/styled-components', + "styled-components": "./node_modules/styled-components", }, - extensions: ['js'], + extensions: ["js"], }, }, ], -} +}; diff --git a/packages/dashboard-v2/postcss.config.js b/packages/dashboard-v2/postcss.config.js index 4193e8ab..116848f6 100644 --- a/packages/dashboard-v2/postcss.config.js +++ b/packages/dashboard-v2/postcss.config.js @@ -1,3 +1,3 @@ module.exports = { - plugins: [require('tailwindcss'), require('autoprefixer')], -} + plugins: [require("tailwindcss"), require("autoprefixer")], +}; diff --git a/packages/dashboard-v2/src/pages/404.js b/packages/dashboard-v2/src/pages/404.js index 4d41c72f..fd99104f 100644 --- a/packages/dashboard-v2/src/pages/404.js +++ b/packages/dashboard-v2/src/pages/404.js @@ -1,28 +1,28 @@ -import * as React from 'react' -import { Link } from 'gatsby' +import * as React from "react"; +import { Link } from "gatsby"; // styles const pageStyles = { - color: '#232129', - padding: '96px', - fontFamily: '-apple-system, Roboto, sans-serif, serif', -} + color: "#232129", + padding: "96px", + fontFamily: "-apple-system, Roboto, sans-serif, serif", +}; const headingStyles = { marginTop: 0, marginBottom: 64, maxWidth: 320, -} +}; const paragraphStyles = { marginBottom: 48, -} +}; const codeStyles = { - color: '#8A6534', + color: "#8A6534", padding: 4, - backgroundColor: '#FFF4DB', - fontSize: '1.25rem', + backgroundColor: "#FFF4DB", + fontSize: "1.25rem", borderRadius: 4, -} +}; // markup const NotFoundPage = () => { @@ -31,13 +31,13 @@ const NotFoundPage = () => { Not found

Page not found

- Sorry{' '} + Sorry{" "} 😔 - {' '} + {" "} we couldn’t find what you were looking for.
- {process.env.NODE_ENV === 'development' ? ( + {process.env.NODE_ENV === "development" ? ( <>
Try creating a page in src/pages/. @@ -48,7 +48,7 @@ const NotFoundPage = () => { Go home.

- ) -} + ); +}; -export default NotFoundPage +export default NotFoundPage; diff --git a/packages/dashboard-v2/src/pages/files.js b/packages/dashboard-v2/src/pages/files.js index 2e07480c..10e5dad2 100644 --- a/packages/dashboard-v2/src/pages/files.js +++ b/packages/dashboard-v2/src/pages/files.js @@ -1,8 +1,8 @@ -import * as React from 'react' +import * as React from "react"; // markup const FilesPage = () => { - return <>FILES -} + return <>FILES; +}; -export default FilesPage +export default FilesPage; diff --git a/packages/dashboard-v2/src/pages/index.js b/packages/dashboard-v2/src/pages/index.js index 28d6d602..1e74046a 100644 --- a/packages/dashboard-v2/src/pages/index.js +++ b/packages/dashboard-v2/src/pages/index.js @@ -1,8 +1,8 @@ -import * as React from 'react' +import * as React from "react"; // markup const IndexPage = () => { - return <>Dashboard -} + return <>Dashboard; +}; -export default IndexPage +export default IndexPage; diff --git a/packages/dashboard-v2/tailwind.config.js b/packages/dashboard-v2/tailwind.config.js index 89800342..986cd0b3 100644 --- a/packages/dashboard-v2/tailwind.config.js +++ b/packages/dashboard-v2/tailwind.config.js @@ -1,57 +1,57 @@ -const defaultTheme = require('tailwindcss/defaultTheme') -const plugin = require('tailwindcss/plugin') +const defaultTheme = require("tailwindcss/defaultTheme"); +const plugin = require("tailwindcss/plugin"); const colors = { - primary: { light: '#33D17E', DEFAULT: '#00c65e' }, - warning: '#ffd567', - error: '#ED5454', + primary: { light: "#33D17E", DEFAULT: "#00c65e" }, + warning: "#ffd567", + error: "#ED5454", palette: { - 100: '#f5f7f7', - 200: '#d4dddb', - 300: '#9e9e9e', - 400: '#555555', - 500: '#242424', - 600: '#0d0d0d', + 100: "#f5f7f7", + 200: "#d4dddb", + 300: "#9e9e9e", + 400: "#555555", + 500: "#242424", + 600: "#0d0d0d", }, -} +}; module.exports = { - content: ['./src/**/*.{js,jsx,ts,tsx}'], + content: ["./src/**/*.{js,jsx,ts,tsx}"], theme: { screens: { - sm: '640px', - md: '768px', - lg: '1024px', - xl: '1440px', + sm: "640px", + md: "768px", + lg: "1024px", + xl: "1440px", }, - backgroundColor: (theme) => ({ ...theme('colors'), ...colors }), - borderColor: (theme) => ({ ...theme('colors'), ...colors }), - textColor: (theme) => ({ ...theme('colors'), ...colors }), - placeholderColor: (theme) => ({ ...theme('colors'), ...colors }), + backgroundColor: (theme) => ({ ...theme("colors"), ...colors }), + borderColor: (theme) => ({ ...theme("colors"), ...colors }), + textColor: (theme) => ({ ...theme("colors"), ...colors }), + placeholderColor: (theme) => ({ ...theme("colors"), ...colors }), extend: { fontFamily: { - sans: ['Sora', ...defaultTheme.fontFamily.sans], - content: ['Source\\ Sans\\ Pro', ...defaultTheme.fontFamily.sans], + sans: ["Sora", ...defaultTheme.fontFamily.sans], + content: ["Source\\ Sans\\ Pro", ...defaultTheme.fontFamily.sans], }, fontSize: { - tab: ['18px', '28px'], + tab: ["18px", "28px"], }, - backgroundColor: ['disabled'], - textColor: ['disabled'], + backgroundColor: ["disabled"], + textColor: ["disabled"], keyframes: { wiggle: { - '0%, 100%': { transform: 'rotate(-3deg)' }, - '50%': { transform: 'rotate(3deg)' }, + "0%, 100%": { transform: "rotate(-3deg)" }, + "50%": { transform: "rotate(3deg)" }, }, }, animation: { - wiggle: 'wiggle 3s ease-in-out infinite', + wiggle: "wiggle 3s ease-in-out infinite", }, width: { - page: '100%', - 'page-md': '640px', - 'page-lg': '896px', - 'page-xl': '1312px', + page: "100%", + "page-md": "640px", + "page-lg": "896px", + "page-xl": "1312px", }, }, }, @@ -59,9 +59,9 @@ module.exports = { plugin(function ({ addBase, theme }) { addBase({ body: { - color: theme('textColor.palette.600'), + color: theme("textColor.palette.600"), }, - }) + }); }), ], -} +};