Bootstrap snippet: small change password form

designed to help people of all skill levels - designer or developer, huge nerd or early beginner.
copy and paste the code. Use it as a complete kit or use it to start something more complex.
tags: form



<div class="container bootstrap snippet"> <div class="row"> <div class="col-xs-12 col-sm-12 col-md-6 col-md-offset-2"> <div class="panel panel-info"> <div class="panel-heading"> <h3 class="panel-title"> <span class="glyphicon glyphicon-th"></span> Change password </h3> </div> <div class="panel-body"> <div class="row"> <div class="col-xs-6 col-sm-6 col-md-6 separator social-login-box"> <br> <img alt="" class="img-thumbnail" src="http://bootdey.com/img/Content/avatar/avatar1.png"> </div> <div style="margin-top:80px;" class="col-xs-6 col-sm-6 col-md-6 login-box"> <div class="form-group"> <div class="input-group"> <div class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></div> <input class="form-control" type="password" placeholder="Current Password"> </div> </div> <div class="form-group"> <div class="input-group"> <div class="input-group-addon"><span class="glyphicon glyphicon-log-in"></span></div> <input class="form-control" type="password" placeholder="New Password"> </div> </div> </div> </div> </div> <div class="panel-footer"> <div class="row"> <div class="col-xs-6 col-sm-6 col-md-6"></div> <div class="col-xs-6 col-sm-6 col-md-6"> <button class="btn icon-btn-save btn-success" type="submit"> <span class="btn-save-label"><i class="glyphicon glyphicon-floppy-disk"></i></span>save</button> </div> </div> </div> </div> </div> </div> </div>
.separator { border-right: 1px solid #dfdfe0; } .icon-btn-save { padding-top: 0; padding-bottom: 0; } .input-group { margin-bottom:10px; } .btn-save-label { position: relative; left: -12px; display: inline-block; padding: 6px 12px; background: rgba(0,0,0,0.15); border-radius: 3px 0 0 3px; }
Dey-Dey

small change password form

Dey-Dey
  Jul 5th 2014, 08:32
11.3K Views