"Panel Form"
Bootstrap 3.3.0 Snippet by g0riloun

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<!-- beauty font ROBOTO -->
<link href='http://fonts.googleapis.com/css?family=Roboto:100' rel='stylesheet' type='text/css'>
<div class="container">
<div class="row">
<div class="col-md-12">
<form id="candidatedata" class="form-horizontal" method="POST" role="form" action="/Candidate/editprofileex/">
<input type="hidden" name="idUser" value="2904">
<input type="hidden" name="userKey" value="d8babe719ffafafd59bc9d802fb3fdb1">
<div class="row">
<div class="col-md-offset-2 col-md-8">
<div class="panel">
<div class="panel-heading custom-header-panel">
<h3 class="panel-title roboto">Profile info</h3>
</div>
<div class="panel-body">
<div class="form-group">
<label class="col-sm-4 control-label" for="name">Full Name <span class="requerido"> *</span></label>
<div class="col-sm-8">
<input type="text" class="form-control" name="name" id="name" value="" oninvalid="this.setCustomValidity('Campo requerido')" oninput="setCustomValidity('')" required="" maxlength="70">
</div>
</div>
<div class="form-group">
<label for="country" class="col-sm-4 control-label">Nationality<span class="requerido"> *</span></label>
<div class="col-sm-8">
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
/* Font ROBOTO */
.roboto{
font-family: 'Roboto', sans-serif !important;
}
/* custom background for panel */
.container{
padding-top: 50px !important;
background-color: #f5f5f5 !important;
}
/* custom background header panel */
.custom-header-panel{
background-color: #004b8e !important;
border-color: #004b8e !important;
color: white;
}
.no-margin-form-group {
margin: 0 !important;
}
.requerido {
color: red;
}
.btn-orange-md {
background: #FF791F !important;
border-bottom: 3px solid #ae4d13 !important;
color: white;
}
.btn-orange-md:hover {
background: #d86016 !important;
color: white !important;
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: