From ffda954add95fc17049cd0f5386952dabfc4168b Mon Sep 17 00:00:00 2001 From: Alexander Tseung Date: Mon, 30 Apr 2018 18:28:34 -0700 Subject: Fix styling of the app spinner --- .../loading-screen/loading-screen.component.js | 35 ++++++++++++++++++++++ 1 file changed, 35 insertions(+) create mode 100644 ui/app/components/loading-screen/loading-screen.component.js (limited to 'ui/app/components/loading-screen/loading-screen.component.js') diff --git a/ui/app/components/loading-screen/loading-screen.component.js b/ui/app/components/loading-screen/loading-screen.component.js new file mode 100644 index 000000000..bce2a4aac --- /dev/null +++ b/ui/app/components/loading-screen/loading-screen.component.js @@ -0,0 +1,35 @@ +const { Component } = require('react') +const h = require('react-hyperscript') +const PropTypes = require('prop-types') +const classnames = require('classnames') +const Spinner = require('../spinner') + +class LoadingScreen extends Component { + renderMessage () { + const { loadingMessage } = this.props + return loadingMessage && h('span', loadingMessage) + } + + render () { + return ( + h('.loading-overlay', { + className: classnames({ 'loading-overlay--full-screen': this.props.fullScreen }), + }, [ + h('.loading-overlay__container', [ + h(Spinner, { + color: '#F7C06C', + }), + + this.renderMessage(), + ]), + ]) + ) + } +} + +LoadingScreen.propTypes = { + loadingMessage: PropTypes.string, + fullScreen: PropTypes.bool, +} + +module.exports = LoadingScreen -- cgit v1.2.3