fix: Revise HTML Structure for Login Page

[sergioceron]

Automated fix by CoderOps.

Swarm: s2
Task: Revise HTML Structure for Login Page

[Copilot]

Pull request overview

Updates the login.php view markup to modernize/clean up the login page’s HTML structure (moving away from table-based layout) while keeping the existing login flow and i18n strings.

Changes:

• Replaced the table-based login form layout with div-based containers and added labels/ids for inputs.
• Introduced new CSS class hooks (login-container, login-form, form-group, etc.) for the new structure.
• Kept the existing inline style block and message rendering behavior.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

The focus script references document.forms["login"], but the only form on this page is name="settings". In browsers this makes focusControl undefined and the subsequent .type access can throw, breaking the page JS and preventing autofocus. Update the script to reference the actual form (or target the input by id) and null-check before accessing properties.

Suggested change

	var focusControl = document.forms["login"].elements["userName"];
	if (focusControl.type != "hidden" && !focusControl.disabled) {
	var focusControl = document.getElementById("userName");
	if (focusControl && focusControl.type != "hidden" && !focusControl.disabled) {

[Copilot]

Both validation error <span> elements use the same id="errormsg_0". IDs must be unique in the DOM; this can break CSS/JS targeting and assistive tech relationships. Use distinct IDs per field (or drop the id attribute if it isn't used).

Suggested change

	<span class="errormsg" id="errormsg_0"> <?=$_i18n[ "error.required" ]?></span>
	<?php } ?>
	</div>
	<div class="form-group">
	<label for="userPassword" class="form-label"><?=$_i18n[ "pass" ]?> :</label>
	<input id="userPassword" name="userPassword" type="password" class="input-text rounded">
	<?php if( strpos( $fields, 'userPassword' ) ){?>
	<span class="errormsg" id="errormsg_0"> <?=$_i18n[ "error.required" ]?></span>
	<span class="errormsg" id="errormsg_userName"> <?=$_i18n[ "error.required" ]?></span>
	<?php } ?>
	</div>
	<div class="form-group">
	<label for="userPassword" class="form-label"><?=$_i18n[ "pass" ]?> :</label>
	<input id="userPassword" name="userPassword" type="password" class="input-text rounded">
	<?php if( strpos( $fields, 'userPassword' ) ){?>
	<span class="errormsg" id="errormsg_userPassword"> <?=$_i18n[ "error.required" ]?></span>

[Copilot]

<h2 class="section-header"> replaces the prior div.section header, but there is no .section-header style in the repo and the existing styling targets div.section in styles/global.css. This likely regresses the login heading styling. Consider keeping div class="section", or update/add CSS so the new heading class gets the intended styles.

Suggested change

	<h2 class="section-header">&nbsp;Entrar al sistema</h2>
	<div class="section">&nbsp;Entrar al sistema</div>