diff --git a/projects/ars/src/lib/style/style.const.ts b/projects/ars/src/lib/style/style.const.ts
index 411ba85e62351b000ddf2642cd1ff0ac70387473..43ab7b791e2dc5d4a3ca515100c1ff2876aec6bd 100644
--- a/projects/ars/src/lib/style/style.const.ts
+++ b/projects/ars/src/lib/style/style.const.ts
@@ -2,6 +2,7 @@ export const light = {
'ars-header-color': '#212121',
'ars-paragraph-color': '#3f3f3f',
'ars-button-color': '#000000',
+ 'ars-button-color-light': '#727272',
'ars-background-color': '#fcfcfc',
'ars-foreground-color': '#FFFFFF',
'ars-border-color': '#DDDDDD'
@@ -11,6 +12,7 @@ export const dark = {
'ars-header-color': '#FAFAFA',
'ars-paragraph-color': '#BDBDBD',
'ars-button-color': '#FFFFFF',
+ 'ars-button-color-light': '#909090',
'ars-background-color': '#212121',
'ars-foreground-color': '#292929',
'ars-border-color': '#2E2E2E'
diff --git a/src/app/components/shared/header/header.component.html b/src/app/components/shared/header/header.component.html
index 51e6f2ef593c2f40746d05d28ab158219bfcf793..b5a6000e8800d6b746e4278d5d692f2e2ff20c23 100644
--- a/src/app/components/shared/header/header.component.html
+++ b/src/app/components/shared/header/header.component.html
@@ -13,9 +13,10 @@
fxLayoutAlign="center center">
{{cTime}}
</h2>
- <span class="fill-remaining-space"></span>
- <button *ngIf="router.url.includes('comments')" mat-button routerLink="participant/room/{{shortId}}/comments/questionwall">
- <span>Presentation</span>
+ <span class="fill-remaining-space"
+ *ngIf="router.url.includes('comments') && deviceType === 'desktop'"></span>
+ <button *ngIf="router.url.includes('comments') && deviceType === 'desktop'" mat-button routerLink="participant/room/{{shortId}}/comments/questionwall">
+ <span class="oldtypo-h3">Presentation</span>
</button>
<span class="fill-remaining-space"
*ngIf="router.url.includes('comments') && user.role === 3 && deviceType === 'desktop'"></span>
diff --git a/src/app/components/shared/questionwall/QuestionWallComment.ts b/src/app/components/shared/questionwall/QuestionWallComment.ts
index 71241b5a936a9583a2fc77e73ccde844316d94db..8880c938b973a2de44a7f2370cc607d13f1c7fbf 100644
--- a/src/app/components/shared/questionwall/QuestionWallComment.ts
+++ b/src/app/components/shared/questionwall/QuestionWallComment.ts
@@ -14,7 +14,6 @@ export class QuestionWallComment {
}
public update() {
- console.log('update');
}
public updateTimeAgo() {
diff --git a/src/app/components/shared/questionwall/question-wall/question-wall.component.html b/src/app/components/shared/questionwall/question-wall/question-wall.component.html
index c5c89f3c4a79f397108b14116d3d4e2749d29b81..c64f444f8b85e71210b889de6d244d3629e33fad 100644
--- a/src/app/components/shared/questionwall/question-wall/question-wall.component.html
+++ b/src/app/components/shared/questionwall/question-wall/question-wall.component.html
@@ -10,8 +10,10 @@
<ars-fill ars-flex-box>
<ars-fill style="overflow:hidden;">
<ars-row [overflow]="'auto'">
- <p class="questionwall-present" *ngIf="commentFocus">{{commentFocus.comment.body}}</p>
- <p class="questionwall-present" *ngIf="!commentFocus">Questionwall. Click on a comment.</p>
+ <ng-container *ngIf="commentFocus">
+ <p class="questionwall-present-timestamp">{{commentFocus.timeAgo}}</p>
+ <p class="questionwall-present">{{commentFocus.comment.body}}</p>
+ </ng-container>
</ars-row>
</ars-fill>
<ars-col [width]="450" [overflow]="'auto'" class="questionwall-list" #colComponent>
@@ -38,7 +40,7 @@
</ars-row>
<ars-row [height]="50">
<ars-style-btn-material style="width:100%;height:100%;" ars-flex-box>
- <ars-col ars-btn-wrp [xp]="16" [extra]="true">
+ <ars-col ars-btn-wrp [xp]="16" [extra]="true" class="questionwall-comment-btn">
<button ars-btn (click)="likeComment(comment)"><i>thumb_up</i><p>{{comment.comment.score}}</p></button>
<button ars-btn (click)="dislikeComment(comment)"><i>thumb_down</i></button>
</ars-col>
diff --git a/src/app/components/shared/questionwall/question-wall/question-wall.component.scss b/src/app/components/shared/questionwall/question-wall/question-wall.component.scss
index 083b9c76d573c1c59e2da547d4dd629ffce4ec0c..a216116968638df456431215136ec1aad95a43b0 100644
--- a/src/app/components/shared/questionwall/question-wall/question-wall.component.scss
+++ b/src/app/components/shared/questionwall/question-wall/question-wall.component.scss
@@ -23,18 +23,30 @@
&-comment{
&-border{
&-on{
- box-shadow:inset 0px 0px 0px 1px var(--ars-paragraph-color);
+ box-shadow:inset 0px 0px 0px 1px var(--ars-button-color-light);
}
&-off{
- box-shadow:inset 0px 0px 0px 0px var(--ars-paragraph-color);
+ box-shadow:inset 0px 0px 0px 0px var(--ars-button-color-light);
}
}
&-timestamp{
color:var(--ars-paragraph-color);
+ font-size:14px;
}
&-body{
hyphens:auto;
- color:var(--ars-paragraph-color);
+ word-break:break-word;
+ color:var(--ars-header-color);
+ line-height:22px;
+ white-space:normal;
+ }
+ &-btn{
+ >button>*{
+ color:var(--ars-button-color-light);
+ }
+ >button:hover>*{
+ color:var(--ars-button-color);
+ }
}
&-notification{
font-size:12px;
@@ -51,8 +63,14 @@
}
&-present{
font-size:45px;
- padding:32px;
+ padding:16px 32px 0 32px;
color:var(--ars-header-color);
+ word-break:break-word;
+ &-timestamp{
+ font-size:18px;
+ padding:32px 32px 0 32px;
+ color:var(--ars-paragraph-color);
+ }
}
&-screen{
background-color:var(--ars-background-color);
diff --git a/src/app/components/shared/shared-routing.module.ts b/src/app/components/shared/shared-routing.module.ts
index 22e98b3b61b8b2b930372ed689e6db0a22e37045..8de3457bce440b7d7d3cd08290c0785c8104535d 100644
--- a/src/app/components/shared/shared-routing.module.ts
+++ b/src/app/components/shared/shared-routing.module.ts
@@ -8,8 +8,8 @@ const routes: Routes = [
{
path: 'room/:shortId/comments/questionwall',
component: QuestionWallComponent,
- canActivate: [AuthenticationGuard],
- data: { roles: [UserRole.CREATOR,
+ data: { roles: [
+ UserRole.CREATOR,
UserRole.EDITING_MODERATOR,
UserRole.EXECUTIVE_MODERATOR,
UserRole.PARTICIPANT] }