add assessment tour

src/components/Home.js

@@ -94,7 +94,7 @@ class Home extends Component {
           <div style={{ float: 'left', height: '40px', position: 'relative' }}><WorkspaceStats /></div>
           : null
         }
-        <div style={{ float: 'right', height: '40px', marginBottom: '20px' }}>
+        <div className='workspaceFunc' style={{ float: 'right', height: '40px', marginBottom: '20px' }}>
           <WorkspaceFunc project={this.props.project} projectType={this.props.projectType}/>
         </div>
         <Grid container spacing={2}>
@@ -109,10 +109,12 @@ class Home extends Component {
               </IconButton>
             </Tooltip>
             <TrashcanButtons />
+            <div className='blocklyWindow'>
               {this.props.project ?
                 < BlocklyWindow blocklyCSS={{ height: '80vH' }} initialXml={this.props.project.xml} />
               : < BlocklyWindow blocklyCSS={{ height: '80vH' }} />
               }
+            </div>
           </Grid>
           {this.state.codeOn ?
             <Grid item xs={12} md={4}>

src/components/Navbar.js

@@ -85,6 +85,7 @@ class Navbar extends Component {
               color="inherit"
               onClick={this.toggleDrawer}
               style={{ margin: '0 10px' }}
+              className="MenuButton"
             >
               <FontAwesomeIcon icon={faBars} />
             </IconButton>
@@ -122,7 +123,7 @@ class Navbar extends Component {
                   onClick={() => { this.openTour(); }}
                   style={{ margin: '0 30px 0 auto' }}
                 >
-                  <FontAwesomeIcon icon={faQuestionCircle} size="3x" />
+                  <FontAwesomeIcon icon={faQuestionCircle} />
                 </IconButton>
               </Tooltip>
             : null}

src/components/Tour.js

@@ -13,17 +13,18 @@ export const home = [
     },
     {
         selector: ".saveBlocks",
-        content: 'Speicher deine Blöcke auf dem Computer',
+        content: 'Speichere deine Blöcke auf dem Computer.',
     },
     {
         selector: ".MenuButton",
         content: 'Im Menü findest du Tutorials und eine Gallery mit verschiedenen Beispiel Programmen.',
-    },
+    }
 ];
 
 export const assessment = [
+    // to be continued...
     {
-        selector: '.workspaceFunc',
+        selector: '.assessmentDiv',
-        content: 'Hier findest du alle Buttons um dein Programm zu übertragen, zu speichern oder zu teilen',
+        content: 'Hier kannst du eine Aufgabe lösen und kontrollieren.',
     }
 ];

src/components/Tutorial/Assessment.js

@@ -33,7 +33,7 @@ class Assessment extends Component {
     var statusTask = status.tasks[taskIndex];
 
     return (
-      <div style={{ width: '100%' }}>
+      <div className="assessmentDiv" style={{ width: '100%' }}>
         <Typography variant='h4' style={{ float: 'left', marginBottom: '5px', height: '40px', display: 'table' }}>{currentTask.headline}</Typography>
         <div style={{ float: 'right', height: '40px' }}><WorkspaceFunc assessment /></div>
         <Grid container spacing={2} style={{ marginBottom: '5px' }}>

src/components/Workspace/DownloadProject.js

@@ -44,7 +44,7 @@ class DownloadProject extends Component {
       <div style={this.props.style}>
         <Tooltip title={Blockly.Msg.tooltip_download_project} arrow>
           <IconButton
-            className={this.props.classes.button}
+            className={`saveBlocks ${this.props.classes.button}`}
             onClick={() => this.downloadXmlFile()}
           >
             <FontAwesomeIcon icon={faFileDownload} size="xs" />