Taylor/trojans-trophy-room
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improved account creation on mobile layouts

Browse Source
This commit is contained in:
FractalParadigm 2025-03-10 12:52:45 -04:00
parent 2e7dd6bc0d
commit 87bbd023c9
5 changed files with 51 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
create_account.php
View File

@ -44,6 +44,15 @@ try { // Try opening the SQL database connection
<script>verifyPageInFrame()</script>
<?php include ("admin/db_config.php");?> <!-- Our password-length variable is stored here -->
<script src="/scripts/user_management.js"></script>
<script>
var head = document.getElementsByTagName('HEAD')[0];
var link = document.createElement('link');
link.rel = "stylesheet";
if (parent.window.screen.width >= 360 && window.screen.width <= 1024) {
link.href = "/styles/user_management_mobile.css";
}
head.appendChild(link);
</script>
<title>USER CREATION FORM</title>
<script>var userList = <?php echo json_encode($userList); ?>; // Convert array from PHP to JS</script>
</head>

4
scripts/user_management.js
View File

@ -121,13 +121,13 @@ function usernameConfirm() {
} else if (listOfUsers.includes(username)) {
document.getElementById("confirmUsername").style.visibility = "visible";
document.getElementById("confirmUsername").style.color = "red";
document.getElementById("confirmUsername").innerHTML = "Name Taken";
document.getElementById("confirmUsername").innerHTML = "Taken";
document.getElementById("username").style.border = "2px solid red";
return false; // we return false for a match - a match is not what we want!
} else if (!listOfUsers.includes(username)) {
document.getElementById("confirmUsername").style.visibility = "visible";
document.getElementById("confirmUsername").style.color = "green";
document.getElementById("confirmUsername").innerHTML = "Name Available!";
document.getElementById("confirmUsername").innerHTML = "";
document.getElementById("username").style.border = "1px solid green";
return true; // this means the user does not already exist and is good to go
}

26
styles/user_management.css
View File

@ -311,29 +311,3 @@
width: 350px;
margin: auto;
}
@media only screen and (min-width: 360px) and (max-width: 1024px) {
#createAccountPanel {
width: 275px;
}
#createAccountBody {
width: 275px;
}
#userForm input[type="password"] {
margin: 2% 2%;
width: 170px;
}
#userForm input[type="text"] {
margin: 2% 2%;
width: 170px;
}
#displayPassword {
padding: 0 0 0 5px;
}
}

31
styles/user_management_mobile.css Normal file
View File

@ -0,0 +1,31 @@
#createAccountPanel {
width: 275px;
}
#createAccountBody {
width: 275px;
}
#userForm input[type="password"] {
margin: 2% 2%;
width: 170px;
}
#userForm input[type="text"] {
margin: 2% 2%;
width: 170px;
}
#displayPassword {
padding: 0 0 0 5px;
}
#matchingPasswords {
visibility: hidden !important;
height: 0;
width: 0;
}
#matchingPasswordsText {
visibility: hidden !important;
height: 0;
width: 0;
}

9
user/account.php
View File

@ -64,6 +64,15 @@ try { // Try opening the SQL database connection
<script src="/scripts/tools.js"></script>
<script src="/scripts/user_management.js"></script>
<script>verifyPageInFrame()</script>
<script>
var head = document.getElementsByTagName('HEAD')[0];
var link = document.createElement('link');
link.rel = "stylesheet";
if (parent.window.screen.width >= 360 && window.screen.width <= 1024) {
link.href = "/styles/user_management_mobile.css";
}
head.appendChild(link);
</script>
<title>User Account Management</title>
</head>