Update TS styling

This commit is contained in:
atownson 2024-09-23 13:42:37 -05:00
parent 1bfb6e6f34
commit 6d5af67da8
3 changed files with 15 additions and 8 deletions

Binary file not shown.

Binary file not shown.

View File

@ -1,12 +1,16 @@
import { getElements } from '../util'; import { getElements } from '../util';
/** /**
* Conditionally add and remove a class that will float the button group * Conditionally add and remove a class that will float the button group
* based on whether or not items in the list are checked * based on whether or not items in the list are checked
*/ */
function toggleFloat(): void { function toggleFloat(): void {
const checkedCheckboxes = document.querySelector<HTMLInputElement>('input[type="checkbox"][name="pk"]:checked'); const checkedCheckboxes = document.querySelector<HTMLInputElement>(
const buttonGroup = document.querySelector<HTMLDivElement>('div.form.form-horizontal div.btn-list'); 'input[type="checkbox"][name="pk"]:checked',
);
const buttonGroup = document.querySelector<HTMLDivElement>(
'div.form.form-horizontal div.btn-list',
);
if (!buttonGroup) { if (!buttonGroup) {
return; return;
} }
@ -19,19 +23,22 @@ function toggleFloat(): void {
} }
} }
/** /**
* Initialize floating bulk buttons. * Initialize floating bulk buttons.
*/ */
export function initFloatBulk(): void { export function initFloatBulk(): void {
for (const element of getElements<HTMLInputElement>('input[type="checkbox"][name="pk"]')) { for (const element of getElements<HTMLInputElement>(
element.addEventListener('change', event => { 'input[type="checkbox"][name="pk"]',
)) {
element.addEventListener('change', () => {
toggleFloat(); toggleFloat();
}); });
} }
// Handle the select-all checkbox // Handle the select-all checkbox
for (const element of getElements<HTMLInputElement>('table tr th > input[type="checkbox"].toggle')) { for (const element of getElements<HTMLInputElement>(
element.addEventListener('change', event => { 'table tr th > input[type="checkbox"].toggle',
)) {
element.addEventListener('change', () => {
toggleFloat(); toggleFloat();
}); });
} }