11import * as React from 'react'
22import { Balloon } from '@alifd/next'
33import Button from '../Button'
4- import Icon from '../Icon'
54
65const styles = {
76iconButton :{
@@ -10,9 +9,12 @@ const styles = {
109alignItems :'center' ,
1110width :30 ,
1211height :30 ,
12+ fontSize :18 ,
13+ color :'grey' ,
1314} ,
1415balloonTitle :{
1516marginTop :0 ,
17+ textAlign :'center' as 'center' ,
1618} ,
1719balloonOptions :{
1820display :'flex' ,
@@ -33,15 +35,11 @@ const StepHelp = (props: Props) => {
3335props . onLoadSolution ( )
3436}
3537}
36- const promptLeft = (
37- < Button style = { styles . iconButton } >
38- < Icon type = "prompt" role = "button" />
39- </ Button >
40- )
38+ const promptLeft = < Button style = { styles . iconButton } > i</ Button >
4139return (
42- < Balloon trigger = { promptLeft } align = "l" alignEdge triggerType = "click" style = { { width :300 } } >
40+ < Balloon trigger = { promptLeft } align = "l" alignEdge triggerType = "click" style = { { width :150 } } closable = { false } >
4341< div >
44- < h4 style = { styles . balloonTitle } > Stuck? Need help? </ h4 >
42+ < h4 style = { styles . balloonTitle } > Stuck?</ h4 >
4543< div style = { styles . balloonOptions } >
4644< Button type = "secondary" onClick = { onClickHandler } disabled = { loadedSolution } >
4745 Load Solution