fix: Button icon only regression. Fixed: #17338

primefaces · Jan 9, 2025 · 536fccc · 536fccc
1 parent eafb8b1
commit 536fccc
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 2 deletions.
diff --git a/apps/showcase/assets/styles/layout/_core.scss b/apps/showcase/assets/styles/layout/_core.scss
@@ -2,7 +2,7 @@ html {
     font-size: 14px;
     font-family: "Inter var", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
     font-feature-settings: "cv02","cv03","cv04","cv11";
-    line-height: normal;
+    line-height: 1.2;
 }
 
 .material {

diff --git a/packages/primeng/src/button/button.ts b/packages/primeng/src/button/button.ts
@@ -460,7 +460,7 @@ export class ButtonDirective extends BaseComponent implements AfterViewInit, OnD
                 <span *ngIf="icon && !iconTemplate && !_iconTemplate" [class]="icon" [ngClass]="iconClass()" [attr.data-pc-section]="'icon'"></span>
                 <ng-template [ngIf]="!icon && (iconTemplate || _iconTemplate)" *ngTemplateOutlet="iconTemplate || _iconTemplate; context: { class: iconClass() }"></ng-template>
             </ng-container>
-            <span class="p-button-label" [attr.aria-hidden]="icon && !label" *ngIf="!contentTemplate && !_contentTemplate" [attr.data-pc-section]="'label'">{{ label || '&nbsp;' }}</span>
+            <span class="p-button-label" [attr.aria-hidden]="icon && !label" *ngIf="!contentTemplate && !_contentTemplate && label" [attr.data-pc-section]="'label'">{{ label }}</span>
             <p-badge *ngIf="!contentTemplate && !_contentTemplate && badge" [value]="badge" [severity]="badgeSeverity"></p-badge>
         </button>
     `,

diff --git a/packages/primeng/src/button/style/buttonstyle.ts b/packages/primeng/src/button/style/buttonstyle.ts
@@ -25,6 +25,12 @@ const theme = ({ dt }) => `
     gap: ${dt('button.gap')};
 }
 
+.p-button-icon,
+.p-button-icon:before,
+.p-button-icon:after {
+    line-height: inherit;
+}
+
 .p-button:disabled {
     cursor: default;
 }