docs: create initial documentation structure

Author: luizbaldi

docs/.gitignore

@@ -0,0 +1,20 @@
+# Dependencies
+/node_modules
+
+# Production
+/build
+
+# Generated files
+.docusaurus
+.cache-loader
+
+# Misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

docs/README.md

@@ -0,0 +1,38 @@
+# Website
+
+This website is built using [Docusaurus 2](https://v2.docusaurus.io/), a modern static website generator.
+
+## Installation
+
+```console
+yarn install
+```
+
+## Local Development
+
+```console
+yarn start
+```
+
+This command starts a local development server and open up a browser window. Most changes are reflected live without having to restart the server.
+
+## Build
+
+```console
+yarn build
+```
+
+This command generates static content into the `build` directory and can be served using any static contents hosting service.
+
+## Deployment
+
+```console
+GIT_USER=<Your GitHub username> USE_SSH=true yarn deploy
+```
+
+If you are using GitHub pages for hosting, this command is a convenient way to build the website and push to the `gh-pages` branch.
+
+## To Do
+
+[ ] Fonts page
+[ ] Theming page

docs/babel.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+  presets: [require.resolve('@docusaurus/core/lib/babel/preset')],
+};

docs/docs/button.md

@@ -0,0 +1,44 @@
+---
+slug: /button
+title: Button
+---
+
+Use buttons to trigger an action after a user interaction.
+
+![img](../static/img/docs-button.png)
+
+### Usage
+
+```javascript
+import { Button } from 'react95-native';
+
+<Button variant='default' onPress={() => console.warn('onPress')} primary>
+  Primary
+</Button>;
+```
+
+### Props
+
+_(all props are optional)_
+
+**`accessibilityLabel`**: `string`
+
+**`active`**: `boolean`
+
+**`children`**: `React.ReactNode`
+
+**`disabled`**: `boolean`
+
+**`onPress`**: `() => void`
+
+**`onLongPress`**: `() => void`
+
+**`primary`**: `boolean`
+
+**`size`**: `Sizes`
+
+**`square`**: `boolean`
+
+**`style`**: `StyleProp<ViewStyle>`
+
+**`variant`**: `ButtonVariants`

docs/docs/fonts.md

@@ -0,0 +1,6 @@
+---
+slug: /fonts
+title: Fonts
+---
+
+Fonts section (WIP)

docs/docs/getting-started.md

@@ -0,0 +1,40 @@
+---
+slug: /
+title: Getting Started
+---
+
+## Installation
+
+React95 Native is available as an [npm package](https://www.npmjs.com/package/react95-native).
+
+## npm
+
+To install and save your `package.json` dependencies, run:
+
+```sh
+// yarn
+yarn react95-native
+
+// npm
+npm i react95-native
+```
+
+## Usage
+
+Simply rap your app content with our custom ThemeProvider (more on the [theming](theming) section) with the theme of your choice... and you're ready to go! 🚀
+
+```jsx
+import React from 'react';
+import { ThemeProvider, themes } from 'react95-native';
+
+/* Pick a theme of your choice */
+const { original } = themes;
+
+const App = () => (
+  <div>
+    <ThemeProvider theme={original}>/* ... */</ThemeProvider>
+  </div>
+);
+
+export default App;
+```

docs/docs/theming.md

@@ -0,0 +1,6 @@
+---
+slug: /theming
+title: Theming
+---
+
+Theming section (WIP)

docs/docusaurus.config.js

@@ -0,0 +1,89 @@
+module.exports = {
+  title: 'React95 Native',
+  tagline:
+    'Refreshed Windows 95 style UI components for your React Native app.',
+  url: 'https://your-docusaurus-test-site.com',
+  baseUrl: '/',
+  onBrokenLinks: 'throw',
+  onBrokenMarkdownLinks: 'warn',
+  favicon: 'img/favicon.ico',
+  organizationName: 'react95-io', // Usually your GitHub org/user name.
+  projectName: 'react95-native', // Usually your repo name.
+  themeConfig: {
+    navbar: {
+      title: 'React95',
+      logo: {
+        alt: 'React95 Logo',
+        src: 'img/logo.svg',
+      },
+      items: [
+        {
+          to: 'docs/',
+          activeBasePath: 'docs',
+          label: 'Docs',
+          position: 'left',
+        },
+        {
+          href: 'https://github.com/react95-io/react95-native',
+          label: 'GitHub',
+          position: 'right',
+        },
+      ],
+    },
+    footer: {
+      style: 'dark',
+      links: [
+        {
+          title: 'Docs',
+          items: [
+            {
+              label: 'Style Guide',
+              to: 'docs/',
+            },
+          ],
+        },
+        {
+          title: 'Community',
+          items: [
+            {
+              label: 'Stack Overflow',
+              href: 'https://stackoverflow.com/questions/tagged/docusaurus',
+            },
+            {
+              label: 'Discord',
+              href: 'https://discordapp.com/invite/docusaurus',
+            },
+            {
+              label: 'Twitter',
+              href: 'https://twitter.com/docusaurus',
+            },
+          ],
+        },
+        {
+          title: 'More',
+          items: [
+            {
+              label: 'GitHub',
+              href: 'https://github.com/facebook/docusaurus',
+            },
+          ],
+        },
+      ],
+      copyright: `Copyright © ${new Date().getFullYear()} React95 Native`,
+    },
+  },
+  presets: [
+    [
+      '@docusaurus/preset-classic',
+      {
+        docs: {
+          sidebarPath: require.resolve('./sidebars.js'),
+          editUrl: 'https://github.com/react95-io/react95-native',
+        },
+        theme: {
+          customCss: require.resolve('./src/css/custom.css'),
+        },
+      },
+    ],
+  ],
+};

docs/package.json

@@ -0,0 +1,34 @@
+{
+  "name": "react-95",
+  "version": "0.0.0",
+  "private": true,
+  "scripts": {
+    "docusaurus": "docusaurus",
+    "start": "docusaurus start",
+    "build": "docusaurus build",
+    "swizzle": "docusaurus swizzle",
+    "deploy": "docusaurus deploy",
+    "serve": "docusaurus serve",
+    "clear": "docusaurus clear"
+  },
+  "dependencies": {
+    "@docusaurus/core": "2.0.0-alpha.70",
+    "@docusaurus/preset-classic": "2.0.0-alpha.70",
+    "@mdx-js/react": "^1.6.21",
+    "clsx": "^1.1.1",
+    "react": "^16.8.4",
+    "react-dom": "^16.8.4"
+  },
+  "browserslist": {
+    "production": [
+      ">0.5%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}

docs/sidebars.js

@@ -0,0 +1,6 @@
+module.exports = {
+  someSidebar: {
+    Guides: ['getting-started', 'theming', 'fonts'],
+    Components: ['button'],
+  },
+};

docs/src/css/custom.css

@@ -0,0 +1,25 @@
+/* stylelint-disable docusaurus/copyright-header */
+/**
+ * Any CSS included here will be global. The classic template
+ * bundles Infima by default. Infima is a CSS framework designed to
+ * work well for content-centric websites.
+ */
+
+/* You can override the default Infima variables here. */
+:root {
+  --ifm-color-primary: teal;
+  --ifm-color-primary-dark: rgb(33, 175, 144);
+  --ifm-color-primary-darker: rgb(31, 165, 136);
+  --ifm-color-primary-darkest: rgb(26, 136, 112);
+  --ifm-color-primary-light: rgb(70, 203, 174);
+  --ifm-color-primary-lighter: rgb(102, 212, 189);
+  --ifm-color-primary-lightest: rgb(146, 224, 208);
+  --ifm-code-font-size: 95%;
+}
+
+.docusaurus-highlight-code-line {
+  background-color: rgb(72, 77, 91);
+  display: block;
+  margin: 0 calc(-1 * var(--ifm-pre-padding));
+  padding: 0 var(--ifm-pre-padding);
+}