Rework folder structure in frontend

Pages are now grouped per group they appear in on in the header (where possible)
Utilities used by multiple pages in the project are grouped in folders such as services/pipes/etc

frontend/src/app/pages/particles/particles.component.html

@@ -0,0 +1,40 @@
+<app-header current_page="particles" height="200px" background_image="/public/img/backgrounds/staff.png"
+            [overlay_gradient]="0.5">
+  <div class="title" header-content>
+    <h1>Particle Creator</h1>
+  </div>
+</app-header>
+
+<main>
+  <section class="darkmodeSection">
+    <section class="column">
+      <div class="renderer-section column">
+        <div class="flex row">
+          <div class="flex side-column">
+            <app-particle-properties></app-particle-properties>
+          </div>
+          <div class="flex middle-column">
+            <app-render-container></app-render-container>
+            <div class="plane-controls">
+              <label>Plane Position (Z-axis):</label>
+              <mat-slider [min]="minOffset" [max]="maxOffset" step="1" #planeSlider>
+                <input matSliderThumb [(ngModel)]="planePosition" (input)="updatePlanePosition($event)">
+              </mat-slider>
+              <span>{{ planePosition }} offset from center</span>
+            </div>
+          </div>
+          <div class="flex side-column">
+            <app-particle></app-particle>
+            <app-frames></app-frames>
+            <div>
+              <button mat-fab extended (click)="copyJson()">
+                <mat-icon>content_copy</mat-icon>
+                Copy JSON to clipboard
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+  </section>
+</main>