MOBILE-3063 reading-mode: Auto height

main
Pau Ferrer Ocaña 2024-12-16 13:05:59 +01:00
parent 157de8fd8a
commit a3c16af58d
4 changed files with 8 additions and 12 deletions

View File

@ -193,7 +193,7 @@ export class CoreReadingModeDirective implements AfterViewInit, OnDestroy {
const exit = await CoreModals.openModal({ const exit = await CoreModals.openModal({
component: CoreReadingModeSettingsModalComponent, component: CoreReadingModeSettingsModalComponent,
initialBreakpoint: 0.5, initialBreakpoint: 1,
breakpoints: [0, 1], breakpoints: [0, 1],
cssClass: 'core-modal-auto-height', cssClass: 'core-modal-auto-height',
}); });

View File

@ -7,7 +7,7 @@
</ion-buttons> </ion-buttons>
</ion-toolbar> </ion-toolbar>
</ion-header> </ion-header>
<ion-content> <div class="content-auto-height">
<ion-item lines="none"> <ion-item lines="none">
<ion-label class="flex-row"> <ion-label class="flex-row">
<div id="readingmode-range-label">{{ 'core.settings.fontsize' | translate }}</div> <div id="readingmode-range-label">{{ 'core.settings.fontsize' | translate }}</div>
@ -29,7 +29,7 @@
</ion-item> </ion-item>
<ion-item> <ion-item>
<ion-label> <ion-label>
Theme {{ 'core.viewer.theme' | translate }}
</ion-label> </ion-label>
</ion-item> </ion-item>
<ion-radio-group [(ngModel)]="settings.theme" (ionChange)="onSettingChange()"> <ion-radio-group [(ngModel)]="settings.theme" (ionChange)="onSettingChange()">
@ -50,4 +50,4 @@
<ion-icon name="fas-book-open-reader" slot="start" aria-hidden="true" class="icon-slash" /> <ion-icon name="fas-book-open-reader" slot="start" aria-hidden="true" class="icon-slash" />
{{ 'core.viewer.exitreadingmode' | translate }} {{ 'core.viewer.exitreadingmode' | translate }}
</ion-button> </ion-button>
</ion-content> </div>

View File

@ -10,5 +10,6 @@
"readingthemehcm": "High contrast", "readingthemehcm": "High contrast",
"readingthemelight": "Light", "readingthemelight": "Light",
"readingthemesepia": "Sepia", "readingthemesepia": "Sepia",
"showmedia": "Show images and media" "showmedia": "Show images and media",
"theme": "Theme"
} }

View File

@ -124,17 +124,12 @@ ion-modal {
} }
&.core-modal-auto-height { &.core-modal-auto-height {
--height: auto;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: flex-end; justify-content: flex-end;
&::part(content) { .content-auto-height {
position: relative;
display: block;
contain: content;
}
.inner-content {
max-height: 80vh; max-height: 80vh;
overflow: auto; overflow: auto;
} }