Input to Subdomain Redirect
.card-container {
height: 50vh;
}
.card {
width: 80%;
}
.btn-custom {
background-color: #fc6200;
color: white;
width: 100%;
}
.btn-custom:hover {
color: white;
}
.error-message {
color: red;
font-size: 1rem;
margin-bottom: 0;
display: flex;
align-items: center;
opacity: 0;
transition: opacity 0.5s ease-in-out, margin-bottom 0.5s ease-in-out;
visibility: hidden;
width: 100%;
}
.error-message i {
margin-right: 5px;
}
.visible {
opacity: 1;
visibility: visible;
margin-bottom: 1rem;
}
.with-error {
margin-bottom: 1rem;
transition: margin-bottom 0.5s ease-in-out;
}
.form-group {
margin-bottom: 5px;
}
/* Add responsive styles using media queries */
@media (max-width: 576px) {
.card {
width: 95%;
}
.input-group {
display: flex;
flex-direction: column;
}
.input-group-prepend,
.input-group-append {
display: block;
margin-bottom: 5px;
width: 100%;
text-align: center;
}
.input-group-prepend > .input-group-text,
.input-group-append > .input-group-text {
display: inline-block;
width: 100%;
text-align: center;
}
#domain {
width: 100%;
text-align: center;
margin-bottom: 5px;
border-radius: 0.25rem;
}
}
Enter your TimeViu domain to login.
// Get the input element, button element, and error message element by ID
const domainInput = document.getElementById('domain');
const submitButton = document.getElementById('submit');
const errorMessage = document.getElementById('error-message');
function showError() {
// Add the visible and with-error classes to the error message
errorMessage.classList.add('visible', 'with-error');
// Remove the visible and with-error classes after 3 seconds
setTimeout(() => {
errorMessage.classList.remove('visible', 'with-error');
}, 3000);
}
// Add a click event listener to the button
submitButton.addEventListener('click', () => {
// Get the user input value
const subdomain = domainInput.value;
// Make sure the user entered a value
if (subdomain) {
// Redirect the user to the subdomain
const domain = 'timeviu.com';
window.location.href = `https://${subdomain}.${domain}`;
} else {
showError();
}
});
