i’ve been trying to use this code… but the headers always seem to overrun each other .
public class MainLayout extends AppLayout {
public MainLayout() {
H1 title = new H1("MyApp");
title.getStyle().set("font-size", "var(--lumo-font-size-l)")
.set("left", "var(--lumo-space-l)").set("margin", "0")
.set("position", "absolute");
HorizontalLayout navigation = getNavigation();
navigation.getElement();
addToNavbar(title, navigation);
}
private HorizontalLayout getNavigation() {
final HorizontalLayout navigation = new HorizontalLayout();
navigation.addClassNames(
LumoUtility.JustifyContent.CENTER
, LumoUtility.Gap.SMALL
, LumoUtility.Height.MEDIUM
, LumoUtility.Width.FULL
);
navigation.add(
createLink("Main", MainView.class)
, createLink("Settings", Settings.class)
);
return navigation;
}
private RouterLink createLink(String viewName,Class<? extends Component> cls) {
RouterLink link = new RouterLink();
link.add(viewName);
// Demo has no routes
link.setRoute(cls);
link.addClassNames(LumoUtility.Display.FLEX,
LumoUtility.AlignItems.CENTER,
LumoUtility.Padding.Horizontal.MEDIUM,
LumoUtility.TextColor.SECONDARY, LumoUtility.FontWeight.MEDIUM);
link.getStyle().set("text-decoration", "none");
return link;
}
}