0
form view:
<div class ="registerUser">
<h1 class="w3-xxlarge ">Cadastro de clientes</h1>
<hr style="width: 80%">
<form method="POST" action="">
<h3 class="w3-xlarge leftTitle escuro">Dados do cliente:</h3><br><br>
<div class ="form-group esquerda" >
<label>Nome:</label>
<input class="form-control " type="text" placeholder="Insira o nome" required>
<br>
<label>Data de Vencimento:</label>
<input class="form-control" id="date" type="date">
</div>
<br><br>
<h3 class="w3-xlarge leftTitle escuro">Dados do carro:</h3><br><br>
<div class ="form-group esquerda">
<label>Placa</label>
<input class="form-control" type="text" placeholder= "Informe a placa do veiculo" >
<br>
<label>Cor</label>
<input class="form-control" type="text" placeholder="Informe a cor do veiculo" >
<br>
<label>Marca</label>
<input class="form-control" type="text" placeholder="Informe a Marca do veiculo" >
<br>
<label>Modelo</label>
<input class="form-control" type="text" placeholder="Informe o Modelo do veiculo" >
</div>
<br>
<br><br><br>
</form>
</div>
</div>
Nav view:
`
<img src="../imgs/imgPark2.png" style="width:100%; height:12vh;">
<ul id="nav">
<li><a href="{{route ('ShowCar')}}" ><i class="fa fa-home w3-xxlarge"></i><br>Inicio</a></li>
<li><a ><i class="fa fa-user w3-xxlarge"></i><br>Clientes</a>
<ul>
<li><a href="{{route('registerUser')}}">Cadastrar cliente</a></li>
<li><a href="#">Ver clientes</a></li>
<li><a href="#">Data de pagamento</a></li>
<li><a href="#">Remover Cliente</a></li>
</ul>
</li>
<li><a id ="closeButton "href="{{route('Home')}}" ><i class ="fa fa-close w3-xxlarge"></i><br>Sair</a></li>
</ul>
</nav>`
CSS
body {
width: 100%;
height: 100% ;
background-color: lightgray;
color:lightgray;
}
.spot{
background-color: black;
height: 100%;
display: block;
width: 12vw;
position: fixed!important;
}
ul {
margin: 0;
padding: 0;
list-style: none;
width: 100%;
text-align: center;
}
ul li {
position: relative;
}
li ul {
position: absolute;
left: 12vw;
top: 0;
display: none;
}
ul li a {
display: block;
text-decoration: none;
color: white;
font-family: 'Lucida Console', Monospace;
background:black;
font-size: x-large;
padding: 12px;
border: 0.5px solid rgb(0, 0, 0);
}
li:hover ul { display: block; }
ul li a:hover{
text-decoration:none;
color: black;
background: white;
}
.registerUser{
text-align:center;
position: absolute;
top: 15vh;
left: 30vw;
background-color: white;
padding: 25px 15vw 0 00px;
border: 3px outset #fff;
border-radius: 0.3rem;
div.esquerda{
margin-left: 5vw;
display: inline-block;
width: 320px;
text-align: left
}
.leftTitle{
display: inline-block;
width: 320px;
text-align: left
}
.escuro{
font-weight: 600;
}
As for the white space in the background, I solved it in another way, I found out that I had linked a css library that was messing me with it, I removed it and everything was normal :)
– Cleberlucas09
But I accepted his answer for having helped in the other things that were of great help, Valeuzão! D
– Cleberlucas09
Good then, I’m glad I could help
– andre_luiss