MOBILE-3063 reading-mode: Auto height
parent
157de8fd8a
commit
a3c16af58d
|
@ -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',
|
||||||
});
|
});
|
||||||
|
|
|
@ -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>
|
||||||
|
|
|
@ -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"
|
||||||
}
|
}
|
||||||
|
|
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue