Merge branch 'main' of https://github.com/AceTheCreator/dnotebook-react

AceTheCreator · AceTheCreator · commit 7d41f74b9841 · 2021-06-02T15:35:57.000+01:00
diff --git a/.github/workflows/node.js.yml b/.github/workflows/node.js.yml
@@ -0,0 +1,29 @@
+# This workflow will do a clean install of node dependencies, build the source code and run tests across different versions of node
+# For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions
+
+name: Node.js CI
+
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+
+jobs:
+  build:
+
+    runs-on: ubuntu-latest
+
+    strategy:
+      matrix:
+        node-version: [10.x, 12.x, 14.x]
+        # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
+
+    steps:
+    - uses: actions/checkout@v2
+    - name: Use Node.js ${{ matrix.node-version }}
+      uses: actions/setup-node@v2
+      with:
+        node-version: ${{ matrix.node-version }}
+    - run: npm run build
+    - run: npm test
diff --git a/README.md b/README.md
@@ -2,12 +2,17 @@
 
 Recreatiing the essential part of [Dnotebook](https://playnotebook.jsdata.org/) using react. See old repo [here](https://github.com/opensource9ja/dnotebook)
 
-Disclaimer: UI is not fancy (no css is used for now).
-
 ## Component Structure
 Cell.js --> Contains all operation  pertaining to a cell block
 
 App.js  --> Manage all cells block and general operations like Downloading and Uploading of Notebook
 
 Index.js --> Renders the App.
 
+## To contribute
+
+1. Clone the repository
+2. cd into the clone repository
+3. run `yarn`
+4. To start the web page: `yarn start` and go to `localhost:3000` to see the webpage
+
diff --git a/craco.config.js b/craco.config.js
@@ -0,0 +1,7 @@
+module.exports = {
+  style: {
+    postcss: {
+      plugins: [require("tailwindcss"), require("autoprefixer")],
+    },
+  },
+};
diff --git a/package.json b/package.json
@@ -3,11 +3,15 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "@craco/craco": "^6.0.0",
+    "@tailwindcss/postcss7-compat": "^2.0.2",
     "@testing-library/jest-dom": "^5.11.5",
     "@testing-library/react": "^11.1.1",
     "@testing-library/user-event": "^12.2.0",
     "blob-polyfill": "^5.0.20210201",
+    "autoprefixer": "^9",
     "codemirror": "^5.58.2",
+    "postcss": "^7",
     "react": "^17.0.1",
     "react-codemirror": "^1.0.0",
     "react-codemirror2": "^7.2.1",
@@ -19,6 +23,7 @@
     "remarkable": "^2.0.1",
     "remarkable-react": "^1.4.3",
     "styled-components": "^5.2.1",
+    "tailwindcss": "npm:@tailwindcss/postcss7-compat",
     "web-vitals": "^0.2.4"
   },
   "scripts": {
diff --git a/public/index.html b/public/index.html
@@ -10,6 +10,8 @@
       content="Web site created using create-react-app"
     />
     <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css"
+    integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
     <!--
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
diff --git a/src/Cell.js b/src/Cell.js
@@ -105,6 +105,7 @@ export default function Cell({
       refCode.current.style.display = cell.input ? "none" : "block";
     } else {
       refCode.current.getCodeMirror().setValue(cell.input);
+      refCode.current.getCodeMirror().setSize("100%", "auto");
       refOutput.current.innerHTML = cell.output;
     }
     // eslint-disable-next-line radix
diff --git a/tailwind.config.js b/tailwind.config.js
@@ -0,0 +1,11 @@
+module.exports = {
+  purge: ["./src/**/*.{js,jsx,ts,tsx}", "./public/index.html"],
+  darkMode: false, // or 'media' or 'class'
+  theme: {
+    extend: {},
+  },
+  variants: {
+    extend: {},
+  },
+  plugins: [],
+};

Original file line number	Diff line number	Diff line change
`@@ -105,6 +105,7 @@ export default function Cell({`
`105`	`105`	`refCode.current.style.display = cell.input ? "none" : "block";`
`106`	`106`	`} else {`
`107`	`107`	`refCode.current.getCodeMirror().setValue(cell.input);`
	`108`	`+ refCode.current.getCodeMirror().setSize("100%", "auto");`
`108`	`109`	`refOutput.current.innerHTML = cell.output;`
`109`	`110`	`}`
`110`	`111`	`// eslint-disable-next-line radix`