From c41743ffd561af3c24042516d3cf2f71e6502b2b Mon Sep 17 00:00:00 2001 From: Jonathan Lim-Breitbart Date: Fri, 28 Aug 2026 12:39:21 -0700 Subject: [PATCH] feat(VLE): Separate activities visually in step view --- .../possible-score.component.html | 12 +-- .../edit-component-title.component.ts | 4 +- src/assets/wise5/common/ComponentContent.ts | 2 +- .../ai-chat-student.component.html | 26 +++-- .../ai-chat-student.component.scss | 8 -- .../ai-chat-student.component.ts | 4 +- .../dialog-guidance-show-work.component.ts | 17 ++- .../dialog-guidance-student.component.html | 39 ++++--- .../dialog-guidance-student.component.scss | 8 -- .../dialog-guidance-student.component.ts | 4 +- .../draw-student/draw-student.component.html | 3 +- .../draw-student/draw-student.component.scss | 4 - .../label-student.component.html | 3 +- .../label-student.component.scss | 4 - .../match-student-default.component.html | 1 + .../match-student-default.component.scss | 6 -- .../open-response-student.component.html | 3 +- .../peer-chat-chat-box.component.html | 47 ++++---- .../peer-chat-chat-box.component.spec.ts | 18 ++-- .../peer-chat-chat-box.component.ts | 17 +-- .../peer-chat-student.component.html | 48 ++++----- .../peer-chat-student.component.ts | 10 ++ .../show-group-work-display.component.html | 10 +- .../summary-student.component.html | 3 - .../table-student.component.html | 1 + .../tabulator-table.component.scss | 1 + .../component-header.component.html | 32 +++--- .../component-header.component.ts | 16 ++- .../wise5/themes/default/style/author.css | 2 +- .../wise5/themes/default/style/author.css.map | 2 +- .../themes/default/style/modules/_node.scss | 26 ----- .../wise5/themes/default/style/monitor.css | 2 +- .../themes/default/style/monitor.css.map | 2 +- src/assets/wise5/themes/default/style/vle.css | 2 +- .../wise5/themes/default/style/vle.css.map | 2 +- .../computer-avatar-selector.component.html | 101 +++++++++--------- .../computer-avatar-selector.component.scss | 13 --- .../computer-avatar-selector.component.ts | 3 +- src/assets/wise5/vle/node/node.component.html | 28 ++--- src/assets/wise5/vle/node/node.component.scss | 7 -- src/assets/wise5/vle/node/node.component.ts | 3 +- src/assets/wise5/vle/vle.component.html | 6 +- src/assets/wise5/vle/vle.component.scss | 3 +- 43 files changed, 236 insertions(+), 317 deletions(-) delete mode 100644 src/assets/wise5/vle/node/node.component.scss diff --git a/src/app/possible-score/possible-score.component.html b/src/app/possible-score/possible-score.component.html index d40d581dc93..1112ec0ad97 100644 --- a/src/app/possible-score/possible-score.component.html +++ b/src/app/possible-score/possible-score.component.html @@ -1,9 +1,7 @@ @if (maxScore > 0 && !hidePossibleScores) { - - @if (maxScore === 1) { - ({{ maxScore }} point) - } @else { - ({{ maxScore }} points) - } - + @if (maxScore === 1) { + {{ maxScore }} point + } @else { + {{ maxScore }} points + } } diff --git a/src/assets/wise5/authoringTool/components/edit-component-title/edit-component-title.component.ts b/src/assets/wise5/authoringTool/components/edit-component-title/edit-component-title.component.ts index 7fab4a680c3..8f2f8d4a554 100644 --- a/src/assets/wise5/authoringTool/components/edit-component-title/edit-component-title.component.ts +++ b/src/assets/wise5/authoringTool/components/edit-component-title/edit-component-title.component.ts @@ -11,7 +11,7 @@ import { TranslatableInputComponent } from '../translatable-input/translatable-i } @if (!computerAvatarSelectorVisible) { - - -
- -
- +
+ - +
+ } diff --git a/src/assets/wise5/components/aiChat/ai-chat-student/ai-chat-student.component.scss b/src/assets/wise5/components/aiChat/ai-chat-student/ai-chat-student.component.scss index 2ac4c0a8c49..a4a80b89ee5 100644 --- a/src/assets/wise5/components/aiChat/ai-chat-student/ai-chat-student.component.scss +++ b/src/assets/wise5/components/aiChat/ai-chat-student/ai-chat-student.component.scss @@ -1,11 +1,3 @@ -@use 'style/abstracts/functions'; - -.mat-mdc-card { - padding: 12px; - margin-top: 16px; - max-width: functions.breakpoint('sm.min'); -} - .messages { margin-bottom: 12px; max-height: 500px; diff --git a/src/assets/wise5/components/aiChat/ai-chat-student/ai-chat-student.component.ts b/src/assets/wise5/components/aiChat/ai-chat-student/ai-chat-student.component.ts index a80a8a12527..f5a93c12dd7 100644 --- a/src/assets/wise5/components/aiChat/ai-chat-student/ai-chat-student.component.ts +++ b/src/assets/wise5/components/aiChat/ai-chat-student/ai-chat-student.component.ts @@ -18,7 +18,6 @@ import { ComputerAvatarInitializer } from '../../../common/computer-avatar/compu import { ComputerAvatarService } from '../../../services/computerAvatarService'; import { StudentStatusService } from '../../../services/studentStatusService'; import { ComputerAvatarSelectorComponent } from '../../../vle/computer-avatar-selector/computer-avatar-selector.component'; -import { MatCard } from '@angular/material/card'; import { ComponentHeaderComponent } from '../../../directives/component-header/component-header.component'; import { ChatInputComponent } from '../../../common/chat-input/chat-input.component'; import { AiChatMessagesComponent } from '../ai-chat-messages/ai-chat-messages.component'; @@ -28,8 +27,7 @@ import { AiChatMessagesComponent } from '../ai-chat-messages/ai-chat-messages.co AiChatMessagesComponent, ChatInputComponent, ComponentHeaderComponent, - ComputerAvatarSelectorComponent, - MatCard + ComputerAvatarSelectorComponent ], styleUrl: './ai-chat-student.component.scss', templateUrl: './ai-chat-student.component.html' diff --git a/src/assets/wise5/components/dialogGuidance/dialog-guidance-show-work/dialog-guidance-show-work.component.ts b/src/assets/wise5/components/dialogGuidance/dialog-guidance-show-work/dialog-guidance-show-work.component.ts index 2cf7e9d7fce..2b950376145 100644 --- a/src/assets/wise5/components/dialogGuidance/dialog-guidance-show-work/dialog-guidance-show-work.component.ts +++ b/src/assets/wise5/components/dialogGuidance/dialog-guidance-show-work/dialog-guidance-show-work.component.ts @@ -4,28 +4,25 @@ import { ComputerAvatarService } from '../../../services/computerAvatarService'; import { NodeService } from '../../../services/nodeService'; import { ProjectService } from '../../../services/projectService'; import { ComponentShowWorkDirective } from '../../component-show-work.directive'; -import { MatCardModule } from '@angular/material/card'; import { DialogResponsesComponent } from '../dialog-responses/dialog-responses.component'; import { CRaterRubric } from '../../common/cRater/CRaterRubric'; import { CRaterService } from '../../../services/cRaterService'; import { UserService } from '../../../../../app/services/user.service'; @Component({ - imports: [DialogResponsesComponent, MatCardModule], + imports: [DialogResponsesComponent], selector: 'dialog-guidance-show-work', styleUrls: [ '../dialog-guidance-student/dialog-guidance-student.component.scss', './dialog-guidance-show-work.component.scss' ], template: ` - - - + ` }) export class DialogGuidanceShowWorkComponent extends ComponentShowWorkDirective { diff --git a/src/assets/wise5/components/dialogGuidance/dialog-guidance-student/dialog-guidance-student.component.html b/src/assets/wise5/components/dialogGuidance/dialog-guidance-student/dialog-guidance-student.component.html index f5dd917b23a..cb1d84cbd18 100644 --- a/src/assets/wise5/components/dialogGuidance/dialog-guidance-student/dialog-guidance-student.component.html +++ b/src/assets/wise5/components/dialogGuidance/dialog-guidance-student/dialog-guidance-student.component.html @@ -1,23 +1,20 @@ -
- @if (computerAvatarSelectorVisible) { - + +} @else { + + + @if (studentCanRespond) { + - } @else { - - - - @if (studentCanRespond) { - - } - } -
+} diff --git a/src/assets/wise5/components/dialogGuidance/dialog-guidance-student/dialog-guidance-student.component.scss b/src/assets/wise5/components/dialogGuidance/dialog-guidance-student/dialog-guidance-student.component.scss index da11d2dde22..969fc34a0f7 100644 --- a/src/assets/wise5/components/dialogGuidance/dialog-guidance-student/dialog-guidance-student.component.scss +++ b/src/assets/wise5/components/dialogGuidance/dialog-guidance-student/dialog-guidance-student.component.scss @@ -1,11 +1,3 @@ -@use 'style/abstracts/functions'; - -.mat-mdc-card { - padding: 12px; - margin-top: 16px; - max-width: functions.breakpoint('sm.min'); -} - dialog-responses { display: block; margin-bottom: 12px; diff --git a/src/assets/wise5/components/dialogGuidance/dialog-guidance-student/dialog-guidance-student.component.ts b/src/assets/wise5/components/dialogGuidance/dialog-guidance-student/dialog-guidance-student.component.ts index 9f2ce0c65a3..b677fdfea46 100644 --- a/src/assets/wise5/components/dialogGuidance/dialog-guidance-student/dialog-guidance-student.component.ts +++ b/src/assets/wise5/components/dialogGuidance/dialog-guidance-student/dialog-guidance-student.component.ts @@ -30,7 +30,6 @@ import { ConstraintService } from '../../../services/constraintService'; import { applyMixins } from '../../../common/apply-mixins'; import { ComputerAvatarInitializer } from '../../../common/computer-avatar/computer-avatar-initializer'; import { ComputerAvatarSelectorComponent } from '../../../vle/computer-avatar-selector/computer-avatar-selector.component'; -import { MatCardModule } from '@angular/material/card'; import { ComponentHeaderComponent } from '../../../directives/component-header/component-header.component'; import { DialogResponsesComponent } from '../dialog-responses/dialog-responses.component'; import { ChatInputComponent } from '../../../common/chat-input/chat-input.component'; @@ -41,8 +40,7 @@ import { CRaterPingService } from '../../../services/cRaterPingService'; ChatInputComponent, ComponentHeaderComponent, ComputerAvatarSelectorComponent, - DialogResponsesComponent, - MatCardModule + DialogResponsesComponent ], providers: [CRaterPingService, DialogGuidanceFeedbackService], selector: 'dialog-guidance-student', diff --git a/src/assets/wise5/components/draw/draw-student/draw-student.component.html b/src/assets/wise5/components/draw/draw-student/draw-student.component.html index a0e45ff31c2..0e5cf0b92b0 100644 --- a/src/assets/wise5/components/draw/draw-student/draw-student.component.html +++ b/src/assets/wise5/components/draw/draw-student/draw-student.component.html @@ -44,9 +44,10 @@ } -
+
@if (isSaveOrSubmitButtonVisible) { } -
+
@if (isSaveOrSubmitButtonVisible) { /> @if (isSaveOrSubmitButtonVisible) { }
-
+