G-Loot DS — text input structure

by Augustin Hiebel

HTML

<div className="form-group">
  <label htmlFor="first-name">First name</label>
  <input type="text" name="first-name" id="first-name" autoComplete="given-name" />
</div>

<div className="form-group">
  <label htmlFor="age">Age</label>
  <input type="number" name="age" id="age" />
</div>

<div className="form-group">
  <label htmlFor="company-website">Company Website</label>
  <div className="input-group">
    <span> http:// </span>
    <input type="text" name="company-website" id="company-website" />
  </div>
</div>

<div className="form-group">
  <label htmlFor="twitch">Twitch</label>
  <div className="input-group">
    <span>
      <span className="icon icon-twitch" />
    </span>
    <input type="text" name="twitch" id="twitch" />
    <span>
      <span className="icon icon-lock" />
    </span>
  </div>
</div>

<div className="form-group">
  <label htmlFor="subdomain">Subdomain</label>
  <div className="input-group">
    <input type="text" name="subdomain" id="subdomain" />
    <span> .gloot.com </span>
  </div>
</div>