pierre/BasicOIDC
1
0
Fork 0
Code Issues Pull Requests Projects Releases 1 Wiki Activity

Display login page

Browse Source
This commit is contained in:
Pierre HUBERT
2022-03-30 11:00:20 +02:00
parent 5bc4af399d
commit 70aaa1ff44
6 changed files with 171 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
assets/css/base_login_page.css Normal file
View File

@@ -0,0 +1,57 @@
html,
body {
height: 100%;
}
body {
display: flex;
align-items: center;
padding-top: 40px;
padding-bottom: 40px;
/* background-color: #f5f5f5; */
}
.form-signin {
width: 100%;
max-width: 330px;
padding: 15px;
margin: auto;
}
.form-signin .checkbox {
font-weight: 400;
}
.form-signin .form-floating:focus-within {
z-index: 2;
}
.form-floating:first-child input {
margin-bottom: -1px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.form-floating:not(:first-child):not(:last-child) input {
margin-bottom: -1px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.form-floating:last-child input {
margin-bottom: 10px;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.form-control {
background-color: var(--bs-gray-700);
color: var(--bs-gray-100);
}
.form-control:focus {
background-color: var(--bs-gray-600);
color: var(--bs-gray-100);
}

5
assets/css/login.css
View File

@@ -1,5 +0,0 @@
/**
* Login page
*
* @author Pierre Hubert
*/

5
assets/js/base_login_page.js Normal file
View File

@@ -0,0 +1,5 @@
// Remove un-used alerts
document.querySelectorAll("[role=alert]").forEach(el => {
if(el.innerHTML.trim() === "")
el.remove();
})

28
src/controllers/login_controller.rs
View File

@@ -1,15 +1,35 @@
use actix_web::Responder; use actix_web::{HttpResponse, Responder};
use askama::Template; use askama::Template;
use crate::constants::APP_NAME; use crate::constants::APP_NAME;
#[derive(Template)]
#[template(path = "base_login_page.html")]
struct BaseLoginPage {
danger: String,
success: String,
page_title: &'static str,
app_name: &'static str,
}
#[derive(Template)] #[derive(Template)]
#[template(path = "login.html")] #[template(path = "login.html")]
struct LoginTemplate<'a> { struct LoginTemplate {
app_name: &'a str, _parent: BaseLoginPage,
mail: String,
} }
pub async fn login_route() -> impl Responder { pub async fn login_route() -> impl Responder {
LoginTemplate { app_name: APP_NAME }.render().unwrap() HttpResponse::Ok()
.content_type("text/html")
.body(LoginTemplate {
_parent: BaseLoginPage {
page_title: "Login",
danger: "".to_string(),
success: "".to_string(),
app_name: APP_NAME,
},
mail: "".to_string()
}.render().unwrap())
} }

63
templates/base_login_page.html Normal file
View File

@@ -0,0 +1,63 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Auth service">
<title>{{ app_name }} - {{ page_title }}</title>
<!-- Bootstrap core CSS -->
<link href="/assets/css/bootstrap.css" rel="stylesheet" crossorigin="anonymous"/>
<!-- Favicons -->
<meta name="theme-color" content="#7952b3">
<style>
.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
@media (min-width: 768px) {
.bd-placeholder-img-lg {
font-size: 3.5rem;
}
}
</style>
<!-- Custom styles for this template -->
<link href="/assets/css/base_login_page.css" rel="stylesheet">
</head>
<body class="text-center">
<main class="form-signin">
<h1 class="h3 mb-3 fw-normal">{{ page_title }}</h1>
<div class="alert alert-danger" role="alert">
{{ danger }}
</div>
<div class="alert alert-success" role="alert">
{{ success }}
</div>
{% block content %}
TO_REPLACE
{% endblock content %}
<p class="mt-5 mb-3 text-muted">&copy; 2022 -
<script>document.write(new Date().getFullYear())</script>
</p>
</main>
<script src="/assets/js/base_login_page.js"></script>
</body>
</html>

23
templates/login.html
View File

@@ -1 +1,22 @@
here comes the login page for {{ app_name }} {% extends "base_login_page.html" %}
{% block content %}
<form action="/login" method="post">
<div>
<div class="form-floating">
<input name="mail" type="text" required class="form-control" id="floatingName" placeholder="unsername"
value="{{ mail }}">
<label for="floatingName">Email address or username</label>
</div>
<div class="form-floating">
<input name="password" type="password" required class="form-control" id="floatingPassword"
placeholder="Password">
<label for="floatingPassword">Password</label>
</div>
</div>
<button class="w-100 btn btn-lg btn-primary" type="submit">Sign in</button>
</form>
{% endblock content %}