{% extends 'templates/base.html' %}
{% block title %}{{super()}} | Pro{% endblock %}

{% block head %}{{super()}}
<style>
	p { margin-bottom: 18px; }
	.main.btn, #already-pro
		{ width: 40vw; }
</style>
{% endblock %}

{% block main %}
<section class='dark'>
	<div class='container'>
		
		<h1>Tracman Pro</h1>
		<h3>A word from the developer</h3>

		<p>Hi Folks, </p>

		<p>Glad you're enjoying my website and app.  I made the whole thing, from front to backend, and I'm really proud of it!  However, I'm a long-haul trucker by day and coding is just a hobby. I don't make any money off this website, and I pay the server fees out of my own pocket.  Do you pity me enough to donate some <a href="https://cash.me/$KeithIrwin">money</a> or <a href="bitcoin:16KY9k6qdXqDD3mWwr8hrD7ky18AqYSJDo?label=tracman">bitcoin</a>?  </p>

		<p>To make a little money off this service, I'm going to be offering a pro version with more features.  It'll be cheap, probably $5 per month.  While Tracman is in beta, you can test the pro version for free.  Be sure to <a href="https://github.com/Tracman-org/Server/issues/new">inform me about any bugs</a> you encounter.  And keep in mind that at some point, when we launch out of beta, Tracman Pro will <i>not</i> be free and you will <b>lose</b> your pro membership unless start paying for it. </p>

		<p>That said, just click the button below to try pro out.  </p>

		<p>Cheers, <br>
		<a href="https://www.keithirwin.us/">Keith Irwin</a></p>

		<form class='flex' action="#" method="POST">
			<input type="hidden" name="_csrf" value="{{csrfToken}}">
			{% if user.isPro %}
				<div id='already-pro' class='inline-block alert alert-success'>
					<i class="fa fa-check-circle"></i>
					<span class='text'>You are already pro! </span>
				</div>
				<a class='btn' href="javascript:history.go(-1)">go back</a>
			{% else %}
				<input type="submit" class='btn main' value="Go Pro"></input>
				<a class='btn' href="javascript:history.go(-1)">go home</a>
			{% endif %}
		</form>

	</div>
</section>
{% endblock %}