EVOgeek
/
Vmeda.Online
1
0
Fork 1
Code Issues Pull Requests Packages Projects Releases Wiki Activity

MOBILE-3380 placeholder: Flip arrow based on language direction

main
Dani Palou 2020-05-07 08:49:51 +02:00
parent 636906e522
commit 26f9e6bda3
4 changed files with 8 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/empty-box/core-empty-box.html
View File

@ -1,7 +1,7 @@
<div class="core-empty-box" [class.core-empty-box-inline]="(!image && !icon) || inline">
<div class="core-empty-box-content" padding>
<img *ngIf="image && !icon" [src]="image" role="presentation">
<core-icon *ngIf="icon" [name]="icon"></core-icon>
<core-icon *ngIf="icon" [name]="icon" [flipRtl]="flipIconRtl"></core-icon>
<p *ngIf="message" [class.padding-top]="image || icon">{{ message }}</p>
<ng-content></ng-content>
</div>

1
src/components/empty-box/empty-box.ts
View File

@ -32,6 +32,7 @@ export class CoreEmptyBoxComponent {
@Input() image?: string; // Image source. If an icon is provided, image won't be used.
@Input() inline?: boolean; // If this has to be shown inline instead of occupying whole page.
// If image or icon is not supplied, it's true by default.
@Input() flipIconRtl?: boolean; // Whether to flip the icon in RTL. Defaults to false.
constructor() {
// Nothing to do.

5
src/components/icon/icon.ts
View File

@ -40,6 +40,7 @@ export class CoreIconComponent implements OnChanges, OnDestroy {
@Input('fixed-width') fixedWidth: string;
@Input('label') ariaLabel?: string;
@Input() flipRtl?: boolean; // Whether to flip the icon in RTL. Defaults to false.
protected element: HTMLElement;
protected newElement: HTMLElement;
@ -106,6 +107,10 @@ export class CoreIconComponent implements OnChanges, OnDestroy {
this.newElement.classList.add('icon-slash');
}
if (this.flipRtl) {
this.newElement.classList.add('core-icon-dir-flip');
}
oldElement.parentElement.replaceChild(this.newElement, oldElement);
}

2
src/components/split-view/placeholder/core-placeholder.html
View File

@ -5,5 +5,5 @@
</ion-header>
<ion-content>
<core-empty-box icon="arrow-dropleft" [message]="'core.emptysplit' | translate"></core-empty-box>
<core-empty-box icon="arrow-dropleft" [message]="'core.emptysplit' | translate" [flipIconRtl]="true"></core-empty-box>
</ion-content>