Replaced custom line height class

apps/client/src/app/components/admin-settings/admin-settings.component.html

@@ -90,7 +90,7 @@
                   }
                 </a>
                 @if (isGhostfolioApiKeyValid === true) {
-                  <div class="line-height-1">
+                  <div class="lh-1">
                     <small class="text-body-secondary">
                       <ng-container i18n>Valid until</ng-container>
                       {{

apps/client/src/app/components/footer/footer.component.html

@@ -192,6 +192,6 @@
 </div>
 <div class="container d-none d-md-block mt-5">
   <div class="d-flex justify-content-center">
-    <div class="fw-bold line-height-1 logotype">Ghostfolio</div>
+    <div class="fw-bold lh-1 logotype">Ghostfolio</div>
   </div>
 </div>

apps/client/src/app/components/markets/markets.html

@@ -58,7 +58,7 @@
       />
       @if (benchmarks()?.length) {
         <div
-          class="gf-text-wrap-balance line-height-1 mt-3 text-body-secondary text-center"
+          class="gf-text-wrap-balance lh-1 mt-3 text-body-secondary text-center"
         >
           <small i18n>
             Calculations are based on delayed market data and may not be

apps/client/src/app/pages/about/oss-friends/oss-friends-page.html

@@ -1,7 +1,7 @@
 <div class="container">
   <div class="row">
     <div class="col">
-      <h1 class="h3 line-height-1 mb-4 text-center">
+      <h1 class="h3 lh-1 mb-4 text-center">
         <span class="d-none d-sm-block"
           ><ng-container i18n>Our</ng-container> OSS Friends</span
         >

apps/client/src/app/pages/blog/blog-page.html

@@ -1,7 +1,7 @@
 <div class="container">
   <div class="mb-5 row">
     <div class="col">
-      <h1 class="h3 line-height-1 mb-4 text-center">
+      <h1 class="h3 lh-1 mb-4 text-center">
         <span class="d-none d-sm-block" i18n>Blog</span>
         <small class="text-body-secondary" i18n
           >Discover the latest Ghostfolio updates and insights on personal

apps/client/src/app/pages/features/features-page.html

@@ -1,7 +1,7 @@
 <div class="container">
   <div class="row">
     <div class="col">
-      <h1 class="h3 line-height-1 mb-4 text-center">
+      <h1 class="h3 lh-1 mb-4 text-center">
         <span class="d-none d-sm-block" i18n>Features</span>
         <small class="text-body-secondary" i18n>
           Check out the numerous features of Ghostfolio to manage your wealth

apps/client/src/app/pages/portfolio/activities/create-or-update-activity-dialog/create-or-update-activity-dialog.html

@@ -22,7 +22,7 @@
               ><b>{{ typesTranslationMap['BUY'] }}</b></span
             >
             <small
-              class="d-block line-height-1 text-body-secondary text-nowrap"
+              class="d-block lh-1 text-body-secondary text-nowrap"
               i18n
               >Stocks, ETFs, bonds, cryptocurrencies, commodities</small
             >
@@ -32,7 +32,7 @@
               ><b>{{ typesTranslationMap['FEE'] }}</b></span
             >
             <small
-              class="d-block line-height-1 text-body-secondary text-nowrap"
+              class="d-block lh-1 text-body-secondary text-nowrap"
               i18n
               >One-time fee, annual account fees</small
             >
@@ -42,7 +42,7 @@
               ><b>{{ typesTranslationMap['DIVIDEND'] }}</b></span
             >
             <small
-              class="d-block line-height-1 text-body-secondary text-nowrap"
+              class="d-block lh-1 text-body-secondary text-nowrap"
               i18n
               >Distribution of corporate earnings</small
             >
@@ -52,7 +52,7 @@
               ><b>{{ typesTranslationMap['INTEREST'] }}</b></span
             >
             <small
-              class="d-block line-height-1 text-body-secondary text-nowrap"
+              class="d-block lh-1 text-body-secondary text-nowrap"
               i18n
               >Revenue for lending out money</small
             >
@@ -62,7 +62,7 @@
               ><b>{{ typesTranslationMap['LIABILITY'] }}</b></span
             >
             <small
-              class="d-block line-height-1 text-body-secondary text-nowrap"
+              class="d-block lh-1 text-body-secondary text-nowrap"
               i18n
               >Mortgages, personal loans, credit cards</small
             >
@@ -72,7 +72,7 @@
               ><b>{{ typesTranslationMap['SELL'] }}</b></span
             >
             <small
-              class="d-block line-height-1 text-body-secondary text-nowrap"
+              class="d-block lh-1 text-body-secondary text-nowrap"
               i18n
               >Stocks, ETFs, bonds, cryptocurrencies, commodities</small
             >
@@ -82,7 +82,7 @@
               ><b>{{ typesTranslationMap['VALUABLE'] }}</b></span
             >
             <small
-              class="d-block line-height-1 text-body-secondary text-nowrap"
+              class="d-block lh-1 text-body-secondary text-nowrap"
               i18n
               >Luxury items, real estate, private companies</small
             >

apps/client/src/app/pages/portfolio/activities/import-activities-dialog/import-activities-dialog.html

@@ -38,7 +38,7 @@
                 }}</mat-select-trigger>
                 @for (holding of holdings; track holding) {
                   <mat-option
-                    class="line-height-1"
+                    class="lh-1"
                     [value]="{
                       assetProfile: {
                         dataSource: holding.assetProfile.dataSource,

apps/client/src/app/pages/pricing/pricing-page.html

@@ -236,7 +236,7 @@
                       <ion-icon name="information-circle-outline" />
                     </span>
                   </li>
-                  <li class="align-items-center d-flex line-height-1 mb-1">
+                  <li class="align-items-center d-flex lh-1 mb-1">
                     <ion-icon
                       class="invisible me-1"
                       name="checkmark-circle-outline"
@@ -301,7 +301,7 @@
               @if (durationExtension) {
                 <div class="mt-3">
                   <div
-                    class="badge bg-warning fw-normal line-height-1 p-3 text-dark w-100"
+                    class="badge bg-warning fw-normal lh-1 p-3 text-dark w-100"
                   >
                     <strong i18n>Limited Offer!</strong>
                     <ng-container>&nbsp;</ng-container>

apps/client/src/styles.scss

@@ -372,10 +372,6 @@ ngx-skeleton-loader {
   font-weight: unset;
 }
 
-.line-height-1 {
-  line-height: 1;
-}
-
 .line-height-normal {
   line-height: normal !important;
 }

apps/client/src/styles/bootstrap.scss

@@ -67,7 +67,6 @@ $unused-utilities: (
   'font-style',
   'gap',
   'gradient',
-  'line-height',
   'link-offset',
   'link-opacity',
   'link-underline',

libs/ui/src/lib/account-selector/account-selector.component.html

@@ -11,7 +11,7 @@
     (closed)="onPanelClosed()"
   >
     <mat-select-trigger>
-      <div class="align-items-center align-middle d-inline-flex line-height-1">
+      <div class="align-items-center align-middle d-inline-flex lh-1">
         @if (selectedAccount()?.platform?.url) {
           <gf-entity-logo
             class="me-1"
@@ -36,7 +36,7 @@
             [tooltip]="account.platform?.name ?? ''"
             [url]="account.platform?.url ?? ''"
           />
-          <div class="line-height-1">
+          <div class="lh-1">
             <span>{{ account.name }}</span>
             <br />
             <small class="text-body-secondary">

libs/ui/src/lib/assistant/assistant-list-item/assistant-list-item.html

@@ -1,6 +1,6 @@
 <a
   #link
-  class="d-block line-height-1 px-3 py-1 text-truncate"
+  class="d-block lh-1 px-3 py-1 text-truncate"
   [queryParams]="queryParams"
   [routerLink]="routerLink"
   (click)="onClick()"

libs/ui/src/lib/currency-selector/currency-selector.component.html

@@ -20,7 +20,7 @@
   (optionSelected)="onUpdateCurrency($event)"
 >
   @for (currency of filteredCurrencies; track currency) {
-    <mat-option class="line-height-1" [value]="currency">
+    <mat-option class="lh-1" [value]="currency">
       <span class="align-items-center d-flex">
         <gf-entity-logo
           class="me-1"

libs/ui/src/lib/entity-logo/entity-logo.component.html

@@ -8,7 +8,7 @@
   >
     <span
       aria-hidden="true"
-      class="align-items-center d-flex emoji justify-content-center line-height-1 position-absolute"
+      class="align-items-center d-flex emoji justify-content-center lh-1 position-absolute"
     >
       {{ emojiFlag }}
     </span>

libs/ui/src/lib/portfolio-filter-form/portfolio-filter-form.component.html

@@ -21,7 +21,7 @@
         <mat-option [value]="null" />
         @for (holding of holdings(); track holding.assetProfile.name) {
           <mat-option [value]="holding">
-            <div class="line-height-1 text-truncate">
+            <div class="lh-1 text-truncate">
               <span>{{ holding.assetProfile.name }}</span>
               <br />
               <small class="text-body-secondary"

libs/ui/src/lib/symbol-autocomplete/symbol-autocomplete.component.html

@@ -15,11 +15,11 @@
   @if (!isLoading) {
     @for (lookupItem of lookupItems; track lookupItem) {
       <mat-option
-        class="line-height-1"
+        class="lh-1"
         [disabled]="lookupItem.dataProviderInfo.isPremium"
         [value]="lookupItem"
       >
-        <span class="align-items-center d-flex line-height-1"
+        <span class="align-items-center d-flex lh-1"
           ><span>{{ lookupItem.name }}</span>
           @if (lookupItem.dataProviderInfo.isPremium) {
             <gf-premium-indicator class="ms-1" [enableLink]="false" />
@@ -40,7 +40,7 @@
       </mat-option>
     } @empty {
       @if (control.value?.length > 1) {
-        <mat-option class="line-height-1" disabled="true" i18n
+        <mat-option class="lh-1" disabled="true" i18n
           >Oops! Could not find any assets.</mat-option
         >
       }