diff --git a/source/actions.js b/source/actions.js index 1d4466155..997c0fc87 100644 --- a/source/actions.js +++ b/source/actions.js @@ -1,5 +1,8 @@ /* @flow */ -import type { ResetSimulationAction } from './types/Actions' +import type { + ResetSimulationAction, + LoadPreviousSimulationAction +} from './types/Actions' // The input "conversation" is composed of "steps" // The state keeps track of which of them have been submitted @@ -26,6 +29,11 @@ export const START_CONVERSATION = 'START_CONVERSATION' export const CHANGE_THEME_COLOUR = 'CHANGE_THEME_COLOUR' +export function loadPreviousSimulation(): LoadPreviousSimulationAction { + return { + type: 'LOAD_PREVIOUS_SIMULATION' + } +} // $FlowFixMe export function changeThemeColour(colour) { return { type: CHANGE_THEME_COLOUR, colour } diff --git a/source/components/News.css b/source/components/Banner.css similarity index 68% rename from source/components/News.css rename to source/components/Banner.css index 06b5dc9fa..ac14b659b 100644 --- a/source/components/News.css +++ b/source/components/Banner.css @@ -1,17 +1,19 @@ -.news-header { +.banner { display: flex; align-items: center; - max-width: 30em; margin: 0 auto; + margin-top: 1em; + width: 40em; justify-content: center; - animation: fade-in 2s; + animation: fade-in 1s; } -.news-header p { +.banner p { + text-align: center; color: #4b4b66; font-size: 85%; } -.news-header i { +.banner i { margin-right: 1em; } diff --git a/source/components/Banner.js b/source/components/Banner.js new file mode 100644 index 000000000..b974289c0 --- /dev/null +++ b/source/components/Banner.js @@ -0,0 +1,48 @@ +/* @flow */ + +import React from 'react' +import type { Node } from 'react' +import { connect } from 'react-redux' +import { compose } from 'ramda' +import withColours from './withColours' +import './Banner.css' +import type { State } from '../types/State' + +type PropTypes = { + hidden: boolean, + fontAwesomeIcon: string, + children: Node +} + +type ConnectedPropTypes = PropTypes & { + colours: { textColourOnWhite: string } +} + +let Banner = ({ + hidden, + fontAwesomeIcon, + colours: { textColourOnWhite }, + children +}: ConnectedPropTypes) => + !hidden ? ( +
+