8000 add NuxTutorial to Level page · An0nCrypto/coderoad-vscode@6b4cc8c · GitHub
[go: up one dir, main page]

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

Commit 6b4cc8c

Browse files
committed
add NuxTutorial to Level page
1 parent 5afca66 commit 6b4cc8c

File tree

2 files changed

+19
-4
lines changed

2 files changed

+19
-4
lines changed

web-app/src/components/NewUserExperience/NuxTutorial.tsx

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ const styles = {
1818
},
1919
title: {
2020
marginLeft: '.6rem',
21-
fontSize: '1.1rem',
21+
fontSize: '1rem',
2222
},
2323
toggle: {
2424
display: 'flex',
@@ -101,16 +101,20 @@ const NewUserExperienceTutorialCollapsible = () => {
101101
)
102102
}
103103

104-
const NewUserExperienceTutorial = () => {
104+
interface Props {
105+
css?: React.CSSProperties
106+
}
107+
108+
const NewUserExperienceTutorial = (props: Props) => {
105109
const [isOpen, setIsOpen] = React.useState<boolean>(false)
106110
const onToggle = () => {
107111
setIsOpen(!isOpen)
108112
}
109113
return (
110-
<div css={styles.container}>
114+
<div css={{ ...styles.container, ...props.css }}>
111115
<div css={styles.header} onClick={onToggle} style={{ cursor: 'pointer' }}>
112116
<div css={styles.toggle}>
113-
<Icon type="help" />
117+
{isOpen ? <Icon type="close" size="xs" /> : <Icon type="help" size="small" />}
114118
<span css={styles.title}>Help</span>
115< 10000 /td>119
</div>
116120
</div>

web-app/src/containers/Tutorial/LevelPage/Level.tsx

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import { css, jsx } from '@emotion/core'
55
import Button from '../../../components/Button'
66
import Markdown from '../../../components/Markdown'
77
import ProcessMessages from '../../../components/ProcessMessages'
8+
import NuxTutorial from '../../../components/NewUserExperience/NuxTutorial'
89
import Step from './Step'
910

1011
const styles = {
@@ -47,6 +48,12 @@ const styles = {
4748
left: 0,
4849
right: 0,
4950
},
51+
nux: {
52+
position: 'fixed' as 'fixed',
53+
bottom: '2rem',
54+
left: 0,
55+
right: 0,
56+
},
5057
footer: {
5158
display: 'flex' as 'flex',
5259
flexDirection: 'row' as 'row',
@@ -129,6 +136,10 @@ const Level = ({ level, onContinue, onLoadSolution, processes, testStatus }: Pro
129136
</div>
130137
)}
131138

139+
<div css={styles.nux}>
140+
<NuxTutorial />
141+
</div>
142+
132143
<div css={styles.footer}>
133144
<span>
134145
{typeof level.index === 'number' ? `${level.index + 1}. ` : ''}

0 commit comments

Comments
 (0)
0