redesign: Login-Seite überarbeitet
- Kacheln untereinander statt nebeneinander angeordnet - Obere blaue Info-Kachel entfernt - Hintergrund auf weiß gesetzt - Login-Formular-Kachel mit weißem Hintergrund - VotianLT-Titel und Anmelden-Chip entfernt - Icon und Titel nebeneinander angeordnet - Größe und Höhe der Kacheln angepasst
This commit is contained in:
2
pom.xml
2
pom.xml
@@ -6,7 +6,7 @@
|
||||
|
||||
<groupId>de.assecutor.votianlt</groupId>
|
||||
<artifactId>votianlt</artifactId>
|
||||
<version>0.9.11</version>
|
||||
<version>0.9.12</version>
|
||||
|
||||
<packaging>jar</packaging>
|
||||
|
||||
|
||||
@@ -158,7 +158,9 @@ vaadin-app-layout::part(content) {
|
||||
box-sizing: border-box;
|
||||
padding: 0;
|
||||
gap: 1rem;
|
||||
background: transparent;
|
||||
background: #ffffff !important;
|
||||
min-height: 100vh;
|
||||
min-height: 100dvh;
|
||||
}
|
||||
|
||||
.data-view,
|
||||
@@ -467,12 +469,13 @@ vaadin-vertical-layout.admin-form-view {
|
||||
|
||||
.login-view {
|
||||
padding-inline: 0;
|
||||
background: var(--app-shell-background) !important;
|
||||
}
|
||||
|
||||
.login-shell {
|
||||
width: min(1120px, 100%);
|
||||
width: min(750px, 100%);
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1.15fr) minmax(360px, 440px);
|
||||
grid-template-columns: 1fr;
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
@@ -488,7 +491,7 @@ vaadin-vertical-layout.admin-form-view {
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
gap: 1rem;
|
||||
min-height: 560px;
|
||||
min-height: 280px;
|
||||
padding: clamp(1.8rem, 4vw, 3rem);
|
||||
border: 1px solid rgba(255, 255, 255, 0.14);
|
||||
background: linear-gradient(140deg, #081224 0%, #173d8d 52%, #0f766e 100%);
|
||||
@@ -523,11 +526,14 @@ vaadin-vertical-layout.admin-form-view {
|
||||
width: 100%;
|
||||
padding: clamp(1.35rem, 3vw, 2rem);
|
||||
border: 1px solid var(--app-border-strong);
|
||||
background: rgba(255, 255, 255, 0.88);
|
||||
backdrop-filter: blur(20px);
|
||||
background: #ffffff;
|
||||
box-shadow: var(--app-shadow-lg);
|
||||
}
|
||||
|
||||
.login-card vaadin-login-form-wrapper {
|
||||
background: #ffffff !important;
|
||||
}
|
||||
|
||||
.login-card-title {
|
||||
margin: 0;
|
||||
color: var(--app-text-strong);
|
||||
|
||||
@@ -14,6 +14,7 @@ import com.vaadin.flow.component.login.LoginI18n;
|
||||
import com.vaadin.flow.component.textfield.TextField;
|
||||
import com.vaadin.flow.component.notification.Notification;
|
||||
import com.vaadin.flow.component.orderedlayout.FlexComponent;
|
||||
import com.vaadin.flow.component.orderedlayout.HorizontalLayout;
|
||||
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
|
||||
import com.vaadin.flow.router.AfterNavigationEvent;
|
||||
import com.vaadin.flow.router.AfterNavigationObserver;
|
||||
@@ -98,9 +99,6 @@ public class LoginView extends VerticalLayout implements BeforeEnterObserver, Af
|
||||
loginForm.setForgotPasswordButtonVisible(true);
|
||||
loginForm.addForgotPasswordListener(e -> UI.getCurrent().navigate(ForgotPasswordRequestView.class));
|
||||
|
||||
H1 title = new H1(getTranslation("login.votianlt"));
|
||||
title.addClassName("login-card-title");
|
||||
|
||||
Button registerButton = new Button(getTranslation("login.register"), e -> UI.getCurrent().navigate("register"));
|
||||
registerButton.addThemeVariants(ButtonVariant.LUMO_TERTIARY);
|
||||
registerButton.addClassName("login-register-button");
|
||||
@@ -117,27 +115,10 @@ public class LoginView extends VerticalLayout implements BeforeEnterObserver, Af
|
||||
loginLayout.setAlignItems(FlexComponent.Alignment.CENTER);
|
||||
loginLayout.addClassName("login-card");
|
||||
|
||||
loginLayout.add(flashBox, title, loginForm, twoFaField, verify2faButton, registerButton, versionSpan);
|
||||
loginLayout.add(flashBox, loginForm, twoFaField, verify2faButton, registerButton, versionSpan);
|
||||
loginLayout.setPadding(true);
|
||||
|
||||
Div loginHighlight = new Div();
|
||||
loginHighlight.addClassName("login-highlight");
|
||||
|
||||
Span loginEyebrow = new Span(getTranslation("login.title"));
|
||||
loginEyebrow.addClassName("eyebrow-chip");
|
||||
|
||||
Icon introIcon = VaadinIcon.CUBES.create();
|
||||
introIcon.addClassName("login-highlight-icon");
|
||||
|
||||
H1 introTitle = new H1(getTranslation("login.votianlt"));
|
||||
introTitle.addClassName("login-highlight-title");
|
||||
|
||||
Paragraph introText = new Paragraph(getTranslation("start.hero.description"));
|
||||
introText.addClassName("login-highlight-text");
|
||||
|
||||
loginHighlight.add(loginEyebrow, introIcon, introTitle, introText);
|
||||
|
||||
Div loginShell = new Div(loginHighlight, loginLayout);
|
||||
Div loginShell = new Div(loginLayout);
|
||||
loginShell.addClassName("login-shell");
|
||||
|
||||
add(loginShell);
|
||||
|
||||
@@ -3,7 +3,6 @@ package de.assecutor.votianlt.pages.view;
|
||||
import com.vaadin.flow.component.button.Button;
|
||||
import com.vaadin.flow.component.button.ButtonVariant;
|
||||
import com.vaadin.flow.component.html.H1;
|
||||
import com.vaadin.flow.component.html.H2;
|
||||
import com.vaadin.flow.component.notification.Notification;
|
||||
import com.vaadin.flow.component.orderedlayout.FlexComponent;
|
||||
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
|
||||
@@ -81,9 +80,6 @@ public class RegisterView extends VerticalLayout implements HasDynamicTitle {
|
||||
H1 title = new H1(getTranslation("register.title"));
|
||||
title.addClassName("form-title");
|
||||
|
||||
H2 subtitle = new H2(getTranslation("register.subtitle"));
|
||||
subtitle.addClassName("form-subtitle");
|
||||
|
||||
// Formularfelder
|
||||
emailField = new TextField(getTranslation("register.email"));
|
||||
emailField.setWidthFull();
|
||||
@@ -204,7 +200,7 @@ public class RegisterView extends VerticalLayout implements HasDynamicTitle {
|
||||
form.add(backButton);
|
||||
form.setColspan(backButton, 2);
|
||||
|
||||
container.add(title, subtitle, form);
|
||||
container.add(title, form);
|
||||
return container;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user