Refactor to ordered list

apps/client/src/app/pages/portfolio/analysis/analysis-page.html

@@ -41,7 +41,8 @@
           >
         </mat-card-header>
         <mat-card-content>
-          <div *ngFor="let position of top3; let i = index" class="py-1">
+          <ol class="mb-0 ml-1 pl-3">
+            <li *ngFor="let position of top3" class="py-1">
               <a
                 class="d-flex"
                 [queryParams]="{
@@ -52,7 +53,7 @@
                 [routerLink]="[]"
               >
                 <div class="flex-grow-1 mr-2 text-truncate">
-                {{ i + 1 }}. {{ position.name }}
+                  {{ position.name }}
                 </div>
                 <div class="d-flex justify-content-end">
                   <gf-value
@@ -65,7 +66,8 @@
                   ></gf-value>
                 </div>
               </a>
-          </div>
+            </li>
+          </ol>
           <div>
             <ngx-skeleton-loader
               *ngIf="!top3"
@@ -87,7 +89,8 @@
           >
         </mat-card-header>
         <mat-card-content>
-          <div *ngFor="let position of bottom3; let i = index" class="py-1">
+          <ol class="mb-0 ml-1 pl-3">
+            <li *ngFor="let position of bottom3" class="py-1">
               <a
                 class="d-flex"
                 [queryParams]="{
@@ -98,7 +101,7 @@
                 [routerLink]="[]"
               >
                 <div class="flex-grow-1 mr-2 text-truncate">
-                {{ i + 1 }}. {{ position.name }}
+                  {{ position.name }}
                 </div>
                 <div class="d-flex justify-content-end">
                   <gf-value
@@ -111,7 +114,8 @@
                   ></gf-value>
                 </div>
               </a>
-          </div>
+            </li>
+          </ol>
           <div>
             <ngx-skeleton-loader
               *ngIf="!bottom3"