Skip to content

Commit

Permalink
ajuste layout
Browse files Browse the repository at this point in the history
  • Loading branch information
lucianamcedro committed Jun 27, 2023
1 parent 6cc6c37 commit e4385da
Show file tree
Hide file tree
Showing 4 changed files with 438 additions and 86 deletions.
77 changes: 40 additions & 37 deletions auth/login.php
Original file line number Diff line number Diff line change
@@ -1,50 +1,53 @@


<!DOCTYPE html>
<html lang="pt-BR">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../css/header.css">
<link rel="icon" type="image/png" href="./img/ico.jpg">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../css/login.css">
<link rel="icon" type="image/png" href="/img/ico.jpg">
<title>Login</title>
</head>
<body>
<div class="container-meio">
<div class="container-inicio">
<header>
<h1>
<a href="../index.php" class="logo">AuPet<span class="span">.</span></a>
</h1>
<div class="header-link">
<li>
<a href="../index.php">Inicio</a>
</li>
<li>
<a href="../contato.php" class="contato">Contato</a>
</li>
<li>
<a href="../fornecedores.php" class="fornecedores">Fornecedores</a>
</li>
<li>
<a href="#login" class="login">Login</a>
</li>
</div>
</header>
<div class="container-inicio">
<header>
<h1>
<a href="../index.php" class="logo">AuPet<span class="span">.</span></a>
</h1>
<div class="header-link">
<li>
<a href="../index.php">Inicio</a>
</li>
<li> <a href="../contato.php" class="contato">Contato</a></li>
<li><a href="../fornecedores.php" class="fornecedores">Fornecedores</a></li>
</div>
</header>
<div class="container-login">
<form method="POST" action="processar-login.php">
<h2>Tela de Login</h2>
<form method="POST" action="processar-login.php">
<label for="nome">Nome de usuário:</label>
<input type="text" id="nome" name="nome" required><br><br>
<label for="senha">Senha:</label>
<input type="password" id="senha" name="senha" required><br><br>
<div style="display: inline-block; width: calc(100%);">
<label for="email">Email:</label>
<input type="text" class="form-control" id="email" name="email" placeholder="Digite seu email"
style="width: 100%;" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,}$" required>
</div>
<div style="display: inline-block; width: calc(100%);">
<label for="telefone">Senha:</label>
<input type="password" name="senha" class="form-control" name="phone" style="width:
100%;">
</div>
<div style="display: inline-block; width: calc(100%);">
<button type="submit" class="btn btn-primary" style="width:
100%;">Entrar</button>
</div>
</form>
</div>
<script src="../script/contato-script.js"></script>
<input type="submit" value="Entrar">
</form>
</div>
</div>
</body>
</html>
</html>
99 changes: 50 additions & 49 deletions cadastro/novo-usuario.php
Original file line number Diff line number Diff line change
@@ -1,59 +1,60 @@
<!DOCTYPE html>
<html lang="pt-BR">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../css/header.css">
<link rel="icon" type="image/png" href="./img/ico.jpg">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../css/cadastrar.css">
<link rel="icon" type="image/png" href="/img/ico.jpg">
<title>Cadastrar</title>
</head>
<body>
<div class="container-meio">
<div class="container-inicio">
<header>
<h1>
<a href="../index.php" class="logo">AuPet<span class="span">.</span></a>
</h1>
<div class="header-link">
<li>
<a href="../index.php">Inicio</a>
</li>
<li>
<a href="../contato.php" class="contato">Contato</a>
</li>
<li>
<a href="../fornecedores.php" class="fornecedores">Fornecedores</a>
</li>
<li>
<a href="#login" class="login">Login</a>
</li>
</div>
</header>
<div class="container-inicio">
<header>
<h1>
<a href="../index.php" class="logo">AuPet<span class="span">.</span></a>
</h1>
<div class="header-link">
<li>
<a href="../index.php">Inicio</a>
</li>
<li> <a href="../contato.php" class="contato">Contato</a></li>
<li><a href="../fornecedores.php" class="fornecedores">Fornecedores</a></li>
</div>
</header>
<div class="container-cadastrar">
<form action="salvar-usuario.php" method="POST">
<div class="mb-3">
<label>Nome</label>
<input type="text" name="nome" class="form-control">
</div>
<div class="mb-3">
<label>Email</label>
<input type="email" name="email" class="form-control">
</div>
<div class="mb-3">
<label>Senha</label>
<input type="password" name="senha" class="form-control">
</div>
<div class="mb-3">
<label>Data de nascimento</label>
<input type="date" name="data_nascimento" class="form-control">
</div>
<div class="mb-3">
<button type="submit" class="btn btn-primary">Enviar</button>
</div>
</form>
</div>
</div>
<form action="salvar-usuario.php" method="POST">
<div style="display: inline-block; width: calc(100%);">
<label for="nome">Nome:</label>
<input type="text" class="form-control" id="nome" name="name" placeholder="Digite seu nome"
style="width: 100%;">
</div>
<div style="display: inline-block; width: calc(100%);">
<label>Data de nascimento</label>
<input type="date" name="data_nascimento" class="form-control" style="width: 100%;>
</div>
<div style="display: inline-block; width: calc(100%);">
<label for="email">Email:</label>
<input type="text" class="form-control" id="email" name="email" placeholder="Digite seu email"
style="width: 100%;" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,}$" required>
</div>
<div style="display: inline-block; width: calc(100%);">
<label for="telefone">Senha:</label>
<input type="password" name="senha" class="form-control" name="phone" style="width:
100%;">
</div>
<div style="display: inline-block; width: calc(100%);">
<button type="submit" class="btn btn-primary" style="width:
100%;">Enviar</button>
</div>
</form>
</div>
<script src="../script/contato-script.js"></script>
</body>
</html>
</html>
174 changes: 174 additions & 0 deletions css/cadastrar.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,174 @@
@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,700;0,900;1,900&display=swap");
@import url("https://fonts.googleapis.com/css?family=Righteous&display=swap");

* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: "Roboto", sans-serif;
border: none;
outline: none;
scroll-behavior: smooth;
list-style: none;
text-decoration: none;
}

:root {
--roxo: rgba(86, 63, 145, 255);
--yellow: #f2b22e;
}




.container-inicio {
background-image: url("../img/bg-contato.jpg");
background-size: cover;
background-position: center 30%;
height: 100vh;

}

.body {
background-color: var(--roxo);
}

.container-meio {
background-color: var(--roxo);
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}

.container-cadastrar {
background-color: #fff;
border-radius: 10px;
padding: 40px;
max-width: 600px;
box-sizing: border-box;
margin: 0 auto;
margin-top: 10vh;
}

.container-cadastrar form {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

.container-cadastrar label {
display: block;
font-weight: bold;
margin-bottom: 5px;
width: 100%;
}

.container-cadastrar input {
border-radius: 5px;
border: none;
padding: 10px;
font-size: 18px;
margin-bottom: 10px;
width: calc(50% - 5px);
background-color: #f6f6f6;
height: 40px;
}

.container-cadastrar textarea {
background-color: #f6f6f6;
height: 30px;
width: calc(100%);
resize: none;
}

.container-cadastrar input[type="text"]::placeholder {
color: #999;
}

.container-cadastrar button[type="submit"] {
border-radius: 5px;
border: none;
padding: 10px;
font-size: 18px;
background-color: var(--roxo);
color: #fff;
cursor: pointer;
flex-basis: calc(50% - 5px);
height: 90%;
margin-top: 10px;
}

.container-cadastrar button[type="submit"]:hover {
background-color: #6c2d73;
}

.container-cadastrar .email-button-container {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 10px;
}

.container-cadastrar #email {
flex-basis: calc(50% - 5px);
}

.container-cadastrar i {
margin-right: 10px;
font-size: 20px;
color: var(--roxo);
}

.container-cadastrar span {
font-size: 18px;
font-weight: normal;
color: black;
}


header {
display: flex;
justify-content: space-between;
padding-top: 1rem;
width: 100%;
top: 0;
right: 0;
z-index: 1000;
background: transparent;
background-color: transparent;
padding: 10px 6%;
}

.header-link {
display: flex;
gap: 3rem;
padding-top: 10px;
cursor: pointer;
}

.header-link a {
color: rgba(255, 255, 255, 0.778);
font-weight: 700;
font-size: 20px;
transition: 0.5s;
}

.header-link a:hover {
color: var(--roxo);
}

.logo {
color: var(--yellow);
display: inline-block;
font: 400 2rem "Righteous", cursive;
font-size: 2.8rem;
letter-spacing: -2px;
font-weight: 700;
}

.logo .span {
display: inline-block;
color: white;
}

Loading

0 comments on commit e4385da

Please sign in to comment.