beenull/visualsubnetcalc
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add more accessibility features

Browse source
This commit is contained in:
Caesar Kabalan 2024-10-14 16:07:25 -07:00
parent 7f378b7582
commit 96fc24209a
No known key found for this signature in database
GPG key ID: DDFEF5FF6CFAB608
2 changed files with 6 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
dist/index.html vendored
View file

@ -114,7 +114,7 @@
<td aria-labelledby="rangeHeader" class="row_range"></td> <td aria-labelledby="rangeHeader" class="row_range"></td>
<td aria-labelledby="useableHeader" class="row_usable"></td> <td aria-labelledby="useableHeader" class="row_usable"></td>
<td aria-labelledby="hostsHeader" class="row_hosts"></td> <td aria-labelledby="hostsHeader" class="row_hosts"></td>
<td aria-labelledby="noteHeader" class="note"><label><input type="text" class="form-control shadow-none p-0"></label></td> <td class="note"><label><input aria-labelledby="noteHeader" type="text" class="form-control shadow-none p-0"></label></td>
<td aria-labelledby="splitHeader" rowspan="1" colspan="13" class="split rotate"><span></span></td> <td aria-labelledby="splitHeader" rowspan="1" colspan="13" class="split rotate"><span></span></td>
<td aria-labelledby="joinHeader" rowspan="14" colspan="1" class="join rotate"><span></span></td> <td aria-labelledby="joinHeader" rowspan="14" colspan="1" class="join rotate"><span></span></td>
</tr> </tr>
@ -153,19 +153,19 @@
</div> </div>
</div> </div>
<div class="modal fade" id="importExportModal" tabindex="-1" aria-labelledby="importExportModalLabel" aria-hidden="true"> <div class="modal fade" id="importExportModal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-xl modal-dialog-centered"> <div class="modal-dialog modal-xl modal-dialog-centered">
<div class="modal-content"> <div class="modal-content" role="alertdialog" aria-labelledby="importExportModalLabel" aria-describedby="importExportModalDescription">
<div class="modal-header border-bottom-0 pb-1"> <div class="modal-header border-bottom-0 pb-1">
<h3 class="modal-title" id="importExportModalLabel">Import/Export</h3> <h3 class="modal-title" id="importExportModalLabel">Import/Export</h3>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div> </div>
<div class="modal-body pt-1"> <div class="modal-body pt-1">
<div class="alert alert-primary show mt-3" role="alert"> <div class="alert alert-primary show mt-3" id="importExportModalDescription">
Copy the content from the box below to EXPORT the current subnet configuration. Or, overwrite/paste a previously exported configuration into the box below and click IMPORT. Copy the content from the box below to EXPORT the current subnet configuration. Or, overwrite/paste a previously exported configuration into the box below and click IMPORT.
</div> </div>
<div class="form-floating font-monospace"> <div class="form-floating font-monospace">
<textarea class="form-control pt-3" id="importExportArea" style="height: 510px"></textarea> <textarea class="form-control pt-3" id="importExportArea" style="height: 510px" aria-label="Import/Export Content"></textarea>
<label for="importExportArea"></label> <label for="importExportArea"></label>
</div> </div>
</div> </div>

2
dist/js/main.js vendored
View file

@ -284,7 +284,7 @@ function addRow(network, netSize, colspan, note, notesWidth, color, operatingMod
' <td data-subnet="' + rowCIDR + '" aria-labelledby="' + rowId + ' rangeHeader" class="row_range">' + rangeCol + '</td>\n' + ' <td data-subnet="' + rowCIDR + '" aria-labelledby="' + rowId + ' rangeHeader" class="row_range">' + rangeCol + '</td>\n' +
' <td data-subnet="' + rowCIDR + '" aria-labelledby="' + rowId + ' useableHeader" class="row_usable">' + usableCol + '</td>\n' + ' <td data-subnet="' + rowCIDR + '" aria-labelledby="' + rowId + ' useableHeader" class="row_usable">' + usableCol + '</td>\n' +
' <td data-subnet="' + rowCIDR + '" aria-labelledby="' + rowId + ' hostsHeader" class="row_hosts">' + hostCount + '</td>\n' + ' <td data-subnet="' + rowCIDR + '" aria-labelledby="' + rowId + ' hostsHeader" class="row_hosts">' + hostCount + '</td>\n' +
' <td aria-labelledby="' + rowId + ' noteHeader" class="note" style="width:' + notesWidth + '"><label><input type="text" class="form-control shadow-none p-0" data-subnet="' + rowCIDR + '" value="' + note + '"></label></td>\n' + ' <td class="note" style="width:' + notesWidth + '"><label><input aria-labelledby="' + rowId + ' noteHeader" type="text" class="form-control shadow-none p-0" data-subnet="' + rowCIDR + '" value="' + note + '"></label></td>\n' +
' <td data-subnet="' + rowCIDR + '" aria-labelledby="' + rowId + ' splitHeader" rowspan="1" colspan="' + colspan + '" class="split rotate" data-mutate-verb="split"><span>/' + netSize + '</span></td>\n' ' <td data-subnet="' + rowCIDR + '" aria-labelledby="' + rowId + ' splitHeader" rowspan="1" colspan="' + colspan + '" class="split rotate" data-mutate-verb="split"><span>/' + netSize + '</span></td>\n'
if (netSize > maxNetSize) { if (netSize > maxNetSize) {
// This is wrong. Need to figure out a way to get the number of children so you can set rowspan and the number // This is wrong. Need to figure out a way to get the number of children so you can set rowspan and the number