style(next): tweak the style of the login page

This commit is contained in:
Adorian Doran 2025-03-08 20:40:00 +02:00
parent fc87f64840
commit d17513bec0
2 changed files with 42 additions and 7 deletions

View File

@ -86,6 +86,40 @@ body.background-effects.platform-win32.layout-vertical #vertical-main-container
border-right: 2px solid var(--left-pane-collapsed-border-color);
}
/*
* Log in page
*/
.login-page {
display: flex;
height: 100%;
flex-direction: column;
justify-content: center;
}
.login-page > div {
padding-top: 0 !important;
padding-bottom: 20vh;
}
.login-page h1 {
margin-bottom: .5em;
font-weight: 300;
color: var(--muted-text-color);
}
.login-page .form-group {
margin-top: 8px;
}
.login-page .alert {
margin: 0;
border: unset;
padding: 8px 0 0 0;
font-size: .85em;
color: var(--dropdown-item-icon-destructive-color) !important;
}
/*
* Global menu
*/

View File

@ -13,17 +13,11 @@
<link rel="stylesheet" href="<%= assetPath %>/stylesheets/style.css">
</head>
<body>
<div class="container">
<div class="container login-page">
<div class="col-xs-12 col-sm-10 col-md-6 col-lg-4 col-xl-4 mx-auto pt-4">
<img class="img-fluid d-block mx-auto" style="height: 8rem;" src="<%= assetPath %>/images/icon-color.svg" aria-hidden="true">
<h1 class="text-center"><%= t("login.heading") %></h1>
<% if (failedAuth) { %>
<div class="alert alert-warning">
<%= t("login.incorrect-password") %>
</div>
<% } %>
<form action="login" method="POST">
<div class="form-group">
<label for="password"><%= t("login.password") %></label>
@ -31,6 +25,13 @@
<input id="password" name="password" placeholder="" class="form-control" type="password" autofocus>
</div>
</div>
<% if (failedAuth) { %>
<div class="alert alert-warning">
<%= t("login.incorrect-password") %>
</div>
<% } %>
<div class="form-group">
<div class="checkbox">
<label class="tn-checkbox">