Untitled

mail@pastecode.io avatar
unknown
plain_text
2 years ago
3.5 kB
0
Indexable
<!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">
    <link rel="preconnect" href="https://fonts.googleapis.com">
	<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
	<link href="https://fonts.googleapis.com/css2?		family=Bebas+Neue&family=Handlee&family=Montserrat:wght@300;400&family=Roboto:wght@300;400&family=Space+Mono&display=swap" rel="stylesheet">
    <title>Administrador</title>
</head>
<style>
    * {
      padding: 0;
      margin: 0;
      box-sizing: border-box;
      font-family: "Roboto", sans-serif;
      background: #80A3F3;
    }

    .datos-usuario {
      display: flex;
      justify-content: center;
      width: 100%;
    }

    .datos-usuario table{
      width: 100%;
      max-width: 500px;   
      background-color: #000;   
      margin-top: 3%;
    }

    .datos-usuario table td {
      padding: 0.5rem;
      background: #fff;
    }

    .main-container{
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .title{
        width: 100%;
        display: flex;
        justify-content: center;
        margin-top: 2%;
    }

    .empleados {
      display: flex;
      justify-content: center;
      width: 100%;
    }

    .empleados table{
      width: 100%;
      max-width: 500px;   
      background-color: #000;   
      margin-top: 3%;
    }

    .empleados table td {
      padding: 0.5rem;
      background: #fff;
    }

    .empleados table th {
      padding: 0.5rem;
      background: #CAF7B3;
    }
  </style>
<body>
    <div class="main-container">
        <div class="title">
            <h1>Dashboard</h1>
        </div>
        <div class="datos-usuario">
            <table>
                <tbody>
					{{#users}}
                    <tr>
                      <td> {{ id }} </td>
                      <td> {{ name }} </td>
                      <td> {{ contrated }} </td>
                      <td> {{ rol }} </td>
                    </tr>
                    <tr>
                        <td> Hora del servidor </td>
                        <td> {{{ time }} </td>
                      </tr>
                      {{/users}}
                </tbody>
              </table>
        </div>
        <div class="title">
          <h1>Lista de empleados</h1>
      </div>
        <div class="empleados">
          <table>
            <thead> 
              <tr>
                  <th> Nombre </th>
                  <th> Fecha de contratación </th>
                  <th> Rol </th>
            </tr>
          </thead>

          <tbody>
            <tr>
              <td>
                Katerin
              </td>
              <td>
                29-03-2023
              </td>
              <td>
                Usuario
              </td>
            </tr>

            <tr>
              <td>
                Ariel
              </td>
              <td>
                29-03-2023
              </td>
              <td>
                Usuario
              </td>
            </tr>

            <tr>
              <td>
                Eddy
              </td>
              <td>
                29-03-2023
              </td>
              <td>
               Administrador
              </td>
            </tr>

          </tbody>
          </table>
        </div>
    </div>
</body>
</html>