From c1a3912f85b12ce16449aa99561e155e3bbd54c0 Mon Sep 17 00:00:00 2001 From: GAM Date: Mon, 8 Mar 2021 11:54:44 +0100 Subject: [PATCH] better table style --- frontend/views/table/table-view.css | 7 ++++++- .../example/application/utils/StringUtils.java | 6 +++++- .../example/application/utils/VaadinUtils.java | 7 +++++++ .../example/application/views/main/MainView.java | 2 ++ .../application/views/results/ResultsView.java | 1 + .../application/views/table/TableView.java | 16 ++++++++-------- 6 files changed, 29 insertions(+), 10 deletions(-) diff --git a/frontend/views/table/table-view.css b/frontend/views/table/table-view.css index 303cebc..8143403 100644 --- a/frontend/views/table/table-view.css +++ b/frontend/views/table/table-view.css @@ -1,3 +1,8 @@ .about-view { display: block; -} \ No newline at end of file +} + +.important_table_column_header { + font-weight: bold; + font-size: large; +} diff --git a/src/main/java/com/example/application/utils/StringUtils.java b/src/main/java/com/example/application/utils/StringUtils.java index 15b53d7..54c8376 100644 --- a/src/main/java/com/example/application/utils/StringUtils.java +++ b/src/main/java/com/example/application/utils/StringUtils.java @@ -29,7 +29,11 @@ public class StringUtils { } public static String getHtmlStringForPlayer(String playerName, String playerNickname) { - return String.format("%s (%s)", playerName, playerNickname); + return String.format("%s (%s)", getBoldHtmlString(playerName), playerNickname); + } + + public static String getBoldHtmlString(String string) { + return String.format("%s", string); } public static String getTemplateItemString(String propertyName) { diff --git a/src/main/java/com/example/application/utils/VaadinUtils.java b/src/main/java/com/example/application/utils/VaadinUtils.java index d43bb27..cba308a 100644 --- a/src/main/java/com/example/application/utils/VaadinUtils.java +++ b/src/main/java/com/example/application/utils/VaadinUtils.java @@ -17,4 +17,11 @@ public class VaadinUtils { .withProperty(name, (ValueProvider) source -> playerProvider.apply(source).getName()) .withProperty(nickname, (ValueProvider) source -> playerProvider.apply(source).getNickname()); } + + public static TemplateRenderer getBoldStringRenderer(ValueProvider stringProvider) { + String string = StringUtils.getNewRandomString(); + String itemString = StringUtils.getTemplateItemString(string); + return TemplateRenderer.of(StringUtils.getBoldHtmlString(itemString)) + .withProperty(string, stringProvider); + } } diff --git a/src/main/java/com/example/application/views/main/MainView.java b/src/main/java/com/example/application/views/main/MainView.java index b826420..7dc96de 100644 --- a/src/main/java/com/example/application/views/main/MainView.java +++ b/src/main/java/com/example/application/views/main/MainView.java @@ -37,6 +37,8 @@ import java.util.Optional; @Theme(value = Lumo.class, variant = Lumo.DARK) public class MainView extends AppLayout { // TODO: Add Localization + // TODO: View for adding match data + // TODO: View for each match // TODO: Handle database connection with environment variables // TODO: make it look even more like chess.com (use darker colors etc.) // TODO: add light theme like on chess.com diff --git a/src/main/java/com/example/application/views/results/ResultsView.java b/src/main/java/com/example/application/views/results/ResultsView.java index 50239b2..cfd5ae4 100644 --- a/src/main/java/com/example/application/views/results/ResultsView.java +++ b/src/main/java/com/example/application/views/results/ResultsView.java @@ -102,6 +102,7 @@ public class ResultsView extends SeasonAndMatchdayNavigationView { } private void configureMatchdayLayout() { + // TODO add background color for content getMatchdayHeader().addClassName("matchday_header"); // TODO: add dates getMatchdayHeader().setWidth("100%"); HorizontalLayout matchdayHeaderLayout = new HorizontalLayout(getPrevButton(), getMatchdayHeader(), getNextButton()); diff --git a/src/main/java/com/example/application/views/table/TableView.java b/src/main/java/com/example/application/views/table/TableView.java index 8945fa1..c540bb2 100644 --- a/src/main/java/com/example/application/views/table/TableView.java +++ b/src/main/java/com/example/application/views/table/TableView.java @@ -60,19 +60,21 @@ public class TableView extends SeasonAndMatchdayNavigationView { @Override protected void configureContentLayout() { - // TODO: bold matchpoints + // TODO: add background color for content + // TODO: add diff to last matchday + // TODO: bold matchpoints etc. contentLayout = new HorizontalLayout(getGrid()); Label headerPlace = new Label("Place"); - headerPlace.addClassName("column_header"); + headerPlace.addClassName("important_table_column_header"); Label headerPlayer = new Label("Player"); - headerPlayer.addClassName("column_header"); + headerPlayer.addClassName("important_table_column_header"); Label headerMatchesPlayed = new Label("Played"); Label headerMatchPoints = new Label("Points"); - headerMatchPoints.addClassName("column_header"); + headerMatchPoints.addClassName("important_table_column_header"); Label headerWon = new Label("W"); @@ -83,9 +85,8 @@ public class TableView extends SeasonAndMatchdayNavigationView { Label headerGames = new Label("Games"); Label headerDiff = new Label("Diff"); - headerDiff.addClassName("column_header"); - getGrid().addColumn((ValueProvider) PlayerForTable::getPlaceString) + getGrid().addColumn(VaadinUtils.getBoldStringRenderer(PlayerForTable::getPlaceString)) .setHeader(headerPlace) .setTextAlign(ColumnTextAlign.CENTER) .setWidth("5em"); @@ -100,7 +101,7 @@ public class TableView extends SeasonAndMatchdayNavigationView { .setTextAlign(ColumnTextAlign.CENTER) .setWidth("5em"); - getGrid().addColumn((ValueProvider) PlayerForTable::getMatchPoints) + getGrid().addColumn(VaadinUtils.getBoldStringRenderer(player -> String.valueOf(player.getMatchPoints()))) .setHeader(headerMatchPoints) .setTextAlign(ColumnTextAlign.CENTER) .setWidth("6em"); @@ -133,7 +134,6 @@ public class TableView extends SeasonAndMatchdayNavigationView { getGrid().setWidth("51em"); getGrid().setHeightByRows(true); -// getGrid().addClassName("my_grid"); getGrid().addThemeVariants(GridVariant.LUMO_NO_BORDER, GridVariant.LUMO_NO_ROW_BORDERS, GridVariant.LUMO_ROW_STRIPES); }