schuelerlabor-cleverlab/smarti
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

linear progress at navbar

Browse Source
This commit is contained in:
Delucse 2020-11-27 12:26:16 +01:00
parent cbe091db27
commit 28720edeea
3 changed files with 18 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/Navbar.js
View File

@ -1,4 +1,6 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { Link } from 'react-router-dom';
import senseboxLogo from './sensebox_logo.svg';
@ -16,6 +18,7 @@ import IconButton from '@material-ui/core/IconButton';
import ListItem from '@material-ui/core/ListItem';
import ListItemIcon from '@material-ui/core/ListItemIcon';
import ListItemText from '@material-ui/core/ListItemText';
import LinearProgress from '@material-ui/core/LinearProgress';
import { faBars, faChevronLeft, faBuilding, faIdCard, faEnvelope, faCog, faChalkboardTeacher, faFolderPlus, faTools, faLightbulb } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@ -50,7 +53,7 @@ class Navbar extends Component {
<div>
<AppBar
position="relative"
style={{ height: '50px', marginBottom: '30px' }}
style={{ height: '50px', marginBottom: this.props.isLoading ? '0px' : '30px', boxShadow: this.props.isLoading ? 'none' : '0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)' }}
classes={{ root: this.props.classes.appBarColor }}
>
<Toolbar style={{ height: '50px', minHeight: '50px', padding: 0, color: 'white' }}>
@ -115,9 +118,20 @@ class Navbar extends Component {
))}
</List> */}
</Drawer>
{this.props.isLoading ?
<LinearProgress style={{marginBottom: '30px', boxShadow: '0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)'}}/>
: null}
</div>
);
}
}
export default withStyles(styles, { withTheme: true })(withRouter(Navbar));
Navbar.propTypes = {
isLoading: PropTypes.bool.isRequired
};
const mapStateToProps = state => ({
isLoading: state.tutorial.progress,
});
export default connect(mapStateToProps, null)(withStyles(styles, { withTheme: true })(withRouter(Navbar)));

3
src/components/Tutorial/Tutorial.js
View File

@ -17,7 +17,6 @@ import { detectWhitespacesAndReturnReadableResult } from '../../helpers/whitespa
import Card from '@material-ui/core/Card';
import Button from '@material-ui/core/Button';
import LinearProgress from '@material-ui/core/LinearProgress';
class Tutorial extends Component {
@ -49,7 +48,7 @@ class Tutorial extends Component {
console.log(this.props.tutorial);
return (
<div>
{this.props.isLoading ? <LinearProgress /> :
{this.props.isLoading ? null :
!this.props.tutorial ? <NotFound button={{ title: 'Zurück zur Tutorials-Übersicht', link: '/tutorial' }} />
: (() => {
var tutorial = this.props.tutorial;

3
src/components/Tutorial/TutorialHome.js
View File

@ -15,7 +15,6 @@ import { withStyles } from '@material-ui/core/styles';
import Grid from '@material-ui/core/Grid';
import Paper from '@material-ui/core/Paper';
import Typography from '@material-ui/core/Typography';
import LinearProgress from '@material-ui/core/LinearProgress';
import { faCheck, faTimes } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@ -72,7 +71,7 @@ class TutorialHome extends Component {
render() {
return (
this.props.isLoading ? <LinearProgress /> :
this.props.isLoading ? null :
<div>
<Breadcrumbs content={[{ link: '/tutorial', title: 'Tutorial' }]} />