import * as React from 'react';
import { Colors } from '../../../../../models/colors';
import { footer, errorMessage } from './footer.style';

const MobileFooter = (props: {
	min: string;
	max: string;
	palette: Colors;
	errorMessage?: string;
}) => {
	return (
		<footer className={footer(props.palette)}>
			<span>{props.min}</span>
			{props.errorMessage && (
				<span className={errorMessage(props.palette)}>{props.errorMessage}</span>
			)}
			<span>{props.max}</span>
		</footer>
	);
};

export default MobileFooter;