This commit is contained in:
Evelyn Sucitro 2025-11-24 13:33:17 +07:00
parent 1f023e84d2
commit 24a1b0bac4
4 changed files with 105 additions and 55 deletions

View File

@ -12,6 +12,9 @@ export async function registerRequest(username, password) {
try {
const response = await fetch(`${BASE_URL}Register.php`, {
method: "POST",
headers: {
"Accept": "application/json"
},
body: formData
});
return await response.json();

View File

@ -270,40 +270,44 @@ input::placeholder {
}
}
@media (max-width: 768px) {
.container {
padding: 40px 30px;
width: 95%;
}
/* Autocomplete/Datalist Styling */
input::-webkit-calendar-picker-indicator {
filter: invert(1);
}
h1 {
font-size: 1.6rem;
letter-spacing: 2px;
margin-bottom: 30px;
}
/* Styling untuk browser autocomplete */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
-webkit-text-fill-color: #fff;
-webkit-box-shadow: 0 0 0px 1000px rgba(50, 50, 70, 0.5) inset;
transition: background-color 5000s ease-in-out 0s;
border: 2px solid rgba(100, 100, 120, 0.3);
}
input {
padding: 12px 16px;
font-size: 15px;
}
input:-webkit-autofill:focus {
border-color: #00d9ff;
}
.btn {
padding: 13px;
font-size: 16px;
letter-spacing: 1.5px;
}
/* Styling untuk datalist dropdown - terbatas karena browser restrictions */
datalist {
background-color: rgba(30, 0, 50, 0.95);
}
.register-link {
font-size: 13px;
}
option {
background-color: rgba(30, 0, 50, 0.95);
color: #fff;
padding: 10px;
}
.modal-content {
padding: 30px 25px;
}
/* Untuk Firefox */
input::-moz-list-thumbnail {
background-color: rgba(30, 0, 50, 0.95);
}
.modal-content h2 {
font-size: 1.5rem;
}
/* Custom styling untuk dropdown suggestion */
input[list]::-webkit-list-button {
color: #00d9ff;
}
@media (max-width: 480px) {

View File

@ -246,6 +246,46 @@ input::placeholder {
box-shadow: 0 0 30px #00eaff;
}
/* Autocomplete/Datalist Styling */
input::-webkit-calendar-picker-indicator {
filter: invert(1);
}
/* Styling untuk browser autocomplete */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
-webkit-text-fill-color: #fff;
-webkit-box-shadow: 0 0 0px 1000px rgba(50, 50, 70, 0.5) inset;
transition: background-color 5000s ease-in-out 0s;
border: 2px solid rgba(100, 100, 120, 0.3);
}
input:-webkit-autofill:focus {
border-color: #00d9ff;
}
/* Styling untuk datalist dropdown - terbatas karena browser restrictions */
datalist {
background-color: rgba(30, 0, 50, 0.95);
}
option {
background-color: rgba(30, 0, 50, 0.95);
color: #fff;
padding: 10px;
}
/* Untuk Firefox */
input::-moz-list-thumbnail {
background-color: rgba(30, 0, 50, 0.95);
}
/* Custom styling untuk dropdown suggestion */
input[list]::-webkit-list-button {
color: #00d9ff;
}
/* Responsive */
@media (max-width: 480px) {
.container {

View File

@ -12,36 +12,39 @@
<div class="container">
<h1>REGISTER</h1>
<form id="registerForm">
<div class="input-group">
<input
type="text"
id="username"
placeholder="Username"
required
/>
</div>
<form id="registerForm">
<div class="input-group">
<input
type="text"
id="username"
name="username"
placeholder="Username"
required
/>
</div>
<div class="input-group">
<input
type="password"
id="password"
placeholder="Password"
required
/>
</div>
<div class="input-group">
<input
type="password"
id="password"
name="password"
placeholder="Password"
required
/>
</div>
<div class="input-group">
<input
type="password"
id="confirmPassword"
placeholder="Confirm Password"
required
/>
</div>
<div class="input-group">
<input
type="password"
id="confirmPassword"
name="confirmPassword"
placeholder="Confirm Password"
required
/>
</div>
<button type="submit" class="btn">Register</button>
</form>
<button type="submit" class="btn">Register</button>
</form>
<div class="register-link">
Already Have An Account?