Merge branch 'several-fixes' into 'master'

Several fixes

See merge request !194

src/app/components/participant/room-participant-page/room-participant-page.component.html

@@ -12,16 +12,17 @@
       </mat-card-header>
       <mat-divider></mat-divider>
       <mat-card-content fxLayoutAlign="center">
-        <mat-expansion-panel *ngIf="!(room.description == '')" class="mat-elevation-z0">
+        <!-- <mat-expansion-panel *ngIf="!(room.description == '')" class="mat-elevation-z0">
           <mat-expansion-panel-header>
             <h4>{{ 'room-page.description' | translate }}</h4>
           </mat-expansion-panel-header>
           <p>
             {{ room.description }}
           </p>
-        </mat-expansion-panel>
+        </mat-expansion-panel> -->
+        <h4>{{room.description}}</h4>
       </mat-card-content>
-      <mat-grid-list cols="3" rowHeight="2:1">
+      <mat-grid-list cols="2" rowHeight="2:1">
         <mat-grid-tile>
           <button mat-icon-button routerLink="/participant/room/{{ room.shortId }}/comments">
             <mat-icon>question_answer</mat-icon>
@@ -34,14 +35,14 @@
             <h3 *ngIf="deviceType === 'desktop'">{{ 'room-page.give-feedback' | translate}}</h3>
           </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>
           </button>
-        </mat-grid-tile>
+        </mat-grid-tile> -->
       </mat-grid-list>
-      <app-content-groups *ngIf="room && room.contentGroups" [contentGroups]="room.contentGroups"></app-content-groups>
+      <!-- <app-content-groups *ngIf="room && room.contentGroups" [contentGroups]="room.contentGroups"></app-content-groups> -->
     </mat-card>
   </div>
 </div>

src/app/components/participant/room-participant-page/room-participant-page.component.scss

@@ -11,16 +11,16 @@ mat-card-content>:first-child {
 }
 
 .mat-icon-button {
-  width: 75%;
-  height: 75%;
+  width: 100%;
+  height: 100%;
   margin-bottom: 10px;
   color: var(--primary)!important;
 }
 
 mat-icon {
-  font-size: 50px;
-  height: 50px;
-  width: 50px;
+  font-size: 70px;
+  height: 70px;
+  width: 70px;
   line-height: 100%!important;
 }
 
@@ -33,26 +33,21 @@ button {
   }
 }
 
-p {
-  font-size: medium;
-  color: var(--on-surface)!important;
-}
-
 h2 {
   font-size: large;
-  color: var(--on-surface)!important;
+  color: var(--on-surface);
 }
 
 h3 {
   font-size: larger;
-  color: var(--on-surface)!important;
-  margin-top: 10px;
+  color: var(--on-surface);
+  margin-top: 15px;
   margin-bottom: 10px;
 }
 
 h4 {
   font-size: medium;
-  color: var(--on-surface)!important;
+  color: var(--on-surface);
 }
 
 mat-card-header {

src/app/components/shared/_dialogs/create-comment/create-comment.component.html

 <div fxLayout="column" fxLayoutAlign="center" fxLayoutGap="20px">
   <mat-form-field class="input-block">
       <textarea matInput #commentBody placeholder="{{ 'comment-page.enter-comment' | translate}}"
-                matAutosizeMinRows=2 matAutosizeMaxRows=5  maxlength="255" [formControl]="bodyForm"></textarea>
+                matTextareaAutosize matAutosizeMinRows=5 matAutosizeMaxRows=10  maxlength="255"
+                [formControl]="bodyForm"></textarea>
     <mat-hint align="end">{{commentBody.value.length}} / 255</mat-hint>
   </mat-form-field>
   <div fxLayout="row" fxLayoutAlign="center" fxLayoutGap="20px">

src/app/components/shared/_dialogs/create-comment/create-comment.component.scss

@@ -22,3 +22,7 @@ textarea {
   color: var(--on-primary);
   background-color: var(--primary);
 }
+
+mat-hint {
+  color: var(--on-surface) !important;
+}

src/app/components/shared/feedback-barometer-page/feedback-barometer-page.component.html

@@ -3,8 +3,7 @@
     <div fxLayout="row" fxLayoutGap="30px" *ngFor="let state of feedback">
       <mat-icon matTooltip="{{ state.message }}"
               (click)="userRole === 0 && submitFeedback(state.state)">{{ state.name }}</mat-icon>
-      <mat-progress-bar [value]="state.count" color="accent">
-      </mat-progress-bar>
+      <mat-progress-bar [value]="state.count" color="accent"></mat-progress-bar>
     </div>
     <div fxLayoutAlign="center" *ngIf="userRole === 1">
       <button mat-raised-button color="primary" fxLayoutAlign="center" (click)="toggle()">Toggle voting</button>

src/app/components/shared/feedback-barometer-page/feedback-barometer-page.component.scss

 mat-card {
   max-width: 800px;
   width: 100%;
+  background-color: var(--surface);
 }
 
 mat-progress-bar {
@@ -12,4 +13,5 @@ mat-icon {
   font-size: 300%;
   height: 50px;
   width: 50px;
+  color: var(--secondary);
 }

src/app/components/shared/room-join/room-join.component.html

@@ -5,7 +5,7 @@
       <input matInput #roomId type="text" pattern="[0-9 ]*" inputmode="numeric" min="00000000" max="99999999"
              onkeydown="if(this.value.length - (this.value.split(' ').length -1) === 8 && event.keyCode != 8) return false;
                         if(this.value.length === 4 && event.keyCode != 8) this.value = this.value + ' ';"
-                        placeholder="Session-Id" [formControl]="roomFormControl" [errorStateMatcher]="matcher"/>
+                        placeholder="Session-ID" [formControl]="roomFormControl" [errorStateMatcher]="matcher"/>
       <mat-hint align="end">{{ roomId.value.length - (roomId.value.split(' ').length -1) }} / 8</mat-hint>
       <mat-error *ngIf="roomFormControl.hasError('required')">{{ 'home-page.please-enter' | translate}}</mat-error>
       <mat-error *ngIf="roomFormControl.hasError('pattern')">{{ 'home-page.only-numbers' | translate}}</mat-error>