Feature/improve spacing of buttons in button container of holding detail dialog (#5692)

* Improve spacing

* Update changelog

CHANGELOG.md

@@ -12,6 +12,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Added support for a date range query parameter in the data gathering endpoint
 - Added a _Storybook_ story for the activities table component
 
+### Changed
+
+- Improved the spacing around the buttons in the holding detail dialog
+
 ## 2.206.0 - 2025-10-04
 
 ### Changed

apps/client/src/app/components/holding-detail-dialog/holding-detail-dialog.component.scss

@@ -8,5 +8,9 @@
       aspect-ratio: 16 / 9;
       margin: 0 -0.5rem;
     }
+
+    .button-container {
+      gap: 0.5rem;
+    }
   }
 }

apps/client/src/app/components/holding-detail-dialog/holding-detail-dialog.html

@@ -424,33 +424,34 @@
       (dataSource?.data.length > 0 &&
         data.hasPermissionToReportDataGlitch === true)
     ) {
+      <hr />
       <div class="row">
         <div class="col">
-          <hr />
+          <div class="button-container d-flex flex-wrap">
-          @if (data.hasPermissionToAccessAdminControl) {
+            @if (data.hasPermissionToAccessAdminControl) {
-            <a
+              <a
-              class="mr-2"
+                mat-stroked-button
-              mat-stroked-button
+                [queryParams]="{
-              [queryParams]="{
+                  assetProfileDialog: true,
-                assetProfileDialog: true,
+                  dataSource: SymbolProfile?.dataSource,
-                dataSource: SymbolProfile?.dataSource,
+                  symbol: SymbolProfile?.symbol
-                symbol: SymbolProfile?.symbol
+                }"
-              }"
+                [routerLink]="routerLinkAdminControlMarketData"
-              [routerLink]="routerLinkAdminControlMarketData"
+                (click)="onClose()"
-              (click)="onClose()"
+                ><ion-icon class="mr-1" name="create-outline"></ion-icon
-              ><ion-icon class="mr-1" name="create-outline"></ion-icon
+                ><span i18n>Manage Asset Profile</span>...</a
-              ><span i18n>Manage Asset Profile</span>...</a
+              >
-            >
+            }
-          }
+            @if (
-          @if (
+              dataSource?.data.length > 0 &&
-            dataSource?.data.length > 0 &&
+              data.hasPermissionToReportDataGlitch === true
-            data.hasPermissionToReportDataGlitch === true
+            ) {
-          ) {
+              <a color="warn" mat-stroked-button [href]="reportDataGlitchMail"
-            <a color="warn" mat-stroked-button [href]="reportDataGlitchMail"
+                ><ion-icon class="mr-1" name="flag-outline"></ion-icon
-              ><ion-icon class="mr-1" name="flag-outline"></ion-icon
+                ><span i18n>Report Data Glitch</span>...</a
-              ><span i18n>Report Data Glitch</span>...</a
+              >
-            >
+            }
-          }
+          </div>
         </div>
       </div>
     }