From 75e2b855c0880ed443f39b490c4842a8eba83b1c Mon Sep 17 00:00:00 2001
From: Thomas Kaul <4159106+dtslvr@users.noreply.github.com>
Date: Sat, 25 Apr 2026 11:00:02 +0200
Subject: [PATCH] Task/various style improvements (#6780)

* Various style improvements

* Update changelog
---
 CHANGELOG.md                                      |  1 +
 .../admin-market-data.component.ts                |  2 +-
 .../asset-profile-dialog.html                     |  2 +-
 .../create-or-update-platform-dialog.html         |  2 +-
 .../login-with-access-token-dialog.html           |  8 +++++---
 .../user-account-access/user-account-access.html  |  4 +++-
 .../user-account-settings.html                    |  4 +++-
 .../src/app/pages/register/register-page.html     |  4 ++--
 .../activities-filter.component.html              | 15 ++++-----------
 9 files changed, 21 insertions(+), 21 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index cbccc5eb1..7f861d45d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -9,6 +9,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Changed
 
+- Improved the styling of buttons and input fields across various components
 - Upgraded `prettier` from version `3.8.2` to `3.8.3`
 
 ## 3.0.0 - 2026-04-23
diff --git a/apps/client/src/app/components/admin-market-data/admin-market-data.component.ts b/apps/client/src/app/components/admin-market-data/admin-market-data.component.ts
index d3265946f..fd96c94fc 100644
--- a/apps/client/src/app/components/admin-market-data/admin-market-data.component.ts
+++ b/apps/client/src/app/components/admin-market-data/admin-market-data.component.ts
@@ -157,7 +157,7 @@ export class GfAdminMarketDataComponent implements AfterViewInit, OnInit {
   public ghostfolioScraperApiSymbolPrefix = ghostfolioScraperApiSymbolPrefix;
   public hasPermissionForSubscription: boolean;
   public info: InfoItem;
-  public isLoading = false;
+  public isLoading = true;
   public isUUID = isUUID;
   public placeholder = '';
   public pageSize = DEFAULT_PAGE_SIZE;
diff --git a/apps/client/src/app/components/admin-market-data/asset-profile-dialog/asset-profile-dialog.html b/apps/client/src/app/components/admin-market-data/asset-profile-dialog/asset-profile-dialog.html
index cfae840a8..32ae24eb2 100644
--- a/apps/client/src/app/components/admin-market-data/asset-profile-dialog/asset-profile-dialog.html
+++ b/apps/client/src/app/components/admin-market-data/asset-profile-dialog/asset-profile-dialog.html
@@ -421,7 +421,7 @@
                 <input formControlName="url" matInput type="text" />
                 @if (assetProfileForm.controls.url.value) {
                   <gf-entity-logo
-                    class="mr-3"
+                    class="mat-icon"
                     matSuffix
                     [url]="assetProfileForm.controls.url.value"
                   />
diff --git a/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.html b/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.html
index 0e39d7653..50193c2cc 100644
--- a/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.html
+++ b/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.html
@@ -30,7 +30,7 @@
         />
         @if (platformForm.get('url')?.value) {
           <gf-entity-logo
-            class="mr-3"
+            class="mat-icon"
             matSuffix
             [url]="platformForm.get('url').value"
           />
diff --git a/apps/client/src/app/components/login-with-access-token-dialog/login-with-access-token-dialog.html b/apps/client/src/app/components/login-with-access-token-dialog/login-with-access-token-dialog.html
index 78604456b..4f4bb1867 100644
--- a/apps/client/src/app/components/login-with-access-token-dialog/login-with-access-token-dialog.html
+++ b/apps/client/src/app/components/login-with-access-token-dialog/login-with-access-token-dialog.html
@@ -13,12 +13,14 @@
             (keydown.enter)="onLoginWithAccessToken(); $event.preventDefault()"
           />
           <button
-            mat-button
+            class="mx-2"
+            mat-icon-button
             matSuffix
             type="button"
             (click)="isAccessTokenHidden = !isAccessTokenHidden"
           >
             <ion-icon
+              class="mat-icon"
               [name]="isAccessTokenHidden ? 'eye-outline' : 'eye-off-outline'"
             />
           </button>
@@ -34,7 +36,7 @@
       @if (data.hasPermissionToUseAuthGoogle) {
         <div class="d-flex flex-column">
           <a
-            class="px-4 rounded-pill"
+            class="px-4 py-3 rounded-pill"
             href="../api/v1/auth/google"
             mat-stroked-button
             ><img
@@ -49,7 +51,7 @@
       @if (data.hasPermissionToUseAuthOidc) {
         <div class="d-flex flex-column mt-2">
           <a
-            class="px-4 rounded-pill"
+            class="px-4 py-3 rounded-pill"
             href="../api/auth/oidc"
             mat-stroked-button
             ><ng-container i18n>Sign in with OpenID Connect</ng-container></a
diff --git a/apps/client/src/app/components/user-account-access/user-account-access.html b/apps/client/src/app/components/user-account-access/user-account-access.html
index 8160c2c8e..412a2f8d2 100644
--- a/apps/client/src/app/components/user-account-access/user-account-access.html
+++ b/apps/client/src/app/components/user-account-access/user-account-access.html
@@ -19,12 +19,14 @@
             [type]="isAccessTokenHidden ? 'password' : 'text'"
           />
           <button
-            mat-button
+            class="mx-2"
+            mat-icon-button
             matSuffix
             type="button"
             (click)="isAccessTokenHidden = !isAccessTokenHidden"
           >
             <ion-icon
+              class="mat-icon"
               [name]="isAccessTokenHidden ? 'eye-outline' : 'eye-off-outline'"
             />
           </button>
diff --git a/apps/client/src/app/components/user-account-settings/user-account-settings.html b/apps/client/src/app/components/user-account-settings/user-account-settings.html
index 93ed614cc..f646ef0fd 100644
--- a/apps/client/src/app/components/user-account-settings/user-account-settings.html
+++ b/apps/client/src/app/components/user-account-settings/user-account-settings.html
@@ -292,12 +292,14 @@
                   [type]="isAccessTokenHidden ? 'password' : 'text'"
                 />
                 <button
-                  mat-button
+                  class="mx-2"
+                  mat-icon-button
                   matSuffix
                   type="button"
                   (click)="isAccessTokenHidden = !isAccessTokenHidden"
                 >
                   <ion-icon
+                    class="mat-icon"
                     [name]="
                       isAccessTokenHidden ? 'eye-outline' : 'eye-off-outline'
                     "
diff --git a/apps/client/src/app/pages/register/register-page.html b/apps/client/src/app/pages/register/register-page.html
index a95a02ce0..c62063537 100644
--- a/apps/client/src/app/pages/register/register-page.html
+++ b/apps/client/src/app/pages/register/register-page.html
@@ -20,7 +20,7 @@
         <div class="py-5 text-center">
           @if (hasPermissionForAuthToken) {
             <button
-              class="d-inline-block"
+              class="py-3"
               color="primary"
               mat-flat-button
               (click)="openShowAccessTokenDialog()"
@@ -33,7 +33,7 @@
           }
           @if (hasPermissionForAuthGoogle) {
             <a
-              class="px-4 rounded-pill w-100"
+              class="px-4 py-3 rounded-pill w-100"
               href="../api/v1/auth/google"
               mat-stroked-button
               ><img
diff --git a/libs/ui/src/lib/activities-filter/activities-filter.component.html b/libs/ui/src/lib/activities-filter/activities-filter.component.html
index d87ce16ce..b525e5133 100644
--- a/libs/ui/src/lib/activities-filter/activities-filter.component.html
+++ b/libs/ui/src/lib/activities-filter/activities-filter.component.html
@@ -1,7 +1,5 @@
 <mat-form-field appearance="outline" class="w-100">
-  <button disabled mat-icon-button matPrefix>
-    <ion-icon name="search-outline" />
-  </button>
+  <ion-icon class="mat-icon" matPrefix name="search-outline" />
   <mat-chip-grid #chipList aria-label="Search keywords">
     @for (filter of selectedFilters; track filter) {
       <mat-chip-row
@@ -42,12 +40,7 @@
     }
   </mat-autocomplete>
 
-  <button
-    disabled
-    mat-icon-button
-    matSuffix
-    [ngClass]="{ 'd-none': !isLoading() }"
-  >
-    <mat-spinner matSuffix [diameter]="20" />
-  </button>
+  @if (isLoading()) {
+    <mat-spinner class="mx-2" matSuffix [diameter]="20" />
+  }
 </mat-form-field>