Skip to content

Instantly share code, notes, and snippets.

@DeanPoulin
DeanPoulin / help-text.html
Created January 14, 2014 00:07
Help Text
<form role="form">
<input type="text" class="form-control">
<span class="help-block">A block of help text that breaks onto a new line and may extend beyond one line.</span>
</form>
@DeanPoulin
DeanPoulin / column-sizing.html
Created January 14, 2014 00:06
Column Sizing
<div class="row">
<div class="col-xs-2">
<input type="text" class="form-control" placeholder=".col-xs-2">
</div>
<div class="col-xs-3">
<input type="text" class="form-control" placeholder=".col-xs-3">
</div>
<div class="col-xs-4">
<input type="text" class="form-control" placeholder=".col-xs-4">
</div>
@DeanPoulin
DeanPoulin / control-sizing.html
Created January 14, 2014 00:04
Control Sizing
<input class="form-control input-lg" type="text" placeholder=".input-lg">
<input class="form-control" type="text" placeholder="Default input">
<input class="form-control input-sm" type="text" placeholder=".input-sm">
<select class="form-control input-lg">...</select>
<select class="form-control">...</select>
<select class="form-control input-sm">...</select>
@DeanPoulin
DeanPoulin / validation-states.html
Created January 14, 2014 00:03
Validation States
<div class="form-group has-success">
<label class="control-label" for="inputSuccess">Input with success</label>
<input type="text" class="form-control" id="inputSuccess">
</div>
<div class="form-group has-warning">
<label class="control-label" for="inputWarning">Input with warning</label>
<input type="text" class="form-control" id="inputWarning">
</div>
<div class="form-group has-error">
<label class="control-label" for="inputError">Input with error</label>
@DeanPoulin
DeanPoulin / disabled-fieldsets.html
Created January 14, 2014 00:02
Disabled Fieldsets
<form role="form">
<fieldset disabled>
<div class="form-group">
<label for="disabledTextInput">Disabled input</label>
<input type="text" id="disabledTextInput" class="form-control" placeholder="Disabled input">
</div>
<div class="form-group">
<label for="disabledSelect">Disabled select menu</label>
<select id="disabledSelect" class="form-control">
<option>Disabled select</option>
@DeanPoulin
DeanPoulin / disabled-inputs.html
Created January 13, 2014 23:59
Disabled Inputs
<input class="form-control" id="disabledInput" type="text" placeholder="Disabled input here..." disabled>
@DeanPoulin
DeanPoulin / input-focus.html
Created January 13, 2014 23:58
Input Focus
<input class="form-control" id="focusedInput" type="text" value="This is focused...">
@DeanPoulin
DeanPoulin / static-control.html
Created January 13, 2014 23:56
Static Control
<form class="form-horizontal" role="form">
<div class="form-group">
<label class="col-sm-2 control-label">Email</label>
<div class="col-sm-10">
<p class="form-control-static">email@example.com</p>
</div>
</div>
<div class="form-group">
<label for="inputPassword" class="col-sm-2 control-label">Password</label>
<div class="col-sm-10">
@DeanPoulin
DeanPoulin / selects.html
Created January 13, 2014 23:55
Selects
<select class="form-control">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>
<select multiple class="form-control">
<option>1</option>
@DeanPoulin
DeanPoulin / inline-checkboxes.html
Created January 13, 2014 23:54
Inline Checkboxes
<label class="checkbox-inline">
<input type="checkbox" id="inlineCheckbox1" value="option1"> 1
</label>
<label class="checkbox-inline">
<input type="checkbox" id="inlineCheckbox2" value="option2"> 2
</label>
<label class="checkbox-inline">
<input type="checkbox" id="inlineCheckbox3" value="option3"> 3
</label>