JSFiddle - React, Tailwind, and code Playground

by alexpts

HTML

<link rel="stylesheet" href="https://yastatic.net/bootstrap/3.3.6/css/bootstrap.min.css">
<form class="login" role="form" method="POST" action="/login/">
    <input tabindex="1" required="required" type="text" class="form-group form-control" name="login" placeholder="Enter login">
    <input tabindex="2" required="required" type="password" class="form-group form-control" name="password" placeholder="Enter password">

    <input tabindex="3" class="btn btn-primary form-control" type="submit" value="Sign in">
</form>

CSS

body {
  display: flex;
  flex-direction: column;
  height: 100vh;
}

form {
  background: #F8FAFB;
  border: 1px solid #d5d5d5;
  margin: auto;
  padding: 20px;
  width: 310px;
  border-radius: 6px;
  overflow: auto;
  opacity: 1;
  transition: opacity 0.6s ease 0s;
}