Merge pull request #10 from sensebox/use-viewport-height

use viewport height for blocklywindow

src/components/CodeViewer.js

@@ -85,7 +85,7 @@ class CodeViewer extends Component {
     var curlyBrackets = '{ }';
     var unequal = '<>';
     return (
-      <Card style={{height: '100%', maxHeight: '500px'}} ref={this.myDiv}>
+      <Card style={{ height: '100%', maxHeight: '80vH' }} ref={this.myDiv}>
         <Accordion
           square={true}
           style={{ margin: 0 }}

src/components/Home.js

@@ -87,7 +87,7 @@ class Home extends Component {
               </IconButton>
             </Tooltip>
             <TrashcanButtons />
-            <BlocklyWindow blocklyCSS={{height: '500px'}} blockDisabled/>
+            <BlocklyWindow blocklyCSS={{ height: '80vH' }} blockDisabled />
           </Grid>
           {this.state.codeOn ?
             <Grid item xs={12} md={6}>

src/components/Tutorial/Assessment.js

@@ -42,7 +42,7 @@ class Assessment extends Component {
             <BlocklyWindow
               initialXml={statusTask ? statusTask.xml ? statusTask.xml : null : null}
               blockDisabled
-              blocklyCSS={{height: '500px'}}
+              blocklyCSS={{ height: '65vH' }}
             />
           </Grid>
           <Grid item xs={12} md={6} lg={4} style={isWidthDown('sm', this.props.width) ? { height: 'max-content' } : {}}>