Page layout with fixed navbar

Page layout example with sticked to top navbar, fixed position.

Modals
Default dialog style
Growl notifications
Default Growl styling
×
Some info!
Info message text sample
×
Error!
Something went wrong here
×
Warning!
Be sure you want to do it!
×
Success!
Everything is fine here

Spinners
Progress bars
Progress bar colors
15% Complete
35% Complete
55% Complete
75% Complete
95% Complete
Progress bar options
20% Complete
40% Complete
60% Complete
80% Complete
35% Complete (success)
20% Complete (warning)
10% Complete (danger)
Alerts
Error alert
Success alert
Warning & default alert
Good to know! Info alert
Alerts
Oh snap! You got an error!

Change this and that and try again. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum.

Oh snap! You got an error!

Change this and that and try again. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum.

Oh snap! You got an error!

Change this and that and try again. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum.

Oh snap! You got an error!

Change this and that and try again. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum.

Tooltips
Popovers

Popover top

Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.

Popover bottom

Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.

Popover right

Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.

Popover left

Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.

Labels
Labels Markup
Default <span class="label label-default">Default</span>
Primary <span class="label label-primary">Primary</span>
Success <span class="label label-success">Success</span>
Warning <span class="label label-warning">Warning</span>
Danger <span class="label label-danger">Danger</span>
Info <span class="label label-info">Info</span>
142 <span class="badge">Badge</span>