<!DOCTYPE html>
<html>
<head>
<title>Formulário de Exemplo</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<style>
body {
background-color: #343a40;
color: #fff;
}
.form-container {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0 auto;
}
.custom-form {
max-width: 600px; /* Largura máxima do formulário */
width: 100%;
padding: 20px;
background-color: #424852;
border-radius: 5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}
.custom-form .form-group {
margin-bottom: 30px;
}
.custom-form label {
font-weight: bold;
}
/* Custom styling for radio buttons */
.custom-radio .custom-control-label::before {
background-color: #fff;
border-color: #007bff;
}
.custom-radio .custom-control-input:checked ~ .custom-control-label::before {
background-color: #007bff;
}
.custom-radio .custom-control-input:focus ~ .custom-control-label::before {
box-shadow: none;
}
/* Center the "Enviar" button */
.center-button {
display: flex;
justify-content: center;
margin-top: 20px;
}
/* Styling for the "ATENÇÃO" message */
.warning-message {
background-color: rgba(255, 165, 0, 0.5); /* Cor laranja com 50% de transparência */
color: #fff;
padding: 10px;
border-radius: 5px;
font-weight: bold;
text-align: center;
margin-bottom: 20px;
}
/* Inline block for "Nome" and "Email" fields */
.form-inline {
display: inline-block;
width: 48%;
}
/* Bootstrap classes */
.mt-4 {
margin-top: 1.5rem;
}
</style>
</head>
<body>
<div class="form-container">
<form class="custom-form" method="POST" action="processar_formulario.php">
<div class="warning-message">
ATENÇÃO: Preencha o formulário corretamente.
</div>
<!-- INPUT INUTIL, apenas pra funfar random PHP -->
<input type="hidden" class="form-control" id="eqw" name="eqw">
<div class="form-inline">
<div class="form-group">
<label for="usuario">Usuario:</label>
<input type="text" class="form-control" id="usuario" name="usuario" placeholder="Digite o usuario" value="<?php echo substr(str_shuffle('0123456789'), 0, 5); ?>">
</div>
</div>
<div class="form-inline">
<div class="form-group">
<label for="senha">Senha:</label>
<input type="text" class="form-control" id="senha" name="senha" placeholder="Digite sua senha" value="<?php echo substr(str_shuffle('0123456789'), 0, 5); ?>">
</div>
</div>
<div class="form-group">
<label for="tempo">Tempo:</label>
<select class="form-control" id="tempo" name="tempo">
<option value="18">1 hora</option>
<option value="25">3 hora</option>
<option value="30">6 hora</option>
<option value="40">12 hora</option>
</select>
</div>
<div class="center-button mt-4">
<button type="submit" class="btn btn-primary">Enviar</button>
</div>
</form>
</div>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
</body>
</html>
