scholar-6 / brillder Goto Github PK
View Code? Open in Web Editor NEWLicense: Apache License 2.0
License: Apache License 2.0
Add some styling and make sure the button 'create' goes to Pro forma page.
We want a preview window on the right hand side of the Brick Build screen.
Ignore the rest of the screen we just want a phone outline on the right hand side. On smaller screens this preview should disappear.
This phone outline will be empty and show message "Preview not available"
When we rebuild the play interface we will be bringing these components in as the preview but until then it will remain empty.
Please use a phone outline similar to Lucid chart. (Feint grey)
First page has the following options.
The poster had these options but ignore them for the moment we can come back to them later.
Second Page is a meta data form to create a new brick
Third page will be similar to SurveyJS, it will be a content building page using blocks.
Fourth Page will be a list of bricks
[There is not really an image for this on the poster]
Add following user types:
Student,
Teacher,
Builder,
Admin
We need another field on pro forma page.
Please set up an EC2 Instance to serve code. I will add subdomain to point to IP.
Create first version of Brick Builder page.
Does not have to be working but should have first version of the layout of the interface.
In future we will have an interface at /play and an interface at /teach.
For moment just move all current components to have route with root /build/
Build the following routes
see lucid chart
Add prefill text "Enter short answer..."
Also add ability to add more than one short answer
Also add a delete button (bin icon) on the left
https://learningfortress.scholar6.org/play/pallet/demopallet
All unauthenticated requests should go to a login page that looks like the above link.
The only difference is we are removing 'learning fortress'
Depending on which button they click will depend on which interface the go back to after authentication.
Please review this issue
facebook/create-react-app#8096
And update dependencies for react-scripts and associated babel dependencies
npm update @babel/core --depth 3
@ivanromakh
Can we set the break points to
max-width: 599px
min-width: 600px
min-width: 900px
min-width: 1200px
min-width: 1800px
As per this article.
https://www.freecodecamp.org/news/the-100-correct-way-to-do-css-breakpoints-88d6a5ba1862/
Use Lucid Chart
https://react-dnd.github.io/react-dnd/about
Please add the following library to the code.
Also review this documentation
https://engineering.datorama.com/mastering-drag-drop-with-reactjs-part-01-39bed3d40a03
Add Material UI
https://github.com/mui-org/material-ui
Review 3.x documentation here
https://v3.material-ui.com/demos/app-bar/
Add 'create' button and make that go to the first version of the brick builder page.
@SashaScholar6 please add a design for build function
Needs latest merges
Please review facebook/create-react-app#6792
And update dependencies / lock file as necessary
Please fix the following warnings from the npm run-script build output:
./src/components/loginPage/loginPage.tsx
Line 10:10: 'useLocation' is defined but never used @typescript-eslint/no-unused-vars
Line 109:13: img elements must have an alt prop, either with meaningful text, or an empty string for decorative images jsx-a11y/alt-text
./src/components/registerPage/registerPage.tsx
Line 16:20: Expected '!==' and instead saw '!=' eqeqeq
Line 28:13: Expected '!==' and instead saw '!=' eqeqeq
Line 93:13: img elements must have an alt prop, either with meaningful text, or an empty string for decorative images jsx-a11y/alt-text
./src/components/investigationBuildPage/buildQuestions/components/Text/Text.tsx
Line 19:15: 'data' is assigned a value but never used @typescript-eslint/no-unused-vars
./src/components/app/privateRoute.tsx
Line 1:17: 'Component' is defined but never used @typescript-eslint/no-unused-vars
./src/redux/actions/auth.ts
Line 23:16: Expected '===' and instead saw '==' eqeqeq
./src/components/proFormaPage/editorRow/editorRow.tsx
Line 23:3: Useless constructor @typescript-eslint/no-useless-constructor
./src/components/investigationBuildPage/buildQuestions/components/QuestionComponentSwitcher.tsx
Line 24:12: Expected '===' and instead saw '==' eqeqeq
Line 26:19: Expected '===' and instead saw '==' eqeqeq
Line 28:19: Expected '===' and instead saw '==' eqeqeq
Line 30:19: Expected '===' and instead saw '==' eqeqeq
Line 32:19: Expected '===' and instead saw '==' eqeqeq
Line 34:19: Expected '===' and instead saw '==' eqeqeq
./src/components/preLoginPage/preLoginPage.tsx
Line 25:16: Expected '===' and instead saw '==' eqeqeq
Line 35:17: img elements must have an alt prop, either with meaningful text, or an empty string for decorative images jsx-a11y/alt-text
Line 43:17: img elements must have an alt prop, either with meaningful text, or an empty string for decorative images jsx-a11y/alt-text
Line 51:17: img elements must have an alt prop, either with meaningful text, or an empty string for decorative images jsx-a11y/alt-text
Line 58:15: img elements must have an alt prop, either with meaningful text, or an empty string for decorative images jsx-a11y/alt-text
Line 90:15: img elements must have an alt prop, either with meaningful text, or an empty string for decorative images jsx-a11y/alt-text
./src/redux/actions/proFormActions.ts
Line 2:8: 'axios' is defined but never used @typescript-eslint/no-unused-vars
Line 4:8: 'host' is defined but never used @typescript-eslint/no-unused-vars
Line 5:10: 'Brick' is defined but never used @typescript-eslint/no-unused-vars
Line 14:7: 'fetchProFormaDataFailure' is assigned a value but never used @typescript-eslint/no-unused-vars
./src/components/investigationBuildPage/header/pageHeader.tsx
Line 34:3: Useless constructor @typescript-eslint/no-useless-constructor
./src/components/investigationBuildPage/buildQuestions/questionComponents/questionComponents.tsx
Line 35:14: Expected '===' and instead saw '==' eqeqeq
Line 37:21: Expected '===' and instead saw '==' eqeqeq
Line 39:21: Expected '===' and instead saw '==' eqeqeq
Line 41:21: Expected '===' and instead saw '==' eqeqeq
Line 43:21: Expected '===' and instead saw '==' eqeqeq
Line 45:21: Expected '===' and instead saw '==' eqeqeq
Line 47:21: Expected '===' and instead saw '==' eqeqeq
Line 49:21: Expected '===' and instead saw '==' eqeqeq
Line 51:21: Expected '===' and instead saw '==' eqeqeq
Line 53:21: Expected '===' and instead saw '==' eqeqeq
./src/components/investigationBuildPage/buildQuestions/buildQuestionComponent.tsx
Line 36:9: 'move' is assigned a value but never used @typescript-eslint/no-unused-vars
./src/components/investigationBuildPage/investigationBuildPage.tsx
Line 58:53: Expected '===' and instead saw '==' eqeqeq
Line 140:23: Expected '===' and instead saw '==' eqeqeq
Line 183:33: Expected '===' and instead saw '==' eqeqeq
./src/components/investigationBuildPage/buildQuestions/drag/dragAndDropBox.tsx
Line 62:13: Expected '!==' and instead saw '!=' eqeqeq
./src/components/investigationBuildPage/dragTabs/dragTab.tsx
Line 68:20: Expected '===' and instead saw '==' eqeqeq
Give this a go
Can we run this live at a sub domain storybook.scholar6.org
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.