@@ -2,13 +2,10 @@ import * as React from 'react'
22import * as T from 'typings'
33import * as TT from 'typings/tutorial'
44import { css , jsx } from '@emotion/core'
5- import { Dropdown } from '@alifd/next'
6- import Icon from '../../../components/Icon'
75import Button from '../../../components/Button'
86import Markdown from '../../../components/Markdown'
97import ProcessMessages from '../../../components/ProcessMessages'
108import TestMessage from '../../../components/TestMessage'
11- import ContentMenu from './ContentMenu'
129import Step from './Step'
1310import { DISPLAY_RUN_TEST_BUTTON } from '../../../environment'
1411
@@ -25,20 +22,7 @@ const styles = {
2522padding :0 ,
2623paddingBottom :'5rem' ,
2724} ,
28- header :{
29- display :'flex' as 'flex' ,
30- alignItems :'center' ,
31- justifyContent :'space-between' ,
32- height :'2rem' ,
33- backgroundColor :'#EBEBEB' ,
34- fontSize :'1rem' ,
35- lineHeight :'1rem' ,
36- padding :'10px 1rem' ,
37- } ,
38- learn :{
39- textDecoration :'none' ,
40- color :'inherit' ,
41- } ,
25+
4226text :{
4327padding :'0rem 1rem' ,
4428paddingBottom :'1rem' ,
@@ -122,9 +106,6 @@ const Level = ({
122106} :Props ) => {
123107const level :TT . Level = tutorial . levels [ index ]
124108
125- const [ title , setTitle ] = React . useState < string > ( level . title )
126- const [ content , setContent ] = React . useState < string > ( level . content )
127-
128109// hold state for hints for the level
129110const [ displayHintsIndex , setDisplayHintsIndex ] = React . useState < number [ ] > ( [ ] )
130111const setHintsIndex = ( index :number , value :number ) => {
@@ -139,16 +120,6 @@ const Level = ({
139120setDisplayHintsIndex ( steps . map ( ( s ) => - 1 ) )
140121} , [ position . levelId ] )
141122
142- const menu = (
143- < ContentMenu
144- levels = { tutorial . levels || [ ] }
145- position = { position }
146- progress = { progress }
147- setTitle = { setTitle }
148- setContent = { setContent }
149- />
150- )
151-
152123const steps :Array < TT . Step & { status :T . ProgressStatus } > = level . steps . map ( ( step :TT . Step ) => {
153124// label step status for step component
154125let status :T . ProgressStatus = 'INCOMPLETE'
@@ -175,27 +146,15 @@ const Level = ({
175146
176147return (
177148< div css = { styles . page } >
178- < div css = { styles . header } >
179- < Dropdown
180- trigger = {
181- < a css = { styles . learn } >
182- { tutorial . summary . title } < Icon type = "arrow-down" size = "xxs" />
183- </ a >
184- }
185- triggerType = "click"
186- >
187- { menu }
188- </ Dropdown >
189- </ div >
190149< div css = { styles . content } >
191- { content . length ?(
150+ { level . content . length ?(
192151< div css = { styles . text } >
193- < h2 css = { styles . title } > { title } </ h2 >
194- < Markdown > { content || '' } </ Markdown >
152+ < h2 css = { styles . title } > { level . title } </ h2 >
153+ < Markdown > { level . content || '' } </ Markdown >
195154</ div >
196155) :null }
197156
198- { content . length && steps . length ?< div css = { styles . separator } /> :null }
157+ { level . content . length && steps . length ?< div css = { styles . separator } /> :null }
199158
200159{ steps . length ?(
201160< div css = { styles . tasks } >
@@ -249,12 +208,7 @@ const Level = ({
249208< Button type = "primary" onClick = { onRunTest } disabled = { processes . length > 0 } >
250209 Run
251210</ Button >
252- ) :(
253- < span >
254- { typeof index === 'number' ?`${ index + 1 } . ` :'' }
255- { title }
256- </ span >
257- ) }
211+ ) :null }
258212< span >
259213{ status === 'COMPLETE' || ! steps . length ?(
260214< Button type = "primary" onClick = { onContinue } >