forgejo/web_src/js/modules/dimmer.ts
Gusted c738e59dca fix: modals on small viewport height (#11547)
- For small modals fomantic tried to add a `scrolling` class using a function that was not implemented, this function is now stubbed.
- There's not really a need to conditionally change the behavior of scrolling or not, we can specify `overflow-y: auto` which is more than enough to take care of this. We do add some layout changes to ensure the modal is fully scrollable.
- Refactor to nested CSS.
- Resolves forgejo/forgejo#10991

Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/11547
Reviewed-by: 0ko <0ko@noreply.codeberg.org>
Reviewed-by: Beowulf <beowulf@beocode.eu>
Co-authored-by: Gusted <postmaster@gusted.xyz>
Co-committed-by: Gusted <postmaster@gusted.xyz>
2026-03-08 00:11:31 +01:00

48 lines
1.3 KiB
TypeScript

import $ from 'jquery';
class Dimmer {
dimmerEl: HTMLDivElement;
active: boolean;
constructor() {
this.dimmerEl = document.querySelector('body > div.ui.dimmer') as HTMLDivElement;
if (!this.dimmerEl) {
this.dimmerEl = document.createElement('div');
this.dimmerEl.classList.add('ui', 'dimmer', 'transition');
document.body.append(this.dimmerEl);
}
}
// eslint-disable-next-line @typescript-eslint/no-explicit-any
dimmer(functionName: string, ...args: any[]) {
if (functionName === 'add content') {
this.dimmerEl.append(args[0][0]);
} else if (functionName === 'get dimmer') {
return $(this.dimmerEl);
} else if (functionName === 'show') {
this.dimmerEl.classList.add('active');
this.dimmerEl.classList.remove('hidden');
this.active = true;
} else if (functionName === 'hide') {
this.dimmerEl.classList.remove('active');
this.dimmerEl.classList.add('hidden');
this.active = false;
} else if (functionName === 'is active') {
return this.active;
}
}
// JQuery compatibility functions.
get(_index: number): HTMLElement {
return document.body;
}
removeClass() {}
hasClass() {}
addClass() {}
}
export function initDimmer() {
$.fn.dimmer = (arg: string | object) => {
if (typeof arg === 'object') return new Dimmer();
};
}