diff --git a/src/app/components/creator/_dialogs/content-delete/content-delete.component.scss b/src/app/components/creator/_dialogs/content-delete/content-delete.component.scss index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..1a636370223fbf7644ef88cc9e72328d915e7094 100644 --- a/src/app/components/creator/_dialogs/content-delete/content-delete.component.scss +++ b/src/app/components/creator/_dialogs/content-delete/content-delete.component.scss @@ -0,0 +1,7 @@ +h3 { + color: var(--on-surface); +} + +p { + color: var(--on-surface); +} diff --git a/src/app/components/creator/_dialogs/delete-comment/delete-comment.component.html b/src/app/components/creator/_dialogs/delete-comment/delete-comment.component.html index 6b88ae2f97fd729c387c6ed8b7454254cd166329..9b81130f02b15b55905d0cdf1d553eb7c9742f3a 100644 --- a/src/app/components/creator/_dialogs/delete-comment/delete-comment.component.html +++ b/src/app/components/creator/_dialogs/delete-comment/delete-comment.component.html @@ -1,10 +1,10 @@ <h3>{{ 'room-page.sure' | translate }}</h3> <p>{{ 'room-page.really-delete-comments' | translate }}</p> <div fxLayout="row" fxLayoutAlign="center" fxLayoutGap="10px"> - <button mat-raised-button color="primary" (click)="close('abort')"> + <button mat-raised-button class="abort" (click)="close('abort')"> {{ 'content.abort' | translate }} </button> - <button mat-raised-button color="warn" (click)="close('delete')"> + <button mat-raised-button class="delete" (click)="close('delete')"> {{ 'content.delete' | translate }} </button> </div> diff --git a/src/app/components/creator/_dialogs/delete-comment/delete-comment.component.scss b/src/app/components/creator/_dialogs/delete-comment/delete-comment.component.scss index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..d2bb99f400bb77daaa2daadaece52c800824d6ee 100644 --- a/src/app/components/creator/_dialogs/delete-comment/delete-comment.component.scss +++ b/src/app/components/creator/_dialogs/delete-comment/delete-comment.component.scss @@ -0,0 +1,18 @@ +h3 { + color: var(--on-surface); +} + +p { + color: var(--on-surface); +} + +.delete { + background-color: var(--red); + color: var(--on-secondary); +} + +.abort { + background-color: var(--secondary); + color: var(--on-secondary); +} + diff --git a/src/app/components/creator/_dialogs/room-delete/room-delete.component.html b/src/app/components/creator/_dialogs/room-delete/room-delete.component.html index 388fccfed247ead815b4783b5a0dc7c7e339824b..0edb8b68eca8bae526f29f5541f0903f792bb159 100644 --- a/src/app/components/creator/_dialogs/room-delete/room-delete.component.html +++ b/src/app/components/creator/_dialogs/room-delete/room-delete.component.html @@ -1,10 +1,10 @@ <h3>{{ 'room-page.sure' | translate }}</h3> <p>{{ 'room-page.reallySession' | translate}}<strong>{{room.name}}</strong>{{ 'room-page.really2' | translate}}</p> <div fxLayout="row" fxLayoutAlign="center" fxLayoutGap="10px"> - <button mat-raised-button color="warn" (click)="dialogRef.close('delete')"> - {{ 'room-page.delete-room' | translate }} - </button> - <button mat-raised-button color="primary" (click)="onNoClick()"> + <button mat-raised-button class="abort" (click)="onNoClick()"> {{ 'room-page.abort' | translate }} </button> + <button mat-raised-button class="delete" (click)="dialogRef.close('delete')"> + {{ 'room-page.delete-room' | translate }} + </button> </div> diff --git a/src/app/components/creator/_dialogs/room-delete/room-delete.component.scss b/src/app/components/creator/_dialogs/room-delete/room-delete.component.scss index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..ef5573e7dd77a52ac9c9f36bb75cfb4a5d5d9711 100644 --- a/src/app/components/creator/_dialogs/room-delete/room-delete.component.scss +++ b/src/app/components/creator/_dialogs/room-delete/room-delete.component.scss @@ -0,0 +1,17 @@ +h3 { + color: var(--on-surface); +} + +p { + color: var(--on-surface); +} + +.delete { + background-color: var(--red); + color: var(--on-secondary); +} + +.abort { + background-color: var(--secondary); + color: var(--on-secondary); +} diff --git a/src/app/components/creator/room-creator-page/room-creator-page.component.html b/src/app/components/creator/room-creator-page/room-creator-page.component.html index c3ff1df1518dd7c4adc281923c1f8320f5ebc215..8283f2948f5971a3ed6a82127f8d8b4f2e7f5612 100644 --- a/src/app/components/creator/room-creator-page/room-creator-page.component.html +++ b/src/app/components/creator/room-creator-page/room-creator-page.component.html @@ -22,10 +22,10 @@ <mat-divider></mat-divider> <mat-card-content fxLayoutAlign="center"> <h4> - {{ room.description }} + {{ room.description.trim() }} </h4> </mat-card-content> - <mat-grid-list cols="2" rowHeight="2:1"> + <mat-grid-list cols="1" rowHeight="2:1"> <mat-grid-tile> <button mat-icon-button routerLink="/creator/room/{{ room.shortId }}/comments"> @@ -34,6 +34,8 @@ <h4 *ngIf="deviceType === 'mobile'">{{ 'room-page.comments' | translate}}</h4> </button> </mat-grid-tile> + </mat-grid-list> + <!-- commented out for EDULEARN19 <mat-grid-tile> <button mat-icon-button routerLink="/creator/room/{{ room.shortId }}/feedback-barometer"> <mat-icon class="smallerIcon">thumbs_up_down @@ -43,7 +45,6 @@ </button> </mat-grid-tile> </mat-grid-list> -<!-- commented out for EDULEARN19 <mat-grid-list cols="2" rowHeight="2:1"> <mat-grid-tile> <button mat-icon-button diff --git a/src/app/components/participant/room-participant-page/room-participant-page.component.html b/src/app/components/participant/room-participant-page/room-participant-page.component.html index 6eda7702240087ba96ce13846d4e98d1ede7f121..dceb015578142b88ed9db2603c13542296c03d44 100644 --- a/src/app/components/participant/room-participant-page/room-participant-page.component.html +++ b/src/app/components/participant/room-participant-page/room-participant-page.component.html @@ -12,9 +12,9 @@ </mat-card-header> <mat-divider></mat-divider> <mat-card-content fxLayoutAlign="center"> - <h4>{{room.description}}</h4> + <h4>{{room.description.trim()}}</h4> </mat-card-content> - <mat-grid-list cols="2" rowHeight="2:1"> + <mat-grid-list cols="1" rowHeight="2:1"> <mat-grid-tile> <button mat-icon-button routerLink="/participant/room/{{ room.shortId }}/comments"> <mat-icon>question_answer</mat-icon> @@ -22,6 +22,7 @@ <h4 *ngIf="deviceType === 'mobile'">{{ 'room-page.create-comment' | translate}}</h4> </button> </mat-grid-tile> + <!-- commented out for EDULEARN19 <mat-grid-tile> <button mat-icon-button routerLink="/participant/room/{{ room.shortId }}/feedback-barometer"> <mat-icon>thumbs_up_down</mat-icon> @@ -29,7 +30,7 @@ <h4 *ngIf="deviceType === 'mobile'">{{ 'room-page.give-feedback' | translate}}</h4> </button> </mat-grid-tile> - <!-- <mat-grid-tile> + <mat-grid-tile> <button mat-icon-button routerLink="/participant/room/{{ room.shortId }}/statistics"> <mat-icon>insert_chart</mat-icon> <h3 *ngIf="deviceType === 'desktop'">{{ 'statistic.answer-statistic' | translate}}</h3> diff --git a/src/app/components/shared/_dialogs/present-comment/present-comment.component.scss b/src/app/components/shared/_dialogs/present-comment/present-comment.component.scss index 200ecff5095b7b7b28f475fbdc01c4c8f65654b4..824d4a185116e99ef0b55b4964c6004e8278185d 100644 --- a/src/app/components/shared/_dialogs/present-comment/present-comment.component.scss +++ b/src/app/components/shared/_dialogs/present-comment/present-comment.component.scss @@ -17,6 +17,7 @@ -ms-hyphens: auto; -moz-hyphens: auto; hyphens: auto; + color: var(--on-surface); } #exitButton { @@ -27,3 +28,18 @@ right:2em; max-height: 100px; } + +mat-icon { + color: var(--on-surface); +} + +::ng-deep .mat-accent .mat-slider-thumb { + background-color: var(--on-surface); +} +::ng-deep .mat-accent .mat-slider-thumb-label { + background-color: var(--on-surface); +} +::ng-deep .mat-accent .mat-slider-track-fill { + background-color: var(--on-surface); +} + diff --git a/src/app/components/shared/_dialogs/room-create/room-create.component.scss b/src/app/components/shared/_dialogs/room-create/room-create.component.scss index 20905c09a3be6ca1fe500d627c63fc2e4a3ee506..6f4fc71ee6de8c09107b227911e97911627a7421 100644 --- a/src/app/components/shared/_dialogs/room-create/room-create.component.scss +++ b/src/app/components/shared/_dialogs/room-create/room-create.component.scss @@ -26,3 +26,7 @@ input { mat-form-field { color: var(--on-surface); } + +mat-hint { + color: var(--on-surface)!important; +} diff --git a/src/app/components/shared/comment-list/comment-list.component.html b/src/app/components/shared/comment-list/comment-list.component.html index 4f4b3ded6f9cd071db19048e586fe0ea4effe1bf..498c28dd230d30db4c12928f11519594e59d90d1 100644 --- a/src/app/components/shared/comment-list/comment-list.component.html +++ b/src/app/components/shared/comment-list/comment-list.component.html @@ -1,4 +1,4 @@ -<div fxLayout="row" id="search-container" *ngIf="comments.length > 2"> +<div fxLayout="row" [ngClass]="{'search-container' : !scroll, 'search-container-fixed' : scroll}" *ngIf="comments.length > 2" (window:scroll)="checkScroll()"> <mat-label fxLayoutAlign="center center"> <mat-icon class="search-icon">search</mat-icon> </mat-label> @@ -74,8 +74,8 @@ <div fxLayout="row" fxLayoutAlign="center" *ngIf="comments.length < 3"> <button mat-fab class="fab-extended" (click)="openCreateDialog()"> - {{'comment-list.add-comment' | translate}} <mat-icon class="add">add</mat-icon> + {{'comment-list.add-comment' | translate}} </button> </div> diff --git a/src/app/components/shared/comment-list/comment-list.component.scss b/src/app/components/shared/comment-list/comment-list.component.scss index 94ba56841c7d3fbf28045f42c5061c92b6ee57ff..ae1600939708dd1c468680c0fda45b31cadf317b 100644 --- a/src/app/components/shared/comment-list/comment-list.component.scss +++ b/src/app/components/shared/comment-list/comment-list.component.scss @@ -12,19 +12,31 @@ input { box-sizing: border-box; padding: 0 10px 0 5px; width: 100%; - background-color: var(--surface); + background-color: var(--dialog); border: none; outline: none; min-height: 60px; font-size: large; border-radius: 5px; - color: var(--on-surface); + color: var(--on-secondary); +} + +.search-container { + border-radius: 5px; + background-color: var(--dialog); + margin-bottom: 2%; } -#search-container { +.search-container-fixed { border-radius: 5px; - background-color: var(--surface); + background-color: var(--dialog); margin-bottom: 2%; + position: fixed; + top: 10px; + right: center; + width: 92%; + max-width: 800px; + z-index: 1; } .search-icon { diff --git a/src/app/components/shared/comment-list/comment-list.component.ts b/src/app/components/shared/comment-list/comment-list.component.ts index 7c6c9e85ab2192d79d5bb2d11f6fb4b7d24c5f88..9cd24e35349738a46b3859fec4d8d6d616dc0133 100644 --- a/src/app/components/shared/comment-list/comment-list.component.ts +++ b/src/app/components/shared/comment-list/comment-list.component.ts @@ -1,3 +1,4 @@ +import { element } from 'protractor'; import { Component, Input, OnInit } from '@angular/core'; import { Comment } from '../../../models/comment'; import { CommentService } from '../../../services/http/comment.service'; @@ -39,6 +40,7 @@ export class CommentListComponent implements OnInit { correct = 'correct'; currentFilter = ''; commentVoteMap = new Map<string, Vote>(); + scroll = false; constructor(private commentService: CommentService, private translateService: TranslateService, @@ -79,6 +81,14 @@ export class CommentListComponent implements OnInit { }); } + checkScroll(): void { + if (document.documentElement.scrollTop >= 65) { + this.scroll = true; + } else { + this.scroll = false; + } + } + searchComments(term: string): void { if (term && term.length > 2) { this.hideCommentsList = true; diff --git a/src/app/components/shared/comment/comment.component.html b/src/app/components/shared/comment/comment.component.html index a915ff2f3e0602655f16d39c263029711452b9aa..93a3b776f4e12e90c6c0f1a448f92a7de75c8254 100644 --- a/src/app/components/shared/comment/comment.component.html +++ b/src/app/components/shared/comment/comment.component.html @@ -26,7 +26,7 @@ </button> </div> <div fxLayout="row"> - <div class="body" (click)="openPresentDialog(comment)">{{comment.body}}</div> + <div class="body" (click)="openPresentDialog(comment)">{{comment.body.trim()}}</div> <span class="fill-remaining-space" (click)="openPresentDialog(comment)"></span> <div fxLayout="column" (tap)="startAnimation('rubberBand')" [@rubberBand]="animationState" (@rubberBand.done)="resetAnimationState()"> diff --git a/src/app/components/shared/footer/footer.component.ts b/src/app/components/shared/footer/footer.component.ts index 3c77f549c4999a86b30a6567de81b7c85cb11aaf..64d7807ea8792148f2dca97fe6e017224dc58968 100644 --- a/src/app/components/shared/footer/footer.component.ts +++ b/src/app/components/shared/footer/footer.component.ts @@ -20,7 +20,7 @@ export class FooterComponent implements OnInit { blogUrl = 'https://arsnova.thm.de/blog/'; dsgvoUrl = 'https://arsnova.thm.de/blog/datenschutzerklaerung/'; imprUrl = 'https://arsnova.thm.de/blog/impressum/'; - demoId = '33602981'; + demoId = '78844652'; room: Room; user: User; diff --git a/src/app/components/shared/login/login.component.scss b/src/app/components/shared/login/login.component.scss index 26996c80c91621a53f93cd835e8678f77bb4d0b9..6801891b5d8049c9c4db56f2cfca9819b7d13f18 100644 --- a/src/app/components/shared/login/login.component.scss +++ b/src/app/components/shared/login/login.component.scss @@ -1,12 +1,12 @@ .pwReset { padding-left: 0; - color: var(--primary); + color: var(--secondary); } .regButton { margin-top: 20px; padding: 0; - color: var(--primary); + color: var(--secondary); } .loginButton { @@ -17,6 +17,7 @@ p { font-size: small; margin: 30px 5px 0 30px; + color: var(--on-surface); } input:-webkit-autofill { diff --git a/src/theme/dark-theme/darkTheme.const.ts b/src/theme/dark-theme/darkTheme.const.ts index dca8535d27dcefba290e00ce47346c06797431f0..585b7f0dd1c1a2f8442c690d37d4c3af28536541 100644 --- a/src/theme/dark-theme/darkTheme.const.ts +++ b/src/theme/dark-theme/darkTheme.const.ts @@ -8,7 +8,7 @@ export const dark = { '--background': '#121212', '--surface': '#1e1e1e', - '--dialog': '#757575', + '--dialog': '#616161', '--on-primary': '#000000', '--on-secondary': '#000000',