refactor: UI-Verbesserungen in Views und Theme-Styles
This commit is contained in:
@@ -118,7 +118,7 @@ vaadin-app-layout::part(content) {
|
||||
.view-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: red;
|
||||
background: transparent;
|
||||
margin: 20px;
|
||||
width: calc(100% - 40px);
|
||||
max-width: calc(100% - 40px);
|
||||
@@ -1581,15 +1581,42 @@ vaadin-grid-tree-toggle[expanded] .nav-expand-icon {
|
||||
|
||||
vaadin-button {
|
||||
font-weight: 700;
|
||||
border-radius: var(--lumo-border-radius-m);
|
||||
transition: transform 0.18s ease, box-shadow 0.18s ease, opacity 0.18s ease;
|
||||
}
|
||||
|
||||
vaadin-button:hover {
|
||||
vaadin-button:not([disabled]):hover {
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
vaadin-button[theme~="primary"] {
|
||||
box-shadow: 0 16px 28px rgba(37, 99, 235, 0.22);
|
||||
box-shadow: 0 8px 20px rgba(37, 99, 235, 0.22);
|
||||
}
|
||||
|
||||
vaadin-button[theme~="primary"]:not([disabled]):hover {
|
||||
box-shadow: 0 12px 28px rgba(37, 99, 235, 0.32);
|
||||
}
|
||||
|
||||
vaadin-button[theme~="primary"][theme~="success"] {
|
||||
box-shadow: 0 8px 20px rgba(5, 150, 105, 0.24);
|
||||
}
|
||||
|
||||
vaadin-button[theme~="primary"][theme~="success"]:not([disabled]):hover {
|
||||
box-shadow: 0 12px 28px rgba(5, 150, 105, 0.34);
|
||||
}
|
||||
|
||||
vaadin-button[theme~="primary"][theme~="error"] {
|
||||
box-shadow: 0 8px 20px rgba(220, 38, 38, 0.24);
|
||||
}
|
||||
|
||||
vaadin-button[theme~="tertiary"][theme~="error"]:not([disabled]):hover {
|
||||
background: rgba(220, 38, 38, 0.08);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
vaadin-button[disabled] {
|
||||
opacity: 0.46;
|
||||
transform: none !important;
|
||||
}
|
||||
|
||||
vaadin-text-field,
|
||||
|
||||
@@ -257,6 +257,7 @@ public class EditAppUserView extends VerticalLayout implements HasUrlParameter<S
|
||||
confirmDeleteButton.addThemeVariants(ButtonVariant.LUMO_ERROR);
|
||||
|
||||
Button cancelDeleteButton = new Button(getTranslation("button.cancel"), e -> confirmDialog.close());
|
||||
cancelDeleteButton.addThemeVariants(ButtonVariant.LUMO_TERTIARY);
|
||||
|
||||
buttonLayout.add(confirmDeleteButton, cancelDeleteButton);
|
||||
buttonLayout.setSpacing(true);
|
||||
|
||||
@@ -194,6 +194,7 @@ public class EditCustomerView extends VerticalLayout implements HasUrlParameter<
|
||||
confirmDeleteButton.addThemeVariants(ButtonVariant.LUMO_ERROR);
|
||||
|
||||
Button cancelDeleteButton = new Button(getTranslation("button.cancel"), e -> confirmDialog.close());
|
||||
cancelDeleteButton.addThemeVariants(ButtonVariant.LUMO_TERTIARY);
|
||||
|
||||
buttonLayout.add(confirmDeleteButton, cancelDeleteButton);
|
||||
buttonLayout.setSpacing(true);
|
||||
|
||||
@@ -43,6 +43,7 @@ public class ForgotPasswordRequestView extends VerticalLayout implements HasDyna
|
||||
emailField.setAutofocus(true);
|
||||
|
||||
Button cancel = new Button("Abbrechen", e -> getUI().ifPresent(ui -> ui.navigate("login")));
|
||||
cancel.addThemeVariants(ButtonVariant.LUMO_TERTIARY);
|
||||
Button submit = new Button("E-Mail senden", e -> {
|
||||
String email = emailField.getValue();
|
||||
if (email == null || email.isBlank()) {
|
||||
|
||||
@@ -296,6 +296,7 @@ public class MessageDetailsView extends Main implements BeforeEnterObserver, Has
|
||||
confirmButton.setEnabled(false);
|
||||
|
||||
Button cancelButton = new Button("Abbrechen", event -> dialog.close());
|
||||
cancelButton.addThemeVariants(com.vaadin.flow.component.button.ButtonVariant.LUMO_TERTIARY);
|
||||
|
||||
upload.addSucceededListener(event -> {
|
||||
try (InputStream inputStream = buffer.getInputStream()) {
|
||||
@@ -669,6 +670,7 @@ public class MessageDetailsView extends Main implements BeforeEnterObserver, Has
|
||||
|
||||
private HorizontalLayout createHeaderLayout(String clientName, String conversationTitle) {
|
||||
Button backButton = new Button("Zurück", VaadinIcon.ARROW_LEFT.create());
|
||||
backButton.addThemeVariants(com.vaadin.flow.component.button.ButtonVariant.LUMO_TERTIARY);
|
||||
backButton.addClickListener(e -> UI.getCurrent().navigate("user-messages/" + participantKey));
|
||||
|
||||
VerticalLayout titleLayout = new VerticalLayout();
|
||||
|
||||
@@ -2,6 +2,7 @@ package de.assecutor.votianlt.pages.view;
|
||||
|
||||
import com.vaadin.flow.component.Component;
|
||||
import com.vaadin.flow.component.button.Button;
|
||||
import com.vaadin.flow.component.button.ButtonVariant;
|
||||
import com.vaadin.flow.component.grid.Grid;
|
||||
import com.vaadin.flow.component.grid.GridVariant;
|
||||
import com.vaadin.flow.component.grid.ColumnTextAlign;
|
||||
@@ -168,6 +169,8 @@ public class MyInvoicesView extends Main implements HasDynamicTitle {
|
||||
// Paginierungs-Buttons (vorerst ohne Funktion, als Platzhalter)
|
||||
Button prev = new Button(getTranslation("myinvoices.button.prev"), VaadinIcon.ANGLE_LEFT.create());
|
||||
Button next = new Button(getTranslation("myinvoices.button.next"), VaadinIcon.ANGLE_RIGHT.create());
|
||||
prev.addThemeVariants(ButtonVariant.LUMO_TERTIARY);
|
||||
next.addThemeVariants(ButtonVariant.LUMO_TERTIARY);
|
||||
prev.setEnabled(false);
|
||||
next.setEnabled(false);
|
||||
HorizontalLayout pager = new HorizontalLayout(prev, next);
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
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.grid.Grid;
|
||||
import com.vaadin.flow.component.html.Div;
|
||||
import com.vaadin.flow.component.html.Paragraph;
|
||||
@@ -34,6 +35,7 @@ public class ShowCustomersView extends VerticalLayout implements HasDynamicTitle
|
||||
addClassName("data-view");
|
||||
|
||||
Button addCustomerButton = new Button(getTranslation("customers.button.add"), new Icon(VaadinIcon.PLUS));
|
||||
addCustomerButton.addThemeVariants(ButtonVariant.LUMO_PRIMARY);
|
||||
add(new ViewToolbar(getTranslation("customers.title"), addCustomerButton));
|
||||
|
||||
// Add hint text
|
||||
|
||||
@@ -70,6 +70,7 @@ public class ShowJobsView extends VerticalLayout implements HasDynamicTitle {
|
||||
searchField.setLabel(getTranslation("jobs.filter.search"));
|
||||
statusFilter.setLabel(getTranslation("jobs.filter.status"));
|
||||
Button exportButton = new Button(getTranslation("jobs.button.csvexport"));
|
||||
exportButton.addThemeVariants(ButtonVariant.LUMO_TERTIARY);
|
||||
ViewToolbar toolbar = new ViewToolbar(getTranslation("nav.jobs"), exportButton);
|
||||
add(toolbar);
|
||||
|
||||
@@ -84,6 +85,7 @@ public class ShowJobsView extends VerticalLayout implements HasDynamicTitle {
|
||||
|
||||
// Filterleiste mit Export-Button am rechten Rand
|
||||
Button applyFilter = new Button(getTranslation("jobs.filter.apply"));
|
||||
applyFilter.addThemeVariants(ButtonVariant.LUMO_PRIMARY);
|
||||
HorizontalLayout leftFilters = new HorizontalLayout(startDate, endDate, searchField, statusFilter, applyFilter);
|
||||
leftFilters.setAlignItems(Alignment.END);
|
||||
leftFilters.getStyle().set("flex-wrap", "wrap");
|
||||
|
||||
@@ -2,6 +2,7 @@ package de.assecutor.votianlt.pages.view;
|
||||
|
||||
import com.vaadin.flow.component.UI;
|
||||
import com.vaadin.flow.component.button.Button;
|
||||
import com.vaadin.flow.component.button.ButtonVariant;
|
||||
import com.vaadin.flow.component.html.Div;
|
||||
import com.vaadin.flow.component.html.H2;
|
||||
import com.vaadin.flow.component.html.H3;
|
||||
@@ -98,6 +99,7 @@ public class UserMessagesView extends Main implements HasUrlParameter<String>, H
|
||||
|
||||
private HorizontalLayout createHeaderLayout(String clientName) {
|
||||
Button backButton = new Button(getTranslation("button.back"), VaadinIcon.ARROW_LEFT.create());
|
||||
backButton.addThemeVariants(ButtonVariant.LUMO_TERTIARY);
|
||||
backButton.addClickListener(e -> UI.getCurrent().navigate("messages"));
|
||||
|
||||
H2 title = new H2(getTranslation("usermessages.title.with", clientName));
|
||||
|
||||
Reference in New Issue
Block a user