style(exam-correct): minor style fixes and restructuring
This commit is contained in:
parent
2667aac1a3
commit
decb1ca2a3
@ -458,6 +458,7 @@ export class ExamCorrect {
|
|||||||
} else {
|
} else {
|
||||||
const partCell = document.createElement('TD');
|
const partCell = document.createElement('TD');
|
||||||
partCell.innerHTML = partResult;
|
partCell.innerHTML = partResult;
|
||||||
|
partCell.classList.add('uw-exam-correct--part-cell');
|
||||||
cells.set(cellIndex, partCell);
|
cells.set(cellIndex, partCell);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -474,8 +475,9 @@ export class ExamCorrect {
|
|||||||
newRow.appendChild(cell);
|
newRow.appendChild(cell);
|
||||||
}
|
}
|
||||||
|
|
||||||
const tableBody = this._element.querySelector(`tbody:not(#${EXAM_CORRECT_INPUT_BODY_ID})`);
|
const tableBody = this._element.querySelector('tbody');
|
||||||
insertAsFirstChild(newRow, tableBody);
|
const inputRow = document.getElementById(EXAM_CORRECT_INPUT_BODY_ID);
|
||||||
|
tableBody && tableBody.insertBefore(newRow, inputRow ? inputRow.nextSibling : null);
|
||||||
}
|
}
|
||||||
|
|
||||||
_clearUserInput() {
|
_clearUserInput() {
|
||||||
@ -492,9 +494,9 @@ export class ExamCorrect {
|
|||||||
function clearInput(inputElement) {
|
function clearInput(inputElement) {
|
||||||
inputElement.value = null;
|
inputElement.value = null;
|
||||||
}
|
}
|
||||||
function insertAsFirstChild(elementToInsert, parentElement) {
|
/* function insertAsFirstChild(elementToInsert, parentElement) {
|
||||||
parentElement.insertBefore(elementToInsert, parentElement.firstChild);
|
parentElement.insertBefore(elementToInsert, parentElement.firstChild);
|
||||||
}
|
} */
|
||||||
function removeAllChildren(element) {
|
function removeAllChildren(element) {
|
||||||
while (element.firstChild) {
|
while (element.firstChild) {
|
||||||
element.removeChild(element.firstChild);
|
element.removeChild(element.firstChild);
|
||||||
|
|||||||
@ -1,5 +1,16 @@
|
|||||||
$exam-correct--input-status-margin: 10px
|
$exam-correct--input-status-margin: 10px
|
||||||
|
|
||||||
|
table[uw-exam-correct]
|
||||||
|
table-layout: fixed
|
||||||
|
|
||||||
|
th.uw-exam-correct--user-cell, td.uw-exam-correct--user-cell
|
||||||
|
min-width: 200px
|
||||||
|
th.uw-exam-correct--part-cell, td.uw-exam-correct--part-cell
|
||||||
|
width: 85px
|
||||||
|
input
|
||||||
|
width: 70px
|
||||||
|
padding: 4px 8px
|
||||||
|
|
||||||
[uw-exam-correct] input:invalid:not(.no-value)
|
[uw-exam-correct] input:invalid:not(.no-value)
|
||||||
border: 2px solid var(--color-error)
|
border: 2px solid var(--color-error)
|
||||||
|
|
||||||
|
|||||||
@ -7,11 +7,11 @@ $newline never
|
|||||||
<tr .table__row .table__row--head>
|
<tr .table__row .table__row--head>
|
||||||
<th .table__th .sortable .sorted-desc uw-exam-correct-header="date" uw-hide-column-header="date">
|
<th .table__th .sortable .sorted-desc uw-exam-correct-header="date" uw-hide-column-header="date">
|
||||||
_{MsgExamCorrectHeadDate}
|
_{MsgExamCorrectHeadDate}
|
||||||
<th .table__th .sortable uw-exam-correct-header="user" uw-hide-column-header="user">
|
<th .table__th .sortable .uw-exam-correct--user-cell uw-exam-correct-header="user" uw-hide-column-header="user">
|
||||||
_{MsgExamCorrectHeadParticipant}
|
_{MsgExamCorrectHeadParticipant}
|
||||||
^{iconTooltip participantHeadTooltip Nothing True}
|
^{iconTooltip participantHeadTooltip Nothing True}
|
||||||
$forall ExamPart{examPartNumber,examPartName} <- examParts
|
$forall ExamPart{examPartNumber,examPartName} <- examParts
|
||||||
<th .table__th .sortable uw-exam-correct-header=#{examPartNumber} uw-hide-column-header=#{examPartNumber}>
|
<th .table__th .sortable .uw-exam-correct--part-cell uw-exam-correct-header=#{examPartNumber} uw-hide-column-header=#{examPartNumber}>
|
||||||
$maybe name <- examPartName
|
$maybe name <- examPartName
|
||||||
<span .tooltip>
|
<span .tooltip>
|
||||||
<span>
|
<span>
|
||||||
@ -22,17 +22,16 @@ $newline never
|
|||||||
_{MsgExamCorrectHeadPart examPartNumber}
|
_{MsgExamCorrectHeadPart examPartNumber}
|
||||||
<th .table__th .sortable uw-exam-correct-header="status" uw-hide-column-header="status">
|
<th .table__th .sortable uw-exam-correct-header="status" uw-hide-column-header="status">
|
||||||
_{MsgExamCorrectHeadStatus}
|
_{MsgExamCorrectHeadStatus}
|
||||||
<tbody #exam-correct__new>
|
<tbody>
|
||||||
<tr .table__row>
|
<tr .table__row #exam-correct__new>
|
||||||
<td .table__td>
|
<td .table__td>
|
||||||
<td .table__td .exam-correct--input-status>
|
<td .table__td .exam-correct--input-status>
|
||||||
<input #exam-correct__user type="text" autofocus minLength=1>
|
<input #exam-correct__user .uw-exam-correct--user-cell type="text" autofocus minLength=1>
|
||||||
<i #exam-correct__user-status .fas .fa-fw>
|
<i #exam-correct__user-status .fas .fa-fw>
|
||||||
<ul #exam-correct__user-candidates>
|
<ul #exam-correct__user-candidates>
|
||||||
$forall ExamPart{examPartNumber} <- examParts
|
$forall ExamPart{examPartNumber} <- examParts
|
||||||
<td .table__td>
|
<td .table__td .uw-exam-correct--part-cell>
|
||||||
^{ptsInput examPartNumber}
|
^{ptsInput examPartNumber}
|
||||||
<td #exam-correct__status .table__td>
|
<td #exam-correct__status .table__td>
|
||||||
<button #exam-correct__send-btn .btn .btn-primary>
|
<button #exam-correct__send-btn .btn .btn-primary>
|
||||||
_{MsgExamCorrectButtonSend}
|
_{MsgExamCorrectButtonSend}
|
||||||
<tbody>
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user