Pear-Trading/Foodloop-Server
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Started working on registration page on website, with validation

Browse source
This commit is contained in:
Tom Bloor 2017-04-08 18:25:34 +01:00
parent cb9819aa2e
commit 0a32b05b6c
6 changed files with 151 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

20
templates/layouts/default.html.ep
View file

@ -14,6 +14,26 @@
%= content_for 'css';
</head>
<body>
<nav class="navbar navbar-toggleable-md fixed-top navbar-inverse bg-primary">
<button class="navbar-toggler navbar-toggler-right"
type="button"
data-toggle="collapse"
data-target="#navbarNav"
aria-controls="navbarNav"
aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<a class="navbar-brand" href="<%= url_for '/home' %>">LocalLoop</a>
<div class="collapse navbar-collapse" id="navbarNav">
<div class="navbar-nav ml-auto">
<a class="nav-item nav-link<%= title eq 'Login' ? ' active' : '' %>" href="<%= url_for '/' %>">Login</a>
<a class="nav-item nav-link<%= title eq 'Register' ? ' active' : '' %>" href="<%= url_for '/register' %>">Register</a>
</div>
</div>
</nav>
<%= content %>
%= content_for 'javascript';
</body>

76
templates/register/index.html.ep Normal file
View file

@ -0,0 +1,76 @@
% layout 'default';
% title 'Register';
% content_for css => begin
<style>
body {
background: whitesmoke;
padding-top: 70px;
}
.panel {
background: white;
padding: 16px;
-webkit-box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.2);
box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.2);
}
</style>
% end
% content_for javascript => begin
% end
<div class="container">
% if ( my $error = flash 'error' ) {
<div class="alert alert-danger" role="alert">
<strong>Error!</strong> <%= $error %>
</div>
% } elsif ( my $success = flash 'success' ) {
<div class="alert alert-success" role="alert">
<strong>Success!</strong> <%= $success %>
</div>
% }
<div class="row justify-content-center">
<!-- Fluid Gird, this login box stay in the middle of screen -->
<div class="col-8">
<div class="register-form panel">
<form action="<%= url_for %>" method="post">
<div class="form-group">
<label for="register-token">Invitation Token</label>
<input type="text" id="register-token" class="form-control" name="token" required>
</div>
<div class="form-group">
<label for="register-name">Full Name</label>
<input type="text" id="register-name" class="form-control" name="name" required>
</div>
<div class="form-group">
<label for="register-email">Email Address</label>
<input type="email" id="register-email" class="form-control" name="email" required>
</div>
<div class="form-group">
<label for="register-postcode">Postcode</label>
<input type="text" id="register-postcode" class="form-control" name="postcode" required>
</div>
<div class="form-group">
<label for="register-age">Age Range</label>
<select id="register-age" class="form-control" name="agerange">
% for my $agerange ( @$ageranges ) {
<option value="<%= $agerange->{agerangeid} %>"><%= $agerange->{agerangestring} %></option>
% }
</select>
</div>
<div class="form-group">
<label for="login-password">Password</label>
<input type="password" id="login-password" class="form-control" name="password" required>
</div>
<div class="form-group">
<label for="login-password">Confirm Password</label>
<input type="password" id="login-password" class="form-control" name="password2" required>
</div>
<input type="submit" class="btn btn-block btn-primary" value="Register">
</form>
</div>
</div>
</div>
</div><!-- Container fluid-->

5
templates/root/index.html.ep
View file

@ -1,5 +1,5 @@
% layout 'default';
% title 'LocalLoop Admin - Login';
% title 'Login';
% content_for css => begin
<style>
body {
@ -22,9 +22,6 @@ body {
% end
% content_for javascript => begin
% end
<nav class="navbar fixed-top navbar-inverse bg-primary">
<a class="navbar-brand" href="#"><%= title %></a>
</nav>
<div class="container-fluid">
<div class="row justify-content-center">
<!-- Fluid Gird, this login box stay in the middle of screen -->