Feature/rewrite

.gitignore

@@ -67,3 +67,6 @@ yarn-error.log
 .pnp.js
 # Yarn Integrity file
 .yarn-integrity
+
+# Next dev work
+.next/

README.md

@@ -1,100 +1,30 @@
-# EdgeSheet: FFG Star Wars RPG Character Sheet
+This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
 
-## Local Development
+## Getting Started
 
-This website is a statically generated site using gatsby, with local json as the backing datasource. This provides a fast, responsive experience.
+First, run the development server:
 
-* Run `npm install -g gatsby-cli`.
-* Run `npm install`.
+```bash
+npm run dev
+# or
+yarn dev
+```
 
-### How to run this on your local
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
 
-Gatsby commands have been wired to simple npm scripts.
+You can start editing the page by modifying `pages/index.js`. The page auto-updates as you edit the file.
 
-* Run `npm develop`.
+## Learn More
 
-This will start the server on localhost:8000, which you can hit with your web browser. For more indepth information on the underlying `gatsby devlop` command, see the [gatsby docs](https://www.gatsbyjs.org/docs/gatsby-cli/).
+To learn more about Next.js, take a look at the following resources:
 
-### Running Tests
+- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
+- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
 
-(Coming Soon)
+You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
 
-### How to deploy manually
+## Deploy on Vercel
 
-Running `npm deploy` is configured properly to:
+The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/import?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
 
-* Run gatsby build with prefix-path on
-* Clear the old docs folder
-* Copy the generated /public folder to the /docs folder. Github serves github pages from /docs; /public is gitignored as it is a purely local step.
-
-You will need to push this to master/create a pull request against master afterwards.
-
-## How to Contribute
-
-If you are not a maintainer, please fork this repo and make a pull request against master when you are ready.
-
-## Why make this site
-
-The goal of this site is to provide a small lightweight experience that other SW FFG RPG tools do not offer. Each tool listed below has welcome place with SW RPG players, and EdgeSheets aims to add another alternative to the enviroment for a different use case.
-
-Intent:
-
-* Lightweight Cross platform experience.
-* Simple to use.
-* Offers Customizability/flexibility.
-* A quick refrence sheet for your character.
-* Free and open source.
-
-What this site is not:
-
-* A rule book. This site is intended to give you a quick reference as to  what your character has in one glance. It does not tell you how to apply those stats or feats. You will still need a rulebook to understand how the game works (or even how to create a character in the first place).
-* An all encompasing system platform like the OggDude Character Generator, or Roll20. The character sheet will be as editable as possible outside of the immediately calculatable items. It will be up to you to track what you spend your xp on, what feats you currently have, and how the rules of the game actually work.
-* A place to store your character sheets. A fuction to import/export to JSON will be provided so you may store it locally/in other cloud services.
-
-### Comparisons Legends of the Galaxy/OggDude Character Generator
-
-Pros:
-
-* All encomposing platform.
-* In depth system and tooling.
-* Tracking across characters, teaches you the system.
-
-Cons:
-
-* Very heavyweight and slow.
-* Requires a download.
-* Only works on windows.
-* As it teaches you the rules, feats are not easy to reference.
-* Not Open Source.
-
-### Comparisons with SWSheets.com
-
-Pros:
-
-* Cross platform.
-* Manages many characters per account.
-* Offers a simple UI
-* Open source.
-
-Cons:
-
-* All characters are public.
-* No place to manage feats.
-* Requires sign up/account.
-* Lots of manual entry.
-
-### Comparisons with Fringer's Datapad
-
-Granted, I don't have a lot of experience with this one, but at first glance...
-
-Pros:
-
-* Simple UI.
-* Multiple characters.
-* Simple to set up.
-
-Cons:
-
-* Much like OggDude's generator, feats require cross refrencing from multiple places, making what you need to remember during combat enormous, making combat slow and a chore.
-* IOS only (No Android :(, and you can't use it on PC/Mac/Linux even if you like the program better).
-* Not Open Source (Even though FD can import oggdude sheets that is difficult to port to SWSheets; and neither OggDude nor SWSheets devs have the time/motivation to move further on that front).
+Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.

components/common/block.tsx

@@ -0,0 +1,42 @@
+import React, { ReactNode } from "react"
+
+interface BlockProps {
+    type?: BlockPropDef,
+    isPrimary?: boolean,
+    children: ReactNode | ReactNode[]
+}
+
+export enum BlockPropDef {
+    widescreen = "is-widescreen",
+    notification = "notification",
+    fullHd = "is-fullhd",
+    primary = "is-primary",
+    maxDesktop = "is-max-desktop",
+    maxFullScreen = "is-max-widescreen",
+    fluid = "is-fluid"
+}
+
+const GenerateClassName = (props: BlockProps) => {
+    let className = ""
+
+    if (props.type === BlockPropDef.notification) {
+        className = className + BlockPropDef.notification
+        if (props.isPrimary === true) {
+            className = className + " " + BlockPropDef.primary
+        }
+    } else if (props.type !== undefined) {
+        className = "container " + props.type
+    } else {
+        className = "container"
+    }
+
+    return className;
+}
+
+const Block = (props: BlockProps) => {
+    return (
+        <div className={GenerateClassName(props)}>{props.children}</div>
+    )
+}
+
+export default Block