front end fixes

This commit is contained in:
William Mantly 2020-07-01 16:08:19 -04:00
parent b8f632e644
commit fb3e6ca7dc
11 changed files with 92 additions and 82 deletions

View File

@ -12,7 +12,7 @@ var http = require('http');
* Get port from environment and store in Express. * Get port from environment and store in Express.
*/ */
var port = normalizePort(process.env.NODE_PORT || '3000'); var port = normalizePort(process.env.NODE_PORT || app.conf.port || '3000');
app.set('port', port); app.set('port', port);
/** /**

View File

@ -1,13 +1,19 @@
.hover-effect { *{
transition: all .5s ease; transition: all .4s ease;
} }
.hover-effect:hover { a:hover, button:hover, div.form-group:hover{
color: darkblue; color: inherit;
transition: all .5s ease; transition: all .4s ease;
background-color: inherit; background-color: inherit;
-ms-transform: scale(1.1); -ms-transform: scale(1.05);
-webkit-transform: scale(1.1); -webkit-transform: scale(1.05);
transform: scale(1.1); /* Standard syntax */ transform: scale(1.05); /* Standard syntax */
z-index: 999999;
}
div.card-body{
padding-left: 1.5em;
padding-right: 1.5em;
} }

View File

@ -20,7 +20,7 @@
return; return;
} }
$( '<b>' ).html( ' - ' + error_message ).appendTo( $input.parents('.form-group').children( 'label' ) ); $( '<b style="color:#dc3545" class="jvalidate-error">' ).html( ' - ' + error_message ).appendTo( $input.parents('.form-group').children( 'label' ) );
$input.addClass("is-invalid"); $input.addClass("is-invalid");
failedCount++; failedCount++;
return false; return false;
@ -35,7 +35,7 @@
value = $input.val(), //link to input value value = $input.val(), //link to input value
rule = attr[0]; rule = attr[0];
$input.parents('.form-group').children( 'label' ).children( 'b' ).remove(); //removes old error $input.parents('.form-group').children( 'label' ).children( '.jvalidate-error' ).remove(); //removes old error
$input.removeClass( "is-invalid" ); //removes is-invalid class $input.removeClass( "is-invalid" ); //removes is-invalid class
//checks if field is required, and length //checks if field is required, and length

View File

@ -52,6 +52,7 @@ router.post('/resetpassword/:token', async function(req, res, next){
if(token.is_valid && 86400000+Number(token.created_on) > (new Date).getTime()){ if(token.is_valid && 86400000+Number(token.created_on) > (new Date).getTime()){
let user = await User.get(token.created_by); let user = await User.get(token.created_by);
await user.setPassword(req.body); await user.setPassword(req.body);
token.update({is_valid: false});
return res.json({ return res.json({
message: 'Password has been changed.' message: 'Password has been changed.'
}); });

View File

@ -1,7 +1,7 @@
<%- include('top') %> <%- include('top') %>
<script id="rowTemplate" type="text/html"> <script id="rowTemplate" type="text/html">
<p> <p>
<div class="card shadow-lg"> <div class="card shadow">
<div class="card-header"> <div class="card-header">
<i class="fad fa-users-class"></i> <i class="fad fa-users-class"></i>
Group: {{ cn }} Group: {{ cn }}
@ -13,7 +13,7 @@
<p> <p>
<ul class="list-group"> <ul class="list-group">
{{ #member }} {{ #member }}
<li class="list-group-item"> <li class="list-group-item shadow">
<i class="fad fa-user"></i> {{ uid }} <i class="fad fa-user"></i> {{ uid }}
<button type="button" action="group/{{groupCN}}/{{uid}}" method="delete" onclick="formAJAX(this)" evalAJAX="tableAJAX(data.message)" class="btn btn-sm btn-danger float-right"> <button type="button" action="group/{{groupCN}}/{{uid}}" method="delete" onclick="formAJAX(this)" evalAJAX="tableAJAX(data.message)" class="btn btn-sm btn-danger float-right">
<i class="fad fa-user-slash"></i> <i class="fad fa-user-slash"></i>
@ -26,7 +26,7 @@
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fad fa-user-plus"></i> <i class="fad fa-user-plus"></i>
</button> </button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton"> <div class="dropdown-menu shadow-lg" aria-labelledby="dropdownMenuButton">
{{ #toAdd }}{{#.}} {{ #toAdd }}{{#.}}
<a class="dropdown-item" action="group/{{groupCN}}/{{uid}}" method="put" onclick="formAJAX(this)" evalAJAX="tableAJAX(data.message)"> <a class="dropdown-item" action="group/{{groupCN}}/{{uid}}" method="put" onclick="formAJAX(this)" evalAJAX="tableAJAX(data.message)">
<i class="fad fa-user"></i> {{uid}} <i class="fad fa-user"></i> {{uid}}
@ -103,12 +103,12 @@
<form action="group/" method="post" onsubmit="formAJAX(this)" evalAJAX="tableAJAX('')"> <form action="group/" method="post" onsubmit="formAJAX(this)" evalAJAX="tableAJAX('')">
<div class="form-group"> <div class="form-group">
<label class="control-label">Name</label> <label class="control-label">Name</label>
<input type="text" class="form-control" name="name" placeholder="app_gitea_admin" validate=":3" /> <input type="text" class="form-control shadow" name="name" placeholder="app_gitea_admin" validate=":3" />
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="control-label">Description</label> <label class="control-label">Description</label>
<textarea class="form-control" name="description" placeholder="Admin group for gitea app" validate=":3"></textarea> <textarea class="form-control shadow" name="description" placeholder="Admin group for gitea app" validate=":3"></textarea>
</div> </div>
<button type="submit" class="btn btn-outline-dark">Add</button> <button type="submit" class="btn btn-outline-dark">Add</button>

View File

@ -51,8 +51,9 @@
Reset Password for {{uid}} Reset Password for {{uid}}
</h3> </h3>
<form action="user/{{uid}}/password" method="put" onsubmit="formAJAX(this)" class="form-group"> <form action="user/{{uid}}/password" method="put" onsubmit="formAJAX(this)" class="form-group">
<div class="form-group">
<label class="control-label">Password</label> <label class="control-label">Password</label>
<div class="input-group mb-3"> <div class="input-group mb-3 shadow">
<div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text" ><i class="fad fa-key"></i></span> <span class="input-group-text" ><i class="fad fa-key"></i></span>
</div> </div>
@ -61,14 +62,14 @@
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="control-label">Again</label> <label class="control-label">Again</label>
<div class="input-group mb-3"> <div class="input-group mb-3 shadow">
<div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text" ><i class="fad fa-key"></i></span> <span class="input-group-text" ><i class="fad fa-key"></i></span>
</div> </div>
<input type="password" name="password" class="form-control" placeholder="hunter123!" validate="eq:userPassword" /> <input type="password" name="password" class="form-control" placeholder="hunter123!" validate="eq:userPassword" />
</div> </div>
</div> </div>
<button type="submit" class="btn btn-outline-dark">Change</button> <button type="submit" class="btn btn-outline-secondary shadow">Change</button>
</form> </form>
</script> </script>
@ -162,17 +163,18 @@
<div class="row" style="display:none"> <div class="row" style="display:none">
<div class="col-md-4"> <div class="col-md-4">
<div class="shadow-lg card mb-3 card-default"> <div class="shadow-lg card mb-3 card-default">
<div class="card-header"> <div class="card-header shadow">
<i class="fas fa-user-plus"></i> <i class="fas fa-user-plus"></i>
Invite User Invite User
<div class="float-right"> <div class="float-right">
<i class="far fa-arrows-v"></i> <i class="far fa-arrows-v"></i>
</div> </div>
</div> </div>
<div class="card-header actionMessage" style="display:none"> <div class="card-header shadow actionMessage" style="display:none">
</div> </div>
<div class="card-body"> <div class="card-body">
<button onclick="getInvite(this)">New Invite Token</button>
<button onclick="getInvite(this)" class="shadow">New Invite Token</button>
<div> <div>
<b id="invite_token"></b> <b id="invite_token"></b>
</div> </div>
@ -180,14 +182,14 @@
</div> </div>
</div> </div>
<div class="shadow-lg card mb-3 card-default"> <div class="shadow-lg card mb-3 card-default">
<div class="card-header"> <div class="card-header shadow">
<div class="float-right"> <div class="float-right">
<i class="far fa-arrows-v"></i> <i class="far fa-arrows-v"></i>
</div> </div>
<i class="fad fa-th-list"></i> <i class="fad fa-th-list"></i>
Services Services
</div> </div>
<div class="card-header actionMessage" style="display:none"> <div class="card-header shadow actionMessage" style="display:none">
</div> </div>
<div class="card-body"> <div class="card-body">
<ul class="list-group text-dark"> <ul class="list-group text-dark">
@ -217,14 +219,14 @@
</div> </div>
</div> </div>
<div class="shadow-lg card"> <div class="shadow-lg card">
<div class="card-header"> <div class="card-header shadow">
<i class="fad fa-undo-alt"></i> <i class="fad fa-undo-alt"></i>
Password Reset Password Reset
<div class="float-right"> <div class="float-right">
<i class="far fa-arrows-v"></i> <i class="far fa-arrows-v"></i>
</div> </div>
</div> </div>
<div class="card-header actionMessage" style="display:none"> <div class="card-header shadow actionMessage" style="display:none">
</div> </div>
<div id="passwordReset" class="card-body"> <div id="passwordReset" class="card-body">
@ -233,37 +235,37 @@
</div> </div>
<div class="col-md-8"> <div class="col-md-8">
<div id="userProfile" class="shadow-lg card card-default mb-8"> <div id="userProfile" class="shadow-lg card card-default mb-8">
<div class="card-header"> <div class="card-header shadow">
<i class="fad fa-id-card"></i> <i class="fad fa-id-card"></i>
Profile Profile
<div class="hover-effect float-right"> <div class="float-right">
<i class="far fa-arrows-v"></i> <i class="far fa-arrows-v"></i>
</div> </div>
</div> </div>
<div class="card-header actionMessage" style="display:none"> <div class="card-header shadow actionMessage" style="display:none">
</div> </div>
<div class="card-body"> <div class="card-body">
<!-- User profile inserted by JS --> <!-- User profile inserted by JS -->
</div> </div>
<div class=card-footer> <div class="card-footer">
<button type="button" onclick="editUser()" class="btn btn-warning btn-lg"> <button type="button" onclick="editUser()" class="btn btn-warning btn-lg shadow ">
<i class="fad fa-user-edit"></i> <i class="fad fa-user-edit"></i>
</button> </button>
<button type="button" onclick="app.user.remove({uid: currentUser.uid}, function(){app.util.actionMessage('username {{uid}} delete.', $(this), 'danger')})" class="btn btn-danger btn-lg float-right"> <button type="button" onclick="app.user.remove({uid: currentUser.uid}, function(){app.util.actionMessage('username {{uid}} delete.', $(this), 'danger')})" class="shadow btn btn-danger btn-lg float-right">
<i class="fad fa-user-slash"></i> <i class="fad fa-user-slash"></i>
</button> </button>
</div> </div>
</div> </div>
<div id="editProfile" class="shadow-lg card card-default mb-8" style="display:none"> <div id="editProfile" class="shadow-lg card card-default mb-8" style="display:none">
<div class="card-header"> <div class="card-header shadow">
<i class="fad fa-id-card"></i> <i class="fad fa-id-card"></i>
Edit Profile Edit Profile
<div class="hover-effect float-right"> <div class="float-right">
<i class="far fa-arrows-v"></i> <i class="far fa-arrows-v"></i>
</div> </div>
</div> </div>
<div class="card-header actionMessage" style="display:none"> <div class="card-header shadow actionMessage" style="display:none">
</div> </div>
<div class="card-body"> <div class="card-body">
<div id="tableAJAX"> <div id="tableAJAX">
@ -274,14 +276,14 @@
<br /> <br />
<div class="shadow-lg card card-default mb-8"> <div class="shadow-lg card card-default mb-8">
<div class="card-header"> <div class="card-header shadow">
<i class="fad fa-id-card"></i> <i class="fad fa-id-card"></i>
My groups My groups
<div class="hover-effect float-right"> <div class="float-right">
<i class="far fa-arrows-v"></i> <i class="far fa-arrows-v"></i>
</div> </div>
</div> </div>
<div class="card-header actionMessage" style="display:none"> <div class="card-header shadow actionMessage" style="display:none">
</div> </div>
<div class="card-body" style="padding-bottom:0"> <div class="card-body" style="padding-bottom:0">
<div class="table-responsive"> <div class="table-responsive">

View File

@ -15,10 +15,10 @@
<div class="row"> <div class="row">
<div class="card-deck"> <div class="card-deck">
<div class="shadow-lg card mb-3"> <div class="shadow-lg card mb-3">
<div class="card-header"> <div class="card-header shadow">
Password Log in Password Log in
</div> </div>
<div class="card-header actionMessage" style="display:none"> <div class="card-header shadow actionMessage" style="display:none">
</div> </div>
<div class="card-body"> <div class="card-body">
<form action="auth/login" onsubmit="formAJAX(this)" evalAJAX="app.auth.setToken(data.token);window.location.href = app.util.getUrlParameter('redirect') || '/';"> <form action="auth/login" onsubmit="formAJAX(this)" evalAJAX="app.auth.setToken(data.token);window.location.href = app.util.getUrlParameter('redirect') || '/';">
@ -26,7 +26,7 @@
<div class="form-group"> <div class="form-group">
<label class="control-label">User name</label> <label class="control-label">User name</label>
<div class="input-group mb-3"> <div class="input-group mb-3 shadow">
<div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text" ><i class="fad fa-user"></i></span> <span class="input-group-text" ><i class="fad fa-user"></i></span>
</div> </div>
@ -36,7 +36,7 @@
<div class="form-group"> <div class="form-group">
<label class="control-label">Password</label> <label class="control-label">Password</label>
<div class="input-group mb-3"> <div class="input-group mb-3 shadow">
<div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text" ><i class="fad fa-key"></i></span> <span class="input-group-text" ><i class="fad fa-key"></i></span>
</div> </div>
@ -49,10 +49,10 @@
</div> </div>
</div> </div>
<div class="shadow-lg card border-danger mb-3"> <div class="shadow-lg card border-danger mb-3">
<div class="card-header"> <div class="card-header shadow">
Social Login Social Login
</div> </div>
<div class="card-header actionMessage" style="display:none"> <div class="card-header shadow actionMessage" style="display:none">
</div> </div>
<div class="card-body"> <div class="card-body">
<h3>Coming soon!</h3> <h3>Coming soon!</h3>
@ -66,10 +66,10 @@
</div> </div>
</div> </div>
<div class="shadow-lg card mb-3"> <div class="shadow-lg card mb-3">
<div class="card-header"> <div class="card-header shadow">
Password Reset Password Reset
</div> </div>
<div class="card-header actionMessage" style="display:none"> <div class="card-header shadow actionMessage" style="display:none">
</div> </div>
<div class="card-body"> <div class="card-body">
<p> <p>
@ -83,7 +83,7 @@
<div class="form-group"> <div class="form-group">
<label class="control-label">Email</label> <label class="control-label">Email</label>
<div class="input-group mb-3"> <div class="input-group mb-3 shadow">
<div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text" ><i class="fad fa-at"></i></span> <span class="input-group-text" ><i class="fad fa-at"></i></span>
</div> </div>
@ -97,5 +97,4 @@
</div> </div>
</div> </div>
</div> </div>
</div>
<%- include('bottom') %> <%- include('bottom') %>

View File

@ -6,17 +6,18 @@
</script> </script>
<div class="row" style="display:none"> <div class="row" style="display:none">
<div class="col-md-12"> <div class="col-md-12">
<div class="card shadow-lg"> <div class="card mb-3 shadow-lg">
<div class="card-header"> <div class="card-header">
Password reset Password reset
</div> </div>
<div class="card-header actionMessage" style="display:none"> <div class="card-header shadow actionMessage" style="display:none">
</div> </div>
<div class="card-body"> <div class="card-body">
<p>
<form action="auth/resetpassword/<%= token.token%>" method="post" onsubmit="formAJAX(this)"> <form action="auth/resetpassword/<%= token.token%>" method="post" onsubmit="formAJAX(this)">
<div class="form-group"> <div class="form-group">
<label class="control-label">Password</label> <label class="control-label">Password</label>
<div class="input-group mb-3"> <div class="input-group mb-3 shadow">
<div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text" ><i class="fad fa-key"></i></span> <span class="input-group-text" ><i class="fad fa-key"></i></span>
</div> </div>
@ -25,7 +26,7 @@
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="control-label">Again</label> <label class="control-label">Again</label>
<div class="input-group mb-3"> <div class="input-group mb-3 shadow">
<div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text" ><i class="fad fa-key"></i></span> <span class="input-group-text" ><i class="fad fa-key"></i></span>
</div> </div>
@ -34,6 +35,7 @@
</div> </div>
<button type="submit" class="btn btn-outline-dark">Change</button> <button type="submit" class="btn btn-outline-dark">Change</button>
</form> </form>
</p>
</div> </div>
</div> </div>
</div> </div>

View File

@ -30,9 +30,9 @@
<header class="shadow d-flex flex-column flex-md-row align-items-center p-3 px-md-4 mb-3 bg-white border-bottom shadow-sm"> <header class="shadow d-flex flex-column flex-md-row align-items-center p-3 px-md-4 mb-3 bg-white border-bottom shadow-sm">
<h5 class="hover-effect my-0 mr-md-auto font-weight-normal">SSO Manager - Theta 42</h5> <h5 class="hover-effect my-0 mr-md-auto font-weight-normal">SSO Manager - Theta 42</h5>
<nav class="my-2 my-md-0 mr-md-3"> <nav class="my-2 my-md-0 mr-md-3">
<a class="hover-effect text-dark p-2" href="/"><i class="fad fa-tachometer-alt-fastest"></i> Home</a> <a class="text-dark hover-effect" href="/"><i class="fad fa-tachometer-alt-fastest"></i> Home</a>
<a class="hover-effect text-dark p-2" href="/users"><i class="fad fa-users"></i> Users</a> <a class="text-dark hover-effect" href="/users"><i class="fad fa-users"></i> Users</a>
<a class="hover-effect text-dark p-2" href="/groups"><i class="fad fa-users-class"></i> Groups</a> <a class="text-dark hover-effect" href="/groups"><i class="fad fa-users-class"></i> Groups</a>
</nav> </nav>
<a class="hover-effect btn btn-outline-primary" onclick="app.auth.logOut(e => window.location.href='/')"><i class="fas fa-sign-out"></i> Log Out</a> <a class="hover-effect btn btn-outline-primary" onclick="app.auth.logOut(e => window.location.href='/')"><i class="fas fa-sign-out"></i> Log Out</a>

View File

@ -2,40 +2,40 @@
<input type="hidden" class="form-control" name="delete" value="false" /> <input type="hidden" class="form-control" name="delete" value="false" />
<div class="form-group"> <div class="form-group">
<label class="control-label">First name</label> <label class="control-label">First name</label>
<input type="text" class="form-control" name="givenName" placeholder="John" validate=":3" /> <input type="text" class="form-control shadow" name="givenName" placeholder="John" validate=":3" />
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="control-label">Last name</label> <label class="control-label">Last name</label>
<input type="text" class="form-control" name="sn" placeholder="smith" validate=":3" /> <input type="text" class="form-control shadow" name="sn" placeholder="smith" validate=":3" />
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="control-label">Email</label> <label class="control-label">Email</label>
<input type="text" class="form-control" name="mail" placeholder="jsmith@gmail.com" validate="email:3" /> <input type="text" class="form-control shadow" name="mail" placeholder="jsmith@gmail.com" validate="email:3" />
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="control-label">SSH Public Key</label> <label class="control-label">SSH Public Key</label>
<input type="text" class="form-control" name="sshPublicKey" placeholder="ssh-rsa AAAAB3NzaC1yc2EAAAADAQ..." /> <input type="text" class="form-control shadow" name="sshPublicKey" placeholder="ssh-rsa AAAAB3NzaC1yc2EAAAADAQ..." />
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="control-label">Mobile Phone</label> <label class="control-label">Mobile Phone</label>
<input type="text" class="form-control" name="mobile" placeholder="9175551234" validate=":9" /> <input type="text" class="form-control shadow" name="mobile" placeholder="9175551234" validate=":9" />
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="control-label">Password</label> <label class="control-label">Password</label>
<input type="password" class="form-control" name="userPassword" placeholder="Atleast 5 char. long" validate="password:5"/> <input type="password" class="form-control shadow" name="userPassword" placeholder="Atleast 5 char. long" validate="password:5"/>
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="control-label">Again</label> <label class="control-label">Again</label>
<input type="password" class="form-control" name="passwordMatch" placeholder="Retype password" validate="eq:userPassword"/> <input type="password" class="form-control shadow" name="passwordMatch" placeholder="Retype password" validate="eq:userPassword"/>
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="control-label">User Description (Optional)</label> <label class="control-label">User Description (Optional)</label>
<textarea class="form-control" name="description" placeholder="Admin group for gitea app"></textarea> <textarea class="form-control shadow" name="description" placeholder="Admin group for gitea app"></textarea>
</div> </div>
<button type="submit" class="btn btn-outline-dark">Add</button> <button type="submit" class="btn btn-outline-dark">Add</button>
</form> </form>

View File

@ -1,6 +1,6 @@
<%- include('top') %> <%- include('top') %>
<script id="rowTemplate" type="text/html"> <script id="rowTemplate" type="text/html">
<tr action="user/password/{{ username }}" method="put" evalAJAX="$form.trigger('reset')"> <tr class="shadow-lg" action="user/password/{{ username }}" method="put" evalAJAX="$form.trigger('reset')">
<td> <td>
{{ uidNumber }} {{ uidNumber }}
</td> </td>
@ -77,7 +77,7 @@
<div class="card-body" style="padding-bottom:0"> <div class="card-body" style="padding-bottom:0">
<div class="table-responsive"> <div class="table-responsive">
<table class="table"> <table class="table">
<thead> <thead class="shadow-lg">
<th>id</th> <th>id</th>
<th>uid</th> <th>uid</th>
<th>Name</th> <th>Name</th>