MOBILE-3734 core: Style ion fab not direct children of ion content
parent
ac8d2b4434
commit
650aafc96e
|
@ -37,8 +37,6 @@
|
|||
</core-navbar-buttons>
|
||||
|
||||
<!-- Content. -->
|
||||
|
||||
<ion-content>
|
||||
<core-loading [hideUntil]="loaded" class="core-loading-center">
|
||||
|
||||
<core-course-module-description [description]="description" [component]="component" [componentId]="componentId"
|
||||
|
@ -151,4 +149,3 @@
|
|||
<ion-icon name="fas-plus"></ion-icon>
|
||||
</ion-fab-button>
|
||||
</ion-fab>
|
||||
</ion-content>
|
||||
|
|
|
@ -46,7 +46,6 @@
|
|||
</core-navbar-buttons>
|
||||
|
||||
<!-- Content. -->
|
||||
<ion-content>
|
||||
<core-loading [hideUntil]="loaded" class="core-loading-center">
|
||||
<div *ngIf="description || pageIsOffline || hasOffline || pageWarning">
|
||||
<core-course-module-description [description]="description" [component]="component" [componentId]="componentId"
|
||||
|
@ -94,4 +93,3 @@
|
|||
<ion-icon name="fas-plus"></ion-icon>
|
||||
</ion-fab-button>
|
||||
</ion-fab>
|
||||
</ion-content>
|
||||
|
|
|
@ -29,7 +29,7 @@ export class CoreFabDirective implements OnDestroy {
|
|||
|
||||
protected static readonly PADDINGBOTTOM = 56;
|
||||
|
||||
protected element?: HTMLElement;
|
||||
protected scrollElement?: HTMLElement;
|
||||
protected done = false;
|
||||
|
||||
constructor(protected content: IonContent) {
|
||||
|
@ -41,10 +41,10 @@ export class CoreFabDirective implements OnDestroy {
|
|||
*/
|
||||
async asyncInit(): Promise<void> {
|
||||
if (this.content) {
|
||||
this.element = await this.content.getScrollElement();
|
||||
this.scrollElement = await this.content.getScrollElement();
|
||||
if (!this.done) {
|
||||
const bottom = parseInt(this.element.style.paddingBottom, 10) || 0;
|
||||
this.element.style.paddingBottom = (bottom + CoreFabDirective.PADDINGBOTTOM) + 'px';
|
||||
const bottom = parseInt(this.scrollElement.style.paddingBottom, 10) || 0;
|
||||
this.scrollElement.style.paddingBottom = (bottom + CoreFabDirective.PADDINGBOTTOM) + 'px';
|
||||
this.done = true;
|
||||
}
|
||||
}
|
||||
|
@ -54,9 +54,9 @@ export class CoreFabDirective implements OnDestroy {
|
|||
* Destroy component.
|
||||
*/
|
||||
ngOnDestroy(): void {
|
||||
if (this.done && this.element) {
|
||||
const bottom = parseInt(this.element.style.paddingBottom, 10) || 0;
|
||||
this.element.style.paddingBottom = (bottom + CoreFabDirective.PADDINGBOTTOM) + 'px';
|
||||
if (this.done && this.scrollElement) {
|
||||
const bottom = parseInt(this.scrollElement.style.paddingBottom, 10) || 0;
|
||||
this.scrollElement.style.paddingBottom = (bottom - CoreFabDirective.PADDINGBOTTOM) + 'px';
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -496,3 +496,11 @@ ion-button.core-button-select {
|
|||
textarea:not([core-auto-rows]) {
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
ion-fab[core-fab] {
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
ion-content > ion-fab[core-fab] {
|
||||
position: absolute;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue