Merge branch '553-show-the-question-number-also-on-the-question-wall' into 'staging'

add number to questions in questionwall

Closes #553

See merge request arsnova/frag.jetzt!564

src/app/components/shared/questionwall/question-wall/question-wall.component.html

@@ -113,7 +113,16 @@
     <ars-fill style="overflow:hidden;" ars-flex-box>
       <ars-fill>
       </ars-fill>
-      <ars-row class="questionwall-present-box-outer">
+      <ars-row ars-flex-box height="400">
+        <ars-fill></ars-fill>
+        <ars-col ars-flex-box>
+          <ars-row *ngIf="commentFocus">
+            <p class="questionwall-present-meta-number">{{commentFocus.comment.number}}</p>
+          </ars-row>
+          <ars-fill></ars-fill>
+        </ars-col>
+      </ars-row>
+      <ars-row class="questionwall-present-box-outer" style="margin-top:-400px;">
         <div class="questionwall-present-box-inner">
           <ng-container *ngIf="commentFocus">
             <ars-row class="questionwall-present-meta">
@@ -210,7 +219,17 @@
           <ars-row *ngFor="let comment of hasFilter?commentsFilter:commentsFilteredByTime"
                    class="questionwall-comment-anchor"
                    style="float:left;">
-            <ars-row style="box-sizing:border-box;padding:8px;">
+            <ars-row ars-flex-box height="170">
+              <ars-fill></ars-fill>
+              <ars-col ars-flex-box>
+                <ars-fill></ars-fill>
+                  <ars-row>
+                    <p class="questionwall-comment-number">{{comment.comment.number}}</p>
+                  </ars-row>
+                <ars-fill></ars-fill>
+              </ars-col>
+            </ars-row>
+            <ars-row style="box-sizing:border-box;padding:8px;margin-top:-170px;">
               <ars-row
                 [ngClass]="comment===commentFocus?'questionwall-comment-border-on':'questionwall-comment-border-off'"
                 style="border-radius:5px">

src/app/components/shared/questionwall/question-wall/question-wall.component.scss

@@ -118,6 +118,16 @@
         font-weight: 600;
         color: #cc4244;
       }
+
+      &-number {
+        font-size: 144px;
+        text-transform: uppercase;
+        letter-spacing: 2px;
+        padding-right:8px;
+        box-sizing:border-box;
+        font-weight: 600;
+        color: rgba(255,255,255,0.2);
+      }
     }
 
     &-list {
@@ -219,6 +229,14 @@
           font-weight: 400;
           color: var(--ars-paragraph-color);
         }
+
+        &-number {
+          font-family: Roboto, 'sans-serif';
+          font-size: 256px;
+          padding-left:16px;
+          font-weight:bold;
+          color: rgba(255,255,255,0.2);
+        }
       }
 
       &-introduction {