Skip to content

Commit 7cd2657

Browse files
committed
Correct display of tips in tables
Make sure tooltips and modals are shown once pre row, grouped with the label. In tables cells the labels are hidden and so should be tooltips and modals.
1 parent 34cb8c7 commit 7cd2657

File tree

2 files changed

+16
-9
lines changed

2 files changed

+16
-9
lines changed

js_src/U.js

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -92,14 +92,14 @@ export class U {
9292
* @returns {HTMLElement}
9393
*/
9494
static modalHint(config) {
95+
const hint = document.createElement("span");
96+
9597
if (!config.modal) {
96-
return null;
98+
return hint;
9799
}
98100

99-
const hint = document.createElement("span");
100101
hint.innerText = "?";
101102
hint.classList.add("modal-hint");
102-
hint.dataset["modal"] = config.modal;
103103

104104
hint.addEventListener('click', (e) => {
105105
const modal = e.target.nextElementSibling;
@@ -108,7 +108,7 @@ export class U {
108108
});
109109

110110
return hint;
111-
}
111+
}
112112

113113
/**
114114
* Creates modal element with event handlers
@@ -117,11 +117,12 @@ export class U {
117117
* @returns {null|HTMLDivElement}
118118
*/
119119
static modal(config) {
120+
const modal = document.createElement("div");
121+
120122
if (!config.modal) {
121-
return null;
123+
return modal;
122124
}
123125

124-
const modal = document.createElement("div");
125126
modal.classList.add("modal");
126127

127128
const backdrop = document.createElement("div");
@@ -206,7 +207,10 @@ export class U {
206207

207208
const rowWrapper = document.createElement('tr');
208209
const labelTh = document.createElement('th');
209-
labelTh.innerText = fieldConfig.label + this.requiredMark(fieldConfig);
210+
labelTh.insertAdjacentText("afterbegin", fieldConfig.label + this.requiredMark(fieldConfig));
211+
labelTh.insertAdjacentHTML("beforeend", U.tooltipHint(fieldConfig));
212+
labelTh.appendChild(U.modalHint(fieldConfig));
213+
labelTh.appendChild(U.modal(fieldConfig));
210214
rowWrapper.appendChild(labelTh);
211215

212216
for (let i = 0; i < repeat; i++) {

public/css/style.css

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -60,9 +60,12 @@ table {
6060

6161
}
6262

63+
/* hide labels, tooltips and modals in cells, as they are visible once per row in <th> */
6364
& label,
64-
& .label {
65-
display: none; /* hide labels */
65+
& .label,
66+
& td span.tooltip-hint,
67+
& td span.modal-hint {
68+
display: none;
6669
}
6770
}
6871

0 commit comments

Comments
 (0)