JSFiddle - React, Tailwind, and code Playground

by 규연 황

HTML

<div class="form-field">
  <input type="text">
</div>
<div class="form-field">
  <input type="text">
</div>

SCSS

.form-field {
  width: 300px;
  margin: 40px auto;
  &:focus-within {
    border-bottom: 2px solid #000000;
  }
  input {
    width: 100%;
    height: 40px;
    border: 0 none;
    background: #eee;
    &:focus {
      outline: 0 none;
    }
  }
}