Merge branch '405-reposition-rename-categories-menu' into 'master'

reposition rename categories

Closes #405

See merge request arsnova/frag.jetzt!408

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

 <ars-row ars-flex-box>
   <ars-row>
+    <div class="anchor-wrp">
+      <div class="anchor-right">
+        <mat-form-field *ngIf="tags" class="tag-form-field">
+          <mat-label>{{'comment-page.tag' | translate}}</mat-label>
+          <mat-select [(ngModel)]="selectedTag" class="tag-select">
+            <mat-option *ngFor="let tag of tags" value="{{tag}}">
+              {{tag}}
+            </mat-option>
+          </mat-select>
+        </mat-form-field>
+      </div>
+    </div>
     <mat-tab-group>
       <mat-tab label="{{ 'comment-page.write-comment' | translate }}">
         <ars-row [height]="12"></ars-row>
@@ -7,16 +19,24 @@
           <mat-divider></mat-divider>
         </ars-row>
         <ars-row [height]="12"></ars-row>
-        <ars-row [overflow]="'auto'" style="max-height:calc( 100vh - 250px )">
+        <ars-row [overflow]="'auto'"
+                 style="max-height:calc( 100vh - 250px )">
           <mat-form-field style="width:100%;">
-            <textarea (focus)="eventService.makeFocusOnInputTrue()" style="margin-top:15px;width:100%;"
+            <textarea (focus)="eventService.makeFocusOnInputTrue()"
+                      style="margin-top:15px;width:100%;"
                       (blur)="eventService.makeFocusOnInputFalse()"
                       matInput #commentBody matTextareaAutosize
                       matAutosizeMinRows=5 matAutosizeMaxRows=10  maxlength="250"
                       [formControl]="bodyForm" aria-labelledby="ask-question-description">
             </textarea>
-            <mat-placeholder class="placeholder">{{ 'comment-page.enter-comment' | translate }}</mat-placeholder>
-            <mat-hint align="end"><span aria-hidden="true">{{commentBody.value.length}} / 250</span></mat-hint>
+            <mat-placeholder class="placeholder">
+              {{ 'comment-page.enter-comment' | translate }}
+            </mat-placeholder>
+            <mat-hint align="end">
+              <span aria-hidden="true">
+                {{commentBody.value.length}} / 250
+              </span>
+            </mat-hint>
           </mat-form-field>
         </ars-row>
       </mat-tab>
@@ -36,16 +56,6 @@
     <mat-divider></mat-divider>
   </ars-row>
   <ars-row ars-flex-box>
-    <ars-col>
-      <mat-form-field *ngIf="tags" class="tag-form-field">
-        <mat-label>{{'comment-page.tag' | translate}}</mat-label>
-        <mat-select [(ngModel)]="selectedTag" class="tag-select">
-          <mat-option *ngFor="let tag of tags" value="{{tag}}">
-            {{tag}}
-          </mat-option>
-        </mat-select>
-      </mat-form-field>
-    </ars-col>
     <ars-fill>
     </ars-fill>
     <ars-col>

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

@@ -40,13 +40,34 @@ mat-hint {
 
 .tag-form-field{
   @media screen and (max-width:500px) {
-    width:40px;
+    width:70px;
   }
+  z-index:10000;
 }
 
 .tag-select{
 }
 
+.anchor-right{
+  @media screen and (max-width:500px) {
+    width:70px;
+    left:calc( 100% - 70px );
+  }
+  width:200px;
+  height:50px;
+  position:relative;
+  left:calc( 100% - 200px );
+  top:0;
+}
+
+.anchor-wrp{
+  width:100%;
+  height:0;
+  position:relative;
+  left:0;
+  top:0;
+}
+
 ::ng-deep .mat-form-field-label {
   color: var(--on-surface)!important;
 }

src/assets/i18n/creator/de.json

@@ -110,7 +110,7 @@
     "semicolon": "CSV-Format (.csv)",
     "send": "Senden",
     "send-description": "Frage abschicken",
-    "tag": "Kategorie",
+    "tag": "Tag",
     "vote-down": "Frage abwerten",
     "vote-up": "Frage aufwerten",
     "write-comment": "Schreiben",

src/assets/i18n/participant/de.json

@@ -52,7 +52,7 @@
     "sort-vote-asc": "Positivste Bewertung zuerst",
     "sort-vote-desc": "Negativste Bewertung zuerst",
     "sort-list-time": "Neueste Frage zuerst",
-    "tag": "Kategorie",
+    "tag": "Tag",
     "time": "Zeit",
     "unread": "Nicht im Hörsaal besprochen",
     "vote-asc": "Aufsteigende Bewertungen",