diff --git a/production/form.html b/production/form.html index c478738c..11332d49 100755 --- a/production/form.html +++ b/production/form.html @@ -1,1347 +1,1359 @@ - - - - - - - Gentelella Alela! | - - - - - - - - - - - - - - - - - - - - - - - - - -
-
-
-
-
- Gentelella Alela! -
- -
- - -
-
- ... -
-
- Welcome, -

John Doe

-
-
- - -
- - - - - - -
- - - - - - - - - - - - -
- -
-
- - -
-
-
- -
- -
-
- - - -
-
-
-
-

Form Elements

-
- -
-
-
- - - - -
-
-
-
-
-
-
-
-
-

Form Design different form elements

- -
-
-
-
-
- -
- -
- -
-
-
- -
- -
-
-
- -
- -
-
-
- -
-
- - -
-
-
-
- -
- -
-
-
-
-
- - - -
-
- -
-
-
-
-
- -
-
-
-
-

Form Design different form elements

- -
-
-
-
-
- -
- - -
- -
- - -
- -
- - -
- -
- - -
- -
- -
- -
-
-
- -
- -
-
-
- -
- -
-
-
- -
- -
-
-
-
-
- - - -
-
- -
-
-
- -
-
-

Star Rating

- -
-
-
-

Star Ratings Hover and click on a star

-
-
- You gave a rating of 0 star(s) -
- -

Also you can give a default rating by adding attribute data-rating

-
- You gave a rating of 4 star(s) -
-
- -
-
-

Registration Form Click to validate

- -
-
-
- - -
- - - - - - - -

- M: - F: - -

- - -

- Skiing -
- - Running -
- - Eating -
- - Sleeping -
-

- - - - - - - -
- Validate form - -

- - -
-
- - -
- -
-
-
-

Form Basic Elements different form elements

- -
-
-
-
-
- -
- -
- -
-
-
- -
- -
-
-
- -
- -
-
-
- -
- -
-
-
- -
- -
-
-
- -
- -
-
-
- -
- -
-
-
- -
- -
-
-
- -
- -
-
-
- -
- -
-
- -
- -
- -
-
-
-
- - -
-
- -
-
- -
-
- -
-
- -
-
-
- -
- - -
-
- -
-
- -
-
- -
-
- -
-
- -
-
- -
-
- -
-
- -
-
-
-
- -
-
- -
-
- -
-
- -
-
- -
-
-
- - -
-
-
- - - -
-
- -
-
-
-
- - -
-
-
-

Form Buttons Sessions

- -
-
-
- -
- -
- - -
-
- - - - -
-
- - - - -
-
-
-
- -
- - -
-
- -
- - -
- -
-
- - - - -
-
-
-
-
-
-
-
- -
-
-
-

Text areasSessions

- -
-
-
-
-
-
- -
    -
-
- -
-   - -
- -
- - - - -
- -
- - - - -
- -
- - - - -
- -
- -
- - -
- -
- -
- - -
- -
- - -
-
- -
- - - -
- -
- -
- -
- -
-
-
-
-
- -
-
-

Form Input Grid form input

- -
-
-
- -
- -
- -
- -
- -
- -
- -
- - -
- -
- -
- -
- -
- -
- - -
- -
- -
- -
- -
- -
- -
- -
- - -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- - -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
-
- -
-
- - -
-
-

Form Design different form elements

- -
-
-
-
- -

Horizontal labels

-

- Using the grid system you can control the position of the labels. The form example below has the col-md-10 which sets the width to 10/12 and center-margin which centers it. -

-
-
- -
- -
-
-
- -
- -
-
-
- - -

Vertical labels

-

- For making labels vertical you have two options, either use the apropiate grid .col- class or wrap the form in the form-vertical class. -

-
-
-
- - -
-
- - -
- -
-
- -

Inline Form

-

- Add .form-inline to your form (which doesn't have to be a <form>) for left-aligned and inline-block controls. -

-
-
- - -
-
- - -
-
- -
- -
-
-
-
-
- - - -
-
- Gentelella - Bootstrap Admin Template by Colorlib -
-
-
- -
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + Gentelella Alela! | + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+
+
+ Gentelella Alela! +
+ +
+ + +
+
+ ... +
+
+ Welcome, +

John Doe

+
+
+ + +
+ + + + + + +
+ + + + + + + + + + + + +
+ +
+
+ + +
+
+
+ +
+ +
+
+ + + +
+
+
+
+

Form Elements

+
+ +
+
+
+ + + + +
+
+
+
+
+
+
+
+
+

Form Design different form elements

+ +
+
+
+
+
+ +
+ +
+ +
+
+
+ +
+ +
+
+
+ +
+ +
+
+
+ +
+
+ + +
+
+
+
+ +
+ + +
+
+
+
+
+ + + +
+
+ +
+
+
+
+
+ +
+
+
+
+

Form Design different form elements

+ +
+
+
+
+
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ +
+ +
+
+
+ +
+ +
+
+
+ +
+ +
+
+
+ +
+ + +
+
+
+
+
+ + + +
+
+ +
+
+
+ +
+
+

Star Rating

+ +
+
+
+

Star Ratings Hover and click on a star

+
+
+ You gave a rating of 0 star(s) +
+ +

Also you can give a default rating by adding attribute data-rating

+
+ You gave a rating of 4 star(s) +
+
+ +
+
+

Registration Form Click to validate

+ +
+
+
+ + +
+ + + + + + + +

+ M: + F: + +

+ + +

+ Skiing +
+ + Running +
+ + Eating +
+ + Sleeping +
+

+ + + + + + + +
+ Validate form + +

+ + +
+
+ + +
+ +
+
+
+

Form Basic Elements different form elements

+ +
+
+
+
+
+ +
+ +
+ +
+
+
+ +
+ +
+
+
+ +
+ +
+
+
+ +
+ +
+
+
+ +
+ +
+
+
+ +
+ +
+
+
+ +
+ +
+
+
+ +
+ +
+
+
+ +
+ +
+
+
+ +
+ +
+
+ +
+ +
+ +
+
+
+
+ + +
+
+ +
+
+ +
+
+ +
+
+ +
+
+
+ +
+ + +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+
+ + +
+
+
+ + + +
+
+ +
+
+
+
+ + +
+
+
+

Form Buttons Sessions

+ +
+
+
+ +
+ +
+ + +
+
+ + + + +
+
+ + + + +
+
+
+
+ +
+ + +
+
+ +
+ + +
+ +
+
+ + + + +
+
+
+
+
+
+
+
+ +
+
+
+

Text areasSessions

+ +
+
+
+
+
+
+ +
    +
+
+ +
+   + +
+ +
+ + + + +
+ +
+ + + + +
+ +
+ + + + +
+ +
+ +
+ + +
+ +
+ +
+ + +
+ +
+ + +
+
+ +
+ + + +
+ +
+ +
+ +
+ +
+
+
+
+
+ +
+
+

Form Input Grid form input

+ +
+
+
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ + +
+ +
+ +
+ +
+ +
+ +
+ + +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ + +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ + +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+
+ +
+
+ + +
+
+

Form Design different form elements

+ +
+
+
+
+ +

Horizontal labels

+

+ Using the grid system you can control the position of the labels. The form example below has the col-md-10 which sets the width to 10/12 and center-margin which centers it. +

+
+
+ +
+ +
+
+
+ +
+ +
+
+
+ + +

Vertical labels

+

+ For making labels vertical you have two options, either use the apropiate grid .col- class or wrap the form in the form-vertical class. +

+
+
+
+ + +
+
+ + +
+ +
+
+ +

Inline Form

+

+ Add .form-inline to your form (which doesn't have to be a <form>) for left-aligned and inline-block controls. +

+
+
+ + +
+
+ + +
+
+ +
+ +
+
+
+
+
+ + + +
+
+ Gentelella - Bootstrap Admin Template by Colorlib +
+
+
+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +