From e428fff676253aa320ed587e67dc5f4e9a116ca7 Mon Sep 17 00:00:00 2001 From: Xingchen722 Date: Wed, 18 Feb 2026 21:55:12 +0800 Subject: [PATCH 1/3] Reduce profile picture size to improve GUI layout --- src/main/resources/view/DialogBox.fxml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/main/resources/view/DialogBox.fxml b/src/main/resources/view/DialogBox.fxml index 252f139623..47ec7efd4a 100644 --- a/src/main/resources/view/DialogBox.fxml +++ b/src/main/resources/view/DialogBox.fxml @@ -9,12 +9,12 @@ - + From 217af0b915d8d52bab226c79263680b32276f795 Mon Sep 17 00:00:00 2001 From: Xingchen722 Date: Wed, 18 Feb 2026 22:07:03 +0800 Subject: [PATCH 2/3] Implement dynamic error styling and resize avatars [A-AiAssisted] --- src/main/java/DialogBox.java | 6 ++++++ src/main/java/MainWindow.java | 6 ++++++ src/main/resources/css/dialog-box.css | 5 +++++ 3 files changed, 17 insertions(+) diff --git a/src/main/java/DialogBox.java b/src/main/java/DialogBox.java index 1cfac902c1..012922674b 100644 --- a/src/main/java/DialogBox.java +++ b/src/main/java/DialogBox.java @@ -55,6 +55,9 @@ public static DialogBox getUserDialog(String text, Image img) { private void changeDialogStyle(String commandType) { switch (commandType) { + case "Error": + dialog.getStyleClass().add("error-bubble"); + break; case "AddCommand": dialog.getStyleClass().add("add-label"); break; @@ -84,4 +87,7 @@ public static DialogBox getLarsDialog(String text, Image img, String commandType return db; } + public void flipToErrorStyle() { + dialog.getStyleClass().add("error-bubble"); + } } diff --git a/src/main/java/MainWindow.java b/src/main/java/MainWindow.java index 7314a6b4a4..25db2b8364 100644 --- a/src/main/java/MainWindow.java +++ b/src/main/java/MainWindow.java @@ -40,6 +40,12 @@ private void handleUserInput() throws LarsException { String input = userInput.getText(); String response = lars.getResponse(input); String commandType = lars.getCommandType(); + DialogBox larsDialog = DialogBox.getLarsDialog(response, larsImage, commandType); + + if ("Error".equals(commandType)) { + larsDialog.flipToErrorStyle(); + } + dialogContainer.getChildren().addAll( DialogBox.getUserDialog(input, userImage), DialogBox.getLarsDialog(response, larsImage, commandType) diff --git a/src/main/resources/css/dialog-box.css b/src/main/resources/css/dialog-box.css index c6a5500ed7..d6d895ea7f 100644 --- a/src/main/resources/css/dialog-box.css +++ b/src/main/resources/css/dialog-box.css @@ -18,6 +18,11 @@ -fx-background-color: lightpink; } +.error-bubble { + -fx-background-color: #FFEBEE !important; + -fx-border-color: #FFCDD2 !important; +} + .reply-label { -fx-background-radius: 1em 1em 1em 0; -fx-border-radius: 1em 1em 1em 0; From 46d947c305d2c8f5b9f140a514f84f400aa899f1 Mon Sep 17 00:00:00 2001 From: Xingchen722 Date: Thu, 19 Feb 2026 14:40:46 +0800 Subject: [PATCH 3/3] Change color of bubbles accroding to different target and fix command-specific styles --- data/lars.txt | 9 +++++++-- src/main/java/DialogBox.java | 12 ++++++++++-- src/main/resources/css/dialog-box.css | 25 ++++++++++++++++--------- src/main/resources/css/main.css | 2 +- 4 files changed, 34 insertions(+), 14 deletions(-) diff --git a/data/lars.txt b/data/lars.txt index 690aea23d3..e6b5797d46 100644 --- a/data/lars.txt +++ b/data/lars.txt @@ -1,5 +1,4 @@ -D | 0 | return library book | Feb 15 2026 -T | 0 | borrow book +T | 1 | borrow book E | 0 | project meeting | 2026-02-10 | 2026-02-20 D | 0 | return library book | Feb 15 2026 18:00 D | 0 | return book | Sunday @@ -11,3 +10,9 @@ D | 0 | return book | Sunday T | 0 | 2103 D | 0 | return li book | 2026-02-19 T | 0 | miss mjr +T | 0 | 11 +T | 0 | 11 +T | 0 | 111 +E | 0 | project meeting | 2026-02-10 | 2026-02-20 +T | 0 | 11 +E | 0 | project meeting | 2026-02-10 | 2026-02-20 diff --git a/src/main/java/DialogBox.java b/src/main/java/DialogBox.java index 012922674b..9aed6998ff 100644 --- a/src/main/java/DialogBox.java +++ b/src/main/java/DialogBox.java @@ -35,7 +35,10 @@ private DialogBox(String text, Image img) { dialog.setText(text); dialog.setWrapText(true); dialog.setMaxWidth(400); + displayPicture.setImage(img); + + dialog.getStyleClass().add("label"); } /** @@ -46,11 +49,14 @@ private void flip() { Collections.reverse(tmp); getChildren().setAll(tmp); setAlignment(Pos.TOP_LEFT); - dialog.getStyleClass().add("reply-label"); + dialog.getStyleClass().add("lars-label"); } public static DialogBox getUserDialog(String text, Image img) { - return new DialogBox(text, img); + var db = new DialogBox(text, img); + db.setAlignment(Pos.TOP_RIGHT); + db.dialog.getStyleClass().add("user-bubble"); + return db; } private void changeDialogStyle(String commandType) { @@ -81,6 +87,8 @@ private void changeDialogStyle(String commandType) { public static DialogBox getLarsDialog(String text, Image img, String commandType) { var db = new DialogBox(text, img); db.flip(); + db.dialog.getStyleClass().add("lars-bubble"); + if (commandType != null) { db.changeDialogStyle(commandType); } diff --git a/src/main/resources/css/dialog-box.css b/src/main/resources/css/dialog-box.css index d6d895ea7f..adde5e643c 100644 --- a/src/main/resources/css/dialog-box.css +++ b/src/main/resources/css/dialog-box.css @@ -1,13 +1,25 @@ .label { - -fx-background-color: linear-gradient(to bottom right, #00ffbf, #00ddff); - -fx-border-color: #d55e00 #009e73 #cc79a7 #0072b2; - -fx-border-width: 2px; + -fx-background-color: #FAFF72; + -fx-border-color: rgba(0,0,0,0.08);; + -fx-border-width: 1px; + -fx-padding: 8 12 8 12; + -fx-text-fill: black; +} + +.user-bubble { + -fx-background-color: #A7E6FF; -fx-background-radius: 1em 1em 0 1em; -fx-border-radius: 1em 1em 0 1em; } +.lars-bubble { + -fx-background-color: #FAFF72; + -fx-background-radius: 1em 1em 1em 0; + -fx-border-radius: 1em 1em 1em 0; +} + .add-label { - -fx-background-color: yellow; + -fx-background-color: #FAFF72; } .marked-label { @@ -23,11 +35,6 @@ -fx-border-color: #FFCDD2 !important; } -.reply-label { - -fx-background-radius: 1em 1em 1em 0; - -fx-border-radius: 1em 1em 1em 0; -} - #displayPicture { /* Shadow effect on image. */ -fx-effect: dropshadow(gaussian, rgba(0, 0, 0, 0.2), 10, 0.5, 5, 5); diff --git a/src/main/resources/css/main.css b/src/main/resources/css/main.css index 8a1c027bd5..d487569e50 100644 --- a/src/main/resources/css/main.css +++ b/src/main/resources/css/main.css @@ -36,7 +36,7 @@ } .scroll-bar .thumb { - -fx-background-color: #ff9cb4; + -fx-background-color: #F4C902; -fx-background-radius: 1em; }