{% block title %} Login {% endblock %}

{% block content %}
<div class="login-content container" style="max-width: 800px;">
	<div class="row" style="margin-top: 70px; margin-bottom: 20px">
		<div class="col-sm-offset-1 col-sm-10">
			<div class="panel panel-default">
				<div class="panel-heading">
					<h4><i class="icon-lock"></i> {{ _("Login") }}</h4>
				</div>
				<div class="panel-body row" style="padding: 30px">
					<div class="col-sm-6 login-wrapper">
						<p id="login_message" class="alert alert-warning" 
							style="display: none;"></p>
						<div class="form-group">
							<input id="login_id" type="text"
								class="form-control" placeholder="Login Email Id">
						</div>
						<div class="form-group" id="full-name-row" style="display: none;">
							<input id="full_name" type="text"
								class="form-control" placeholder="Your Full Name">
						</div>
						<div class="form-group" id="password-row">
							<input id="pass" type="password"
								class="form-control" placeholder="Password">
						</div>
						<div class="form-group">
							<button type="submit" id="login_btn" 
								class="btn btn-primary">{{ _("Login") }}</button>
							<img src="/assets/webnotes/images/ui/button-load.gif" id="login-spinner" 
								style="display: none;">
						</div>
						<p id="forgot-link"></p>
					</div>
					<div class="col-sm-6">
						<p id="switch-view"></p>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<script>
	{% include "templates/includes/login.js" %}
</script>
{% endblock %}