const { Component } = require("inferno");

module.exports = class extends Component {
	render() {
		const { config, theme, url_for } = this.props;

		return (
			<div id="nexmoe-background">
				<div
					class="nexmoe-bg"
					style={`background-image: url(${theme.background.path})`}
				></div>
				<div class="mdui-appbar mdui-shadow-0">
					<div class="mdui-toolbar">
						<a
							mdui-drawer="{target: '#drawer', swipe: true}"
							title="menu"
							class="mdui-btn mdui-btn-icon mdui-ripple"
						>
							<i class="mdui-icon nexmoefont icon-menu"></i>
						</a>
						<div class="mdui-toolbar-spacer"></div>
						<a
							href={url_for()}
							title={config.author || config.title}
							class="mdui-btn mdui-btn-icon"
						>
							<img
								src={theme.avatar }
								alt={config.author || config.title}
							/>
						</a>
					</div>
				</div>
			</div>
		);
	}
};