From ff6a1d151783d0e07aec2b40c6950817ef03f09f Mon Sep 17 00:00:00 2001 From: Paul Copplestone Date: Sat, 12 Oct 2019 14:33:00 +0800 Subject: [PATCH] Adding sign up form --- package.json | 6 +- packages/web/babel.config.js | 1 - packages/web/components/Footer.js | 16 +- packages/web/components/Navbar.js | 46 +---- packages/web/components/SignUpForm.js | 14 ++ .../components/{ => layouts}/MainLayout.js | 7 +- packages/web/package.json | 3 - packages/web/pages/_app.js | 43 ----- packages/web/pages/blog.js | 4 +- packages/web/pages/index.js | 115 +++++------- packages/web/pages/plugin/[slug].js | 170 ------------------ packages/web/stores/store.js | 29 --- packages/web/styles/style.scss | 15 +- 13 files changed, 88 insertions(+), 381 deletions(-) create mode 100644 packages/web/components/SignUpForm.js rename packages/web/components/{ => layouts}/MainLayout.js (83%) delete mode 100644 packages/web/pages/_app.js delete mode 100644 packages/web/pages/plugin/[slug].js delete mode 100644 packages/web/stores/store.js diff --git a/package.json b/package.json index 38883a303c3..5d68ce1ec71 100644 --- a/package.json +++ b/package.json @@ -10,9 +10,13 @@ "yarn": "1.x" }, "scripts": { + "build": "yarn run build:docs && yarn run build:web", + "build:docs": "yarn workspace @supabase/docs build", + "build:web": "yarn workspace @supabase/web build", "dev": "concurrently --kill-others-on-fail \"yarn dev:web\" \"yarn dev:docs\" ", "dev:docs": "yarn workspace @supabase/docs dev", - "dev:web": "yarn workspace @supabase/web dev" + "dev:web": "yarn workspace @supabase/web dev", + "static:web": "yarn workspace @supabase/web static" }, "dependencies": { "concurrently": "^5.0.0" diff --git a/packages/web/babel.config.js b/packages/web/babel.config.js index 8d8daff29b2..f9dabf4180d 100644 --- a/packages/web/babel.config.js +++ b/packages/web/babel.config.js @@ -10,7 +10,6 @@ module.exports = function(api) { root: ['./'], alias: { '~': '.', - '@base': '../..', }, }, ], diff --git a/packages/web/components/Footer.js b/packages/web/components/Footer.js index ee8a018809a..7ebf43e803c 100644 --- a/packages/web/components/Footer.js +++ b/packages/web/components/Footer.js @@ -1,5 +1,6 @@ import React, { useState, useEffect } from 'react' import Link from 'next/link' +import SignUpForm from '~/components/SignUpForm' export default function Footer() { return ( @@ -10,15 +11,22 @@ export default function Footer() {

Supabase

+ -
-

Link

-

Link

+
+
+
+

Products

+

Docs

+
+
+

Company

+

Github

-
+
© Supabase diff --git a/packages/web/components/Navbar.js b/packages/web/components/Navbar.js index 4f866d1e7f0..79b3bba6947 100644 --- a/packages/web/components/Navbar.js +++ b/packages/web/components/Navbar.js @@ -6,6 +6,7 @@ export default function Navbar() { return (
+
) } diff --git a/packages/web/components/SignUpForm.js b/packages/web/components/SignUpForm.js new file mode 100644 index 00000000000..695a8611761 --- /dev/null +++ b/packages/web/components/SignUpForm.js @@ -0,0 +1,14 @@ +export default function Footer() { + return ( +
+

+ +

+

+ +

+
+ ) +} diff --git a/packages/web/components/MainLayout.js b/packages/web/components/layouts/MainLayout.js similarity index 83% rename from packages/web/components/MainLayout.js rename to packages/web/components/layouts/MainLayout.js index efec9b47570..a8797c63040 100644 --- a/packages/web/components/MainLayout.js +++ b/packages/web/components/layouts/MainLayout.js @@ -1,9 +1,8 @@ -import '../styles/style.scss' -import Navbar from './Navbar' -import Footer from './Footer' +import '~/styles/style.scss' +import Navbar from '../Navbar' +import Footer from '../Footer' import Head from 'next/head' - export default function MainLaout(props) { return ( <> diff --git a/packages/web/package.json b/packages/web/package.json index bbab62a4f76..9de32e06c46 100644 --- a/packages/web/package.json +++ b/packages/web/package.json @@ -14,9 +14,6 @@ "@zeit/next-mdx": "^1.2.0", "@zeit/next-sass": "^1.0.0", "bulma": "^0.7.5", - "mobx": "^5.13.0", - "mobx-react": "^6.1.3", - "mobx-state-tree": "^3.14.1", "next": "^9.0.5-canary.2", "node-sass": "^4.7.2", "react": "^16.7.0", diff --git a/packages/web/pages/_app.js b/packages/web/pages/_app.js deleted file mode 100644 index dd33f4971a4..00000000000 --- a/packages/web/pages/_app.js +++ /dev/null @@ -1,43 +0,0 @@ -import React from 'react' -import { Provider } from 'mobx-react' -import { getSnapshot } from 'mobx-state-tree' -import App from 'next/app' -import { initializeStore } from '../stores/store' - -export default class MyApp extends App { - static async getInitialProps ({ Component, ctx }) { - // - // Use getInitialProps as a step in the lifecycle when - // we can initialize our store - // - const isServer = typeof window === 'undefined' - const store = initializeStore(isServer) - // - // Check whether the page being rendered by the App has a - // static getInitialProps method and if so call it - // - let pageProps = {} - if (Component.getInitialProps) { - pageProps = await Component.getInitialProps(ctx) - } - return { - initialState: getSnapshot(store), - isServer, - pageProps - } - } - - constructor (props) { - super(props) - this.store = initializeStore(props.isServer, props.initialState) - } - - render () { - const { Component, pageProps } = this.props - return ( - - - - ) - } -} \ No newline at end of file diff --git a/packages/web/pages/blog.js b/packages/web/pages/blog.js index 02ab768db68..dc7db0cd03a 100644 --- a/packages/web/pages/blog.js +++ b/packages/web/pages/blog.js @@ -1,7 +1,7 @@ // index.js import React from 'react' -import MainLayout from '../components/MainLayout' -import MDXDocument, { metadata } from './posts/post.mdx' +import MainLayout from '~/components/layouts/MainLayout' +import MDXDocument, { metadata } from '~/pages/posts/post.mdx' export default () => ( <> diff --git a/packages/web/pages/index.js b/packages/web/pages/index.js index 15910f66493..fa6abaaad1c 100644 --- a/packages/web/pages/index.js +++ b/packages/web/pages/index.js @@ -1,39 +1,41 @@ -import MainLayout from '~/components/MainLayout' +import MainLayout from '~/components/layouts/MainLayout' import Link from 'next/link' +import SignUpForm from '~/components/SignUpForm' -import { inject, observer } from 'mobx-react' -@inject('store') -@observer export default class Home extends React.Component { render() { return ( -
-
-
-
-

Supabase

-

Supercharge Postgres without a single line of code.

-
+
+
+
+

Supabase

+

Supercharge PostgreSQL.

+
-

Apps

+

Products

+

+ Extend your existing Postgres Database with opensource products. +

-

Pricing

-
- -
- -
Free
-
    -
  • Feature
    • -
  • Feature
    • -
+

Launch

+

+ Whether you're a DB expert, or just a beginner, Supabase makes it ridiculously easy to get started with PostgreSQL. +

+ - -
-

Section title

-
-

Heading 1

-

Heading 2

-

Heading 3

-

- This is what a paragraph looks like with a linky link. -

diff --git a/packages/web/pages/plugin/[slug].js b/packages/web/pages/plugin/[slug].js deleted file mode 100644 index cd72d902ac1..00000000000 --- a/packages/web/pages/plugin/[slug].js +++ /dev/null @@ -1,170 +0,0 @@ -import { useRouter } from 'next/router' -import Layout from '../../components/MainLayout' -import Link from 'next/link' -import { inject, observer } from 'mobx-react' - -@inject('store') -@observer -export default class Site extends React.Component { - static async getInitialProps({ query }) { - return { - slug: query.slug, - } - } - constructor(props) { - super(props) - this.state = { - ...this.props, - } - } - - render() { - let { slug } = this.state - const Site = this.props.store.siteBySlug(slug) - - return ( - -
-
Cover image
-
-
-
-
-
-
-

{Site.name}

- - {Site.location.name} - - Depth: -

- {Site.min_depth}m - {Site.max_depth}m{' '} -

-
-

{Site.blurb}

-
- -
-
-
-
-

- 34 Dives -

-
-
-
-
- -
-
-
- -
- -
-
-
-
Visibility
-
- -
-
-
-
-
-
Sealife
-
- -
-
-
-
-
-
Enjoyment
-
- -
-
-
-
-
-
Novelty
-
- -
-
-
-
- -
-

- -

- Barbara Middleton - -

- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis porta eros lacus, - nec ultricies elit blandit non. Suspendisse pellentesque mauris sit amet dolor - blandit rutrum. Nunc in tempus turpis. -

- - Like · 3 hrs - -
-
- -
-
- - - -
-
-
-
-
- - ) - } -} - -@inject('store') -@observer -class Rating extends React.Component { - render() { - return ( - - - - - - - - - - - - - - - - - - ) - } -} diff --git a/packages/web/stores/store.js b/packages/web/stores/store.js deleted file mode 100644 index 3e7597c8e9c..00000000000 --- a/packages/web/stores/store.js +++ /dev/null @@ -1,29 +0,0 @@ -import { types, applySnapshot } from 'mobx-state-tree' - -let store = null - -// const Plugin = types.model({ -// id: types.string, -// slug: types.string, -// title: types.title, -// }) - -const Store = types - .model({ - // Plugins: types.maybe(types.map(Plugin)), - }) - .actions(self => { - return {} - }) - .views(self => ({ - pluginBySlug(slug) { - return Object.entries(self.Plugin).find(x => x.slug == slug) - }, - })) - -export function initializeStore(isServer, snapshot = null) { - if (isServer) store = Store.create({ }) - if (store === null) store = Store.create({ }) - if (snapshot) applySnapshot(store, snapshot) - return store -} diff --git a/packages/web/styles/style.scss b/packages/web/styles/style.scss index a38539aa96f..2e2cdb19287 100644 --- a/packages/web/styles/style.scss +++ b/packages/web/styles/style.scss @@ -20,6 +20,7 @@ $grey-300: #7f7f7f; $grey-200: #8f8f8f; $grey-100: #eeeeee; $background: $grey-900; +$background: $grey-900; $border-color: $grey-400; $primary: $green; $link: $green; @@ -239,9 +240,7 @@ h3.has-underline { border: 1px solid $primary !important; } .button { - text-transform: uppercase; text-shadow: $text-shallow; - font-size: 0.8em; font-weight: bold; &.is-primary { // color: $background; @@ -258,18 +257,6 @@ h3.has-underline { color: $grey-200 !important; border: 1px solid transparent; } - &.is-medium { - font-size: 1rem; - padding-left: 1.5rem; - padding-right: 1.2rem; - } -} -.field.has-addons { - .button { - padding-top: 14.5px; - padding-bottom: 15px; - border: 1px solid $border-color; - } } pre { background: $grey-700;