Port the web to bootstrap5

So it is responsive in phones.
This commit is contained in:
Las Zenow 2017-06-08 00:44:35 +00:00
parent 8af2ad3758
commit 6a3da59c75
40 changed files with 1131 additions and 849 deletions

View file

@ -1,51 +1,36 @@
{{template "header.html" .S}}
<script>
$(document).ready(function () {
$("#passCheck").keyup(checkPasswordMatch);
});
function checkPasswordMatch() {
var password = $("#password1").val();
var confirmPassword = $("#password2").val();
var password = document.forms["passwordChange"]["password1"].value;
var confirmPassword = document.forms["passwordChange"]["password2"].value;
if (password != confirmPassword) {
$("#passCheck").removeClass("success");
$("#passCheck").addClass("error");
$("#passCheckHelp").html("Passwords don't match!");
document.getElementById("password2").classList.remove("is-valid");
document.getElementById("password2").classList.add("is-invalid");
} else {
$("#passCheck").removeClass("error");
$("#passCheck").addClass("success");
$("#passCheckHelp").html("");
document.getElementById("password2").classList.remove("is-invalid");
document.getElementById("password2").classList.add("is-valid");
}
}
</script>
<h2>Settings</h2>
<form class="form-horizontal" method="POST" action="/settings/">
<form name="passwordChange" method="POST" action="/settings/">
<legend>Change your pasword</legend>
<div class="control-group">
<label class="control-label" for="currpass">Current password:</label>
<div class="controls">
<input type="password" name="currpass" id="currpass" /><br />
</div>
<div class="mb-3">
<label class="form-label" for="currpass">Current password:</label>
<input class="form-control" type="password" name="currpass" id="currpass" /><br />
</div>
<div class="control-group" id="passCheck">
<label class="control-label" for="password1">New password:</label>
<div class="controls">
<input type="password" name="password1" id="password1" />
</div>
<label class="control-label" for="password2">Confirm password:</label>
<div class="controls">
<input type="password" name="password2" id="password2" />
</div>
<div id="passCheckHelp" class="controls text-error"></div>
<div class="mb-3">
<label class="form-label" for="password1">New password:</label>
<input class="form-control" type="password" name="password1" id="password1" onchange="checkPasswordMatch()" />
<label class="form-label" for="password2">Confirm password:</label>
<input class="form-control" type="password" name="password2" id="password2" onchange="checkPasswordMatch()" />
<div class="invalid-feedback">Passwords don't match!</div>
</div>
<div class="control-group">
<div class="controls">
<button type="submit" class="btn">Change password</button>
</div>
<button type="submit" class="btn btn-primary">Change password</button>
</div>
</form>