assembler-institute · Jota-T-S · Dec 23, 2022 · Dec 23, 2022
diff --git a/close_session.php b/close_session.php
@@ -0,0 +1,9 @@
+<?php
+session_start();
+
+if(isset($_POST["clouse"])){
+    // session_destroy();
+    unset($_SERVER);
+    header('Location: index.php');
+}
+?>
diff --git a/footer.php b/footer.php
@@ -0,0 +1,7 @@
+<?php
+include "header.php";
+?>
+
+<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-cuYeSxntonz0PPNlHhBs68uyIAVpIIOZZ5JqeqvYYIcEL727kskC66kF92t6Xl2V" crossorigin="anonymous"></script>
+</body>
+</html>
diff --git a/header.php b/header.php
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html lang="en">
+<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">
+    <title>Document</title>
+    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
+    <link href="style.css" rel="stylesheet" type="text/css">
+</head>
+<body>
diff --git a/index.php b/index.php
@@ -0,0 +1,35 @@
+<?php
+include "header.php";
+session_start();
+
+if(isset ($_GET['error'])){
+    echo '<p class="warning">El usuario o contraseña no son correctos</p>';
+}
+if(isset($_SESSION['email'])) {
+    echo '<p class="greeting">Do you want to log in again ' . $_SESSION['email'] . '?</p>';
+    unset($_SESSION['email']);
+}
+
+?>
+
+<section id="section-login" class="container">
+    <div class="row">
+    <h2 id="tittle-login" class="col-md-12 col-sm-6 ">Complete the fields to log in</h2>
+        <form id="form-login" action="validate.php" method="post">
+            <div class="mb-3">
+                <label for="email" class="form-label">Email: [email protected]</label><br>
+                <input type="email" id="email" name="email" class="form-control" placeholder="email:">
+            </div>
+            <div class="mb-3">
+                <label for="password" class="form-label">Password: 1234</label><br>
+                <input type="password" id="password" name="password" class="form-control" placeholder="pass:">
+            </div>
+            <button type="submit"  name="login">Submit</button>
+            <br><br>
+        </form>
+    </div>
+</section>
+
+ <?php
+ include "footer.php";
+ ?>
diff --git a/panel.php b/panel.php
@@ -0,0 +1,28 @@
+<?php
+include "header.php";
+session_start();
+
+if(!isset($_SESSION['email'])){
+   header('Location: index.php?error=privatezone'); 
+}
+?>
+
+<section id="section-panel" class="container-fluid">
+    <div class="row">
+        <h1 class="col-md-6 col-xs-12"><?php echo 'Welcom back! <br><span>' . $_SESSION['email'] . '</span>';?></h1>
+        <form id="close-sesion" action="index.php" method="post">
+            <button class="close" type="submit" value="Clouse session" name="clouse">Close</button>
+        </form>
+    </div>
+</section>
+
+
+
+
+    <?php
+
+    include "footer.php";
+    ?>
+
+
+
diff --git a/phpinfo/phpinfo.php b/phpinfo/phpinfo.php
@@ -0,0 +1,3 @@
+<?php
+phpinfo();
+?>
diff --git a/style.css b/style.css
@@ -0,0 +1,155 @@
+body{
+    background-color: #1C1C1C;
+}
+
+#section-login{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+    max-width: 70vw;
+    height: 90vh;
+}
+
+#tittle-login{
+    color: #dcb18c;
+    margin-bottom: 50px;
+}
+#form-login{
+    display: flex;
+}
+
+.form-control{
+    border:none;
+}
+input[type="email"], input[type="password"]{
+    background-color: #1C1C1C;
+    border-bottom: 1px solid #dcb18c;
+    color:#dcb18c;
+    border-radius: 0;
+    -webkit-border-radius: 0;
+    -moz-border-radius: 0;
+    -ms-border-radius: 0;
+    -o-border-radius: 0;
+    width: 30vw;
+}
+::placeholder {
+    color:#dcb18c !important;
+}
+input[type="email"], input[type="password"]:active{
+    background-color: #1C1C1C !important;
+}
+.form-control:focus:focus{
+    background-color: #1C1C1C !important;
+    border-bottom: 5px solid #dcb18c;
+    box-shadow: 0 0 0 0.25rem rgb(13 110 253 / 0%);
+}
+label{
+    color:antiquewhite;
+}
+
+#form-login button[type="submit"]{
+    padding: 50px 35px;
+    border-radius: 150px;
+    background: #1c1c1c;
+    border: 1px solid #dcb18c;
+    color: #dcb18c;
+    font-weight: 900;
+    transition: 0.4s;
+	transform: perspective(1px) translateZ(0);
+}
+
+#form-login button[type="submit"]:hover {
+	color: #1c1c1c;
+    background-color: #dcb18c;
+}
+
+#form-login button[type="submit"]::before {
+	clip-path: circle(0.5% at 50% 50%);
+	background-color: #dcb18c;
+	transition: 0.4s;
+	opacity: 1;
+}
+
+#form-login button[type="submit"]:hover::before {
+	clip-path: circle(100% at 50% 50%);
+}
+
+.warning{
+    color: #dcb18c;
+    text-align: center;
+    padding: 30px;
+    font-weight: 700;
+}
+
+.greeting{
+    color: #dcb18c;
+    text-align: center;
+    padding: 30px;
+    font-weight: 700;
+}
+
+#section-panel{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+    width: 100vw;
+}
+
+#section-panel h1{
+    width: 100%;
+    color:#dcb18c;
+    font-size: 80px;
+    font-weight: 800;
+    text-align: center;
+    margin-bottom: 50px;
+}
+
+#section-panel h1 span{
+    font-weight: 100;
+}
+
+#close-sesion{
+    display: flex;
+    justify-content: center;
+}
+
+.close{
+    padding: 50px 40px;
+    border-radius: 150px;
+    background: #1c1c1c;
+    border: 1px solid #dcb18c;
+    color: #dcb18c;
+    font-weight: 900;
+    transition: 0.4s;
+	transform: perspective(1px) translateZ(0);
+}
+
+@media screen and (max-width: 790px){
+    #form-login{
+        display: flex;
+        flex-direction: column !important;
+    }
+    input[type="email"], input[type="password"]{
+        width: 100% !important;
+    }
+    button[type="submit"]{
+        padding: 20px !important;
+    }
+    #section-panel h1{
+        font-size: 60px;
+        padding: 20px;
+    }
+    #close-sesion button{
+        width: 60%;
+    }
+}
+
+@media screen and (max-width: 520px){
+    #section-panel h1{
+        font-size: 40px;
+        padding: 20px;
+    }
+
+}
diff --git a/validate.php b/validate.php
@@ -0,0 +1,18 @@
+<?php
+session_start();
+
+$email = '[email protected]';
+$pass = '1234';
+
+$emaildb = $_POST['email'];
+$passdb = $_POST['password'];
+
+if($emaildb === $email && $passdb === $pass){
+    session_start();
+    $_SESSION['email'] = $emaildb;
+    header('Location: panel.php');
+}else{
+    header('Location: index.php?error=incorrectuser');
+}
+
+?>