Commit6b4cc8c

committed

add NuxTutorial to Level page

1 parent5afca66 commit6b4cc8cCopy full SHA for 6b4cc8c

File tree

+19

-4

lines changed

web-app/src
- components/NewUserExperience
  - NuxTutorial.tsx
- containers/Tutorial/LevelPage
  - Level.tsx

+19

-4

lines changed

Lines changed: 8 additions & 4 deletions

Original file line number	Diff line number	Diff line change
`@@ -18,7 +18,7 @@ const styles = {`
`18`	`18`	`},`
`19`	`19`	`title:{`
`20`	`20`	`marginLeft:'.6rem',`
`21`		`-fontSize:'1.1rem',`
	`21`	`+fontSize:'1rem',`
`22`	`22`	`},`
`23`	`23`	`toggle:{`
`24`	`24`	`display:'flex',`
`@@ -101,16 +101,20 @@ const NewUserExperienceTutorialCollapsible = () => {`
`101`	`101`	`)`
`102`	`102`	`}`
`103`	`103`
`104`		`-constNewUserExperienceTutorial=()=>{`
	`104`	`+interfaceProps{`
	`105`	`+css?:React.CSSProperties`
	`106`	`+}`
	`107`	`+`
	`108`	`+constNewUserExperienceTutorial=(props:Props)=>{`
`105`	`109`	`const[isOpen,setIsOpen]=React.useState<boolean>(false)`
`106`	`110`	`constonToggle=()=>{`
`107`	`111`	`setIsOpen(!isOpen)`
`108`	`112`	`}`
`109`	`113`	`return(`
`110`		`-<divcss={styles.container}>`
	`114`	`+<divcss={{ ...styles.container, ...props.css}}>`
`111`	`115`	`<divcss={styles.header}onClick={onToggle}style={{cursor:'pointer'}}>`
`112`	`116`	`<divcss={styles.toggle}>`
`113`		`-<Icontype="help"/>`
	`117`	`+{isOpen ?<Icontype="close"size="xs"/> :<Icontype="help"size="small"/>}`
`114`	`118`	`<spancss={styles.title}>Help</span>`
`115`	`119`	`</div>`
`116`	`120`	`</div>`

Lines changed: 11 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -5,6 +5,7 @@ import { css, jsx } from '@emotion/core'`
`5`	`5`	`importButtonfrom'../../../components/Button'`
`6`	`6`	`importMarkdownfrom'../../../components/Markdown'`
`7`	`7`	`importProcessMessagesfrom'../../../components/ProcessMessages'`
	`8`	`+importNuxTutorialfrom'../../../components/NewUserExperience/NuxTutorial'`
`8`	`9`	`importStepfrom'./Step'`
`9`	`10`
`10`	`11`	`conststyles={`
`@@ -47,6 +48,12 @@ const styles = {`
`47`	`48`	`left:0,`
`48`	`49`	`right:0,`
`49`	`50`	`},`
	`51`	`+nux:{`
	`52`	`+position:'fixed'as'fixed',`
	`53`	`+bottom:'2rem',`
	`54`	`+left:0,`
	`55`	`+right:0,`
	`56`	`+},`
`50`	`57`	`footer:{`
`51`	`58`	`display:'flex'as'flex',`
`52`	`59`	`flexDirection:'row'as'row',`
`@@ -129,6 +136,10 @@ const Level = ({ level, onContinue, onLoadSolution, processes, testStatus }: Pro`
`129`	`136`	`</div>`
`130`	`137`	`)}`
`131`	`138`
	`139`	`+<divcss={styles.nux}>`
	`140`	`+<NuxTutorial/>`
	`141`	`+</div>`
	`142`	`+`
`132`	`143`	`<divcss={styles.footer}>`
`133`	`144`	`<span>`
`134`	`145`	{typeoflevel.index==='number' ?`${level.index+1}. ` :''}

Comments

(0)