feat: rework settings page design

src/app/modules/about/about-licenses.html

@@ -1,5 +1,5 @@
 <!--
-  ~ Copyright (C) 2022 StApps
+  ~ Copyright (C) 2023 StApps
   ~ This program is free software: you can redistribute it and/or modify it
   ~ under the terms of the GNU General Public License as published by the Free
   ~ Software Foundation, version 3.
@@ -22,28 +22,32 @@
     <!-- TODO: translation -->
   </ion-toolbar>
 </ion-header>
-<cdk-virtual-scroll-viewport itemSize="130" minBufferPx="1500" maxBufferPx="2000">
-  <ion-card
-    *cdkVirtualFor="let license of licenses"
-    [href]="license.url || license.repository"
-    rel="external"
-    target="_blank"
-  >
-    <ion-card-header>
-      <ion-card-title>
-        {{ license.name }}
-        <ion-icon size="16" weight="300" class="supertext-icon" name="open_in_browser"></ion-icon>
-      </ion-card-title>
+<ion-content class="ion-content-parallax">
+  <div>
+    <div class="licenses-content">
+      <ion-card
+        *ngFor="let license of licenses"
+        [href]="license.url || license.repository"
+        rel="external"
+        target="_blank"
+      >
+        <ion-card-header>
+          <ion-card-title>
+            {{ license.name }}
+            <ion-icon size="16" weight="300" class="supertext-icon" name="open_in_browser"></ion-icon>
+          </ion-card-title>
 
-      <ion-card-subtitle *ngIf="license.authors || license.publisher">
-        {{ license.authors || license.publisher }}
-      </ion-card-subtitle>
-    </ion-card-header>
-    <ion-card-content>
-      <ion-chip (click)="$event.preventDefault(); viewLicense(license)">
-        <ion-icon name="copyright"></ion-icon>
-        <ion-label>{{ license.licenses }} License</ion-label>
-      </ion-chip>
-    </ion-card-content>
-  </ion-card>
-</cdk-virtual-scroll-viewport>
+          <ion-card-subtitle *ngIf="license.authors || license.publisher">
+            {{ license.authors || license.publisher }}
+          </ion-card-subtitle>
+        </ion-card-header>
+        <ion-card-content>
+          <ion-chip (click)="$event.preventDefault(); viewLicense(license)">
+            <ion-icon name="copyright"></ion-icon>
+            <ion-label>{{ license.licenses }} License</ion-label>
+          </ion-chip>
+        </ion-card-content>
+      </ion-card>
+    </div>
+  </div>
+</ion-content>