gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-10 16:39:02 +01:00
Code Issues Actions 18 Packages Projects Releases Wiki Activity

client: allow changing the max content width option without a frontend reload

Browse Source
This commit is contained in:
Adorian Doran 2025-10-30 00:49:02 +02:00
parent 1ef03b7a77
commit 4063229982
3 changed files with 11 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
apps/client/src/widgets/containers/root_container.ts
View File

@ -31,6 +31,7 @@ export default class RootContainer extends FlexContainer<BasicWidget> {
window.visualViewport?.addEventListener("resize", () => this.#onMobileResize()); window.visualViewport?.addEventListener("resize", () => this.#onMobileResize());
} }
this.#setMaxContentWidth(options.getInt("maxContentWidth") ?? 0);
this.#setMotion(options.is("motionEnabled")); this.#setMotion(options.is("motionEnabled"));
this.#setShadows(options.is("shadowsEnabled")); this.#setShadows(options.is("shadowsEnabled"));
this.#setBackdropEffects(options.is("backdropEffectsEnabled")); this.#setBackdropEffects(options.is("backdropEffectsEnabled"));
@ -52,14 +53,24 @@ export default class RootContainer extends FlexContainer<BasicWidget> {
if (loadResults.isOptionReloaded("backdropEffectsEnabled")) { if (loadResults.isOptionReloaded("backdropEffectsEnabled")) {
this.#setBackdropEffects(options.is("backdropEffectsEnabled")); this.#setBackdropEffects(options.is("backdropEffectsEnabled"));
} }
if (loadResults.isOptionReloaded("maxContentWidth")) {
this.#setMaxContentWidth(options.getInt("maxContentWidth") ?? 0);
}
} }
#onMobileResize() { #onMobileResize() {
const currentViewportHeight = getViewportHeight(); const currentViewportHeight = getViewportHeight();
const isKeyboardOpened = (currentViewportHeight < this.originalViewportHeight); const isKeyboardOpened = (currentViewportHeight < this.originalViewportHeight);
this.$widget.toggleClass("virtual-keyboard-opened", isKeyboardOpened); this.$widget.toggleClass("virtual-keyboard-opened", isKeyboardOpened);
} }
#setMaxContentWidth(width: number) {
width = Math.max(width, 640);
document.body.style.setProperty("--preferred-max-content-width", `${width}px`);
}
#setMotion(enabled: boolean) { #setMotion(enabled: boolean) {
document.body.classList.toggle("motion-disabled", !enabled); document.body.classList.toggle("motion-disabled", !enabled);
jQuery.fx.off = !enabled; jQuery.fx.off = !enabled;

4
apps/client/src/widgets/type_widgets/options/appearance.tsx
View File

@ -299,10 +299,6 @@ function MaxContentWidth() {
/> />
</FormGroup> </FormGroup>
</Column> </Column>
<p>
{t("max_content_width.apply_changes_description")} <Button text={t("max_content_width.reload_button")} size="micro" onClick={reloadFrontendApp} />
</p>
</OptionsSection> </OptionsSection>
) )
} }

1
apps/server/src/routes/index.ts
View File

@ -57,7 +57,6 @@ function index(req: Request, res: Response) {
isDev, isDev,
isMainWindow: view === "mobile" ? true : !req.query.extraWindow, isMainWindow: view === "mobile" ? true : !req.query.extraWindow,
isProtectedSessionAvailable: protectedSessionService.isProtectedSessionAvailable(), isProtectedSessionAvailable: protectedSessionService.isProtectedSessionAvailable(),
maxContentWidth: Math.max(640, parseInt(options.maxContentWidth)),
triliumVersion: packageJson.version, triliumVersion: packageJson.version,
assetPath, assetPath,
appPath, appPath,