Helper Classes

File Input

This Jasny designed file input allows you have uniform file input design for all browsers.

EXAMPLE
file Input

Progress Bar

EXAMPLE
.progress-xs for Some Task

30% Complete

70% Complete
.progress-sm for Some Task

70% Complete

70% Complete

List

Seperated Links

List seperated by dashes is a common feature used for links in footer. Some website also use such seperated list above navigation bar as Quick link. Below is an example of additional class added to .list-inline

EXAMPLE
  • abcd
  • abcdefg
  • abcdef

Center Align List

Center align a bullet list is a tricky thing to achieve. Neither text-align: center nor margin:auto would be perfectly able to center align a bullet list. Thus, .center-list-xs is added to display list as table in mobile devices. Below is an example for center aligned bullet list.

EXAMPLE
  • abcd
  • abcdefg
  • abcdef

No Underline

Underline below links make you feel that it is a hyperlink. but sometimes we just dont require underline. In that case you can use .no-underline to remove the undeline

Backgrounds

As the current web designs are shifting more towards card base system, more background color options are required to be applied on either on body or wrapper.

Class name Description
.bg-well Well Background color
.bg-jumbotron Jumbotron Background color
.bg-img This class includes the basic configuration required to set a background cover image on a selected element. You just need to define background-image CSS property along with this class.