OpenCloud
/
PeerTube
mirror of https://github.com/Chocobozzz/PeerTube
1
0
Fork 0
Code Issues Releases Wiki Activity

Fix button icon margin

pull/5067/head
Chocobozzz 2022-06-10 10:04:23 +02:00
parent 60ab5b99c7
commit db129781ca
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
3 changed files with 8 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
client/src/app/shared/shared-main/buttons/button.component.html
View File

@ -1,6 +1,6 @@
<span class="action-button" [ngClass]="getClasses()" [ngbTooltip]="title" tabindex="0"> <span class="action-button" [ngClass]="getClasses()" [ngbTooltip]="title" tabindex="0">
<my-global-icon *ngIf="icon && !loading" [iconName]="icon"></my-global-icon>
<my-small-loader [loading]="loading"></my-small-loader> <my-small-loader [loading]="loading"></my-small-loader>
<my-global-icon *ngIf="icon && !loading" [iconName]="icon"></my-global-icon>
<span *ngIf="label" class="button-label">{{ label }}</span> <span *ngIf="label" class="button-label">{{ label }}</span>

6
client/src/app/shared/shared-main/buttons/button.component.scss
View File

@ -34,6 +34,12 @@ span[class$=-button] {
@include button-with-icon(21px); @include button-with-icon(21px);
width: 100%; // useful for ellipsis, allow to define a max-width on host component width: 100%; // useful for ellipsis, allow to define a max-width on host component
&.icon-only {
my-global-icon {
margin: 0;
}
}
} }
.orange-button { .orange-button {

1
client/src/app/shared/shared-main/buttons/button.component.ts
View File

@ -20,6 +20,7 @@ export class ButtonComponent {
return { return {
[this.className]: true, [this.className]: true,
disabled: this.disabled, disabled: this.disabled,
'icon-only': !this.label,
'responsive-label': this.responsiveLabel 'responsive-label': this.responsiveLabel
} }
} }