Login page

by Imri Paloja

HTML

<script src="https://cdn.tailwindcss.com"></script>

<div>
  <div>
    <nav
      class="bg-eb-dark mb-4 rounded-2xl border border-gray-200 bg-white p-5 lg:p-6 dark:border-gray-800 dark:bg-white/[0.03]"
    >
      <header class="row">
        <a href="/" title="Home" id="site-name" class="one-half column">
          EuroCMS
        </a>
      </header>
    </nav>

    <div
      class="bg-eb-dark rounded-2xl border border-gray-200 bg-white p-5 lg:p-6 dark:border-gray-800 dark:bg-white/[0.03]"
    >
      <h3 class="bg-eb-dark">
        Sign In
        <sup>
          <small> Testing </small>
        </sup>
      </h3>

      <form method="post" id="formpost" action="/admin/login" class="bg-eb-dark">
        <label for="uname">Username</label>
        <input
          id="uname"
          type="text"
          name="uname"
          autocomplete="given-name"
          class="block w-full rounded-md bg-white/5 px-3 py-1.5 text-base text-white outline-1 -outline-offset-1 outline-white/10 placeholder:text-gray-500 focus:outline-2 focus:-outline-offset-2 focus:outline-indigo-500 sm:text-sm/6"
        />

        <label for="pword">Password</label>
        <input
          type="password"
          id="pword"
          name="pword"
          placeholder="secret password"
          required=""
        />

        <input
          type="hidden"
          id="hidden"
          name="hidden"
          value="7bd036776d2f6b2459b158a19f5fbf771ddaa94f1e163248a87977c45a6243a6"
        />

        <br />

        <div class="row">
          <label for="remember-me" class="one-third column">
            <input type="checkbox" name="remember-me" id="remember-me" />
            Remember me
          </label>

          <input type="submit" name="submit" value="sign in" />
        </div>
      </form>
    </div>
  </div>
</div>

JavaScript

tailwind.config = {
  theme: {
    extend: {
      colors: {
        'eb-red': '#e60000',
        'eb-dark': '#1b1e1f',
        'eb-gray': '#181a1b',
      },
      fontFamily: {
        sans: ['Inter', 'sans-serif'],
      },
    },
  },
}